:root{--bg: #FAF7F2;--bg-card: #FFFFFF;--bg-subtle: #F0EBE3;--border: #DDD5C8;--text: #2C2016;--text-muted: #7A6860;--accent: #C19A6B;--accent-dark: #9E7A4F;--accent-light: #E8D5BC;--correct: #2E8B57;--correct-bg: #D4EDDA;--wrong: #C0392B;--wrong-bg: #FADBD8;--shadow: 0 2px 12px rgba(44,32,22,.1);--shadow-lg: 0 8px 32px rgba(44,32,22,.14);--radius: 14px;--radius-sm: 8px;--tab-h: 64px;--header-h: 50px;--font-display: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;--font-body: "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", sans-serif;--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace}@media (prefers-color-scheme: dark){:root{--bg: #1A1410;--bg-card: #251E18;--bg-subtle: #2E2520;--border: #3D3028;--text: #F0E8DC;--text-muted: #9A8878;--accent: #C19A6B;--accent-dark: #D4A97A;--accent-light: #3A2E22;--correct: #52B788;--correct-bg: #1A3D2B;--wrong: #E05C52;--wrong-bg: #3D1A18;--shadow: 0 2px 12px rgba(0,0,0,.4);--shadow-lg: 0 8px 32px rgba(0,0,0,.5)}}[data-theme=dark]{--bg: #1A1410;--bg-card: #251E18;--bg-subtle: #2E2520;--border: #3D3028;--text: #F0E8DC;--text-muted: #9A8878;--accent: #C19A6B;--accent-dark: #D4A97A;--accent-light: #3A2E22;--correct: #52B788;--correct-bg: #1A3D2B;--wrong: #E05C52;--wrong-bg: #3D1A18;--shadow: 0 2px 12px rgba(0,0,0,.4);--shadow-lg: 0 8px 32px rgba(0,0,0,.5)}[data-theme=light]{--bg: #FAF7F2;--bg-card: #FFFFFF;--bg-subtle: #F0EBE3;--border: #DDD5C8;--text: #2C2016;--text-muted: #7A6860;--accent: #C19A6B;--accent-dark: #9E7A4F;--accent-light: #E8D5BC;--correct: #2E8B57;--correct-bg: #D4EDDA;--wrong: #C0392B;--wrong-bg: #FADBD8;--shadow: 0 2px 12px rgba(44,32,22,.1);--shadow-lg: 0 8px 32px rgba(44,32,22,.14)}[data-theme=dark]{--bg:#1A1410;--bg-card:#251E18;--bg-subtle:#2E2520;--border:#3D3028;--text:#F0E8DC;--text-muted:#9A8878;--accent:#C19A6B;--accent-dark:#D4A97A;--accent-light:#3A2E22;--correct:#52B788;--correct-bg:#1A3D2B;--wrong:#E05C52;--wrong-bg:#3D1A18;--shadow:0 2px 12px rgba(0,0,0,.4);--shadow-lg:0 8px 32px rgba(0,0,0,.5)}[data-theme=light]{--bg:#FAF7F2;--bg-card:#FFFFFF;--bg-subtle:#F0EBE3;--border:#DDD5C8;--text:#2C2016;--text-muted:#8A7468;--accent:#C19A6B;--accent-dark:#9E7A4F;--accent-light:#E8D5BC;--correct:#2E8B57;--correct-bg:#D4EDDA;--wrong:#C0392B;--wrong-bg:#FADBD8;--shadow:0 2px 12px rgba(44,32,22,.1);--shadow-lg:0 8px 32px rgba(44,32,22,.14)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100dvh;line-height:1.6;-webkit-font-smoothing:antialiased}#root{min-height:100dvh;display:flex;flex-direction:column}h1,h2,h3{font-family:var(--font-display);line-height:1.2}.page{flex:1;display:flex;flex-direction:column;align-items:center;padding:16px 16px calc(var(--tab-h) + 16px);max-width:480px;width:100%;margin:0 auto}.page-full{flex:1;display:flex;flex-direction:column;align-items:center;padding:20px 16px 32px;max-width:480px;width:100%;margin:0 auto}.tab-bar{position:fixed;bottom:0;left:0;right:0;height:var(--tab-h);background:var(--bg-card);border-top:1px solid var(--border);display:flex;align-items:stretch;z-index:100;padding-bottom:env(safe-area-inset-bottom)}.tab-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;background:none;cursor:pointer;color:var(--text-muted);font-family:var(--font-body);font-size:.6rem;font-weight:500;transition:color .15s;padding:8px 0}.tab-item.active{color:var(--accent)}.tab-icon{font-size:1.3rem;line-height:1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border:none;border-radius:var(--radius-sm);font-family:var(--font-body);font-size:.95rem;font-weight:700;cursor:pointer;transition:transform .12s,box-shadow .12s,background .15s;text-decoration:none;white-space:nowrap}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:#2c2016;box-shadow:0 4px 14px #c19a6b59}.btn-primary:hover{background:var(--accent-dark)}.btn-secondary{background:var(--bg-subtle);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border)}.btn-ghost{background:transparent;color:var(--text-muted);padding:8px 16px}.btn-ghost:hover{color:var(--text);background:var(--bg-subtle)}.btn-danger{background:var(--wrong);color:#fff}.btn-lg{padding:16px 36px;font-size:1.1rem;border-radius:var(--radius)}.btn-full{width:100%}.card{background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow)}.input{width:100%;padding:12px 16px;border:1.5px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:.95rem;transition:border-color .15s,box-shadow .15s;outline:none}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #c19a6b33}.input::placeholder{color:var(--text-muted)}@keyframes fanSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999}.fan{width:60px;height:60px;animation:fanSpin .8s linear infinite}.rating-badge{display:inline-flex;align-items:center;gap:6px;background:var(--accent-light);color:var(--accent-dark);border-radius:100px;padding:4px 14px;font-family:var(--font-mono);font-size:.85rem;font-weight:700}.chip{display:inline-flex;align-items:center;justify-content:center;padding:6px 16px;border-radius:100px;border:1.5px solid var(--border);background:var(--bg-card);color:var(--text-muted);font-family:var(--font-body);font-size:.85rem;font-weight:700;cursor:pointer;transition:all .15s;white-space:nowrap}.chip.active{border-color:var(--accent);background:var(--accent-light);color:var(--accent-dark)}.text-muted{color:var(--text-muted);font-size:.875rem}.text-center{text-align:center}.w-full{width:100%}.mt-2{margin-top:8px}.mt-4{margin-top:16px}.mt-8{margin-top:32px}