:root{--bg-canvas:#fbf7f0;--bg-surface:#fff;--bg-sunken:#f2ece1;--bg-overlay:#22201c7a;--ink-primary:#22201c;--ink-secondary:#5b554c;--ink-tertiary:#8a8377;--line-hairline:#e3dacb;--line-strong:#cfc3ae;--accent:#e2542f;--accent-ink:#fff;--accent-soft:#fbe7df;--positive:#2f8f5b;--positive-soft:#e1f1e6;--negative:#b23a2a;--negative-soft:#f8e4e0;--caution:#b4820f;--caution-soft:#fbf0d6;--focus-ring:#1b6fe0;--finger-l4:#6b4fbf;--finger-l3:#3d6fd6;--finger-l2:#2e8fa8;--finger-l1:#2f8f5b;--finger-t:#8a8377;--finger-r1:#b08a12;--finger-r2:#d07a22;--finger-r3:#d0523a;--finger-r4:#b03a70;--shadow-e0:none;--border-e0:none;--shadow-e1:0 1px 2px #22201c0f, 0 2px 8px #22201c0a;--border-e1:none;--shadow-e2:0 8px 24px #22201c1a;--border-e2:none;--font-ui:system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", "Yu Gothic UI", "Meiryo", sans-serif;--font-mono:ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", "Noto Sans Mono", Consolas, monospace;--font-cert:"Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;--text-challenge-xl-size:96px;--text-challenge-xl-weight:700;--text-challenge-xl-line:1;--text-challenge-xl-tracking:.02em;--text-challenge-xl-font:var(--font-mono);--text-challenge-l-size:64px;--text-challenge-l-weight:700;--text-challenge-l-line:1.1;--text-challenge-l-tracking:.04em;--text-challenge-l-font:var(--font-mono);--text-display-size:32px;--text-display-weight:700;--text-display-line:1.25;--text-display-tracking:-.01em;--text-display-font:var(--font-ui);--text-headline-size:28px;--text-headline-weight:700;--text-headline-line:1.3;--text-headline-tracking:-.01em;--text-headline-font:var(--font-ui);--text-title-size:20px;--text-title-weight:700;--text-title-line:1.4;--text-title-tracking:0em;--text-title-font:var(--font-ui);--text-metric-size:40px;--text-metric-weight:700;--text-metric-line:1.1;--text-metric-tracking:0em;--text-metric-font:var(--font-mono);--text-body-size:16px;--text-body-weight:400;--text-body-line:1.9;--text-body-tracking:.01em;--text-body-font:var(--font-ui);--text-body-s-size:14px;--text-body-s-weight:400;--text-body-s-line:1.6;--text-body-s-tracking:.01em;--text-body-s-font:var(--font-ui);--text-caption-size:12px;--text-caption-weight:500;--text-caption-line:1.5;--text-caption-tracking:.02em;--text-caption-font:var(--font-ui);--text-keycap-size:13px;--text-keycap-weight:600;--text-keycap-line:1;--text-keycap-tracking:0em;--text-keycap-font:var(--font-mono);--text-keycap-finger-size:9px;--text-keycap-finger-weight:700;--text-keycap-finger-line:1;--text-keycap-finger-tracking:0em;--text-keycap-finger-font:var(--font-mono);--space-1:2px;--space-2:4px;--space-3:8px;--space-4:12px;--space-5:16px;--space-6:24px;--space-7:32px;--space-8:40px;--space-9:56px;--space-10:80px;--space-11:120px;--content-max-width:1200px;--practice-max-width:1040px;--result-max-width:880px;--header-height:56px;--hud-height:40px;--gutter-padding:40px;--gutter-padding-wide:56px;--radius-xs:4px;--radius-s:8px;--radius-m:12px;--radius-l:20px;--radius-pill:999px;--t-instant:0s;--t-quick:.12s;--t-base:.2s;--t-slow:.36s;--t-celebrate:.9s;--e-standard:cubic-bezier(.2, 0, 0, 1);--e-out:cubic-bezier(0, 0, 0, 1);--e-in:cubic-bezier(.3, 0, 1, 1);--e-pop:cubic-bezier(.34, 1.56, .64, 1);--z-background:0;--z-content:10;--z-hud:20;--z-header:30;--z-banner:40;--z-panel:50;--z-dialog:60;--z-celebration:70;--z-toast:80;--z-environment:90}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg-canvas:#171512;--bg-surface:#201d19;--bg-sunken:#121110;--bg-overlay:#0009;--ink-primary:#f2ece1;--ink-secondary:#b9b0a2;--ink-tertiary:#857d71;--line-hairline:#332e28;--line-strong:#4a433a;--accent:#ff7a4d;--accent-ink:#2a1509;--accent-soft:#3a2018;--positive:#4fbf80;--positive-soft:#16301f;--negative:#ff6b54;--negative-soft:#331612;--caution:#e8b33c;--caution-soft:#2e2410;--focus-ring:#6ba8ff;--finger-l4:#a78bfa;--finger-l3:#7ba7f5;--finger-l2:#5fc3d9;--finger-l1:#4fbf80;--finger-t:#a9a093;--finger-r1:#e0bc3a;--finger-r2:#f0a045;--finger-r3:#ff8062;--finger-r4:#f07aae;--shadow-e1:none;--border-e1:1px solid var(--line-hairline);--shadow-e2:none;--border-e2:1px solid var(--line-strong)}}:root[data-theme=light]{--bg-canvas:#fbf7f0;--bg-surface:#fff;--bg-sunken:#f2ece1;--bg-overlay:#22201c7a;--ink-primary:#22201c;--ink-secondary:#5b554c;--ink-tertiary:#8a8377;--line-hairline:#e3dacb;--line-strong:#cfc3ae;--accent:#e2542f;--accent-ink:#fff;--accent-soft:#fbe7df;--positive:#2f8f5b;--positive-soft:#e1f1e6;--negative:#b23a2a;--negative-soft:#f8e4e0;--caution:#b4820f;--caution-soft:#fbf0d6;--focus-ring:#1b6fe0;--finger-l4:#6b4fbf;--finger-l3:#3d6fd6;--finger-l2:#2e8fa8;--finger-l1:#2f8f5b;--finger-t:#8a8377;--finger-r1:#b08a12;--finger-r2:#d07a22;--finger-r3:#d0523a;--finger-r4:#b03a70;--shadow-e1:0 1px 2px #22201c0f, 0 2px 8px #22201c0a;--border-e1:none;--shadow-e2:0 8px 24px #22201c1a;--border-e2:none}:root[data-theme=dark]{--bg-canvas:#171512;--bg-surface:#201d19;--bg-sunken:#121110;--bg-overlay:#0009;--ink-primary:#f2ece1;--ink-secondary:#b9b0a2;--ink-tertiary:#857d71;--line-hairline:#332e28;--line-strong:#4a433a;--accent:#ff7a4d;--accent-ink:#2a1509;--accent-soft:#3a2018;--positive:#4fbf80;--positive-soft:#16301f;--negative:#ff6b54;--negative-soft:#331612;--caution:#e8b33c;--caution-soft:#2e2410;--focus-ring:#6ba8ff;--finger-l4:#a78bfa;--finger-l3:#7ba7f5;--finger-l2:#5fc3d9;--finger-l1:#4fbf80;--finger-t:#a9a093;--finger-r1:#e0bc3a;--finger-r2:#f0a045;--finger-r3:#ff8062;--finger-r4:#f07aae;--shadow-e1:none;--border-e1:1px solid var(--line-hairline);--shadow-e2:none;--border-e2:1px solid var(--line-strong)}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{background-color:var(--bg-canvas);color:var(--ink-primary);font-family:var(--font-ui);font-size:var(--text-body-size);line-height:var(--text-body-line);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}img,svg{max-width:100%;display:block}button,input,select,textarea{font:inherit;color:inherit}button{background:0 0;border:none}a{color:inherit}ul,ol{margin:0;padding:0;list-style:none}h1,h2,h3,p{margin:0}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.text-display{font-family:var(--text-display-font);font-size:var(--text-display-size);font-weight:var(--text-display-weight);line-height:var(--text-display-line);letter-spacing:var(--text-display-tracking)}.text-headline{font-family:var(--text-headline-font);font-size:var(--text-headline-size);font-weight:var(--text-headline-weight);line-height:var(--text-headline-line);letter-spacing:var(--text-headline-tracking)}.text-title{font-family:var(--text-title-font);font-size:var(--text-title-size);font-weight:var(--text-title-weight);line-height:var(--text-title-line);letter-spacing:var(--text-title-tracking)}.text-body{font-family:var(--text-body-font);font-size:var(--text-body-size);font-weight:var(--text-body-weight);line-height:var(--text-body-line);letter-spacing:var(--text-body-tracking)}.text-body-s{font-family:var(--text-body-s-font);font-size:var(--text-body-s-size);font-weight:var(--text-body-s-weight);line-height:var(--text-body-s-line);letter-spacing:var(--text-body-s-tracking)}.text-caption{font-family:var(--text-caption-font);font-size:var(--text-caption-size);font-weight:var(--text-caption-weight);line-height:var(--text-caption-line);letter-spacing:var(--text-caption-tracking)}.skeleton{background-color:var(--bg-sunken);border-radius:var(--radius-m)}@media (prefers-reduced-motion:no-preference){.skeleton{animation:1.6s ease-in-out infinite skeleton-pulse}}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.6}}.fade-in{animation:fade-in var(--t-base) var(--e-out)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-property:opacity!important;transition-duration:.12s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.app-shell{flex-direction:column;min-height:100%;display:flex}.app-header{height:var(--header-height);justify-content:space-between;align-items:center;gap:var(--space-6);padding-inline:var(--gutter-padding);border-bottom:1px solid var(--line-hairline);background-color:var(--bg-canvas);z-index:var(--z-header);flex:none;display:flex;position:relative}.app-header__logo{align-items:center;gap:var(--space-3);color:var(--ink-primary);text-decoration:none;display:inline-flex}.app-header__nav{gap:var(--space-6);flex:1;display:flex}.app-header__nav-link{color:var(--ink-secondary);text-decoration:none}.app-header__nav-link:hover{color:var(--ink-primary)}.app-header__actions{align-items:center;gap:var(--space-4);display:flex}.app-header__settings{border-radius:var(--radius-pill);width:40px;height:40px;color:var(--ink-secondary);cursor:pointer;transition:background-color var(--t-quick) var(--e-standard);justify-content:center;align-items:center;display:inline-flex}.app-header__settings:hover{background-color:var(--bg-sunken)}.app-header__sync{color:var(--ink-tertiary)}.app-main{flex:1}.focus-shell{flex-direction:column;min-height:100%;display:flex}.focus-hud{height:var(--hud-height);background-color:var(--bg-canvas);z-index:var(--z-hud);flex:none}.focus-hud--top{border-bottom:1px solid var(--line-hairline)}.focus-hud--bottom{border-top:1px solid var(--line-hairline);margin-top:auto}.focus-shell__content{width:100%;max-width:var(--practice-max-width);flex:1;margin-inline:auto}.title-screen{justify-content:center;align-items:flex-start;gap:var(--space-6);min-height:100%;padding:var(--space-11) var(--gutter-padding);background-color:var(--bg-canvas);color:var(--ink-primary);flex-direction:column;display:flex}.title-screen__brand-heading{margin:0}.title-screen__logo-text{color:var(--ink-primary)}.title-screen__subtitle{color:var(--ink-secondary)}.title-screen__menu{gap:var(--space-2);flex-direction:column;display:flex}.title-screen__menu-item{align-items:center;gap:var(--space-2);padding:var(--space-2) 0;color:var(--ink-secondary);text-align:left;cursor:pointer;transition:color var(--t-quick) var(--e-standard), transform var(--t-quick) var(--e-standard);display:inline-flex}.title-screen__menu-item--active{color:var(--accent);transform:translateX(var(--space-3))}.title-screen__menu-marker{width:1em;display:inline-block}.title-screen__hint{color:var(--ink-tertiary)}.s12-screen{z-index:var(--z-environment);justify-content:center;align-items:center;gap:var(--space-5);text-align:center;padding:var(--gutter-padding);background-color:var(--bg-canvas);color:var(--ink-primary);flex-direction:column;display:flex;position:fixed;inset:0}.s12-screen__icon{color:var(--ink-tertiary);font-size:48px;line-height:1}.s12-screen__body{max-width:480px;color:var(--ink-secondary)}.s12-screen__continue{height:48px;padding-inline:var(--space-6);border-radius:var(--radius-pill);background-color:var(--accent);color:var(--accent-ink);cursor:pointer;align-items:center;display:inline-flex}.placeholder-screen{padding:var(--space-8) var(--gutter-padding);max-width:var(--content-max-width);color:var(--ink-primary);margin-inline:auto}.placeholder-screen__note{color:var(--ink-secondary)}.keyboard{gap:var(--space-2);flex-direction:column;display:flex}.keyboard__row{gap:var(--space-2);display:flex}.keyboard__key{border-radius:var(--radius-s);background-color:var(--bg-surface);border:2px solid var(--finger-color,var(--line-hairline));width:40px;height:40px;color:var(--ink-primary);font-family:var(--text-keycap-font);font-size:var(--text-keycap-size);font-weight:var(--text-keycap-weight);flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.keyboard__key[data-finger=L4],.keyboard__key--shift[data-finger=L4]{--finger-color:var(--finger-l4)}.keyboard__key[data-finger=L3]{--finger-color:var(--finger-l3)}.keyboard__key[data-finger=L2]{--finger-color:var(--finger-l2)}.keyboard__key[data-finger=L1]{--finger-color:var(--finger-l1)}.keyboard__key[data-finger=T]{--finger-color:var(--finger-t)}.keyboard__key[data-finger=R1]{--finger-color:var(--finger-r1)}.keyboard__key[data-finger=R2]{--finger-color:var(--finger-r2)}.keyboard__key[data-finger=R3]{--finger-color:var(--finger-r3)}.keyboard__key[data-finger=R4],.keyboard__key--shift[data-finger=R4]{--finger-color:var(--finger-r4)}.keyboard__key--shift{width:64px}.keyboard__key--space{width:240px}.keyboard__label{line-height:var(--text-keycap-line)}.keyboard__shift-label{font-size:var(--text-keycap-finger-size);color:var(--ink-tertiary);position:absolute;top:2px;right:4px}.keyboard__finger-number{font-family:var(--text-keycap-finger-font);font-size:var(--text-keycap-finger-size);font-weight:var(--text-keycap-finger-weight);color:var(--finger-color,var(--ink-tertiary))}.keyboard__home-bump{background-color:var(--finger-color,var(--ink-tertiary));border-radius:var(--radius-xs);width:12px;height:2px;position:absolute;bottom:4px;left:50%;transform:translate(-50%)}.keyboard__key[data-expected=true],.keyboard__key--shift[data-shift-target=true]{border-color:var(--accent);outline:2px solid var(--accent-soft)}.keyboard__key[data-feedback=correct]{background-color:var(--positive-soft);border-color:var(--positive)}.keyboard__key[data-feedback=incorrect]{background-color:var(--negative-soft);border-color:var(--negative)}.hands-guide{align-items:center;gap:var(--space-3);flex-direction:column;width:100%;max-width:560px;display:flex}.hands-guide__hint{color:var(--ink-secondary);letter-spacing:.12em;margin:0;font-size:13px;font-weight:700}.hands-guide__stage{justify-content:center;align-items:flex-end;gap:var(--space-5);width:100%;display:flex}.hands-guide__hand{flex-direction:column;align-items:center;gap:0;display:flex}.hands-guide__digits{align-items:flex-end;gap:6px;padding:0 10px;display:flex}.hands-guide__palm{border:2px solid var(--line-strong);background-color:var(--bg-surface);clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);border-top:0;width:132px;height:48px;margin-top:-2px}.hands-guide__finger{--finger-color:var(--ink-tertiary);flex-direction:column;justify-content:flex-end;align-items:center;width:28px;display:flex;position:relative}.hands-guide__finger[data-finger=L4]{--finger-color:var(--finger-l4)}.hands-guide__finger[data-finger=L3]{--finger-color:var(--finger-l3)}.hands-guide__finger[data-finger=L2]{--finger-color:var(--finger-l2)}.hands-guide__finger[data-finger=L1]{--finger-color:var(--finger-l1)}.hands-guide__finger[data-finger=T]{--finger-color:var(--finger-t);width:44px;margin-bottom:8px}.hands-guide__finger[data-finger=R1]{--finger-color:var(--finger-r1)}.hands-guide__finger[data-finger=R2]{--finger-color:var(--finger-r2)}.hands-guide__finger[data-finger=R3]{--finger-color:var(--finger-r3)}.hands-guide__finger[data-finger=R4]{--finger-color:var(--finger-r4)}.hands-guide__pad{border:2px solid var(--finger-color);background-color:color-mix(in srgb, var(--finger-color) 14%, var(--bg-surface));width:100%;color:var(--finger-color);flex-direction:column;justify-content:flex-start;align-items:center;transition:none;display:flex;position:relative}.hands-guide__finger[data-height=short] .hands-guide__pad{height:46px}.hands-guide__finger[data-height=mid] .hands-guide__pad{height:58px}.hands-guide__finger[data-height=tall] .hands-guide__pad{height:66px}.hands-guide__finger[data-height=long] .hands-guide__pad{height:76px}.hands-guide__finger[data-height=thumb] .hands-guide__pad{border-radius:0;width:44px;height:28px}.hands-guide__nail{border:1px solid color-mix(in srgb, var(--finger-color) 55%, transparent);background-color:color-mix(in srgb, var(--finger-color) 8%, #fff);width:14px;height:10px;margin-top:5px;display:block}.hands-guide__finger-number{font-family:var(--text-keycap-finger-font);letter-spacing:0;margin-top:auto;margin-bottom:6px;font-size:12px;font-weight:800}.hands-guide__press-cue,.hands-guide__callout{white-space:nowrap;pointer-events:none;opacity:0;font-weight:800;position:absolute;left:50%;transform:translate(-50%)}.hands-guide__press-cue{color:var(--accent);letter-spacing:.08em;font-size:11px;bottom:calc(100% + 28px)}.hands-guide__callout{border:1px solid var(--accent);background-color:var(--bg-surface);color:var(--accent);letter-spacing:.04em;padding:2px 8px;font-size:11px;top:calc(100% + 6px)}.hands-guide__finger[data-active=true]{color:var(--accent)}.hands-guide__finger[data-active=true] .hands-guide__pad{background-color:var(--accent);border-color:var(--accent);color:#fff;outline:3px solid var(--accent-soft)}.hands-guide__finger[data-active=true] .hands-guide__press-cue,.hands-guide__finger[data-active=true] .hands-guide__callout{opacity:1}.hands-guide__finger[data-active=true] .hands-guide__nail{opacity:.9;background-color:#fff;border-color:#fff}@media (height<=639px){.hands-guide{display:none}}.level-select{max-width:var(--content-max-width);padding:var(--space-7) var(--gutter-padding);gap:var(--space-6);flex-direction:column;margin:0 auto;display:flex}.level-select__heading{color:var(--ink-primary)}.level-select__grid{gap:var(--space-5);border:none;grid-template-columns:repeat(4,1fr);margin:0;padding:0;display:grid}@media (width>=1280px){.level-select__grid{grid-template-columns:repeat(5,1fr)}}.level-select__hint{color:var(--ink-tertiary);text-align:center}.level-card{align-items:stretch;gap:var(--space-2);padding:var(--space-5);border-radius:var(--radius-l);background-color:var(--bg-surface);border:var(--border-e1);box-shadow:var(--shadow-e1);color:var(--ink-primary);text-align:left;font-family:var(--font-ui);cursor:pointer;transition:transform var(--t-quick) var(--e-standard), box-shadow var(--t-quick) var(--e-standard), background-color var(--t-quick) var(--e-standard);flex-direction:column;display:flex}.level-card:hover{box-shadow:var(--shadow-e2);transform:translateY(-2px)}.level-card--active{background-color:var(--accent-soft);transition-timing-function:var(--e-pop);transform:scale(1.02)}.level-card__top{justify-content:space-between;align-items:center;display:flex}.level-card__lv{color:var(--ink-secondary)}.level-card__stamp{color:var(--accent);font-size:var(--text-title-size)}.level-card__name{color:var(--ink-primary)}.level-card__target-chars,.level-card__added-fingers,.level-card__stats{color:var(--ink-tertiary)}.mini-keyboard{align-items:center;gap:var(--space-2);display:flex}.mini-keyboard__shift-marker{color:var(--ink-tertiary);font-size:var(--text-caption-size)}.mini-keyboard__rows{flex-direction:column;gap:2px;width:100px;display:flex}.mini-keyboard__row{gap:2px;display:flex}.mini-keyboard__key{border-radius:var(--radius-xs);background-color:var(--bg-sunken);border:1px solid var(--line-hairline);opacity:.5;flex:1;height:6px}.mini-keyboard__key[data-lit=true]{background-color:var(--accent);border-color:var(--accent);opacity:.85}.level-card--active .mini-keyboard__key[data-lit=true]{opacity:1}.lesson-screen{justify-content:center;align-items:center;gap:var(--space-6);min-height:100%;padding:var(--space-6) var(--gutter-padding);flex-direction:column;display:flex}.lesson-hud{justify-content:center;align-items:center;gap:var(--space-5);height:var(--hud-height);width:100%;color:var(--ink-secondary);display:flex}.lesson-hud__dots{gap:4px;display:flex}.lesson-hud__focus-badge{margin-left:var(--space-3);padding:2px var(--space-3);border-radius:var(--radius-pill);background-color:var(--accent-soft);color:var(--accent)}.lesson-hud__dot{border-radius:var(--radius-pill);background-color:var(--line-strong);width:6px;height:6px}.lesson-hud__dot--filled{background-color:var(--accent)}.lesson-hud__exit{color:var(--ink-tertiary);cursor:pointer;background:0 0;border:none;text-decoration:underline}.challenge-display{justify-content:center;align-items:center;width:100%;min-height:120px;display:flex}.challenge-display__text{text-align:center;color:var(--ink-primary);font-family:var(--font-mono);transition:color var(--t-base) var(--e-standard)}.challenge-display__text--xl{font-size:var(--text-challenge-xl-size);font-weight:var(--text-challenge-xl-weight);line-height:var(--text-challenge-xl-line);letter-spacing:var(--text-challenge-xl-tracking)}.challenge-display__text--l{font-size:var(--text-challenge-l-size);font-weight:var(--text-challenge-l-weight);line-height:var(--text-challenge-l-line);letter-spacing:var(--text-challenge-l-tracking)}.challenge-display__text--dimmed{color:var(--ink-tertiary)}.lesson-banner{padding:var(--space-3) var(--space-5);border-radius:var(--radius-s);background-color:var(--caution-soft);color:var(--ink-primary)}.pause-overlay{background-color:var(--bg-overlay);z-index:var(--z-panel);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.pause-overlay__panel{gap:var(--space-4);padding:var(--space-6);border-radius:var(--radius-l);background-color:var(--bg-surface);box-shadow:var(--shadow-e2);flex-direction:column;min-width:320px;display:flex}.pause-overlay__volume{gap:var(--space-2);color:var(--ink-secondary);flex-direction:column;display:flex}.pause-overlay__resume{padding:var(--space-3) var(--space-5);border-radius:var(--radius-m);background-color:var(--accent);color:var(--accent-ink);cursor:pointer;border:none}.lesson-result__weak-keys,.test-result__weak-keys{align-items:center;gap:var(--space-2);color:var(--ink-secondary);flex-direction:column;display:flex}.lesson-result__weak-key-list,.test-result__weak-key-list{gap:var(--space-3);margin:0;padding:0;list-style:none;display:flex}.lesson-result__weak-key,.test-result__weak-key{align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-4);border-radius:var(--radius-s);background-color:var(--bg-surface);box-shadow:var(--shadow-e1);font-family:var(--font-mono);color:var(--ink-primary);flex-direction:column;display:flex}.lesson-result{max-width:var(--result-max-width);padding:var(--space-7) var(--gutter-padding);align-items:center;gap:var(--space-6);text-align:center;flex-direction:column;margin:0 auto;display:flex}.lesson-result__stats{gap:var(--space-8);display:flex}.lesson-result__actions{gap:var(--space-3);flex-direction:column;display:flex}.final-test-screen{justify-content:center;align-items:center;gap:var(--space-6);min-height:100%;padding:var(--space-6) var(--gutter-padding);flex-direction:column;display:flex}.test-hud__time-bar{appearance:none;border-radius:var(--radius-pill);border:none;width:240px;height:8px;overflow:hidden}.test-hud__time-bar::-webkit-progress-value{background-color:var(--accent);border-radius:var(--radius-pill);transition:width var(--t-base) var(--e-standard)}.test-hud__time-bar[data-caution=true]{animation:1s ease-in-out infinite test-hud-caution-pulse}@keyframes test-hud-caution-pulse{0%,to{opacity:1}50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.test-hud__time-bar[data-caution=true]{animation:none}}.test-result{max-width:var(--result-max-width);padding:var(--space-7) var(--gutter-padding);align-items:center;gap:var(--space-6);text-align:center;flex-direction:column;margin:0 auto;display:flex}.test-result--passed{background-color:var(--positive-soft)}.test-result__stats{gap:var(--space-8);display:flex}.test-result__best{color:var(--accent)}.test-result__metric--negative,.test-result__note--negative{color:var(--negative)}.test-result__actions{gap:var(--space-3);flex-direction:column;display:flex}.stamp__circle{fill:var(--accent)}.stamp__ring{fill:none;stroke:var(--accent-ink);stroke-width:1.5px;opacity:.5}.stamp__glyph{fill:var(--accent-ink);font-family:var(--font-cert);font-size:44px}.stamp-reveal{align-items:center;gap:var(--space-4);flex-direction:column;display:flex}.stamp-reveal__badge{position:relative}.stamp-reveal__ring-pulse{border-radius:var(--radius-pill);border:3px solid var(--accent);opacity:0;width:100%;height:100%;margin:auto;position:absolute;inset:0}.stamp-reveal__heading{opacity:1}.stamp-reveal[data-phase=playing] .stamp-reveal__badge .stamp{animation:stamp-reveal-drop .26s var(--e-in) forwards, stamp-reveal-settle 60ms var(--e-pop) .26s forwards}.stamp-reveal[data-phase=playing] .stamp-reveal__ring-pulse{animation:stamp-reveal-ring .24s var(--e-standard) .26s forwards}.stamp-reveal[data-phase=playing] .stamp-reveal__heading{opacity:0;animation:stamp-reveal-heading-in var(--t-base) var(--e-out) .32s forwards}@keyframes stamp-reveal-drop{0%{opacity:0;transform:translateY(-120px)scale(1.8)}to{opacity:1;transform:translateY(0)scale(1.06)}}@keyframes stamp-reveal-settle{0%{transform:scale(1.06)}to{transform:scale(1)}}@keyframes stamp-reveal-ring{0%{opacity:1;transform:scale(.2)}to{opacity:0;transform:scale(1.8)}}@keyframes stamp-reveal-heading-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.stamp-reveal[data-phase=playing] .stamp-reveal__badge .stamp,.stamp-reveal[data-phase=playing] .stamp-reveal__ring-pulse{opacity:1;animation:none}.stamp-reveal[data-phase=playing] .stamp-reveal__heading{opacity:0;transition:opacity .2s var(--e-standard);animation:none}}.stamp-card{align-items:center;gap:var(--space-5);max-width:var(--result-max-width);padding:var(--space-7) var(--gutter-padding);text-align:center;flex-direction:column;margin:0 auto;display:flex}.stamp-card__grid{gap:var(--space-3);width:100%;padding:var(--space-5);border:1px dashed var(--line-strong);border-radius:var(--radius-l);grid-template-columns:repeat(5,1fr);display:grid}.stamp-card__slot{justify-content:center;align-items:center;gap:var(--space-1);min-height:120px;padding:var(--space-3);border:1px solid var(--line-hairline);border-radius:var(--radius-m);background-color:var(--bg-surface);cursor:pointer;flex-direction:column;display:flex}.stamp-card__slot-lv{color:var(--ink-secondary)}.stamp-card__slot-date,.stamp-card__slot-stats{color:var(--ink-tertiary)}.stamp-card__certificate{width:100%;padding:var(--space-4) var(--space-5);border:1px solid var(--line-hairline);border-radius:var(--radius-m);color:var(--ink-secondary)}.stamp-card__certificate--ready{align-items:center;gap:var(--space-3);border-color:var(--accent);flex-direction:column;display:flex}.certificate-screen{align-items:center;gap:var(--space-6);min-height:100%;padding:var(--space-6) var(--gutter-padding);background-color:var(--bg-canvas);flex-direction:column;display:flex}.certificate-screen__close-top{color:var(--ink-tertiary);cursor:pointer;background:0 0;border:none;align-self:flex-start;text-decoration:underline}.certificate-screen__frame{width:100%;max-width:960px}.certificate-svg{width:100%;height:auto;font-family:var(--font-cert)}.certificate-svg__bg{fill:var(--bg-surface)}.certificate-svg__border{fill:none;stroke:var(--accent);stroke-width:4px}.certificate-svg__title{letter-spacing:.2em;fill:var(--ink-primary);font-size:56px}.certificate-svg__name{fill:var(--ink-primary);font-size:44px}.certificate-svg__body{fill:var(--ink-secondary);font-size:24px}.certificate-svg__date,.certificate-svg__org{fill:var(--ink-secondary);font-size:22px}.certificate-screen__actions{gap:var(--space-3);display:flex}.story-scene{cursor:pointer;flex-direction:column;justify-content:flex-end;min-height:100vh;display:flex;position:relative;overflow:hidden}.story-scene__background-image,.story-scene__background-fallback{object-fit:cover;z-index:0;width:100%;height:100%;position:absolute;inset:0}.story-scene__background-fallback{background-color:var(--bg-sunken)}.story-scene__portrait{z-index:1;right:var(--space-6);max-width:46vw;height:106vh;position:absolute;bottom:-6vh}.story-scene__portrait-image{object-fit:contain;object-position:bottom center;width:auto;max-width:100%;height:100%;animation:story-portrait-fade-in var(--t-quick) var(--e-standard)}@keyframes story-portrait-fade-in{0%{opacity:0}to{opacity:1}}.story-scene__dialogue{z-index:1;margin:0 40px var(--space-6);padding:var(--space-5) var(--space-6);border-radius:var(--radius-l);background-color:var(--bg-surface);opacity:.92;box-shadow:var(--shadow-e2);position:relative}.story-scene__speaker{color:var(--accent);margin-bottom:var(--space-2)}.story-scene__body{color:var(--ink-primary);min-height:5.7em;line-height:1.9}.story-scene__advance-indicator{margin-left:var(--space-2);animation:1s ease-in-out infinite story-advance-bounce;display:inline-block}@keyframes story-advance-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}@media (prefers-reduced-motion:reduce){.story-scene__portrait-image{animation:none}.story-scene__advance-indicator{animation:1s ease-in-out infinite story-advance-fade;transform:none}}@keyframes story-advance-fade{0%,to{opacity:1}50%{opacity:.4}}.story-scene__footer{z-index:1;text-align:center;color:var(--bg-surface);padding-bottom:var(--space-3);position:relative}.skip-confirm{z-index:var(--z-panel);background-color:var(--bg-overlay);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.skip-confirm__panel{gap:var(--space-4);padding:var(--space-6);border-radius:var(--radius-l);background-color:var(--bg-surface);box-shadow:var(--shadow-e2);text-align:center;flex-direction:column;max-width:480px;display:flex}.skip-confirm__actions{justify-content:center;gap:var(--space-3);display:flex}.recollection{align-items:center;gap:var(--space-5);max-width:var(--result-max-width);padding:var(--space-7) var(--gutter-padding);text-align:center;flex-direction:column;margin:0 auto;display:flex}.recollection__list{border:1px solid var(--line-hairline);border-radius:var(--radius-m);flex-direction:column;width:100%;display:flex;overflow:hidden}.recollection__item{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-5);border:none;border-bottom:1px solid var(--line-hairline);background-color:var(--bg-surface);color:var(--ink-primary);cursor:pointer;text-align:left;display:flex}.recollection__item:last-child{border-bottom:none}.recollection__item-date,.recollection__item-hint{color:var(--ink-tertiary);white-space:nowrap}.settings-panel{z-index:var(--z-panel);gap:var(--space-6);width:400px;max-width:100%;padding:var(--space-6);background-color:var(--bg-surface);box-shadow:var(--shadow-e2);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;right:0;overflow-y:auto}.settings-panel__header{justify-content:space-between;align-items:center;display:flex}.settings-panel__close{border-radius:var(--radius-pill);width:32px;height:32px;color:var(--ink-secondary);cursor:pointer}.settings-panel__section{gap:var(--space-3);border:none;flex-direction:column;margin:0;padding:0;display:flex}.settings-panel__segmented{border:1px solid var(--line-hairline);border-radius:var(--radius-m);display:flex;overflow:hidden}.settings-panel__segment{padding:var(--space-3);color:var(--ink-secondary);cursor:pointer;flex:1}.settings-panel__segment--selected{background-color:var(--accent-soft);color:var(--accent)}.settings-panel__name-input{padding:var(--space-3);border:1px solid var(--line-hairline);border-radius:var(--radius-m);color:var(--ink-primary);background-color:var(--bg-canvas)}.settings-panel__error{color:var(--negative)}.settings-panel__sound-row,.settings-panel__account{align-items:center;gap:var(--space-3);display:flex}.settings-panel__login{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-5);border:1px solid var(--line-hairline);border-radius:var(--radius-m);cursor:pointer;display:inline-flex}.settings-panel__danger{align-items:flex-start;gap:var(--space-2);padding-top:var(--space-5);border-top:1px solid var(--line-hairline);flex-direction:column;display:flex}.settings-panel__danger button{color:var(--negative);cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}.sync-indicator{color:var(--ink-tertiary);display:inline-flex}.confirm-dialog{z-index:var(--z-panel);background-color:var(--bg-overlay);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.confirm-dialog__panel{gap:var(--space-4);padding:var(--space-6);border-radius:var(--radius-l);background-color:var(--bg-surface);max-width:420px;box-shadow:var(--shadow-e2);flex-direction:column;display:flex}.confirm-dialog__actions{justify-content:flex-end;gap:var(--space-4);display:flex}.confirm-dialog__danger{color:var(--negative);cursor:pointer;background:0 0;border:none}:root{--dossier-ink:#0d1119;--dossier-ink-2:#1b2130;--dossier-paper:#f2efe9;--dossier-paper-2:#e7e2d8;--dossier-paper-3:#fbf9f5;--dossier-crimson:#e3264f;--dossier-crimson-deep:#b4183c;--dossier-gold:#c9a227;--dossier-gold-soft:#e8cf85;--dossier-club:#c45c2d;--dossier-steel:#5a6478;--sheet:var(--dossier-paper-3);--sheet-2:var(--dossier-paper-2);--sheet-dark:var(--dossier-ink);--rule:#0d111929;--rule-strong:#0d111961;--rule-gold:#c9a2278c;--type:var(--dossier-ink);--type-2:#4a5162;--type-3:#7b8394;--on-crimson:#fffaf6;--club-ribbon:var(--dossier-crimson);--club-ribbon-deep:var(--dossier-crimson-deep);--scanline:repeating-linear-gradient(180deg, #ffffff0b 0 1px, transparent 1px 3px);--grid-paper:repeating-linear-gradient(0deg, #0d111917 0 1px, transparent 1px 7px), repeating-linear-gradient(90deg, #0d111917 0 1px, transparent 1px 7px);--cut-l:14px;--cut-s:8px;--bg-canvas:var(--dossier-paper);--bg-surface:var(--sheet);--bg-sunken:var(--sheet-2);--bg-overlay:#0d1119b8;--ink-primary:var(--type);--ink-secondary:var(--type-2);--ink-tertiary:var(--type-3);--line-hairline:var(--rule);--line-strong:var(--rule-strong);--accent:var(--dossier-crimson);--accent-ink:var(--on-crimson);--accent-soft:#fbe3e8;--focus-ring:var(--dossier-crimson);--shadow-e1:none;--shadow-e2:none;--border-e1:1px solid var(--rule);--border-e2:1px solid var(--rule-strong);--radius-xs:0;--radius-s:0;--radius-m:0;--radius-l:0}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--sheet:#151a25;--sheet-2:#0f131c;--sheet-dark:#080b12;--rule:#d8dfec29;--rule-strong:#d8dfec57;--rule-gold:#e8cf8580;--type:#eef1f7;--type-2:#aab3c4;--type-3:#808b9e;--bg-canvas:#0a0e16;--accent-soft:#e3264f2e;--grid-paper:repeating-linear-gradient(0deg, #eef1f712 0 1px, transparent 1px 7px), repeating-linear-gradient(90deg, #eef1f712 0 1px, transparent 1px 7px)}}:root[data-theme=dark]{--sheet:#151a25;--sheet-2:#0f131c;--sheet-dark:#080b12;--rule:#d8dfec29;--rule-strong:#d8dfec57;--rule-gold:#e8cf8580;--type:#eef1f7;--type-2:#aab3c4;--type-3:#808b9e;--bg-canvas:#0a0e16;--accent-soft:#e3264f2e;--grid-paper:repeating-linear-gradient(0deg, #eef1f712 0 1px, transparent 1px 7px), repeating-linear-gradient(90deg, #eef1f712 0 1px, transparent 1px 7px)}:root[data-theme=light]{--sheet:#fbf9f5;--sheet-2:#e7e2d8;--sheet-dark:#0d1119;--rule:#0d111929;--rule-strong:#0d111961;--rule-gold:#c9a2278c;--type:#0d1119;--type-2:#4a5162;--type-3:#7b8394;--bg-canvas:#f2efe9;--accent-soft:#fbe3e8;--grid-paper:repeating-linear-gradient(0deg, #0d111917 0 1px, transparent 1px 7px), repeating-linear-gradient(90deg, #0d111917 0 1px, transparent 1px 7px)}body{background-color:var(--bg-canvas);color:var(--type)}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--dossier-crimson);outline-offset:2px}::selection{background-color:var(--dossier-crimson);color:var(--on-crimson)}.text-metric,.lesson-hud__progress-text,.level-card__stats,.stamp-card__count,.recollection__count,.stamp-card__slot-date,.stamp-card__slot-stats,[data-testid=accuracy-text],[data-testid=kpm-text],[data-testid=miss-text],[data-testid=time-text],[data-testid=remaining-text]{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}.text-display,.text-headline,.title-screen__logo-text,.level-select__heading,.stamp-card__heading,.recollection__heading,.s12-screen__heading{font-family:var(--font-cert);letter-spacing:.06em;font-weight:700}button:not(:disabled):active{transform:translateY(2px)}.app-header{z-index:var(--z-header);border:0;border-bottom:1px solid var(--rule-gold);background-color:var(--sheet-dark);background-image:var(--scanline);height:60px;color:var(--dossier-paper);margin:0;padding-inline:clamp(14px,2.4vw,28px);position:sticky;top:0}.app-header:before{content:"";background-color:var(--dossier-crimson);width:6px;position:absolute;inset:0 auto 0 0}.app-header__logo{color:var(--dossier-paper);font-family:var(--font-cert);letter-spacing:.08em;gap:12px;font-size:17px;font-weight:700}.app-header__logo:before{content:"部" / "";border:1px solid var(--dossier-gold);background-color:var(--dossier-crimson);width:30px;height:30px;color:var(--on-crimson);font:700 15px / 1 var(--font-cert);place-items:center;display:grid}.app-header__nav{justify-content:center;gap:0}.app-header__nav-link{color:#eef1f7c7;letter-spacing:.04em;border-left:1px solid #d8dfec24;align-items:center;min-height:44px;padding-inline:18px;font-weight:700;display:inline-flex;position:relative}.app-header__nav-link:last-child{border-right:1px solid #d8dfec24}.app-header__nav-link:after{content:"";background-color:var(--dossier-crimson);opacity:0;height:3px;position:absolute;bottom:0;left:0;right:0}.app-header__nav-link:hover,.app-header__nav-link:focus-visible{color:#fff}.app-header__nav-link:hover:after,.app-header__nav-link:focus-visible:after{opacity:1}.app-header__settings{width:44px;height:44px;color:var(--dossier-paper);background-color:#0000;border:1px solid #d8dfec47}.app-header__settings:hover{border-color:var(--dossier-gold);background-color:#c9a22724}.app-header__sync{color:var(--dossier-gold-soft);font:700 11px / 1 var(--font-mono);letter-spacing:.16em}.title-screen{isolation:isolate;min-height:100vh;padding:0;display:block;position:relative;overflow:hidden}.title-screen__backdrop{z-index:-4;object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.title-screen:before{content:"";z-index:-3;background-color:#080b129e;background-image:var(--scanline);position:absolute;inset:0}.title-screen:after{content:"";z-index:-2;pointer-events:none;border-top:10px solid var(--dossier-ink);border-bottom:10px solid var(--dossier-ink);position:absolute;inset:0}.title-screen__accent--red{z-index:2;border-right:1px solid var(--rule-gold);background-color:var(--dossier-ink);border-radius:0;width:58px;height:auto;position:absolute;top:10px;bottom:10px;left:0}.title-screen__accent--red:after{content:"文\a 字\a ヶ\a 丘\a 学\a 園\a タ\a イ\a ピ\a ン\a グ\a 部" / "";color:var(--dossier-gold-soft);font:700 13px / 1.75 var(--font-cert);text-align:center;white-space:pre;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.title-screen__accent--cyan{z-index:2;background-color:var(--club-ribbon);border-radius:0;width:10px;height:auto;position:absolute;top:10px;bottom:10px;right:0}.title-screen__console-panel{z-index:1;background-color:#0000;border:0;border-radius:0;grid-template-columns:minmax(430px,.96fr) minmax(360px,1.04fr);width:100%;min-height:100vh;margin:0;display:grid;position:relative;overflow:hidden}.title-screen__copy{border-right:1px solid var(--rule-gold);background-color:#080b12e0;flex-direction:column;justify-content:center;gap:26px;padding:84px 64px 84px 118px;display:flex;position:relative}.title-screen__copy:before{content:"CLUB NOTE / TITLE" / "";color:var(--dossier-gold);font:700 10px / 1 var(--font-mono);letter-spacing:.34em;position:absolute;top:58px;left:118px}.title-screen__copy:after{content:"";background-color:var(--rule-gold);height:1px;position:absolute;bottom:62px;left:118px;right:64px}.title-screen__eyebrow,.level-select__eyebrow{color:#ff6b88;font:800 11px / 1 var(--font-mono);letter-spacing:.34em}.title-screen__eyebrow:before,.level-select__eyebrow:before{content:"◆ " / "";color:var(--dossier-gold)}.title-screen__logo-image{width:100%;max-width:400px}.title-screen__logo-text{color:#fff;letter-spacing:.02em;font-size:clamp(38px,4.6vw,68px);line-height:1.1}.title-screen__subtitle{border-left:3px solid var(--dossier-crimson);color:#fff;font-family:var(--font-cert);letter-spacing:.32em;margin-top:14px;padding-left:16px;font-size:22px}.title-screen__menu{gap:6px;max-width:520px;display:grid}.title-screen__menu-item{color:#eef1f7db;width:100%;min-height:58px;font-family:var(--font-cert);letter-spacing:.14em;clip-path:polygon(0 0, 100% 0, 100% calc(100% - var(--cut-l)), calc(100% - var(--cut-l)) 100%, 0 100%);background-color:#0d1119c2;border:1px solid #eef1f73d;border-radius:0;padding:0 20px 0 0;position:relative;overflow:hidden}.title-screen__menu-item--active{border-color:var(--dossier-crimson);background-color:var(--dossier-crimson);color:var(--on-crimson)}.title-screen__menu-item--active:before{content:"";background-color:var(--dossier-gold);width:8px;position:absolute;inset:0 auto 0 0}.title-screen__menu-number{min-width:62px;color:var(--dossier-gold-soft);font:800 13px / 1 var(--font-mono);letter-spacing:.1em;opacity:1;border-right:1px solid #eef1f733;justify-content:center;align-self:stretch;align-items:center;display:inline-flex}.title-screen__menu-item--active .title-screen__menu-number{color:var(--on-crimson);border-right-color:#ffffff5c}.title-screen__menu-marker{width:auto;font-size:15px;font-family:var(--font-mono);margin-left:auto}.title-screen__hint{color:#eef1f7b8;font-family:var(--font-mono);letter-spacing:.1em}.title-screen__hint kbd{border:1px solid var(--dossier-gold);color:var(--dossier-gold-soft);font:700 11px / 1 var(--font-mono);background-color:#0000;border-radius:0;padding:3px 9px;display:inline-block}.title-screen__art{background-color:#0000;position:relative;overflow:hidden}.title-screen__art-backdrop{display:none}.title-screen__character{z-index:2;object-fit:contain;object-position:bottom center;width:auto;height:calc(100% - 20px);max-height:none;position:absolute;inset:10px 40px 10px auto}.title-screen__art:before{content:"";z-index:1;aspect-ratio:1;border:2px solid var(--rule-gold);background-color:#e3264f29;width:40%;position:absolute;top:50%;left:52%;transform:translate(-50%,-50%)rotate(45deg)}.title-screen__art-label{z-index:3;border:1px solid var(--dossier-gold);background-color:var(--dossier-ink);color:var(--dossier-gold-soft);font:800 11px / 1 var(--font-mono);letter-spacing:.22em;border-radius:0;padding:8px 14px;position:absolute;top:44px;right:44px}.title-screen__status{z-index:3;border-top:1px solid var(--rule-gold);background-color:var(--dossier-ink);width:auto;color:var(--dossier-gold-soft);font:700 11px / 1 var(--font-mono);letter-spacing:.2em;border-radius:0;justify-content:space-between;gap:20px;margin:0;padding:11px 22px;display:flex;position:absolute;bottom:10px;left:68px;right:10px}.level-select{gap:26px;max-width:1280px;padding-top:34px}.level-select__hero{border:1px solid var(--rule-gold);background-color:var(--dossier-ink);color:#fff;clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px));border-radius:0;grid-template-columns:1fr 260px;min-height:250px;display:grid;position:relative;overflow:hidden}.level-select__hero-backdrop{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.level-select__hero:after{content:"";background-color:#080b12b3;background-image:var(--scanline);position:absolute;inset:0}.level-select__hero:before{content:"";z-index:2;background-color:var(--club-ribbon);height:6px;position:absolute;inset:0 0 auto}.level-select__hero-copy{z-index:1;flex-direction:column;justify-content:center;gap:10px;padding:34px 40px;display:flex;position:relative}.level-select__heading{color:#fff;letter-spacing:.1em;font-size:clamp(30px,3.4vw,46px)}.level-select__hero-message{color:#eef1f7cc;font-family:var(--font-cert);letter-spacing:.08em}.level-select__hero-character{z-index:1;object-fit:contain;height:244px;position:absolute;bottom:0;right:18px}.level-select__progress{align-items:center;gap:18px;margin-top:14px;display:flex}.level-select__progress>span{color:var(--dossier-gold-soft);font:800 34px / 1 var(--font-mono);font-variant-numeric:tabular-nums}.level-select__progress small{color:#eef1f799;margin-left:4px;font-size:13px}.level-select__progress>div{border:1px solid var(--rule-gold);background-color:#eef1f714;background-image:repeating-linear-gradient(90deg, transparent 0 calc(10% - 1px), var(--rule-gold) calc(10% - 1px) 10%);border-radius:0;width:min(320px,56%);height:14px;overflow:hidden}.level-select__progress i{background-color:var(--dossier-crimson);width:0;height:100%;display:block}.level-select__progress i[data-progress="1"]{width:10%}.level-select__progress i[data-progress="2"]{width:20%}.level-select__progress i[data-progress="3"]{width:30%}.level-select__progress i[data-progress="4"]{width:40%}.level-select__progress i[data-progress="5"]{width:50%}.level-select__progress i[data-progress="6"]{width:60%}.level-select__progress i[data-progress="7"]{width:70%}.level-select__progress i[data-progress="8"]{width:80%}.level-select__progress i[data-progress="9"]{width:90%}.level-select__progress i[data-progress="10"]{width:100%}.level-select__grid{gap:14px}.level-card{border:1px solid var(--rule-strong);background-color:var(--sheet);clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);border-radius:0;gap:6px;min-height:288px;padding:0 16px 16px;position:relative;overflow:hidden}.level-card__visual{object-fit:cover;width:calc(100% + 32px);max-width:none;height:104px;margin:0 -16px 10px}.level-card:before{content:attr(data-level) / "";z-index:1;color:#ffffffe6;font:800 52px / 1 var(--font-mono);text-shadow:2px 2px #0d11198c;pointer-events:none;position:absolute;top:2px;right:10px}.level-card:after{content:"ENTER" / "";color:var(--type-3);font:800 9px / 1 var(--font-mono);letter-spacing:.26em;align-self:flex-end;margin-top:auto}.level-card__top{z-index:1;min-height:30px;margin-top:-4px;position:relative}.level-card__lv{background-color:var(--dossier-ink);height:26px;color:var(--dossier-gold-soft);font:800 12px / 1 var(--font-mono);letter-spacing:.1em;border-radius:0;align-items:center;padding-inline:11px;display:inline-flex}.level-card__stamp{border:2px solid var(--dossier-crimson);width:38px;height:38px;color:var(--dossier-crimson);font:700 20px / 1 var(--font-cert);background-color:#0000;border-radius:0;place-items:center;display:grid;transform:rotate(-9deg)}.level-card__name{z-index:1;color:var(--type);font-family:var(--font-cert);letter-spacing:.04em;font-size:18px;position:relative}.level-card__target-chars{z-index:1;font-family:var(--font-mono);letter-spacing:.18em;color:var(--type-2);position:relative}.level-card__added-fingers{z-index:1;color:var(--type-3);position:relative}.level-card__stats{z-index:1;border-top:1px solid var(--rule);color:var(--type-2);letter-spacing:.04em;align-self:stretch;padding-top:8px;position:relative}.level-card--active{border-color:var(--dossier-crimson);background-color:var(--sheet)}.level-card--active:before{color:#fff;text-shadow:2px 2px 0 var(--dossier-crimson)}.level-card--active:after{color:var(--dossier-crimson)}.level-card--active .level-card__lv{background-color:var(--dossier-crimson);color:var(--on-crimson)}.level-select__hint{color:var(--type-3);font-family:var(--font-mono);letter-spacing:.14em}.mini-keyboard__key{background-color:var(--sheet-2);border-color:var(--rule);opacity:1;border-radius:0}.mini-keyboard__key[data-lit=true]{background-color:var(--dossier-crimson);border-color:var(--dossier-crimson)}.focus-shell{background-color:var(--bg-canvas);min-height:100vh;position:relative}.focus-shell:before{content:"TYPING CLUB / AFTER SCHOOL" / "";writing-mode:vertical-rl;text-orientation:sideways;color:var(--type-3);font:800 10px / 1 var(--font-mono);letter-spacing:.34em;pointer-events:none;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.focus-shell__content{flex-direction:column;max-width:1120px;display:flex}.lesson-screen,.final-test-screen{background-color:#0000;flex:1;justify-content:flex-start;gap:18px}.focus-hud{background:0 0;border:0;height:0;min-height:0}.lesson-hud{border:1px solid var(--rule-gold);background-color:var(--sheet-dark);color:#eef1f7d1;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);border-radius:0;gap:18px;width:auto;height:auto;min-height:48px;margin:12px 16px;padding-inline:20px}.lesson-hud--top{align-self:stretch;margin-bottom:0}.lesson-hud--bottom{align-self:stretch;margin-top:0}.challenge-display{margin-top:auto}.practice-guides,.practice-guides-placeholder{margin-bottom:auto}.lesson-hud__level-name{color:#fff;font-family:var(--font-cert);letter-spacing:.1em;margin-right:auto;font-weight:700}.lesson-hud__level-name:before{content:"「" / "";color:var(--dossier-gold)}.lesson-hud__level-name:after{content:"」" / "";color:var(--dossier-gold)}.lesson-hud__progress-text{color:var(--dossier-gold-soft);letter-spacing:.12em;margin-left:auto;font-weight:800}.lesson-hud__dots{gap:3px}.lesson-hud__dot{background-color:#0000;border:1px solid #d8dfec4d;border-radius:0;width:12px;height:8px}.lesson-hud__dot--filled{border-color:var(--dossier-crimson);background-color:var(--dossier-crimson)}.lesson-hud__focus-badge{border:1px solid var(--dossier-club);color:var(--dossier-club);letter-spacing:.1em;background-color:#0000;border-radius:0;font-weight:700}.lesson-hud--bottom [data-testid=accuracy-text],.lesson-hud--bottom [data-testid=kpm-text],.lesson-hud--bottom [data-testid=miss-text]{color:#fff;letter-spacing:.1em;border:1px solid #d8dfec3d;border-radius:0;padding:4px 12px}.lesson-hud__exit{color:#eef1f7b3;font-family:var(--font-mono);letter-spacing:.06em;border:1px solid #d8dfec3d;border-radius:0;margin-left:auto;padding:5px 12px;text-decoration:none}.lesson-hud__exit:hover{border-color:var(--dossier-crimson);color:#fff}.challenge-display{border:1px solid var(--rule-strong);background-color:var(--sheet);border-radius:0;width:min(780px,100%);min-height:168px;position:relative}.challenge-display:before{content:"";border-top:3px solid var(--dossier-crimson);border-left:3px solid var(--dossier-crimson);width:26px;height:26px;position:absolute;top:-1px;left:-1px}.challenge-display:after{content:"";border-right:3px solid var(--dossier-crimson);border-bottom:3px solid var(--dossier-crimson);width:26px;height:26px;position:absolute;bottom:-1px;right:-1px}.challenge-display__text{color:var(--type)}.keyboard__key{border:1px solid var(--rule-strong);background-color:var(--sheet);border-bottom-width:3px;border-radius:0}.hands-guide__finger,.hands-guide__pad{border-radius:0}.hands-guide__palm{background-color:var(--sheet);border-color:var(--rule-strong);border-radius:0}.hands-guide__finger[data-active=true] .hands-guide__pad{transform:translateY(5px)}.hands-guide__finger[data-active=true] .hands-guide__press-cue{animation:.9s steps(2,end) infinite club-finger-cue}@keyframes club-finger-cue{0%,to{opacity:1}50%{opacity:.25}}@media (prefers-reduced-motion:reduce){.hands-guide__finger[data-active=true] .hands-guide__press-cue{animation:none}}.lesson-banner{border:1px solid var(--dossier-club);background-color:var(--sheet-2);color:var(--type);border-left-width:6px;border-radius:0;font-weight:700}.test-hud__time-bar{border:1px solid var(--rule-gold);border-radius:0;width:270px;height:12px}.test-hud__time-bar::-webkit-progress-bar{background-color:#eef1f71a;border-radius:0}.test-hud__time-bar::-webkit-progress-value{background-color:var(--dossier-crimson);border-radius:0}.test-hud__time-bar::-moz-progress-bar{background-color:var(--dossier-crimson);border-radius:0}.test-hud__time-bar[data-caution=true]::-webkit-progress-value{background-color:var(--dossier-club)}.test-hud__time-bar[data-caution=true]::-moz-progress-bar{background-color:var(--dossier-club)}.lesson-result,.test-result{background-image:var(--grid-paper);border:1px solid var(--rule-strong);background-color:var(--sheet);border-radius:0;gap:22px;margin-top:30px;padding:46px clamp(24px,4vw,52px) 40px;position:relative}.lesson-result:before,.test-result:before{content:"REPORT" / "";background-color:var(--dossier-ink);height:26px;color:var(--dossier-gold-soft);font:800 10px / 26px var(--font-mono);letter-spacing:.4em;place-items:center;display:grid;position:absolute;top:0;left:0;right:0}.test-result--passed{border-color:var(--dossier-crimson);background-color:var(--sheet)}.test-result--passed:before{content:"REPORT / CLEARED" / "";background-color:var(--dossier-crimson);color:var(--on-crimson)}.lesson-result__stats,.test-result__stats{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);flex-wrap:wrap;justify-content:center;gap:0}.lesson-result__stats>*,.test-result__stats>*{border-left:1px solid var(--rule);min-width:156px;padding:18px 24px}.lesson-result__stats>:first-child,.test-result__stats>:first-child{border-left:0}.lesson-result__stats dt,.test-result__stats dt{color:var(--type-3);font-family:var(--font-mono);letter-spacing:.16em}.test-result__best{color:var(--dossier-gold);letter-spacing:.08em;margin-top:4px;font-weight:700}.result-rank{background-color:#0000;border:0;border-radius:0;align-items:center;gap:22px;padding:0;display:flex}.result-rank__ring{border:2px solid var(--result-rank-color,var(--type-3));border-radius:0;place-items:center;width:86px;height:86px;display:grid;position:relative;transform:rotate(45deg)}.result-rank__ring:after{content:"";border:1px solid var(--result-rank-color,var(--type-3));position:absolute;inset:5px}.result-rank__letter{z-index:1;color:var(--result-rank-color,var(--type-2));font:700 40px / 1 var(--font-cert);letter-spacing:.02em;position:relative;transform:rotate(-45deg)}.result-rank__meta{text-align:left;flex-direction:column;align-items:flex-start;gap:4px;display:flex}.result-rank__label{color:var(--type);font-family:var(--font-cert);letter-spacing:.16em;font-size:22px}.result-rank__criteria{color:var(--type-3);font-family:var(--font-mono);letter-spacing:.06em}.result-rank[data-rank=S]{--result-rank-color:var(--dossier-gold)}.result-rank[data-rank=A]{--result-rank-color:var(--dossier-crimson)}.result-rank[data-rank=B]{--result-rank-color:var(--dossier-steel)}.result-rank[data-rank=C]{--result-rank-color:var(--type-3)}.lesson-result__weak-key,.test-result__weak-key{border:1px solid var(--rule-strong);background-color:var(--sheet-2);min-width:62px;box-shadow:none;border-radius:0}.lesson-result__weak-key-count,.test-result__weak-key-count{color:var(--dossier-crimson);font-weight:800}.lesson-result__actions button,.test-result__actions button,.certificate-screen__actions button,.confirm-dialog__actions button,.skip-confirm__actions button,.pause-overlay__resume,.s12-screen__continue,.stamp-card__certificate--ready button{border:1px solid var(--rule-strong);min-height:48px;color:var(--type);font-family:var(--font-cert);letter-spacing:.12em;cursor:pointer;transition:border-color var(--t-quick) var(--e-standard), background-color var(--t-quick) var(--e-standard), color var(--t-quick) var(--e-standard);background-color:#0000;border-radius:0;padding-inline:26px}.lesson-result__actions button:first-child,.test-result__actions button:first-child,.certificate-screen__actions button:first-child,.pause-overlay__resume,.s12-screen__continue,.stamp-card__certificate--ready button{border-color:var(--dossier-crimson);background-color:var(--dossier-crimson);color:var(--on-crimson);clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);font-weight:700;position:relative}.lesson-result__actions button:first-child:before,.test-result__actions button:first-child:before,.certificate-screen__actions button:first-child:before,.pause-overlay__resume:before,.s12-screen__continue:before{content:"";background-color:var(--dossier-gold);width:4px;position:absolute;inset:0 auto 0 0}.confirm-dialog__danger,.settings-panel__danger button{border-color:var(--negative);color:var(--negative)}.stamp-card,.recollection,.certificate-screen__frame{border:1px solid var(--rule-strong);background-color:var(--sheet);border-radius:0;margin-top:30px;padding:46px clamp(24px,3.4vw,46px) 40px;position:relative}.stamp-card:before,.recollection:before{content:"RECORD" / "";background-color:var(--dossier-ink);height:26px;color:var(--dossier-gold-soft);font:800 10px / 26px var(--font-mono);letter-spacing:.4em;place-items:center;display:grid;position:absolute;top:0;left:0;right:0}.certificate-screen__frame{border:1px solid var(--rule-gold);outline:1px solid var(--rule-gold);outline-offset:5px;overflow:hidden}.stamp-card__count,.recollection__count{border:1px solid var(--rule-strong);color:var(--type-2);letter-spacing:.12em;border-radius:0;padding:6px 18px;font-weight:700}.stamp-card__grid{border:1px solid var(--rule);background-color:var(--sheet-2);background-image:var(--grid-paper);border-radius:0}.stamp-card__slot{border:1px solid var(--rule-strong);background-color:var(--sheet);transition:border-color var(--t-quick) var(--e-standard);border-radius:0}.stamp-card__slot[data-passed=true]{border-color:var(--dossier-crimson);border-width:2px}.stamp-card__slot--active{border-color:var(--dossier-gold)}.stamp-card__slot-lv{font-family:var(--font-mono);letter-spacing:.12em;font-weight:800}.stamp-card__certificate{border:1px solid var(--rule);background-color:var(--sheet-2);color:var(--type-2);border-radius:0}.stamp-card__certificate--ready{border:2px solid var(--dossier-gold);background-color:var(--sheet)}.recollection__list{border:1px solid var(--rule-strong);border-radius:0;overflow:hidden}.recollection__item{border-bottom:1px solid var(--rule);background-color:var(--sheet);transition:background-color var(--t-quick) var(--e-standard)}.recollection__item:before{content:"◆" / "";color:var(--dossier-gold);margin-right:12px;font-size:10px}.recollection__item--active{background-color:var(--accent-soft)}.recollection__item-date{color:var(--type-3)}.story-scene__dialogue{border:1px solid var(--rule-gold);color:#fff;opacity:1;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px));background-color:#080b12e6;border-radius:0;margin:0 clamp(16px,4vw,56px) 28px;padding:26px 30px 24px;position:relative}.story-scene__body{color:#eef1f7f0;font-family:var(--font-cert);letter-spacing:.06em;font-size:18px}.story-scene__speaker{background-color:var(--dossier-crimson);height:28px;color:var(--on-crimson);font-family:var(--font-cert);letter-spacing:.18em;border-radius:0;align-items:center;margin-bottom:14px;padding-inline:16px;font-weight:700;display:inline-flex}.story-scene__footer{color:#ffffffb3;font-family:var(--font-mono);letter-spacing:.18em}.settings-panel,.pause-overlay__panel,.confirm-dialog__panel,.skip-confirm__panel{border:1px solid var(--rule-gold);background-color:var(--sheet);border-radius:0}.settings-panel{border-top:0;border-bottom:0;border-right:0;border-left:4px solid var(--dossier-crimson);height:100%;margin:0}.settings-panel__header{border-bottom:1px solid var(--rule-gold);padding-bottom:14px}.settings-panel__segmented{border:1px solid var(--rule-strong);background-color:var(--sheet-2);border-radius:0;padding:0}.settings-panel__segment{min-height:42px;color:var(--type-2);font-family:var(--font-cert);letter-spacing:.08em;transition:background-color var(--t-quick) var(--e-standard), color var(--t-quick) var(--e-standard);border-radius:0}.settings-panel__segment--selected{background-color:var(--dossier-crimson);color:var(--on-crimson);font-weight:700}.settings-panel__name-input{border:1px solid var(--rule-strong);background-color:var(--sheet);min-height:44px;color:var(--type);border-radius:0}.settings-panel__close{border:1px solid var(--rule-strong);background-color:#0000;border-radius:0;width:44px;height:44px}.sync-indicator{font-family:var(--font-mono);letter-spacing:.12em}.s12-screen{background-color:var(--bg-canvas)}.s12-screen__icon{border:2px solid var(--rule-strong);background-color:var(--sheet);width:88px;height:88px;color:var(--type-2);border-radius:0;place-items:center;font-size:38px;display:grid}@media (hover:hover){.level-card:hover{border-color:var(--dossier-crimson)}.stamp-card__slot:hover{border-color:var(--dossier-gold)}.title-screen__menu-item:hover{border-color:var(--dossier-gold);color:#fff}.lesson-result__actions button:hover,.test-result__actions button:hover,.certificate-screen__actions button:hover,.confirm-dialog__actions button:hover,.skip-confirm__actions button:hover{border-color:var(--dossier-crimson);color:var(--dossier-crimson)}.lesson-result__actions button:first-child:hover,.test-result__actions button:first-child:hover,.certificate-screen__actions button:first-child:hover,.pause-overlay__resume:hover,.s12-screen__continue:hover{background-color:var(--dossier-crimson-deep);color:var(--on-crimson)}}@media (prefers-reduced-motion:no-preference){.title-screen__menu-item--active:before{animation:1.8s steps(2,end) infinite dossier-blink}}@keyframes dossier-blink{50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.title-screen__menu-item--active:before{animation:none}}@media (width<=1023px){.title-screen__console-panel{grid-template-columns:1fr;min-height:auto}.title-screen__art{order:-1;min-height:340px}.title-screen__character{height:320px;inset:10px auto 10px 50%;transform:translate(-50%)}.title-screen__copy{padding:64px 40px 72px 92px}.title-screen__copy:before{left:92px}.title-screen__copy:after{left:92px;right:40px}.level-select__hero{grid-template-columns:1fr 170px}.level-select__hero-character{height:172px}.level-select__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=620px){.app-header{height:56px;padding-inline:12px}.app-header__logo:before,.app-header__sync{display:none}.app-header__logo{white-space:nowrap;text-overflow:ellipsis;flex:0 auto;min-width:0;font-size:14px;overflow:hidden}.app-header__nav{flex:none;justify-content:flex-end}.app-header__nav-link{white-space:nowrap;padding-inline:10px;font-size:13px}.title-screen__accent--red{width:34px}.title-screen__accent--red:after{letter-spacing:.28em;font-size:11px}.title-screen__copy{padding:34px 32px 64px 54px}.title-screen__copy:before{display:none}.title-screen__copy:after{left:54px;right:32px}.title-screen__status{flex-wrap:wrap;justify-content:center;gap:8px 16px;padding:9px 14px;font-size:10px;left:44px}.level-select{padding-inline:14px}.level-select__hero{grid-template-columns:1fr;min-height:226px}.level-select__hero-character{display:none}.level-select__grid{grid-template-columns:1fr}.level-card{min-height:250px}.lesson-result__stats,.test-result__stats{flex-direction:column;width:100%}.lesson-result__stats>*,.test-result__stats>*{border-top:1px solid var(--rule);border-left:0}.lesson-result__stats>:first-child,.test-result__stats>:first-child{border-top:0}.result-rank{text-align:center;flex-direction:column}.result-rank__meta{text-align:center;align-items:center}}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .challenge-display,:root:not([data-theme=light]) .keyboard__key,:root:not([data-theme=light]) .level-card,:root:not([data-theme=light]) .stamp-card__slot{background-color:var(--sheet)}:root:not([data-theme=light]) .lesson-result,:root:not([data-theme=light]) .test-result,:root:not([data-theme=light]) .stamp-card,:root:not([data-theme=light]) .recollection{background-image:var(--scanline)}:root:not([data-theme=light]) .title-screen__menu-item:not(.title-screen__menu-item--active){background-color:#080b12db}}:root[data-theme=dark] .challenge-display,:root[data-theme=dark] .keyboard__key,:root[data-theme=dark] .level-card,:root[data-theme=dark] .stamp-card__slot{background-color:var(--sheet)}:root[data-theme=dark] .lesson-result,:root[data-theme=dark] .test-result,:root[data-theme=dark] .stamp-card,:root[data-theme=dark] .recollection{background-image:var(--scanline)}:root[data-theme=dark] .title-screen__menu-item:not(.title-screen__menu-item--active){background-color:#080b12db}
/*$vite$:1*/