@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@500;700;800&family=Plus+Jakarta+Sans:wght@600;700;800;900&display=swap";:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-heading:"Plus Jakarta Sans", "Inter", sans-serif;--font-mono:"JetBrains Mono", monospace;--background:#0c0a1d;--surface:#110e2e;--surface-elevated:#18153c;--surface-card:#1e1a4d;--surface-hover:#262160;--primary:#8b5cf6;--primary-hover:#a78bfa;--primary-glow:#8b5cf659;--signal:#10b981;--signal-bright:#34d399;--signal-secondary:#059669;--signal-glow:#10b98159;--accent-amber:#f59e0b;--amber-glow:#f59e0b40;--success:#10b981;--danger:#ef4444;--text:#f8fafc;--text-secondary:#cbd5e1;--text-muted:#94a3b8;--border:#a78bfa2e;--border-focus:#8b5cf699;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:26px;--shadow-sm:0 2px 4px #0006;--shadow-md:0 10px 30px #00000080;--shadow-lg:0 20px 50px #000000b3;--shadow-glow:0 0 35px #8b5cf64d}[data-theme=light]{--background:#f5f3ff;--surface:#ede9fe;--surface-elevated:#fff;--surface-card:#fff;--surface-hover:#f3e8ff;--primary:#7c3aed;--primary-hover:#6d28d9;--primary-glow:#7c3aed33;--signal:#059669;--signal-bright:#10b981;--signal-secondary:#047857;--signal-glow:#05966933;--accent-amber:#d97706;--text:#1e1b4b;--text-secondary:#475569;--text-muted:#64748b;--border:#ddd6fe;--border-focus:#7c3aed66;--shadow-sm:0 1px 3px #0000000d;--shadow-md:0 8px 20px #7c3aed14;--shadow-lg:0 16px 32px #7c3aed1f;--shadow-glow:0 0 25px #7c3aed33}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-sans);background-color:var(--background);color:var(--text);min-height:100vh;line-height:1.6;transition:background-color .25s,color .25s;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle at 50% 0,#8b5cf638,#0000 60%),radial-gradient(circle at 85% 40%,#10b9811f,#0000 50%),radial-gradient(circle at 15% 70%,#f59e0b14,#0000 50%);width:100vw;height:100vh;position:fixed;top:0;left:0}.navbar{z-index:100;-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);background:#0c0a1dd9;align-items:center;height:68px;display:flex;position:sticky;top:0}[data-theme=light] .navbar{background:#f5f3ffd9}.nav-container{justify-content:space-between;align-items:center;width:100%;max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex}.brand-logo{font-family:var(--font-heading);color:var(--text);letter-spacing:-.02em;align-items:center;gap:.65rem;font-size:1.35rem;font-weight:800;text-decoration:none;display:flex}.brand-logo-icon{background:linear-gradient(135deg, var(--primary), #6d28d9);color:#fff;width:36px;height:36px;box-shadow:0 0 20px var(--primary-glow);border-radius:12px;justify-content:center;align-items:center;display:flex}.desktop-nav{display:block}.desktop-nav-list{align-items:center;gap:1.75rem;list-style:none;display:flex}.nav-item{position:relative}.nav-button{color:var(--text-secondary);font-family:var(--font-sans);cursor:pointer;background:0 0;border:none;align-items:center;gap:.35rem;padding:.35rem 0;font-size:.925rem;font-weight:600;transition:color .2s;display:flex;position:relative}.nav-button:hover,.nav-button.active,.nav-button.open{color:var(--primary-hover)}.nav-button.active:after{content:"";background:var(--primary);width:100%;height:2px;box-shadow:0 0 10px var(--primary);border-radius:2px;position:absolute;bottom:-2px;left:0}.dropdown-icon{transition:transform .2s}.nav-button.open .dropdown-icon{transform:rotate(180deg)}.dropdown-menu{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-md);width:280px;box-shadow:var(--shadow-lg);z-index:150;padding:.5rem;animation:.15s forwards dropdown-fade-in;position:absolute;top:calc(100% + .5rem);left:50%;transform:translate(-50%)}@media (prefers-reduced-motion:reduce){.dropdown-menu{animation:none}}@keyframes dropdown-fade-in{0%{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%)}}.dropdown-menu ul{flex-direction:column;gap:.25rem;list-style:none;display:flex}.dropdown-item{color:var(--text);border-radius:var(--radius-sm);align-items:flex-start;gap:.85rem;padding:.75rem;text-decoration:none;transition:background-color .2s;display:flex}.dropdown-item:hover,.dropdown-item.active{background:var(--surface-hover)}.dropdown-item-icon{color:var(--primary);justify-content:center;align-items:center;margin-top:.1rem;display:flex}.dropdown-item-content{text-align:left;flex-direction:column;gap:.15rem;display:flex}.dropdown-item-title{font-size:.9rem;font-weight:700}.dropdown-item-desc{color:var(--text-muted);font-size:.75rem;line-height:1.35}.btn-icon{background:var(--surface-card);border:1px solid var(--border);color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;padding:.5rem;transition:all .2s;display:flex}.btn-icon:hover{background:var(--surface-hover);color:var(--primary-hover);border-color:var(--primary)}.hero-section{z-index:1;text-align:center;max-width:820px;margin:0 auto;padding:2.25rem 1.5rem 1.25rem;position:relative}.morse-signal-bar{font-family:var(--font-mono);color:var(--signal-bright);box-shadow:0 0 15px var(--signal-glow);background:#10b9811a;border:1px solid #10b9814d;border-radius:999px;align-items:center;gap:.45rem;margin-bottom:1rem;padding:.35rem 1.1rem;font-size:.9rem;font-weight:800;display:inline-flex}.signal-unit{opacity:.5;transition:all .15s}.signal-unit.active{opacity:1;color:#fff;text-shadow:0 0 12px var(--signal-bright);transform:scale(1.25)}.hero-title{font-family:var(--font-heading);letter-spacing:-.03em;background:linear-gradient(135deg, #fff 30%, var(--primary-hover) 80%, var(--signal-bright) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.75rem;font-size:clamp(2.25rem,5vw,3.25rem);font-weight:900;line-height:1.15}.hero-subtitle{color:var(--text-secondary);max-width:680px;margin:0 auto;font-size:clamp(.95rem,1.8vw,1.1rem);line-height:1.6}.translator-container{z-index:1;max-width:1200px;margin:1.25rem auto 3rem;padding:0 1.5rem;position:relative}.workspace-card{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);transition:border-color .25s,box-shadow .25s;overflow:hidden}.workspace-card:focus-within{border-color:var(--border-focus);box-shadow:var(--shadow-glow)}.workspace-topbar{border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.5rem;display:flex}.direction-selector{background:var(--surface-elevated);border-radius:var(--radius-md);border:1px solid var(--border);padding:.25rem;display:flex}.dir-btn{color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;padding:.5rem 1.1rem;font-size:.875rem;font-weight:700;transition:all .2s}.dir-btn.active{background:linear-gradient(135deg, var(--primary), #7c3aed);color:#fff;box-shadow:0 2px 10px var(--primary-glow)}.telemetry-status{color:var(--signal-bright);background:#10b9811f;border:1px solid #10b98140;border-radius:999px;align-items:center;gap:.45rem;padding:.3rem .8rem;font-size:.825rem;font-weight:700;display:flex}.status-dot{background:var(--signal-bright);width:8px;height:8px;box-shadow:0 0 10px var(--signal-bright);border-radius:50%;animation:2s ease-in-out infinite pulseDot}@keyframes pulseDot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)}}.workspace-grid{grid-template-columns:1fr;display:grid;position:relative}@media (width>=900px){.workspace-grid{grid-template-columns:1fr 1fr}}.input-panel,.output-panel{flex-direction:column;min-height:220px;padding:1.5rem;display:flex}.input-panel{border-bottom:1px solid var(--border)}@media (width>=900px){.input-panel{border-bottom:none;border-right:1px solid var(--border)}}.output-panel{background:#110e2e66}.panel-title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);justify-content:space-between;align-items:center;margin-bottom:.75rem;font-size:.775rem;font-weight:800;display:flex}.panel-textarea{width:100%;color:var(--text);resize:vertical;background:0 0;border:none;outline:none;flex:1;min-height:140px;font-size:1.2rem;line-height:1.6}.panel-textarea.morse-font{font-family:var(--font-mono);letter-spacing:.08em;color:var(--signal-bright);text-shadow:0 0 10px var(--signal-glow);font-size:1.35rem}.swap-wrapper{z-index:20;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.btn-swap-circle{background:var(--surface-elevated);border:1px solid var(--border);width:44px;height:44px;color:var(--primary-hover);cursor:pointer;box-shadow:var(--shadow-md);border-radius:50%;justify-content:center;align-items:center;transition:all .25s;display:flex}.btn-swap-circle:hover{border-color:var(--primary);color:#fff;background:var(--primary);box-shadow:0 0 25px var(--primary-glow);transform:scale(1.15)rotate(180deg)}.workspace-actionbar{background:var(--surface);border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.5rem;display:flex}.action-group{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.btn-primary-cta{background:linear-gradient(135deg, var(--primary), #7c3aed);color:#fff;border-radius:var(--radius-md);cursor:pointer;box-shadow:0 4px 16px var(--primary-glow);border:none;align-items:center;gap:.5rem;padding:.65rem 1.4rem;font-size:.9rem;font-weight:800;transition:all .2s;display:inline-flex}.btn-primary-cta:hover:not(:disabled){background:linear-gradient(135deg, var(--primary-hover), #8b5cf6);box-shadow:0 8px 25px var(--primary-glow);transform:translateY(-2px)}.btn-primary-cta:disabled{opacity:.45;cursor:not-allowed}.btn-secondary-action{background:var(--surface-elevated);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;align-items:center;gap:.45rem;padding:.6rem 1.1rem;font-size:.875rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-secondary-action:hover:not(:disabled){background:var(--surface-hover);border-color:var(--primary);color:var(--primary-hover)}.waveform-bars{align-items:flex-end;gap:2px;height:14px;display:inline-flex}.waveform-bars span{background:#fff;border-radius:1px;width:2.5px;height:4px}.waveform-bars.playing span:first-child{animation:.5s ease-in-out .1s infinite alternate waveDance}.waveform-bars.playing span:nth-child(2){animation:.7s ease-in-out .2s infinite alternate waveDance}.waveform-bars.playing span:nth-child(3){animation:.4s ease-in-out infinite alternate waveDance}.waveform-bars.playing span:nth-child(4){animation:.6s ease-in-out .3s infinite alternate waveDance}@keyframes waveDance{0%{height:3px}to{height:14px}}.examples-bar{scrollbar-width:none;align-items:center;gap:.6rem;margin-top:1.25rem;padding-bottom:.5rem;display:flex;overflow-x:auto}.examples-bar::-webkit-scrollbar{display:none}.example-chip{background:var(--surface-card);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;white-space:nowrap;border-radius:999px;padding:.35rem .9rem;font-size:.8rem;font-weight:700;transition:all .2s}.example-chip:hover{color:var(--primary-hover);border-color:var(--primary);background:var(--primary-glow);transform:translateY(-2px)}.breakdown-section{z-index:1;max-width:1200px;margin:0 auto 3rem;padding:0 1.5rem;position:relative}.section-title{font-family:var(--font-heading);align-items:center;gap:.6rem;margin-bottom:.35rem;font-size:1.35rem;font-weight:800;display:flex}.section-desc{color:var(--text-secondary);margin-bottom:1.25rem;font-size:.9rem}.breakdown-flow{scrollbar-width:thin;gap:.75rem;padding-bottom:.75rem;display:flex;overflow-x:auto}.char-flow-card{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-md);text-align:center;cursor:pointer;flex:0 0 100px;padding:.85rem .5rem;transition:all .25s;position:relative}.char-flow-card:hover{border-color:var(--signal-bright);box-shadow:0 6px 20px var(--signal-glow);transform:translateY(-3px)}.char-flow-card.active-playing{border-color:var(--signal-bright);box-shadow:0 0 22px var(--signal-bright);background:#10b9812e;transform:scale(1.08)}.flow-char{color:var(--text);font-size:1.3rem;font-weight:800}.flow-morse{font-family:var(--font-mono);color:var(--signal-bright);margin:.2rem 0;font-size:1.1rem;font-weight:800}.flow-ditdah{color:var(--text-muted);font-size:.725rem}.tools-tabs{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:2rem;display:flex}.tab-btn{background:var(--surface-card);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:999px;padding:.6rem 1.25rem;font-size:.875rem;font-weight:700;transition:all .2s}.tab-btn:hover,.tab-btn.active{background:linear-gradient(135deg, var(--primary), #7c3aed);color:#fff;box-shadow:0 4px 16px var(--primary-glow);border-color:#0000}.advanced-section{z-index:1;max-width:1200px;margin:0 auto 3rem;padding:0 1.5rem;position:relative}.controls-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;padding:1.5rem;display:grid}.control-group{flex-direction:column;gap:.5rem;display:flex}.control-label{color:var(--text);justify-content:space-between;font-size:.875rem;font-weight:700;display:flex}.slider-input{width:100%;accent-color:var(--primary);cursor:pointer}.metrics-box{background:var(--surface);border-radius:var(--radius-md);border:1px solid var(--border);grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;margin-top:1rem;padding:1rem;display:grid}.metric-stat{text-align:center}.metric-val{color:var(--signal-bright);font-size:1.25rem;font-weight:900}.metric-lbl{color:var(--text-muted);text-transform:uppercase;font-size:.725rem;font-weight:700}.toast-container{z-index:1000;position:fixed;bottom:2rem;right:2rem}.toast{background:var(--surface-card);border:1px solid var(--primary);color:var(--text);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);align-items:center;gap:.5rem;padding:.75rem 1.25rem;font-size:.875rem;font-weight:700;animation:.25s ease-out slideUp;display:flex}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.footer{border-top:1px solid var(--border);background:var(--surface);text-align:center;color:var(--text-secondary);margin-top:4rem;padding:3rem 1.5rem;font-size:.875rem}.footer-links{flex-wrap:wrap;justify-content:center;gap:1.5rem;margin:1.25rem 0;list-style:none;display:flex}.footer-links a{color:var(--text-secondary);font-weight:600;text-decoration:none;transition:color .15s}.footer-links a:hover{color:var(--primary-hover)}.seo-article-container{flex-direction:column;gap:2.5rem;margin-top:3.5rem;display:flex}.article-intro-card{background:var(--surface-card);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:1.75rem 2rem}.intro-paragraph{color:var(--text);margin-bottom:1rem;font-size:1.05rem;line-height:1.7}.intro-paragraph:last-child{margin-bottom:0}.article-body-content{flex-direction:column;gap:2.75rem;display:flex}.content-section{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:2rem}.content-section h2{color:var(--text);letter-spacing:-.01em;margin-bottom:1.25rem;font-size:1.45rem;font-weight:800}.content-section h3{color:var(--primary);margin:1.75rem 0 .75rem;font-size:1.15rem;font-weight:700}.content-section p{color:var(--text-secondary);margin-bottom:1rem;font-size:.975rem;line-height:1.7}.content-section p:last-child{margin-bottom:0}.content-section a{color:var(--primary);font-weight:600;text-decoration:none}.content-section a:hover{text-decoration:underline}.content-list,.code-list{color:var(--text-secondary);margin:1rem 0;padding-left:1.5rem;font-size:.95rem;line-height:1.8}.table-responsive{border-radius:var(--radius-md);border:1px solid var(--border);width:100%;margin:1.5rem 0;overflow-x:auto}.seo-table{border-collapse:collapse;text-align:left;width:100%;font-size:.925rem}.seo-table th,.seo-table td{border-bottom:1px solid var(--border);padding:.85rem 1.25rem}.seo-table th{background:var(--surface-elevated);color:var(--text);text-transform:uppercase;letter-spacing:.05em;font-size:.775rem;font-weight:800}.seo-table tbody tr:last-child td{border-bottom:none}.seo-table tbody tr:hover{background:#ffffff05}.code-demo-box{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-md);flex-wrap:wrap;align-items:center;gap:1.5rem;margin:1.25rem 0;padding:1.25rem;display:flex}.demo-step{flex-direction:column;gap:.25rem;display:flex}.demo-label{text-transform:uppercase;color:var(--text-muted);font-size:.75rem;font-weight:800}.demo-val{font-size:1.1rem}.demo-arrow{color:var(--primary);font-size:.9rem;font-weight:700}.inline-code{background:var(--surface-elevated);border:1px solid var(--border);font-family:var(--font-mono);color:var(--signal-bright);border-radius:4px;padding:.15rem .4rem;font-size:.875rem}.step-process{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin:1.5rem 0;display:grid}.process-step{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;gap:.5rem;padding:1.25rem;display:flex}.step-num{text-transform:uppercase;color:var(--primary);letter-spacing:.05em;font-size:.75rem;font-weight:800}.cta-banner{border:1px solid var(--primary);text-align:center;background:linear-gradient(135deg,#6366f11f,#a855f71f)}.motto-box{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--signal-bright);margin-top:1.5rem;padding:1rem;font-size:1.1rem}.eeat-box{background:var(--surface-elevated);border:1px solid var(--border);border-top:4px solid var(--signal-bright)}.eeat-header{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.eeat-header h2{margin-bottom:0}.article-figure{border-radius:var(--radius-lg);background:var(--surface-card);border:1px solid #6366f140;width:100%;max-width:760px;margin:2rem auto;transition:transform .25s,box-shadow .25s,border-color .25s;overflow:hidden;box-shadow:0 8px 24px #00000059}.article-figure:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:0 14px 35px #00000073}.article-figure img{object-fit:cover;object-position:top center;width:100%;max-height:420px;display:block}.article-figcaption{color:var(--text-secondary);background:var(--surface-elevated);border-top:1px solid var(--border);text-align:center;padding:.85rem 1.25rem;font-size:.85rem;font-weight:500;line-height:1.5}@media (width<=768px){.article-figure{max-width:100%;margin:1.5rem 0}.article-figure img{max-height:280px}.article-figcaption{padding:.75rem 1rem;font-size:.8rem}}.alphabet-page-container{flex-direction:column;gap:2.25rem;margin-top:1rem;display:flex}.breadcrumb-nav{color:var(--text-muted);align-items:center;gap:.5rem;font-size:.85rem;display:flex}.breadcrumb-nav a{color:var(--primary);font-weight:600;text-decoration:none}.breadcrumb-nav a:hover{text-decoration:underline}.breadcrumb-nav .separator{color:var(--text-muted)}.breadcrumb-nav .current{color:var(--text);font-weight:700}.alphabet-hero{text-align:center;border-radius:var(--radius-xl);background:radial-gradient(circle at top, #6d28d91f 0%, transparent 65%), linear-gradient(180deg, var(--surface-card) 0%, var(--background) 100%);border:1px solid var(--border);flex-direction:column;align-items:center;gap:1.25rem;margin-bottom:2rem;padding:3.5rem 1.5rem;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 40px -20px #0003}.alphabet-hero:before{content:"";z-index:0;pointer-events:none;background:url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"2\" cy=\"2\" r=\"1.5\" fill=\"rgba(109, 40, 217, 0.15)\"/></svg>");width:200%;height:200%;position:absolute;top:-50%;left:-50%}[data-theme=light] .alphabet-hero:before{background:url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"2\" cy=\"2\" r=\"1.5\" fill=\"rgba(109, 40, 217, 0.05)\"/></svg>")}.standard-badge{z-index:1;color:#60a5fa;letter-spacing:.02em;background:#3b82f61a;border:1px solid #3b82f64d;border-radius:999px;align-items:center;gap:.5rem;padding:.4rem 1rem;font-size:.8rem;font-weight:700;display:inline-flex;position:relative;box-shadow:0 0 20px #3b82f626}[data-theme=light] .standard-badge{color:#2563eb}.alphabet-title{z-index:1;color:var(--text);letter-spacing:-.03em;background:linear-gradient(135deg, var(--text) 0%, var(--text-secondary) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0;font-size:clamp(2.5rem,5vw,3.75rem);font-weight:900;line-height:1.15;position:relative}.alphabet-subtitle{z-index:1;max-width:720px;color:var(--text-secondary);margin:0;font-size:1.15rem;line-height:1.6;position:relative}.alphabet-tool-card{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);flex-direction:column;gap:1.5rem;padding:1.75rem;display:flex}.tool-controls-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.alphabet-search-box{flex:1;min-width:280px;position:relative}.alphabet-search-box .search-icon{color:var(--text-muted);position:absolute;top:50%;left:.85rem;transform:translateY(-50%)}.alphabet-search-input{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-md);width:100%;color:var(--text);outline:none;padding:.75rem 2.25rem .75rem 2.5rem;font-size:.95rem;transition:border-color .2s,box-shadow .2s}.alphabet-search-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3b82f633}.search-clear-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:.2rem;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.tool-actions-group{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.btn-seq-cta{background:var(--primary);color:#fff;border-radius:var(--radius-md);cursor:pointer;border:none;align-items:center;gap:.5rem;padding:.7rem 1.25rem;font-size:.875rem;font-weight:700;transition:background .2s,transform .15s;display:flex}.btn-seq-cta:hover{background:var(--primary-hover);transform:translateY(-1px)}.btn-seq-cta.playing{background:#ef4444}.wpm-mini-selector{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-md);align-items:center;gap:.4rem;padding:.4rem .75rem;display:flex}.wpm-lbl{color:var(--text-muted);text-transform:uppercase;font-size:.775rem;font-weight:800}.wpm-select{color:var(--signal-bright);cursor:pointer;background:0 0;border:none;outline:none;font-size:.875rem;font-weight:800}.category-tabs{border-bottom:1px solid var(--border);gap:.5rem;padding-bottom:.75rem;display:flex;overflow-x:auto}.cat-tab{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;padding:.5rem 1rem;font-size:.875rem;font-weight:700;transition:all .2s}.cat-tab:hover{color:var(--text);background:var(--surface-elevated)}.cat-tab.active{background:var(--surface-elevated);border-color:var(--primary);color:var(--signal-bright)}.alphabet-cards-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1rem;display:grid}@media (width>=1200px){.alphabet-cards-grid{grid-template-columns:repeat(6,1fr)}}.alphabet-card{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;flex-direction:column;gap:.4rem;padding:1.15rem;transition:transform .2s,border-color .2s,box-shadow .2s;display:flex;position:relative}.alphabet-card:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:0 8px 20px #0000004d}.alphabet-card.playing-glow{border-color:var(--signal-bright);box-shadow:0 0 16px var(--signal-glow);background:#22d3ee14}.alphabet-card.selected{border-color:var(--primary);background:#3b82f61f}.card-top{justify-content:space-between;align-items:center;display:flex}.char-badge{color:var(--text);font-size:1.4rem;font-weight:900}.nato-tag{text-transform:uppercase;color:var(--text-muted);background:var(--surface-card);border:1px solid var(--border);border-radius:4px;padding:.15rem .4rem;font-size:.7rem;font-weight:800}.card-morse-code{color:var(--signal-bright);letter-spacing:.1em;font-size:1.25rem;font-weight:800}.card-visual-bars{color:var(--primary);font-size:.85rem;font-weight:700}.card-rhythm{color:var(--text-secondary);font-size:.75rem;font-style:italic}.card-actions{gap:.4rem;margin-top:.4rem;display:flex}.card-btn{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;flex:1;justify-content:center;align-items:center;padding:.35rem;transition:all .15s;display:flex}.card-btn:hover{color:var(--text);border-color:var(--primary);background:var(--surface)}.no-results-box{text-align:center;color:var(--text-secondary);padding:3rem 1.5rem}.detail-modal-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:1000;background:#070b14cc;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.detail-modal-card{background:var(--surface-card);border:1px solid var(--primary);border-radius:var(--radius-lg);width:100%;max-width:520px;box-shadow:var(--shadow-lg);flex-direction:column;gap:1.5rem;padding:2rem;animation:.2s ease-out modalFadeIn;display:flex;position:relative}@keyframes modalFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-close-btn{background:var(--surface-elevated);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;display:flex;position:absolute;top:1.25rem;right:1.25rem}.modal-header{align-items:center;gap:1.25rem;display:flex}.modal-char-avatar{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--primary), #a855f7);color:#fff;justify-content:center;align-items:center;width:56px;height:56px;font-size:2rem;font-weight:900;display:flex}.modal-title{color:var(--text);font-size:1.35rem;font-weight:800}.modal-subtitle{color:var(--text-secondary);font-size:.85rem}.modal-body-grid{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.detail-metric-card{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;gap:.25rem;padding:.85rem 1rem;display:flex}.metric-label{text-transform:uppercase;color:var(--text-muted);font-size:.725rem;font-weight:800}.modal-actions-bar{flex-wrap:wrap;gap:.75rem;display:flex}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@media print{body *{visibility:hidden!important}.print-only-chart,.print-only-chart *{visibility:visible!important;color:#000!important}.print-only-chart{background:#fff!important;width:100%!important;padding:20px!important;display:block!important;position:absolute!important;top:0!important;left:0!important}}.learn-morse-page-container{flex-direction:column;gap:2rem;max-width:1100px;margin:0 auto;padding:1.5rem 1rem 4rem;display:flex}.interactive-drill-card{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);flex-direction:column;gap:1.5rem;padding:1.75rem;display:flex}.drill-header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding-bottom:1rem;display:flex}.drill-title{align-items:center;gap:.75rem;display:flex}.drill-level-selector{background:var(--surface);border-radius:var(--radius-md);border:1px solid var(--border);align-items:center;gap:.5rem;padding:.25rem;display:flex}.btn-pill{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:.4rem .85rem;font-size:.825rem;font-weight:700;transition:all .2s}.btn-pill:hover{color:var(--text)}.btn-pill.active{background:var(--primary);color:#fff;box-shadow:0 0 12px var(--primary-glow)}.drill-body{grid-template-columns:1fr 1fr;align-items:center;gap:1.5rem;display:grid}@media (width<=768px){.drill-body{grid-template-columns:1fr}}.sound-card-display{background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius-md);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1.25rem;padding:1.5rem;display:flex}.sound-visual-indicator{color:var(--primary);flex-direction:column;align-items:center;gap:.5rem;display:flex}.pulse-icon.playing{color:var(--signal-bright);animation:.6s ease-in-out infinite alternate pulse-glow}@keyframes pulse-glow{0%{filter:drop-shadow(0 0 2px var(--signal));transform:scale(1)}to{filter:drop-shadow(0 0 15px var(--signal-bright));transform:scale(1.15)}}.sound-status-label{color:var(--text-secondary);font-size:.825rem;font-weight:600}.drill-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;display:flex}.answer-reveal-area{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:1.5rem;display:flex}.revealed-box{flex-direction:column;align-items:center;gap:.25rem;display:flex}.revealed-char{color:var(--primary-hover);font-size:3rem;font-weight:900;line-height:1}.revealed-morse{font-family:var(--font-mono);letter-spacing:.25em;color:var(--signal-bright);font-size:1.5rem;font-weight:800}.hidden-box{flex-direction:column;align-items:center;gap:.35rem;padding:1rem 0;display:flex}.question-mark{color:var(--text-muted);font-size:2.75rem;font-weight:900;line-height:1}.hint-text{color:var(--text-muted);font-size:.8rem}.drill-input-group{align-items:center;gap:.5rem;width:100%;max-width:280px;display:flex}.drill-input{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--background);color:var(--text);text-align:center;text-transform:uppercase;flex:1;padding:.5rem .85rem;font-size:.95rem;font-weight:700}.drill-input:focus{border-color:var(--primary);box-shadow:0 0 8px var(--primary-glow);outline:none}.feedback-badge{border-radius:999px;align-items:center;gap:.5rem;margin-top:.5rem;padding:.4rem .85rem;font-size:.825rem;font-weight:700;display:inline-flex}.feedback-success{color:var(--signal-bright);background:#10b98126;border:1px solid #10b9814d}.feedback-error{color:#f87171;background:#ef444426;border:1px solid #ef44444d}.drill-controls-footer{border-top:1px solid var(--border);grid-template-columns:1fr 1fr;gap:1.5rem;padding-top:1rem;display:grid}@media (width<=640px){.drill-controls-footer{grid-template-columns:1fr}}.speed-slider-group{flex-direction:column;gap:.4rem;display:flex}.learn-article-container{color:var(--text);flex-direction:column;gap:2.5rem;line-height:1.7;display:flex}.article-intro-box{background:var(--surface-card);border-left:4px solid var(--primary);border-radius:var(--radius-md);color:var(--text-secondary);flex-direction:column;gap:1rem;padding:1.5rem 1.75rem;font-size:1.05rem;display:flex}.article-section{flex-direction:column;gap:1.15rem;display:flex}.article-section h2{font-family:var(--font-heading);color:var(--text);letter-spacing:-.01em;border-bottom:1px solid var(--border);padding-bottom:.5rem;font-size:1.6rem;font-weight:800}.article-section p{color:var(--text-secondary);font-size:.975rem}.quote-callout{background:var(--surface);border-left:3px solid var(--signal-bright);font-family:var(--font-mono);color:var(--signal-bright);border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin:.5rem 0;padding:.75rem 1.25rem;font-size:1rem;font-weight:700}.recognition-diagram{grid-template-columns:1fr 1fr;gap:1.25rem;margin:1rem 0;display:grid}@media (width<=640px){.recognition-diagram{grid-template-columns:1fr}}.diagram-card{border-radius:var(--radius-md);border:1px solid var(--border);flex-direction:column;gap:.75rem;padding:1.25rem;display:flex}.goal-card{background:#10b98114;border-color:#10b9814d}.flaw-card{background:#ef444414;border-color:#ef44444d}.diagram-title{text-transform:uppercase;font-size:.85rem;font-weight:800}.goal-card .diagram-title{color:var(--signal-bright)}.flaw-card .diagram-title{color:#f87171}.diagram-flow{flex-wrap:wrap;align-items:center;gap:.4rem;font-size:.85rem;font-weight:700;display:flex}.flow-step{background:var(--surface-card);border-radius:var(--radius-sm);border:1px solid var(--border);padding:.3rem .6rem}.comparison-box{background:var(--surface);border-radius:var(--radius-md);border:1px solid var(--border);grid-template-columns:1fr 1fr;gap:1rem;margin:.5rem 0;padding:1.25rem;display:grid}@media (width<=640px){.comparison-box{grid-template-columns:1fr}}.comp-item{flex-direction:column;gap:.35rem;font-size:.9rem;display:flex}.table-responsive{width:100%;overflow-x:auto}.routine-table{border-collapse:collapse;background:var(--surface);border-radius:var(--radius-md);border:1px solid var(--border);width:100%;margin:.5rem 0;overflow:hidden}.routine-table th{background:var(--surface-card);text-align:left;color:var(--text-primary);border-bottom:1px solid var(--border);padding:.85rem 1rem;font-size:.85rem;font-weight:800}.routine-table td{color:var(--text-secondary);border-bottom:1px solid var(--border);padding:.85rem 1rem;font-size:.9rem}.routine-table tr:last-child td{border-bottom:none}.tip-alert-box{border-radius:var(--radius-md);color:var(--text);background:#f59e0b1a;border:1px solid #f59e0b4d;gap:.85rem;padding:1.15rem;font-size:.925rem;line-height:1.6;display:flex}.tip-icon{color:var(--accent-amber);flex-shrink:0;margin-top:.15rem}.digit-structure-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem;margin:.5rem 0;display:grid}.digit-pill{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);justify-content:space-between;align-items:center;padding:.6rem .85rem;font-weight:800;display:flex}.digit-pill span{color:var(--primary-hover);font-size:1.1rem}.digit-pill code{font-family:var(--font-mono);color:var(--signal-bright);font-size:.95rem}.mistakes-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.15rem;margin:.5rem 0;display:grid}.mistake-card{background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius-md);align-items:flex-start;gap:1rem;padding:1.25rem;display:flex}.mistake-icon{color:#f87171;flex-shrink:0;margin-top:.2rem}.mistake-card h3{color:var(--text);margin-bottom:.35rem;font-size:1rem;font-weight:800}.mistake-card p{color:var(--text-secondary);font-size:.875rem;line-height:1.5}.roadmap-list{flex-direction:column;gap:.75rem;margin:.5rem 0;display:flex}.roadmap-step{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);align-items:center;gap:1rem;padding:.85rem 1.15rem;font-size:.925rem;font-weight:600;display:flex}.step-num{background:var(--primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:.85rem;font-weight:800;display:flex}.internal-link{color:var(--primary-hover);text-underline-offset:3px;font-weight:700;text-decoration:underline}.external-link{color:var(--signal-bright);text-underline-offset:3px;font-weight:700;text-decoration:underline}.faq-accordion{flex-direction:column;gap:.85rem;margin-top:.5rem;display:flex}.faq-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);transition:border-color .2s;overflow:hidden}.faq-item.open{border-color:var(--primary)}.faq-question-btn{width:100%;color:var(--text);text-align:left;cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;gap:1rem;padding:1.15rem 1.25rem;font-size:1rem;font-weight:700;display:flex}.faq-answer{color:var(--text-secondary);border-top:1px solid var(--border);margin-top:.5rem;padding:1rem 1.25rem 1.25rem;font-size:.925rem;line-height:1.6}@media (width<=1024px){.desktop-nav{display:none}.mobile-menu-toggle{display:flex!important}.mobile-menu-overlay{background:var(--background);border-bottom:1px solid var(--border);z-index:99;width:100%;max-height:calc(100vh - 68px);position:absolute;top:68px;left:0;overflow-y:auto;box-shadow:0 10px 15px -3px #0000001a}.mobile-nav-list{flex-direction:column;list-style:none;display:flex}.mobile-nav-item{border-bottom:1px solid var(--border)}.mobile-nav-item:last-child{border-bottom:none}.mobile-nav-button{width:100%;color:var(--text);cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;font-size:1.05rem;font-weight:700;display:flex}.mobile-nav-button.active{color:var(--primary)}.mobile-dropdown-icon{color:var(--text-muted);transition:transform .2s}.mobile-dropdown-icon.open{transform:rotate(180deg)}.mobile-dropdown-list{background:var(--surface);border-top:1px solid var(--border);list-style:none}.mobile-dropdown-item{color:var(--text-secondary);border-bottom:1px solid var(--border);padding:1rem 1.5rem 1rem 2.5rem;font-size:.95rem;font-weight:600;text-decoration:none;display:block}.mobile-dropdown-item:last-child{border-bottom:none}.mobile-dropdown-item:hover,.mobile-dropdown-item.active{color:var(--primary);background:var(--surface-hover)}}@media (width>=1025px){.mobile-menu-toggle{display:none!important}}