:root{--ink:#14262c;--ink-soft:#3a555e;--paper:#eef5f4;--paper-deep:#d9e8e6;--mist:#f4faf8;--teal:#0f6e6a;--teal-deep:#0a4f4c;--teal-soft:#b7d9d5;--copper:#b86b2a;--copper-soft:#f0d7bf;--line:#14262c1f;--shadow:0 18px 50px #0f37341f;--radius:18px;--radius-sm:10px;--sidebar-width:280px;--header-height:72px;--font-display:"Fraunces", "Georgia", serif;--font-body:"Sora", "Segoe UI", sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--ease:cubic-bezier(.22, 1, .36, 1)}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;color:var(--ink);font-family:var(--font-body);background:radial-gradient(1200px 600px at 10% -10%, #0f6e6a29, transparent 55%), radial-gradient(900px 500px at 100% 0%, #b86b2a1f, transparent 45%), linear-gradient(180deg, var(--mist), var(--paper) 40%, var(--paper-deep));background-attachment:fixed;margin:0;line-height:1.65}body:before{content:"";pointer-events:none;opacity:.035;z-index:0;background-image:linear-gradient(#14262c59 1px,#0000 1px),linear-gradient(90deg,#14262c59 1px,#0000 1px);background-size:28px 28px;position:fixed;inset:0}#root{z-index:1;min-height:100vh;position:relative}a{color:var(--teal-deep);text-underline-offset:.18em;text-decoration-thickness:1px}a:hover{color:var(--copper)}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.02em;margin:0 0 .6em;font-weight:560;line-height:1.2}p{margin:0 0 1em}button,input,select{font:inherit}code,.mono{font-family:var(--font-mono)}.app-shell{grid-template-columns:var(--sidebar-width) 1fr;min-height:100vh;display:grid}.app-shell.nav-open{overflow:hidden}.main-column{flex-direction:column;min-width:0;display:flex}.content{width:min(860px,100% - 2.5rem);animation:rise .55s var(--ease) both;margin:0 auto;padding:1.5rem 0 4rem}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes draw{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes pulse-soft{0%,to{box-shadow:0 0 #0f6e6a2e}50%{box-shadow:0 0 0 10px #0f6e6a00}}.site-header{z-index:20;height:var(--header-height);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);background:#f4faf8d1;justify-content:space-between;align-items:center;gap:1rem;padding:0 1.25rem;display:flex;position:sticky;top:0}.brand-block{color:inherit;flex-direction:column;gap:.1rem;text-decoration:none;display:flex}.brand-name{font-family:var(--font-display);letter-spacing:-.03em;font-size:1.55rem;line-height:1}.brand-pronunciation{letter-spacing:.18em;color:var(--ink-soft);text-transform:uppercase;font-size:.78rem}.brand-phonetic{color:var(--teal);font-size:.78rem;font-family:var(--font-mono)}.header-actions{flex:1;justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.lang-switch{color:var(--ink-soft);align-items:center;gap:.4rem;font-size:.8rem;display:inline-flex}.lang-switch select{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.45rem .7rem}@media (width<=560px){.lang-switch-label{display:none}}.menu-toggle{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:999px;padding:.55rem .9rem;display:none}.sidebar{border-right:1px solid var(--line);background:linear-gradient(#ffffffb8,#e9f4f2eb);height:100vh;padding:1.25rem 1rem 2rem;position:sticky;top:0;overflow:auto}.sidebar-section{margin-bottom:1.4rem}.sidebar-section h2{font-family:var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 .55rem .55rem;font-size:.72rem}.sidebar a{color:var(--ink);transition:background .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);border-radius:12px;padding:.55rem .75rem;text-decoration:none;display:block}.sidebar a:hover{background:#0f6e6a14;transform:translate(2px)}.sidebar a.active{background:var(--teal);color:#fff}.search-wrap{width:min(360px,100%);position:relative}.search-wrap input{border:1px solid var(--line);background:#ffffffe6;border-radius:999px;outline:none;width:100%;padding:.7rem 1rem .7rem 2.4rem}.search-wrap input:focus{border-color:var(--teal);box-shadow:0 0 0 3px #0f6e6a1f}.search-icon{color:var(--ink-soft);font-size:.9rem;position:absolute;top:50%;left:.9rem;transform:translateY(-50%)}.search-results{border:1px solid var(--line);max-height:420px;box-shadow:var(--shadow);z-index:30;background:#fff;border-radius:16px;position:absolute;top:calc(100% + .4rem);left:0;right:0;overflow:auto}.search-results a{color:inherit;border-bottom:1px solid var(--line);padding:.75rem 1rem;text-decoration:none;display:block}.search-results a:hover{background:#0f6e6a0f}.search-kind{letter-spacing:.08em;text-transform:uppercase;color:var(--teal);margin-bottom:.15rem;font-size:.7rem;display:inline-block}.hero{min-height:calc(100vh - var(--header-height));align-items:end;padding:2rem 0 3rem;display:grid;position:relative;overflow:hidden}.hero-visual{z-index:-1;background:linear-gradient(120deg,#0a4f4ce0,#14262c8c),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='600' viewBox='0 0 800 600'%3E%3Crect fill='%230a4f4c' width='800' height='600'/%3E%3Cpath d='M0 420C120 360 220 480 340 400C460 320 520 180 640 220C720 246 780 300 800 280V600H0Z' fill='%230f6e6a'/%3E%3Cpath d='M0 480C140 430 240 520 360 470C480 420 560 300 680 340C740 360 780 400 800 390V600H0Z' fill='%2314262c' opacity='.55'/%3E%3Ccircle cx='620' cy='140' r='48' fill='%23f0d7bf' opacity='.55'/%3E%3C/svg%3E") 50%/cover;position:absolute;inset:0}.hero-copy{color:#fff;width:min(720px,100%);animation:rise .7s var(--ease) both;padding:1.5rem}.hero-brand{font-family:var(--font-display);margin:0;font-size:clamp(3.2rem,9vw,6rem);line-height:.95}.hero-sub{letter-spacing:.22em;text-transform:uppercase;opacity:.9;margin:.55rem 0 .2rem;font-size:.85rem}.hero-phonetic{font-family:var(--font-mono);opacity:.85;margin-bottom:1.1rem}.hero-lead{opacity:.92;max-width:34rem;font-size:1.1rem}.cta-row{flex-wrap:wrap;gap:.75rem;margin-top:1.4rem;display:flex}.btn{cursor:pointer;transition:transform .2s var(--ease), background .2s var(--ease), color .2s var(--ease);border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;padding:.8rem 1.25rem;text-decoration:none;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn-primary{color:var(--teal-deep);background:#fff}.btn-ghost{color:#fff;background:0 0;border-color:#ffffff73}.btn-solid{background:var(--teal);color:#fff}.btn-outline{color:var(--teal-deep);background:0 0;border-color:#0f6e6a59}.section{margin:2.5rem 0}.section-title{display:inline-block;position:relative}.section-title:after{content:"";background:linear-gradient(90deg, var(--teal), transparent);transform-origin:0;width:100%;height:2px;animation:draw .8s var(--ease) both;position:absolute;bottom:-.25rem;left:0}.lead{color:var(--ink-soft);font-size:1.08rem}.rule-block{border-left:3px solid var(--teal);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-family:var(--font-mono);background:#ffffff8c;margin:1.25rem 0;padding:1.1rem 1.2rem;font-size:.95rem}.remember{border-radius:var(--radius);background:linear-gradient(135deg,#f0d7bf8c,#b7d9d573);border:1px solid #b86b2a2e;margin:1.5rem 0;padding:1.1rem 1.25rem}.remember strong{font-family:var(--font-display);margin-bottom:.35rem;font-size:1.05rem;display:block}.table-wrap{border:1px solid var(--line);border-radius:var(--radius);background:#ffffffb3;margin:1.25rem 0 1.75rem;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.95rem}th,td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:.75rem .9rem}th{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);background:#0f6e6a0d;font-size:.75rem}.example{border-radius:var(--radius-sm);border:1px solid var(--line);background:#ffffffa6;margin:.85rem 0;padding:.95rem 1.1rem}.example-ai{font-family:var(--font-display);margin-bottom:.25rem;font-size:1.15rem}.example-hu{color:var(--ink-soft)}.example-gloss{font-family:var(--font-mono);color:var(--teal-deep);margin-top:.35rem;font-size:.82rem}.builder{border-radius:var(--radius);border:1px solid var(--line);background:#ffffffb8;margin:1.5rem 0;padding:1.25rem;animation:3.5s ease-in-out infinite pulse-soft}.builder-grid{gap:.85rem;display:grid}.builder label{color:var(--ink-soft);gap:.35rem;font-size:.85rem;display:grid}.builder select,.builder input{border:1px solid var(--line);background:#fff;border-radius:12px;padding:.65rem .8rem}.builder-flow{flex-wrap:wrap;align-items:center;gap:.45rem;margin:1rem 0;display:flex}.chip{font-family:var(--font-mono);background:#0f6e6a1a;border-radius:999px;align-items:center;gap:.35rem;padding:.45rem .7rem;font-size:.88rem;display:inline-flex}.chip small{color:var(--ink-soft);font-family:var(--font-body)}.arrow{color:var(--copper);font-weight:700}.final-word{font-family:var(--font-display);color:var(--teal-deep);margin:.4rem 0 0;font-size:clamp(1.8rem,4vw,2.6rem)}.vocab-toolbar{flex-wrap:wrap;gap:.75rem;margin:1rem 0 1.5rem;display:flex}.vocab-toolbar input,.vocab-toolbar select{border:1px solid var(--line);background:#fff;border-radius:12px;min-width:180px;padding:.7rem .9rem}.vocab-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.85rem;display:grid}.vocab-card{color:inherit;border-radius:var(--radius-sm);border:1px solid var(--line);transition:transform .2s var(--ease), border-color .2s var(--ease);background:#ffffffb3;padding:1rem;text-decoration:none;display:block}.vocab-card:hover{border-color:#0f6e6a59;transform:translateY(-2px)}.vocab-word{font-family:var(--font-display);font-size:1.25rem}.vocab-meta{color:var(--ink-soft);margin-top:.35rem;font-size:.8rem}.topic-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.9rem;display:grid}.topic-link{border-radius:var(--radius);color:inherit;border:1px solid var(--line);transition:transform .2s var(--ease), background .2s var(--ease);background:#ffffffa8;padding:1.1rem 1.15rem;text-decoration:none;display:block}.topic-link:hover{background:#fff;transform:translateY(-2px)}.topic-link h3{margin-bottom:.35rem;font-size:1.15rem}.topic-link p{color:var(--ink-soft);margin:0;font-size:.92rem}.overlay{display:none}@media (width<=960px){.app-shell{grid-template-columns:1fr}.menu-toggle{display:inline-flex}.sidebar{z-index:40;width:min(86vw,320px);transition:transform .28s var(--ease);box-shadow:var(--shadow);position:fixed;top:0;left:0;transform:translate(-105%)}.app-shell.nav-open .sidebar{transform:none}.overlay{opacity:0;pointer-events:none;transition:opacity .28s var(--ease);z-index:35;background:#0a1e2059;display:block;position:fixed;inset:0}.app-shell.nav-open .overlay{opacity:1;pointer-events:auto}.content{width:min(100% - 1.5rem,860px)}.search-wrap{width:min(220px,42vw)}}@media (width<=560px){.site-header{padding:0 .75rem}.brand-pronunciation,.brand-phonetic{display:none}.hero-copy{padding:1rem}}