:root{--bg:#f6f4fc;--bg-glow:#ece6ff;--surface:#fff;--surface-2:#f1eefa;--ink:#1b1640;--muted:#5f5a85;--line:#e0daf2;--accent:#6d3df5;--accent-ink:#fff;--mark:#fff0a8;--ok:#138a52;--bad:#c62f45;--iridescent:linear-gradient(115deg, #7c5cff 0%, #e23ad4 50%, #ff9a5c 100%);--radius:14px;--shadow:0 1px 2px #1b16400f, 0 8px 24px #1b164012;--font:"Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace;--tile-l:91%;--tile-s:80%;--tile-ink-l:22%;--tile-line-l:72%;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0e0b22;--bg-glow:#1f1650;--surface:#18143a;--surface-2:#211c4a;--ink:#eeebff;--muted:#a8a2d2;--line:#2f2a5c;--accent:#9b7bff;--accent-ink:#120e2c;--mark:#5b4a00;--ok:#4ad495;--bad:#ff7b8e;--shadow:0 1px 2px #0000004d, 0 8px 24px #00000059;--tile-l:22%;--tile-s:45%;--tile-ink-l:90%;--tile-line-l:42%;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#0e0b22;--bg-glow:#1f1650;--surface:#18143a;--surface-2:#211c4a;--ink:#eeebff;--muted:#a8a2d2;--line:#2f2a5c;--accent:#9b7bff;--accent-ink:#120e2c;--mark:#5b4a00;--ok:#4ad495;--bad:#ff7b8e;--shadow:0 1px 2px #0000004d, 0 8px 24px #00000059;--tile-l:22%;--tile-s:45%;--tile-ink-l:90%;--tile-line-l:42%;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-cat=trouble]{--h:2}[data-cat=animals]{--h:28}[data-cat=food]{--h:50}[data-cat=money]{--h:100}[data-cat=nature]{--h:162}[data-cat=time]{--h:196}[data-cat=talk]{--h:226}[data-cat=success]{--h:262}[data-cat=people]{--h:298}[data-cat=body]{--h:334}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{font-family:var(--font);color:var(--ink);background:var(--bg);background-image:radial-gradient(1200px 500px at 85% -10%, var(--bg-glow), transparent 70%);-webkit-font-smoothing:antialiased;background-attachment:fixed;margin:0;line-height:1.5}a{color:var(--accent);text-underline-offset:3px}button{font:inherit;color:inherit}h1,h2,h3{letter-spacing:-.02em;margin:0 0 .5em;line-height:1.15}h1{font-size:clamp(1.8rem,4vw,2.6rem)}h2{font-size:1.35rem}.h3,h3{font-size:1.1rem}p{margin:0 0 .8em}mark{background:var(--mark);color:inherit;border-radius:4px;padding:0 .15em}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.muted{color:var(--muted)}.small{font-size:.875rem}.skip{background:var(--surface);z-index:10;border-radius:8px;padding:8px 12px;position:absolute;top:8px;left:-999px}.skip:focus{left:8px}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);align-items:center;gap:6px;margin:0 0 6px;font-size:.75rem;font-weight:600;display:inline-flex}.app{flex-direction:column;min-height:100vh;display:flex}main{flex:1;width:100%;max-width:1320px;margin:0 auto;padding:0 16px 48px}.page--narrow{max-width:760px;margin:0 auto}.page-head{padding:28px 0 20px}.lead{color:var(--muted);max-width:62ch;font-size:1.1rem}.masthead{justify-content:space-between;align-items:center;gap:16px;width:100%;max-width:1320px;margin:0 auto;padding:16px;display:flex}.brand{color:inherit;align-items:center;gap:12px;text-decoration:none;display:flex}.brand__tile{background:var(--ink);width:46px;height:46px;color:var(--bg);box-shadow:0 0 0 2px var(--bg), 0 0 0 4px transparent;border-radius:10px;flex:none;place-items:center;display:grid;position:relative}.brand__tile:after{content:"";z-index:-1;background:var(--iridescent);border-radius:12px;position:absolute;inset:-3px}.brand__num{font:600 .6rem var(--mono);opacity:.75;position:absolute;top:3px;left:5px}.brand__sym{margin-top:6px;font-size:1.35rem;font-weight:700}.brand__text{flex-direction:column;display:flex}.brand__name{letter-spacing:-.02em;font-size:1.3rem;font-weight:700;line-height:1.1}.brand__tag{color:var(--muted);font-size:.8rem}.mainnav{align-items:center;gap:4px;display:flex}.mainnav a{color:var(--ink);border-radius:999px;align-items:center;gap:6px;padding:8px 12px;font-weight:500;text-decoration:none;display:inline-flex}.mainnav a:hover{background:var(--surface-2)}.mainnav a[aria-current=page]{background:var(--ink);color:var(--bg)}.footer{width:100%;max-width:1320px;color:var(--muted);border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:8px;margin:0 auto;padding:24px 16px 32px;font-size:.875rem;display:flex}.footer a{white-space:nowrap}.btn{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:8px 16px;font-weight:600;text-decoration:none;transition:transform .12s,background .15s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.6;cursor:default}.btn--primary{background:var(--accent);color:var(--accent-ink)}.btn--primary:hover:not(:disabled){filter:brightness(1.08)}.btn--ghost{background:var(--surface);border-color:var(--line);color:var(--ink)}.btn--ghost:hover{background:var(--surface-2)}.btn--done{background:color-mix(in srgb, var(--ok) 16%, var(--surface));border-color:var(--ok);color:var(--ok)}.btn--lg{min-height:48px;padding:10px 24px;font-size:1.05rem}.icon-btn{border:1px solid var(--line);background:var(--surface);cursor:pointer;width:40px;height:40px;color:var(--ink);border-radius:999px;flex:none;place-items:center;display:inline-grid}.icon-btn:hover{background:var(--surface-2)}.icon-btn--sm{background:0 0;border:0;width:28px;height:28px}.link-btn{color:var(--accent);cursor:pointer;text-underline-offset:3px;background:0 0;border:0;padding:0;font-weight:600;text-decoration:underline}.segmented{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:3px;display:inline-flex}.segmented button{cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:999px;align-items:center;gap:6px;min-height:34px;padding:6px 14px;font-weight:500;display:inline-flex}.segmented button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.segmented--wrap{border-radius:18px;flex-wrap:wrap}.card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;padding:24px}.swatch{background:hsl(var(--h) var(--tile-s) var(--tile-l));border:1.5px solid hsl(var(--h) 60% var(--tile-line-l));border-radius:4px;flex:none;width:12px;height:12px;display:inline-block}.tile{background:hsl(var(--h,260) var(--tile-s) var(--tile-l));color:hsl(var(--h,260) 60% var(--tile-ink-l));border:1.5px solid hsl(var(--h,260) 55% var(--tile-line-l));text-align:center;border-radius:10px;flex-direction:column;flex:none;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.tile__number{font-family:var(--mono);opacity:.8;font-weight:500;position:absolute;top:6%;left:8%}.tile__symbol{letter-spacing:-.02em;font-weight:700;line-height:1}.tile__name{padding:0 6%;font-weight:500;line-height:1.15}.tile__learned{background:var(--ok);color:#fff;border-radius:999px;place-items:center;font-weight:700;line-height:1;display:grid;position:absolute;top:5%;right:7%}.tile--cell{border-radius:7px;width:100%;height:100%}.tile--cell .tile__number{font-size:15cqi}.tile--cell .tile__symbol{margin-top:8cqi;font-size:34cqi}.tile--cell .tile__name{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:4cqi;font-size:10.5cqi;display:-webkit-box;overflow:hidden}.tile--cell .tile__learned{width:18cqi;height:18cqi;font-size:12cqi}.tile--sm{border-radius:9px;width:48px;height:48px}.tile--sm .tile__number{font-size:.6rem}.tile--sm .tile__symbol{margin-top:6px;font-size:1.25rem}.tile--sm .tile__learned{width:13px;height:13px;font-size:.55rem}.tile--lg{border-radius:14px;width:104px;height:112px}.tile--lg .tile__number{font-size:.8rem}.tile--lg .tile__symbol{margin-top:8px;font-size:2.6rem}.tile--lg .tile__name{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:4px;font-size:.7rem;display:-webkit-box;overflow:hidden}.tile--lg .tile__learned{width:18px;height:18px;font-size:.7rem}.tile--xl{border-width:2px;border-radius:16px;width:132px;height:144px}.tile--xl .tile__number{font-size:.95rem}.tile--xl .tile__symbol{margin-top:10px;font-size:3.4rem}.tile--xl .tile__name{margin-top:6px;font-size:.8rem}.tile--xl .tile__learned{width:22px;height:22px;font-size:.8rem}.levels{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:8px 0 10px;display:grid}.level{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:16px;grid-template-columns:1fr auto;align-items:end;gap:2px 10px;padding:12px 16px;text-decoration:none;transition:border-color .15s,transform .15s;display:grid;position:relative}.level:hover{border-color:var(--accent)}.level--active{background:linear-gradient(var(--surface), var(--surface)) padding-box, var(--iridescent) border-box;box-shadow:var(--shadow);border:2px solid #0000;padding:11px 15px}.level__num{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);grid-column:1;font-size:.75rem;font-weight:600}.level__name{grid-column:1;font-size:1.2rem;font-weight:700}.level__progress{font:500 .75rem var(--mono);color:var(--muted);flex-direction:column;grid-area:1/2/3;align-items:flex-end;gap:4px;display:flex}.level__bar{background:var(--surface-2);border-radius:999px;width:64px;height:6px;position:relative;overflow:hidden}.level__bar:after{content:"";width:var(--p);background:var(--ok);border-radius:inherit;position:absolute;inset:0 auto 0 0}.level__hits{background:var(--accent);color:var(--accent-ink);border-radius:999px;padding:1px 8px;font-size:.72rem;font-weight:600;position:absolute;top:-9px;right:12px}.level-blurb{color:var(--muted);margin:0 0 14px}.toolbar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px;display:flex}.search{background:var(--surface);border:1px solid var(--line);min-height:42px;color:var(--muted);border-radius:999px;flex:280px;align-items:center;gap:8px;padding:0 8px 0 14px;display:flex}.search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent)}.search input{min-width:0;font:inherit;color:var(--ink);background:0 0;border:0;outline:0;flex:1;padding:10px 0}.search input::-webkit-search-cancel-button{display:none}.families{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.family{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:999px;align-items:center;gap:7px;min-height:34px;padding:5px 12px 5px 9px;font-size:.875rem;display:inline-flex}.family:hover{border-color:hsl(var(--h,260) 55% var(--tile-line-l))}.family__name{color:var(--muted);font-size:.75rem;font-family:var(--mono)}.family[aria-pressed=true]{background:hsl(var(--h,260) var(--tile-s) var(--tile-l));border-color:hsl(var(--h,260) 55% var(--tile-line-l));color:hsl(var(--h,260) 60% var(--tile-ink-l));font-weight:600}.family[aria-pressed=true] .family__name{color:inherit}.families--compact .family__name{display:none}.status-line{min-height:28px;color:var(--muted);flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:8px;font-size:.9rem;display:flex}.empty{text-align:center;color:var(--muted);padding:48px 0}.ptable-scroll{scrollbar-width:thin;margin:0 -16px;padding:4px 16px 12px;overflow-x:auto}.ptable{grid-template-rows:repeat(7,auto) 12px repeat(2,auto);grid-template-columns:repeat(18,minmax(0,1fr));gap:4px;min-width:920px;display:grid}.cell{aspect-ratio:1/1.12;cursor:pointer;background:0 0;border:0;border-radius:8px;padding:0;transition:transform .15s,opacity .2s,filter .2s;container-type:inline-size}.cell:hover,.cell:focus-visible{z-index:2;position:relative;transform:scale(1.12)}.cell:hover .tile,.cell:focus-visible .tile{box-shadow:0 6px 18px hsl(var(--h) 60% 30% / .35)}@container (width<=52px){.tile--cell .tile__name{display:none}.tile--cell .tile__symbol{margin-top:14cqi;font-size:40cqi}.tile--cell .tile__number{font-size:20cqi}}.cell--dim{opacity:.16;filter:grayscale()}.cell--dim:hover{opacity:.5}.ptable__slot{border:1.5px dashed var(--line);font:500 .65rem var(--mono);color:var(--muted);aspect-ratio:1/1.12;border-radius:7px;place-items:center;display:grid}.preview{align-items:center;gap:18px;min-width:0;padding:6px 12px;display:flex;overflow:hidden}.preview__text{min-width:0}.preview__phrase{margin:0 0 4px;font-size:1.35rem;font-weight:700;line-height:1.15}.preview__meaning{color:var(--muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0 0 6px;display:-webkit-box;overflow:hidden}.list{gap:22px;display:grid}.list__heading{align-items:center;gap:8px;margin-bottom:8px;font-size:1rem;display:flex}.list__items{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.row{text-align:left;background:var(--surface);border:1px solid var(--line);cursor:pointer;width:100%;color:var(--ink);border-radius:14px;align-items:center;gap:12px;padding:10px;text-decoration:none;display:flex}.row:hover{border-color:hsl(var(--h,260) 55% var(--tile-line-l))}.row__text{flex-direction:column;min-width:0;display:flex}.row__phrase{font-weight:600}.row__meaning{color:var(--muted);font-size:.875rem}.detail{background:var(--surface);width:min(600px,100vw - 24px);max-height:calc(100dvh - 24px);color:var(--ink);border:0;border-radius:24px;padding:0;box-shadow:0 24px 80px #00000059}.detail::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0e0b228c}.detail[open]{animation:.18s ease-out pop}@keyframes pop{0%{opacity:0;transform:translateY(8px)scale(.98)}}.detail__inner{border-top:6px solid hsl(var(--h) 65% 60%);outline:none;padding:24px}.detail__top{align-items:flex-start;gap:18px;margin-bottom:20px;display:flex}.detail__meta{flex:1;min-width:0;padding-top:4px}.detail__phrase{margin-bottom:10px;font-size:clamp(1.5rem,4vw,2rem)}.detail__close{margin-left:auto}.chip-static{background:var(--surface-2);border-radius:999px;align-items:center;gap:6px;margin:0;padding:3px 10px;font-size:.875rem;display:inline-flex}.detail__section{margin-bottom:16px}.detail__section .eyebrow{margin-bottom:4px}.detail__meaning{margin:0;font-size:1.2rem;font-weight:500}.detail__example{background:var(--surface-2);border-left:4px solid hsl(var(--h) 65% 60%);border-radius:12px;margin:0;padding:12px 14px;font-size:1.1rem}.detail__listen{flex-wrap:wrap;gap:8px;margin-bottom:18px;display:flex}.detail__actions{border-top:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:8px;padding-top:16px;display:flex}.detail__nav{gap:6px;margin-left:auto;display:flex}fieldset{border:0;margin:0 0 20px;padding:0}legend{margin-bottom:8px;padding:0;font-weight:600}.checkbox{cursor:pointer;align-items:center;gap:10px;margin-bottom:20px;display:flex}.checkbox input{width:18px;height:18px;accent-color:var(--accent)}.lab-setup__go{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:8px;padding-top:16px;display:flex}.page-head--quiz{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding-bottom:14px;display:flex}.quiz-progress{gap:4px;display:flex}.quiz-progress span{background:var(--line);border-radius:999px;width:22px;height:8px}.quiz-progress .now{background:var(--accent)}.quiz-progress .ok{background:var(--ok)}.quiz-progress .bad{background:var(--bad)}.quiz{border-top:6px solid hsl(var(--h) 65% 60%)}.quiz__ask{color:var(--muted);font-weight:600}.quiz__subject{align-items:center;gap:18px;margin-bottom:18px;display:flex}.quiz__phrase{flex-wrap:wrap;align-items:center;gap:10px;margin:0;font-size:clamp(1.3rem,3.5vw,1.8rem);font-weight:700;display:flex}.quiz__sentence{background:var(--surface-2);border-radius:12px;padding:14px 16px;font-size:1.3rem;line-height:1.6}.blank{color:var(--accent);font-family:var(--mono);letter-spacing:1px;display:inline-block}.options{gap:8px;margin:16px 0 0;padding:0;list-style:none;display:grid}.option{text-align:left;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;border-radius:14px;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:14px 16px;font-size:1rem;display:flex}.option:hover:not(:disabled){border-color:var(--accent)}.option:disabled{cursor:default;color:var(--ink)}.option.correct{border-color:var(--ok);background:color-mix(in srgb, var(--ok) 14%, var(--surface))}.option.wrong{border-color:var(--bad);background:color-mix(in srgb, var(--bad) 12%, var(--surface))}.option.faded{opacity:.5}.feedback{background:var(--surface-2);border-radius:14px;margin-top:18px;padding:16px}.feedback__title{font-size:1.1rem;font-weight:700}.feedback--ok .feedback__title{color:var(--ok)}.feedback--bad .feedback__title{color:var(--bad)}.feedback .detail__example{background:var(--surface);margin-bottom:14px}.review{gap:8px;margin:0 0 12px;padding:0;list-style:none;display:grid}.prose section{margin-bottom:32px}.prose ul{padding-left:1.2em}.prose li{margin-bottom:8px}.how-to{margin-bottom:32px}.anatomy{flex-wrap:wrap;align-items:center;gap:24px;display:flex}.anatomy__notes{flex:260px;margin:0;padding-left:1.2em}.levels-list{list-style:none;padding:0!important}.family-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;display:grid}.family-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;align-items:flex-start;gap:10px;padding:12px 14px;display:flex}.family-card .swatch{margin-top:5px}.family-card p{margin:2px 0 0}.people{gap:12px;margin:0 0 24px;padding:0;list-style:none;display:grid}.person{align-items:center;gap:20px;padding:18px;display:flex}.person p{color:var(--muted);margin:0}@media (width<=720px){.brand__tag{display:none}.mainnav a{padding:8px 10px}.levels{gap:6px}.level{grid-template-columns:1fr;padding:10px}.level--active{padding:9px}.level__name{font-size:1rem}.level__progress{grid-area:auto/1;align-items:flex-start}.level__bar{width:100%}.hide-sm{display:none}.ptable{gap:3px;min-width:660px}.preview{gap:10px;padding:2px 6px}.preview .tile--lg{width:64px;height:70px}.preview .tile--lg .tile__symbol{font-size:1.6rem}.preview .tile--lg .tile__name{display:none}.preview__phrase{font-size:1rem}.preview__meaning{-webkit-line-clamp:2;font-size:.85rem}.preview .eyebrow{margin-bottom:2px;font-size:.65rem}.family__name{display:none}.detail__inner{padding:18px}.detail__top{gap:14px}.detail__top .tile--xl{width:96px;height:104px}.detail__top .tile--xl .tile__symbol{font-size:2.4rem}.detail__top .tile--xl .tile__name{display:none}.card{padding:18px}.list__items{grid-template-columns:1fr}.quiz__subject .tile--lg{width:80px;height:88px}.quiz__subject .tile--lg .tile__symbol{font-size:2rem}}@media (width<=420px){.brand__name{font-size:1.1rem}.mainnav{gap:0}.mainnav a svg{display:none}.level__num{font-size:.65rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
