.newsletter-banner{position:relative;margin:var(--sp-12) 0 var(--sp-8);padding:var(--sp-10) var(--sp-8);background:var(--primary-bg-subtle);border:1px solid var(--primary-border-subtle);border-radius:var(--radius-lg);overflow:hidden}.newsletter-banner::before{content:'';position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:radial-gradient(circle,var(--primary-bg-light) 0%,transparent 70%);border-radius:var(--radius-full);pointer-events:none}.newsletter-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--sp-5)}.newsletter-icon{display:flex;align-items:center;justify-content:center;width:52px;height:52px;background:var(--primary-bg-subtle);border-radius:var(--radius-full);flex-shrink:0}.newsletter-icon i{font-size:var(--text-xl);color:var(--primary)}.newsletter-text h3{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--text);margin:0 0 var(--sp-1);line-height:1.3}.newsletter-text p{font-size:var(--text-sm);color:var(--text-secondary);margin:0;line-height:1.5}.newsletter-form{display:flex;gap:var(--sp-2);width:100%;max-width:460px;margin-top:var(--sp-1)}.newsletter-form input[type="email"]{flex:1;min-width:0;padding:var(--sp-3) var(--sp-4);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-size:var(--text-sm);font-family:inherit;transition:border-color var(--ease-base),box-shadow var(--ease-base);outline:none}.newsletter-form input[type="email"]::placeholder{color:var(--text-muted)}.newsletter-form input[type="email"]:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-bg-light)}.newsletter-form button{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5);background:var(--primary);color:var(--text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-semibold);font-family:inherit;cursor:pointer;white-space:nowrap;transition:background var(--ease-base),transform var(--ease-base),box-shadow var(--ease-base)}.newsletter-form button:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.newsletter-form button:active{transform:translateY(0)}.newsletter-form button i{font-size:var(--text-xs)}.newsletter-rgpd{font-size:var(--text-xs);color:var(--text-muted);margin:0;line-height:1.4}.newsletter-rgpd i{font-size:var(--text-xs);margin-right:var(--sp-1);opacity:0.7}.newsletter-banner.is-submitted .newsletter-form{display:none}.newsletter-success{display:none;align-items:center;gap:var(--sp-2);font-size:var(--text-base);font-weight:var(--weight-semibold);color:var(--color-success)}.newsletter-success i{font-size:var(--text-lg)}.newsletter-banner.is-submitted .newsletter-success{display:flex}.reading-progress-circle{display:inline-flex;align-items:center;gap:var(--sp-2);color:var(--text-muted);font-size:var(--text-sm)}.reading-progress-circle svg{width:22px;height:22px;transform:rotate(-90deg);flex-shrink:0}.reading-progress-circle .progress-bg{fill:none;stroke:var(--border);stroke-width:2.5}.reading-progress-circle .progress-fill{fill:none;stroke:var(--primary);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:56.549;stroke-dashoffset:56.549;transition:stroke-dashoffset 0.15s linear}.reactions-section{margin:var(--sp-10) 0;padding:var(--sp-6) 0;border-top:1px solid var(--border)}.reactions-label{font-size:var(--text-sm);color:var(--text-muted);margin:0 0 var(--sp-4);font-weight:var(--weight-medium);text-align:center}.reactions-container{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--sp-3)}.reaction-btn{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);background:transparent;border:1px solid var(--border);border-radius:var(--radius-full);color:var(--text-secondary);font-size:var(--text-sm);font-family:inherit;cursor:pointer;transition:all var(--ease-base);user-select:none;-webkit-user-select:none}.reaction-btn:hover{border-color:var(--primary);background:var(--primary-bg-subtle);color:var(--text)}.reaction-btn:active{transform:scale(0.96)}.reaction-btn.is-active{border-color:var(--primary);background:var(--primary-bg-subtle);color:var(--text)}.reaction-emoji{font-size:var(--text-lg);line-height:1;display:inline-block}.reaction-label{font-weight:var(--weight-medium)}.reaction-count{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);min-width:1.25em;text-align:center;transition:color var(--ease-base)}.reaction-btn.is-active .reaction-count{color:var(--primary)}@keyframes reaction-bounce{0%{transform:scale(1)}30%{transform:scale(1.25)}50%{transform:scale(0.9)}70%{transform:scale(1.1)}100%{transform:scale(1)}}.reaction-btn.is-bouncing .reaction-emoji{animation:reaction-bounce 0.4s var(--ease-base)}@media (max-width:768px){.newsletter-banner{padding:var(--sp-8) var(--sp-5);margin:var(--sp-8) 0 var(--sp-6)}.newsletter-text h3{font-size:var(--text-lg)}.newsletter-form{flex-direction:column}.newsletter-form button{justify-content:center}.reactions-container{gap:var(--sp-2)}.reaction-btn{padding:var(--sp-2) var(--sp-3);font-size:var(--text-xs)}.reaction-emoji{font-size:var(--text-base)}}@media (max-width:480px){.newsletter-banner{padding:var(--sp-6) var(--sp-4)}.newsletter-text h3{font-size:var(--text-base)}.reaction-label{display:none}.reaction-btn{padding:var(--sp-2) var(--sp-3);gap:var(--sp-1)}}@media print{.newsletter-banner,.reactions-section,.reading-progress-circle{display:none}}
