.system-page{min-height:60vh;padding:var(--s-xl);justify-content:center;align-items:center;display:flex}.system-card{align-items:center;gap:var(--s-md);padding:var(--s-2xl);text-align:center;border-radius:var(--radius-xl);flex-direction:column;width:100%;max-width:440px;display:flex}.system-icon{border-radius:var(--radius-full);width:88px;height:88px;margin-bottom:var(--s-sm);justify-content:center;align-items:center;display:flex}.system-icon--error{background:color-mix(in srgb, var(--danger) 12%, transparent);color:var(--danger)}.system-icon--warning{color:#f59e0b;background:#f59e0b1f}.system-icon--info{background:color-mix(in srgb, var(--brand-primary) 12%, transparent);color:var(--brand-primary)}.system-icon--success{background:color-mix(in srgb, var(--brand-success) 12%, transparent);color:var(--brand-success)}.system-heading{font-family:var(--font-display);font-size:var(--text-xl);color:var(--ink);margin:0;font-weight:700}.system-message{color:var(--ink);font-size:var(--text-base);margin:0;line-height:1.5}.system-detail{color:var(--ink-soft);font-size:var(--text-caption);word-break:break-all;margin:0;font-family:monospace}.system-actions{gap:var(--s-md);margin-top:var(--s-sm);flex-wrap:wrap;justify-content:center;display:flex}.system-actions .btn{font-size:var(--text-small)}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--brand-primary:#d6ad60;--brand-secondary:#df6254;--brand-tertiary:#e3c990;--brand-success:#79a96b;--paper:#090c0b;--surface:#121614;--surface-raised:#181d1a;--ink:#f2ede4;--ink-soft:#aaa398;--hairline:#2c322f;--shu:#ee6b5f;--ai:#d6ad60;--danger:#ef746b;--mesh-1:#d6ad6029;--mesh-2:#df625424;--mesh-3:#e3c9901a;--mesh-bg:#090c0b;--ground-scrim:#090c0be6;--glass-bg:#121614eb;--glass-solid:#121614;--glass-border:#d6ad602e;--glass-edge:#0000009e;--glass-blur:18px;--shu-glass:#f07b70;--font-ja:"Zen Kaku Gothic New", system-ui, sans-serif;--font-ui:"Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;--font-display:"Outfit", var(--font-ui);--text-caption:.875rem;--text-small:1rem;--text-body:1.125rem;--text-large:1.25rem;--text-title:1.625rem;--text-heading:2.25rem;--text-display:clamp(3rem, 7vw, 5.5rem);--text-base:var(--text-body);--text-lg:var(--text-large);--text-xl:var(--text-title);--text-2xl:var(--text-heading);--s-xs:4px;--s-sm:8px;--s-md:12px;--s-lg:16px;--s-xl:24px;--s-2xl:32px;--s-3xl:48px;--s-4xl:72px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--t-fast:.15s;--t-base:.25s;--t-slow:.4s;--spring-bounce:cubic-bezier(.34, 1.56, .64, 1)}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-color:color-mix(in srgb, var(--brand-primary) 42%, var(--hairline)) var(--paper)}::selection{background:color-mix(in srgb, var(--brand-primary) 72%, var(--paper));color:var(--ink)}:where(input,select,textarea){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;accent-color:var(--brand-primary);caret-color:var(--brand-primary)}body{background-color:var(--mesh-bg);color:var(--ink);font-family:var(--font-ui);font-size:var(--text-body);-webkit-font-smoothing:antialiased;min-height:100vh;margin:0;line-height:1.6;position:relative;overflow-x:hidden}body:before{content:"";z-index:-1;background-image:linear-gradient(var(--ground-scrim), var(--ground-scrim)), url(./background-BLSOsUTV.jpg);pointer-events:none;background-position:50%;background-repeat:no-repeat;background-size:cover;position:fixed;inset:0}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(180%);backdrop-filter:blur(var(--glass-blur)) saturate(180%);border:1px solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:0 1px 1px 0 #ffffff1a inset, 0 12px 40px -12px var(--glass-edge);transition:transform var(--t-base) var(--spring-bounce), box-shadow var(--t-base) ease}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.glass{background:var(--glass-solid)}}.js-motion .reveal{opacity:0;transform:translateY(24px)scale(.98)}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js-motion .reveal{opacity:1;transform:none}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.wrap{width:100%;max-width:1060px;padding:0 var(--s-xl);margin:0 auto}.ja{font-family:var(--font-ja)}.tabular{font-variant-numeric:tabular-nums}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);letter-spacing:-.02em;margin-top:0;font-weight:700}:where(a,button,[tabindex]):focus-visible{outline:2px solid var(--brand-primary);outline-offset:3px;border-radius:var(--radius-md)}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.text-gradient{background:linear-gradient(135deg, var(--brand-primary), var(--brand-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.btn{min-height:48px;font-family:var(--font-ui);font-weight:600;font-size:var(--text-body);padding:var(--s-md) var(--s-xl);border-radius:var(--radius-full);cursor:pointer;transition:all var(--t-fast) var(--spring-bounce);border:none;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.btn:active:not(:disabled){transform:scale(.95)}.btn:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}.btn-primary{background:var(--brand-primary);color:var(--paper);box-shadow:0 8px 22px #d6ad6029}.btn-primary:hover:not(:disabled){background:var(--brand-tertiary);transform:translateY(-2px);box-shadow:0 10px 28px #d6ad603d}.btn-secondary{background:var(--surface);color:var(--ink);border:1px solid var(--hairline);box-shadow:0 2px 8px var(--glass-edge)}.btn-secondary:hover:not(:disabled){border-color:color-mix(in srgb, var(--brand-primary) 48%, var(--hairline));background:var(--surface-raised);color:var(--brand-primary);transform:translateY(-2px)}.skip{left:var(--s-lg);z-index:10;padding:var(--s-md) var(--s-lg);background:var(--glass-solid);color:var(--ink);border:1px solid var(--hairline);border-radius:var(--radius-md);transition:top var(--t-fast) ease;text-decoration:none;position:absolute;top:-100px}.skip:focus{top:var(--s-lg)}.hero{padding:var(--s-4xl) 0 var(--s-3xl);text-align:center;justify-content:center;align-items:center;display:flex;position:relative;overflow:visible}.hero-inner{align-items:center;gap:var(--s-xl);z-index:2;flex-direction:column;display:flex;position:relative}.eyebrow{font-size:var(--text-small);letter-spacing:.2em;text-transform:uppercase;color:var(--brand-primary);background:var(--glass-bg);padding:var(--s-xs) var(--s-md);border-radius:var(--radius-full);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));margin:0;font-weight:800}.hero-title{max-width:20ch;font-size:var(--text-display);letter-spacing:-.03em;margin:0;font-weight:800;line-height:1.1}.hero-title em{color:#0000;background:linear-gradient(135deg, var(--brand-primary), var(--brand-secondary));-webkit-background-clip:text;background-clip:text;font-style:normal}.hero-lede{max-width:50ch;font-size:var(--text-large);color:var(--ink-soft);margin:0;line-height:1.6}.hero-stats{justify-content:center;gap:var(--s-xl);padding:var(--s-lg) var(--s-2xl);background:var(--glass-bg);width:fit-content;-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:0 10px 30px var(--glass-edge);flex-wrap:wrap;display:flex}.stat{flex-direction:column;align-items:center;min-width:100px;display:flex}.stat-value{font-size:var(--text-heading);color:var(--brand-primary);font-weight:800;line-height:1.1}.stat-label{font-size:var(--text-small);color:var(--ink-soft);font-weight:500}.stat-ja{font-size:var(--text-caption);color:var(--ink-soft);opacity:.6}.section{padding:var(--s-3xl) 0;z-index:1;position:relative}.section-head{align-items:flex-start;gap:var(--s-xs);margin-bottom:var(--s-2xl);flex-direction:column;display:flex}.section-kanji{display:none}.section-idx{font-size:var(--text-caption);letter-spacing:.15em;text-transform:uppercase;color:var(--brand-secondary);margin:0;font-weight:700}.section-head h2{font-size:var(--text-heading);margin:0;line-height:1.15}.section-sub{margin:var(--s-sm) 0 0;max-width:60ch;color:var(--ink-soft);font-size:var(--text-large)}.panel{padding:var(--s-xl)}.note{gap:var(--s-xs);color:var(--ink-soft);flex-direction:column;display:flex}.note-error strong{color:var(--danger)}.notfound-actions{align-items:center;gap:var(--s-md);margin:var(--s-md) 0 0;flex-wrap:wrap;display:flex}.mono{border:1px solid var(--hairline);border-radius:var(--radius-sm);background:var(--paper);color:var(--ink);word-break:break-all;padding:1px 5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}.reader-page{padding-top:var(--s-4xl);padding-bottom:var(--s-4xl)}.reader-intro{justify-content:space-between;align-items:end;gap:var(--s-xl);margin-bottom:var(--s-2xl);display:flex}.reader-intro h1,.reader-card h1,.reader-card h2{margin:0;line-height:1.12}.reader-intro h1{font-size:var(--text-display)}.reader-copy{max-width:58ch;color:var(--ink-soft);line-height:1.6}.reader-known{min-width:132px;padding:var(--s-md) var(--s-lg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);background:var(--glass-bg);text-align:right}.reader-known strong{color:var(--brand-primary);font-size:var(--text-heading);display:block}.reader-known span{color:var(--ink-soft);font-size:var(--text-caption)}.reader-card{max-width:680px;padding:var(--s-2xl);border:1px solid var(--glass-border);border-radius:var(--radius-xl)}.reader-empty-mark{color:var(--brand-primary);margin:0;font-size:4rem;line-height:1}.reading-list{gap:var(--s-md);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:0;padding:0;list-style:none;display:grid}.reading-word{min-height:180px;padding:var(--s-xl);border:1px solid var(--glass-border);border-radius:var(--radius-lg);flex-direction:column;justify-content:center;display:flex}.reading-lemma{margin:0;font-size:2.5rem;line-height:1.2}.reading-romaji{margin:var(--s-xs) 0 0;color:var(--brand-primary);font-weight:700}.reading-gloss{margin:var(--s-sm) 0 0;color:var(--ink-soft)}@media (width<=620px){.reader-intro{flex-direction:column;align-items:flex-start}.reader-known{text-align:left}}.units{gap:var(--s-2xl);display:grid}.unit-head{align-items:baseline;gap:var(--s-lg);padding-bottom:var(--s-lg);border-bottom:2px solid var(--hairline);display:flex}.unit-index{font-size:var(--text-body);color:var(--brand-primary);padding:var(--s-xs) var(--s-md);border-radius:var(--radius-full);background:#d6ad601a;flex:none;font-weight:700}.unit-titles{flex:1;min-width:0}.unit-titles h3{font-size:var(--text-title);margin:0;line-height:1.2}.unit-ja{font-size:var(--text-small);color:var(--ink-soft);margin-left:var(--s-sm);font-weight:400}.unit-titles p{margin:var(--s-xs) 0 0;font-size:var(--text-body);color:var(--ink-soft)}.unit-count{font-size:var(--text-title);color:var(--brand-secondary);flex-direction:column;flex:none;align-items:flex-end;font-weight:800;line-height:1;display:flex}.unit-count-label{font-size:var(--text-caption);color:var(--ink-soft);margin-top:4px;font-weight:500}.lessons{margin:var(--s-md) 0 0;gap:var(--s-md);padding:0;list-style:none;display:grid}.lesson{background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--t-fast) var(--spring-bounce);box-shadow:0 4px 12px var(--glass-edge);overflow:hidden}.lesson:hover{box-shadow:0 8px 24px var(--glass-edge);border-color:#d6ad604d;transform:translateY(-2px)}.lesson summary{align-items:center;gap:var(--s-md);padding:var(--s-lg);cursor:pointer;font-weight:600;font-size:var(--text-large);list-style:none;display:flex}.lesson summary::-webkit-details-marker{display:none}.lesson summary:before{content:"↓";color:var(--brand-primary);font-size:var(--text-body);transition:transform var(--t-base) var(--spring-bounce);background:#d6ad601a;border-radius:50%;flex:none;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.lesson[open] summary:before{transform:rotate(180deg)}.lesson-title{min-width:0;transition:color var(--t-fast) ease;flex:1}.lesson-meta{font-size:var(--text-small);color:var(--ink-soft);flex:none;font-weight:500}.lesson-body{padding:0 var(--s-lg) var(--s-lg);border-top:1px solid var(--hairline);margin-top:var(--s-xs);padding-top:var(--s-md)}.muted{color:var(--ink-soft);font-size:var(--text-small);margin:0}.items{gap:var(--s-md);margin:0;padding:0;list-style:none;display:grid}.items-kana{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.items-kanji{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.items-vocab{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.item{gap:var(--s-xs);background:var(--surface);padding:var(--s-md);border-radius:var(--radius-md);border:1px solid var(--hairline);transition:all var(--t-fast) ease;flex-direction:column;display:flex}.item:hover{border-color:var(--brand-tertiary);box-shadow:0 4px 12px #e3c9901a}.items-kana .item,.items-kanji .item{text-align:center;justify-content:center;align-items:center}.kana-cells{gap:var(--s-xs);display:flex}.item-answer{font-size:var(--text-caption);color:var(--ink-soft);text-transform:uppercase;font-weight:600}.item-word{font-size:var(--text-title);color:var(--ink);font-weight:700}.item-reading{font-size:var(--text-small);color:var(--brand-primary);font-weight:500}.item-romaji{font-size:var(--text-caption);color:var(--ink-soft);opacity:.8}.items-grammar .item{gap:var(--s-sm)}.item-example{padding-left:var(--s-md);border-left:3px solid var(--brand-secondary);padding:var(--s-sm) var(--s-md);border-radius:0 var(--radius-md) var(--radius-md) 0;background:#df62540d;flex-direction:column;gap:4px;display:flex}.item-example .ja{font-size:var(--text-body);font-weight:500}.item-gloss,.item-explanation{font-size:var(--text-body);color:var(--ink-soft)}.footer{padding:var(--s-3xl) 0 var(--s-4xl);margin-top:var(--s-4xl);background:var(--surface);border-top:1px solid var(--hairline)}.footer-inner{align-items:flex-start;gap:var(--s-lg);flex-direction:column;display:flex}.footer-mark{font-size:var(--text-heading);color:#0000;background:linear-gradient(135deg, var(--brand-primary), var(--brand-tertiary));-webkit-background-clip:text;background-clip:text;font-weight:800}.footer p{max-width:50ch;font-size:var(--text-small);color:var(--ink-soft);margin:0}.header{z-index:50;padding:var(--s-md) 0;background:0 0;position:sticky;top:0}.header-inner{align-items:center;gap:var(--s-md);padding:var(--s-sm) var(--s-xl);border-radius:var(--radius-full);background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);box-shadow:0 4px 20px var(--glass-edge);display:flex}.header-mark{font-size:var(--text-title);color:var(--brand-primary);flex-shrink:0;font-weight:800;text-decoration:none}.header-nav{gap:var(--s-sm);margin-right:auto;display:flex}.nav-link{font-size:var(--text-small);color:var(--ink-soft);border-radius:var(--radius-full);transition:all var(--t-fast) ease;padding:6px 12px;font-weight:600;text-decoration:none}.nav-link:hover{color:var(--ink);background:#d6ad6014}.nav-admin{color:var(--brand-primary);background:#d6ad601a;font-weight:700}.nav-admin:hover{color:var(--brand-primary);background:#d6ad602e}.header-stats{align-items:center;gap:var(--s-md);display:flex}.daily-ring{cursor:default;justify-content:center;align-items:center;width:36px;height:36px;display:inline-flex;position:relative}.daily-ring svg{position:absolute;top:0;left:0}.daily-ring-text{color:var(--ink);z-index:1;font-size:14px;font-weight:800}.daily-ring-fill{transition:stroke-dashoffset var(--t-slow,.6s) ease}.daily-ring-done{animation:2s ease-in-out infinite pulse-glow}@keyframes pulse-glow{0%,to{filter:drop-shadow(0 0 #0000)}50%{filter:drop-shadow(0 0 6px #10b98166)}}.streak-flame{border-radius:var(--radius-full);cursor:default;transition:all var(--t-fast) ease;background:#64748b14;align-items:center;gap:4px;padding:4px 10px;display:inline-flex}.streak-active{background:#f973161a}.streak-hot{background:#ef44441f;box-shadow:0 0 12px #ef444426}.streak-fire{transform:scale(var(--flame-scale,1));transition:transform var(--t-base) var(--spring-bounce);font-size:16px;display:inline-block}.streak-active .streak-fire{animation:1.5s ease-in-out infinite flicker}@keyframes flicker{0%,to{transform:scale(var(--flame-scale,1)) rotate(0deg)}25%{transform:scale(calc(var(--flame-scale,1) * 1.1)) rotate(-3deg)}75%{transform:scale(calc(var(--flame-scale,1) * 1.05)) rotate(3deg)}}.streak-count{font-size:var(--text-small);color:var(--ink);font-weight:800}.level-badge{border-radius:var(--radius-full);cursor:default;align-items:center;gap:6px;padding:4px 12px;display:inline-flex}.level-number{border-radius:var(--radius-full);color:#fff;padding:2px 6px;font-size:14px;font-weight:800}.header-name{font-size:var(--text-small);color:var(--ink);font-weight:600}.level-bronze{background:#cd7f321a}.level-bronze .level-number{background:linear-gradient(135deg,#cd7f32,#b87333)}.level-silver{background:#c0c0c026}.level-silver .level-number{background:linear-gradient(135deg,#a8a9ad,silver)}.level-gold{background:#ffd7001a}.level-gold .level-number{background:linear-gradient(135deg,gold,#daa520)}.level-diamond{background:#e3c9901a}.level-diamond .level-number{background:linear-gradient(135deg,#60a5fa,#3b82f6)}.level-master{background:#d6ad601a}.level-master .level-number{background:linear-gradient(135deg,#d6ad60,#df6254)}.header-inner>.link-button:last-child{margin-left:var(--s-sm);font-size:var(--text-small)}.btn-sm{min-height:36px;font-size:var(--text-small);padding:0 var(--s-lg)}.speak{align-items:center;gap:var(--s-xs);min-height:36px;padding:0 var(--s-md);border:1px solid var(--hairline);border-radius:var(--radius-full);background:var(--surface);color:var(--ink);font-family:var(--font-ui);font-size:var(--text-small);cursor:pointer;transition:all var(--t-fast) ease;font-weight:600;display:inline-flex}.speak:hover:not(:disabled),.speak-playing{border-color:var(--brand-primary);color:var(--brand-primary)}.speak:disabled{opacity:.5;cursor:not-allowed}.link-button{padding:var(--s-sm) var(--s-md);color:var(--brand-primary);font-family:var(--font-ui);font-weight:600;font-size:var(--text-small);cursor:pointer;border-radius:var(--radius-full);transition:background var(--t-fast) ease;background:0 0;border:none;text-decoration:none}.link-button:hover{background:#d6ad601a}.section-tight{padding:0 0 var(--s-3xl)}.signin{gap:var(--s-xl);background:var(--glass-bg);max-width:420px;-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));padding:var(--s-2xl);border-radius:var(--radius-xl);border:1px solid var(--glass-border);box-shadow:0 10px 40px var(--glass-edge);flex-direction:column;display:flex}.signin-head h3{margin:0 0 var(--s-xs);font-size:var(--text-heading)}.signin-head p{font-size:var(--text-body);color:var(--ink-soft);margin:0}.field{flex-direction:column;gap:8px;display:flex}.field span{font-size:var(--text-small);color:var(--ink);font-weight:600}.field input{min-height:48px;padding:0 var(--s-md);border:2px solid var(--hairline);border-radius:var(--radius-md);background:var(--surface);color:var(--ink);font-family:var(--font-ui);font-size:var(--text-body);transition:border-color var(--t-fast) ease, box-shadow var(--t-fast) ease}.field input:focus{border-color:var(--brand-primary);outline:none;box-shadow:0 0 0 3px #d6ad6033}.form-error{padding:var(--s-sm) var(--s-md);border-radius:var(--radius-md);color:var(--danger);font-size:var(--text-small);background:#ef44441a;margin:0;font-weight:500}.form-success{padding:var(--s-sm) var(--s-md);border-radius:var(--radius-md);color:var(--brand-success);font-size:var(--text-small);background:#10b9811a;margin:0;font-weight:500}.forgot-link{margin-top:calc(-1 * var(--s-md));font-size:var(--text-caption);align-self:flex-end;padding:2px 8px}.signin-links{align-items:center;gap:var(--s-sm);flex-direction:column;display:flex}.lesson-screen{padding-top:var(--s-2xl);padding-bottom:var(--s-4xl);flex-direction:column;min-height:100vh;display:flex}.quiz{gap:var(--s-xl);background:var(--glass-bg);width:100%;max-width:680px;-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));padding:var(--s-2xl);border-radius:var(--radius-xl);border:1px solid var(--glass-border);box-shadow:0 10px 40px var(--glass-edge);flex-direction:column;margin:0 auto;display:flex}.quiz-head{justify-content:space-between;align-items:center;display:flex}.quiz-count{font-size:var(--text-small);color:var(--ink-soft);font-weight:600}.quiz-progress{border-radius:var(--radius-full);background:var(--hairline);height:6px;margin:0 var(--s-lg);flex:1;overflow:hidden}.quiz-progress span{background:linear-gradient(90deg, var(--brand-primary), var(--brand-tertiary));border-radius:var(--radius-full);height:100%;transition:width var(--t-base) var(--spring-bounce);display:block}.quiz-card{gap:var(--s-xl);text-align:center;padding:var(--s-2xl) 0;flex-direction:column;align-items:center;display:flex}.quiz-prompt{color:var(--ink);margin:0;font-weight:800;line-height:1.2}.quiz-prompt-kana{font-size:100px}.quiz-prompt-vocab{font-size:3rem}.quiz-prompt-grammar{font-size:2rem}.quiz-prompt-wordReading{font-size:3rem}.quiz-prompt-kanji{font-size:80px}.quiz-question{font-size:var(--text-large);color:var(--ink-soft);margin:0;font-weight:500}.options{gap:var(--s-lg);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));width:100%;display:grid}.option{min-height:64px;padding:0 var(--s-md);border:2px solid var(--hairline);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);font-family:var(--font-ui);font-size:var(--text-large);cursor:pointer;transition:all var(--t-fast) var(--spring-bounce);box-shadow:0 2px 8px var(--glass-edge);font-weight:600}.option:hover:not(:disabled){border-color:var(--brand-tertiary);transform:translateY(-3px);box-shadow:0 6px 16px #e3c99033}.option:active:not(:disabled){transform:scale(.97)}.option-answer{border-color:var(--brand-success);color:var(--brand-success);background:#10b9811a}.option-wrong{border-color:var(--danger);color:var(--danger);background:#ef44441a;animation:.4s cubic-bezier(.36,.07,.19,.97) both shake}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}.option-muted{opacity:.3}.typing{gap:var(--s-md);flex-direction:column;width:100%;max-width:400px;margin:0 auto;display:flex}.typing-input{min-height:64px;padding:0 var(--s-lg);border:2px solid var(--hairline);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);font-family:var(--font-ui);font-size:var(--text-large);text-transform:none;text-align:center;transition:all var(--t-fast) ease;font-weight:600}.typing-input:focus{border-color:var(--brand-primary);outline:none;box-shadow:0 0 0 4px #d6ad6033}.verdict{gap:var(--s-sm);width:100%;padding:var(--s-lg);border-radius:var(--radius-md);animation:slide-up var(--t-base) var(--spring-bounce);flex-direction:column;align-items:center;display:flex}@keyframes slide-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.verdict-right{color:var(--brand-success);font-weight:800;font-size:var(--text-large);padding:var(--s-sm) var(--s-xl);border-radius:var(--radius-full);background:#10b9811a}.verdict-wrong{color:var(--danger);font-weight:800;font-size:var(--text-large);padding:var(--s-sm) var(--s-xl);border-radius:var(--radius-full);background:#ef44441a}.verdict-detail{font-size:var(--text-body);color:var(--ink-soft);margin-top:8px;font-weight:500}.quiz-summary{gap:var(--s-xl);text-align:center;flex-direction:column;max-width:500px;margin:0 auto;display:flex}.quiz-summary h2{font-size:var(--text-display);color:var(--brand-primary);margin:0}.summary-rows{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--hairline);flex-direction:column;margin:0;display:flex;overflow:hidden}.summary-rows>div{padding:var(--s-lg) var(--s-xl);border-bottom:1px solid var(--hairline);justify-content:space-between;align-items:center;display:flex}.summary-rows>div:last-child{border-bottom:none}.summary-rows dt{color:var(--ink-soft);font-weight:600}.summary-rows dd{color:var(--ink);font-weight:800;font-size:var(--text-large);margin:0}.flip-container{perspective:1000px;width:100%;min-height:240px;margin-bottom:var(--s-lg)}.flip-card{width:100%;height:100%;transform-style:preserve-3d;justify-content:center;align-items:center;transition:transform .6s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.flip-card.revealed{transform:rotateY(180deg)}.flip-front,.flip-back{backface-visibility:hidden;justify-content:center;align-items:center;gap:var(--s-md);width:100%;height:100%;padding:var(--s-xl);flex-direction:column;display:flex;position:absolute}.flip-back{transform:rotateY(180deg)}.grades{gap:var(--s-sm);grid-template-columns:repeat(4,1fr);width:100%;display:grid}.grade{padding:var(--s-md);border-radius:var(--radius-lg);border:1px solid var(--hairline);background:var(--surface);color:var(--ink);cursor:pointer;transition:all var(--t-fast) ease;font-weight:700}.grade:hover:not(:disabled){box-shadow:0 4px 12px var(--glass-edge);transform:translateY(-2px)}.grade:disabled{opacity:.3;cursor:default}.grade-again{border-color:var(--danger);color:var(--danger)}.grade-again:hover:not(:disabled){background:#ef44441a}.grade-hard{border-color:var(--brand-secondary);color:var(--brand-secondary)}.grade-hard:hover:not(:disabled){background:#df62541a}.grade-good{border-color:var(--brand-tertiary);color:var(--brand-tertiary)}.grade-good:hover:not(:disabled){background:#e3c9901a}.grade-easy{border-color:var(--brand-success);color:var(--brand-success)}.grade-easy:hover:not(:disabled){background:#10b9811a}.continue{justify-content:space-between;align-items:center;gap:var(--s-lg);padding:var(--s-xl);border-left:4px solid var(--brand-primary);background:linear-gradient(135deg,#ffffffb3,#fff6);display:flex}.continue-body{gap:var(--s-xs);flex-direction:column;display:flex}.continue-label{font-size:var(--text-caption);text-transform:uppercase;letter-spacing:.1em;color:var(--brand-primary);margin:0;font-weight:800}.continue-title{font-size:var(--text-large);color:var(--ink);margin:0;font-weight:700}.due-callout{align-items:center;gap:var(--s-xl);padding:var(--s-xl);border-radius:var(--radius-lg);color:var(--ink);transition:all var(--t-fast) ease;background:#ef44440d;border:1px solid #ef444433;text-decoration:none;display:flex}.due-callout:hover{background:#ef44441a;transform:translateY(-2px)}.due-count{font-size:var(--text-display);color:var(--danger);font-weight:800;line-height:1}.due-callout span:last-child{flex-direction:column;gap:4px;display:flex}.due-callout strong{font-size:var(--text-large);color:var(--danger)}.due-callout span span{font-size:var(--text-body);color:var(--ink-soft)}.quiz-pips{width:100%;margin-top:var(--s-md);margin-bottom:var(--s-xl);gap:4px;display:flex}.pip{border-radius:var(--radius-full);background:var(--hairline);height:6px;transition:all var(--t-fast) ease;flex:1}.pip-right{background:var(--brand-success)}.pip-wrong{background:var(--danger)}.pip-now{background:var(--brand-primary)}.pip-todo{background:var(--hairline);opacity:.5}.study-card{gap:var(--s-lg);text-align:center;padding:var(--s-3xl) var(--s-xl);flex-direction:column;align-items:center;display:flex}.study-kicker{font-size:var(--text-caption);text-transform:uppercase;letter-spacing:.1em;color:var(--brand-primary);margin:0;font-weight:800}.study-nav{width:100%;margin-top:var(--s-xl);justify-content:space-between;align-items:center;display:flex}.study-skip{margin-top:var(--s-md)}.confetti-layer{z-index:90;pointer-events:none;position:fixed;inset:0;overflow:hidden}.confetti-piece{opacity:0;will-change:transform, opacity;border-radius:2px;width:8px;height:12px;position:absolute}.xp-burst{align-items:baseline;gap:var(--s-xs);margin:0 auto var(--s-md);padding:var(--s-sm) var(--s-lg);border-radius:var(--radius-full);color:var(--brand-success);background:#10b9811f;display:inline-flex}.xp-burst-amount{font-size:var(--text-title);font-weight:800;line-height:1}.xp-burst-label{font-size:var(--text-caption);letter-spacing:.06em;text-transform:uppercase;font-weight:700}.correct-flash{width:1.4em;height:1.4em;margin-right:var(--s-xs);background:var(--brand-success);color:#fff;animation:tick-pop var(--t-base) var(--spring-bounce) both;border-radius:50%;justify-content:center;align-items:center;font-size:.8em;font-weight:800;display:inline-flex}.correct-flash-tick{line-height:1}@keyframes tick-pop{0%{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}.quiz-card-right{animation:wash-right var(--t-slow,.6s) ease-out;border-color:#10b98180}.quiz-card-wrong{border-color:#ef444480;animation:.4s cubic-bezier(.36,.07,.19,.97) both shake}@keyframes wash-right{0%{background-color:#10b98129}to{background-color:#0000}}.verdict-remember{margin-top:var(--s-sm);padding:var(--s-sm) var(--s-md);border-left:3px solid var(--brand-primary);border-radius:var(--radius-sm);text-align:left;background:#d6ad600f}.verdict-remember-kicker{font-size:var(--text-caption);letter-spacing:.06em;text-transform:uppercase;color:var(--brand-primary);margin:0 0 2px;font-weight:700}.achievements{padding:var(--s-lg)}.achievements-head{justify-content:space-between;align-items:baseline;gap:var(--s-md);margin-bottom:var(--s-md);display:flex}.achievements-head h2{font-size:var(--text-body);margin:0;font-weight:700}.achievements-score{font-size:var(--text-small);color:var(--ink-soft);font-weight:700}.achievement-row{gap:var(--s-md);padding:0 0 var(--s-sm);scroll-snap-type:x proximity;margin:0;list-style:none;display:flex;overflow-x:auto}.achievement{padding:var(--s-md);border:1px solid var(--hairline);border-radius:var(--radius-md);scroll-snap-align:start;opacity:.62;flex-direction:column;flex:0 0 148px;gap:2px;display:flex}.achievement-earned{opacity:1;background:#10b98112;border-color:#10b98173}.achievement-icon{filter:grayscale();font-size:1.5rem;line-height:1.2}.achievement-earned .achievement-icon{filter:none}.achievement-title{font-size:var(--text-small);color:var(--ink);font-weight:700}.achievement-note{font-size:var(--text-caption);color:var(--ink-soft)}.achievement-bar{margin-top:var(--s-xs);border-radius:var(--radius-full);background:var(--hairline);height:4px;overflow:hidden}.achievement-bar-fill{border-radius:var(--radius-full);background:var(--brand-primary);height:100%;display:block}.admin-banner{align-items:center;gap:var(--s-md);padding:var(--s-md) var(--s-lg);border-radius:var(--radius-md);color:var(--ink);transition:transform var(--t-fast) var(--spring-bounce);text-decoration:none;display:flex}.admin-banner:hover{transform:translateY(-2px)}.admin-banner-icon{font-size:1.4rem}.admin-banner-body{flex-direction:column;flex:1;display:flex}.admin-banner-body strong{font-size:var(--text-body)}.admin-banner-body span{font-size:var(--text-small);color:var(--ink-soft)}.admin-banner-arrow{color:var(--brand-primary);font-weight:700}.mnemonics,.seen-in{margin-top:var(--s-lg);padding-top:var(--s-md);border-top:1px solid var(--hairline);text-align:left}.mnemonic-kicker{margin:0 0 var(--s-xs);font-size:var(--text-caption);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);font-weight:700}.mnemonic{align-items:baseline;gap:var(--s-sm);margin:0 0 var(--s-xs);font-size:var(--text-small);color:var(--ink);display:flex}.mnemonic strong{color:var(--brand-primary);font-weight:800}.mnemonic-char{font-size:var(--text-body);font-weight:700}.seen-in-list{gap:var(--s-sm);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.seen-in-list li{align-items:baseline;gap:var(--s-xs);border-radius:var(--radius-full);background:#d6ad6012;padding:4px 10px;display:flex}.seen-in-word{font-weight:700}.seen-in-gloss{font-size:var(--text-caption);color:var(--ink-soft)}.trace-row{gap:var(--s-lg);margin-top:var(--s-lg);flex-wrap:wrap;justify-content:center;display:flex}.trace{align-items:center;gap:var(--s-xs);flex-direction:column;display:flex}.trace-loading{border-radius:var(--radius-md);background:var(--hairline);opacity:.4;width:188px;height:188px}.trace-kicker{font-size:var(--text-caption);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:0;font-weight:700}.trace-count{color:var(--brand-primary)}.trace-svg{border:1px solid var(--hairline);border-radius:var(--radius-md);background:var(--paper);touch-action:none;cursor:crosshair}.trace-svg-done{border-color:var(--brand-success)}.trace-guide{stroke:var(--hairline);stroke-width:1px;stroke-dasharray:4 4}.trace-ghost{fill:none;stroke:var(--hairline);stroke-width:5px;stroke-linecap:round;stroke-linejoin:round}.trace-ghost-next{stroke:var(--brand-primary);opacity:.34}.trace-hint{fill:none;stroke:var(--brand-primary);stroke-width:4px;stroke-linecap:round;stroke-dasharray:3 5;opacity:.85}.trace-done,.trace-live{fill:none;stroke-width:5px;stroke-linecap:round;stroke-linejoin:round}.trace-done{stroke:var(--brand-success)}.trace-live{stroke:var(--ink)}.trace-verdict{min-height:1.4em;font-size:var(--text-caption);text-align:center;color:var(--ink-soft);margin:0}.trace-verdict-match{color:var(--brand-success);font-weight:700}.trace-verdict-reversed,.trace-verdict-off{color:var(--danger)}.unit-checkpoint{margin-top:var(--s-lg);text-align:center;flex-direction:column;align-items:center;gap:2px;display:flex}.unit-checkpoint-sub{font-size:var(--text-caption);opacity:.85;font-weight:500}.checkpoint-screen{padding-block:var(--s-3xl)}.checkpoint-note{font-size:var(--text-caption);color:var(--ink-soft);text-align:center;margin:0}.checkpoint-last{font-size:var(--text-small);color:var(--ink-soft);text-align:center;margin:0;font-weight:600}.checkpoint-score{font-size:var(--text-display);color:var(--brand-primary);font-weight:800;line-height:1}.checkpoint-score-unit{font-size:var(--text-title);color:var(--brand-primary);font-weight:800}.checkpoint-score-detail{margin-top:var(--s-sm);font-size:var(--text-small);color:var(--ink-soft);font-weight:500;display:block}.missed{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);text-align:left;flex-direction:column;margin:0;padding:0;list-style:none;display:flex;overflow:hidden}.missed li{justify-content:space-between;align-items:baseline;gap:var(--s-lg);padding:var(--s-md) var(--s-lg);border-bottom:1px solid var(--hairline);display:flex}.missed li:last-child{border-bottom:none}.missed-prompt{font-size:var(--text-large);color:var(--ink);font-weight:600}.missed-answer{font-size:var(--text-small);color:var(--brand-primary);text-align:right;font-weight:600}.summary-note{font-size:var(--text-small);color:var(--ink-soft);margin:0;line-height:1.6}.summary-actions{gap:var(--s-md);flex-direction:column;align-items:center;display:flex}.unit-cleared{gap:var(--s-md);padding:var(--s-lg);border:1px solid var(--brand-primary);border-radius:var(--radius-lg);text-align:center;flex-direction:column;display:flex}.tick{border-radius:var(--radius-full);background:var(--hairline);width:100%;height:3px;display:block;overflow:hidden}.tick-fill{border-radius:var(--radius-full);background:var(--brand-primary);width:0;height:100%;animation-name:tick-run;animation-timing-function:linear;animation-fill-mode:forwards;display:block}@keyframes tick-run{0%{width:0}to{width:100%}}.clean-run{font-size:var(--text-large);color:var(--brand-primary);margin:0;font-weight:700}.run-broken{justify-content:center;align-items:baseline;gap:var(--s-sm);padding:var(--s-md) var(--s-lg);border-radius:var(--radius-md);background:var(--surface);border:1px solid var(--hairline);font-size:var(--text-small);color:var(--ink-soft);text-align:center;flex-wrap:wrap;margin:0;display:flex}.quiz-audio{justify-content:center;display:flex}.accent{color:var(--brand-primary)}.up-next{gap:var(--s-md);flex-direction:column;display:flex}.up-next-line{font-size:var(--text-small);color:var(--ink-soft);margin:0;line-height:1.6}.up-next-line strong{color:var(--ink)}.unit{padding:var(--s-xl)}.unit-progress{border-radius:var(--radius-full);background:var(--hairline);height:4px;overflow:hidden}.unit-progress>span{border-radius:var(--radius-full);background:var(--brand-primary);height:100%;transition:width var(--t-base) ease;display:block}.lesson-actions{gap:var(--s-sm);flex-wrap:wrap;align-items:center;display:flex}.lesson-badge{font-size:var(--text-caption);letter-spacing:.04em;text-transform:uppercase;color:var(--brand-primary);font-weight:700}.learn-first{font-size:var(--text-caption);color:var(--ink-soft);margin:0}.strokes-wrap{align-items:center;gap:var(--s-sm);flex-direction:column;display:flex}.strokes{border-radius:var(--radius-md);background:var(--surface);border:1px solid var(--hairline);display:block}.strokes-loading{border-radius:var(--radius-md);background:var(--hairline);opacity:.4}.stroke-ghost{fill:none;stroke:var(--hairline);stroke-width:4px;stroke-linecap:round;stroke-linejoin:round}.stroke-draw{fill:none;stroke:var(--ink);stroke-width:5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:.8s ease-out both stroke-draw}@keyframes stroke-draw{to{stroke-dashoffset:0}}.strokes-foot{justify-content:space-between;align-items:center;gap:var(--s-md);width:100%;display:flex}.strokes-count{font-size:var(--text-caption);color:var(--ink-soft)}.strokes-credit{font-size:var(--text-caption);color:var(--ink-soft);text-align:center;margin:0}.strokes-credit a{color:var(--ink-soft);text-decoration:underline}.strokes-row{gap:var(--s-lg);flex-wrap:wrap;justify-content:center;display:flex}.study-item{align-items:center;gap:var(--s-md);text-align:center;flex-direction:column;display:flex}.study-item-kana .ja{font-size:72px}.study-item-kanji .ja{font-size:56px}.study-item-vocab .ja{font-size:2.5rem}.study-item-grammar .ja{font-size:var(--text-title)}.speech-quiz,.speech-quiz-unsupported{align-items:center;gap:var(--s-md);flex-direction:column;width:100%;display:flex}.transcript-box{width:100%;min-height:48px;padding:var(--s-md);border-radius:var(--radius-md);border:1px solid var(--hairline);background:var(--surface);font-family:var(--font-ja);font-size:var(--text-large);color:var(--ink);text-align:center}.cell{border:1px solid var(--hairline);border-radius:var(--radius-md);width:48px;height:48px;font-size:var(--text-title);color:var(--ink);justify-content:center;align-items:center;display:inline-flex}.cell-sm{width:36px;height:36px;font-size:var(--text-large)}.friend-list,.request-list,.search-results{gap:var(--s-sm);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.bubble-text{white-space:pre-wrap;overflow-wrap:anywhere;margin:0}.empty-msg,.loading-msg,.empty-tier,.leaderboard-loading{padding:var(--s-lg);font-size:var(--text-small);color:var(--ink-soft);text-align:center;margin:0}.leaderboard-error{padding:var(--s-lg);font-size:var(--text-small);color:var(--danger);text-align:center;margin:0}.leagues-page{gap:var(--s-xl);padding-block:var(--s-3xl);flex-direction:column;display:flex}.card-back{align-items:center;gap:var(--s-md);text-align:center;flex-direction:column;display:flex}.field-hint{font-size:var(--text-caption);color:var(--ink-soft);margin:0}.checkpoint-progress{flex:none;height:6px;margin:0}.checkpoint-summary{max-width:560px}.checkpoint-summary h2{font-size:var(--text-heading);text-wrap:balance;line-height:1.15}