:root{--bg: #151a33;--deep: #0e1226;--panel: #20284a;--rim: #323d6b;--shadow: #0a0d1c;--cream: #f3ead8;--muted: #a6a9c4;--verm: #e2553a;--sakura: #f2a7b8;--matcha: #9bbf6b;--gold: #e8b64c;--ai: #4a6fb5;--brick: #c8553d;--ink: #151a33;--f-ui: "VT323", "DotGothic16", ui-monospace, monospace;--f-jp: "DotGothic16", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;--f-jp-sans: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", Meiryo, system-ui, sans-serif;--frame: 0 0 0 2px var(--shadow), 0 0 0 4px var(--rim), 0 4px 0 4px var(--shadow);--frame-light: 0 0 0 2px var(--shadow), 0 0 0 4px #c9b48e, 0 4px 0 4px var(--shadow);--drop: 8px 8px 0 #0a0d1ccc;--glow: 0 0 32px #e8b64c22;--safe-b: env(safe-area-inset-bottom, 0px);--safe-t: env(safe-area-inset-top, 0px);--tabh: 64px;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;background:var(--deep)}body{color:var(--cream);font-family:var(--f-ui);font-size:21px;line-height:1.25;-webkit-font-smoothing:none;-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior-y:none}[lang=ja],.jp{font-family:var(--f-jp)}.jp-sans{font-family:var(--f-jp-sans)}h1,h2,h3{font-weight:400;margin:0 0 6px;line-height:1.05}h1{font-size:38px}h2{font-size:28px}p{margin:6px 0}b{font-weight:400;color:var(--gold)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.muted{color:var(--muted)}.small,small{font-size:17px}.gold{color:var(--gold)}.center{text-align:center}.fine{font-size:16px;margin-top:10px}.sprite{image-rendering:pixelated;display:inline-block;vertical-align:middle;flex:none}.sprite.dim{opacity:.35;filter:grayscale(1)}:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.app{max-width:480px;margin:0 auto;min-height:100vh;min-height:100dvh;background:var(--bg);position:relative}.app.with-chrome{padding-bottom:calc(var(--tabh) + var(--safe-b))}main{position:relative}.page{padding:18px 16px 28px;position:relative;z-index:2}.page-title{display:flex;align-items:center;gap:10px;margin-bottom:14px}.section-title{margin:22px 0 12px;font-size:26px;color:var(--sakura)}.center-col{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding-top:40px}.center-col .btn.wide{max-width:340px}.row{display:flex;gap:10px;align-items:center}.grow{flex:1}.panel{background:var(--panel);box-shadow:var(--frame);margin:4px;padding:14px;position:relative}.panel.light{background:var(--cream);color:var(--ink);box-shadow:var(--frame-light)}.panel.light .muted{color:#6b6378}.panel.light b{color:var(--verm)}.eyebrow{font-size:17px;color:var(--sakura);letter-spacing:.5px;text-transform:uppercase}.eyebrow.gold{color:var(--gold)}.tag{display:inline-block;font-size:15px;padding:0 8px;background:var(--ink);color:var(--cream);margin-top:6px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:4px 18px;margin:4px;border:0;cursor:pointer;background:var(--panel);color:var(--cream);font-size:24px;line-height:1;box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #171d38,inset 0 3px #3a4677,0 5px 0 2px var(--shadow);transition:transform 60ms steps(2);user-select:none;-webkit-user-select:none;touch-action:manipulation}.btn:active:not(:disabled){transform:translateY(3px);box-shadow:0 0 0 2px var(--shadow),inset 0 -2px #171d38,inset 0 2px #3a4677,0 2px 0 2px var(--shadow)}.btn:disabled{opacity:.45;cursor:default}.btn.wide{width:calc(100% - 8px)}.btn.primary{background:var(--verm);color:#fff8ee;box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #a8392a,inset 0 3px #f58b70,0 5px 0 2px var(--shadow)}.btn.ok{background:var(--matcha);color:var(--ink);box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #6f9147,inset 0 3px #c3dc98,0 5px 0 2px var(--shadow)}.btn.gold{background:var(--gold);color:var(--ink);box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #b9893f,inset 0 3px #ffe3a0,0 5px 0 2px var(--shadow)}.btn.bad{background:var(--brick);color:#fff8ee;box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #8f3a29,inset 0 3px #e48068,0 5px 0 2px var(--shadow)}.btn.danger{background:transparent;color:var(--sakura);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px #6b3a4a;margin-top:18px}.btn.ghost{background:transparent;box-shadow:0 0 0 2px var(--rim)}.btn.ghost:active:not(:disabled){box-shadow:0 0 0 2px var(--rim)}.btn.small{min-height:44px;font-size:20px;padding:2px 12px}.btn.icon{min-width:52px;padding:4px 8px}.btn small{display:block;font-size:14px;opacity:.8;font-family:var(--f-jp)}.grade-row .btn{flex-direction:column;gap:2px;flex:1}.seg{display:flex;background:var(--deep);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--rim);margin:4px 4px 16px}.seg button{flex:1;min-height:48px;border:0;background:transparent;font-size:22px;color:var(--muted);cursor:pointer}.seg button.on{background:var(--rim);color:var(--cream);box-shadow:inset 0 -3px 0 var(--gold)}.seg.small{margin:4px}.seg.small button{min-height:44px;font-size:19px;padding:0 10px}.toggles{display:flex;gap:8px;margin:4px 4px 10px}.toggles.mini{margin:0 0 0 auto}.toggle{min-height:40px;min-width:48px;padding:0 12px;border:0;background:var(--deep);color:var(--muted);font-size:18px;box-shadow:0 0 0 2px var(--rim);cursor:pointer}.toggle.on{background:var(--ai);color:var(--cream);box-shadow:0 0 0 2px #7d9be0}.switch{width:64px;height:36px;border:0;background:var(--deep);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--rim);position:relative;cursor:pointer;flex:none}.switch i{position:absolute;top:4px;left:4px;width:28px;height:28px;background:var(--muted);transition:left .1s steps(3)}.switch.on{background:#2f4a2a}.switch.on i{left:32px;background:var(--matcha)}.field{display:block;margin:12px 4px}.field>span{display:block;font-size:19px;color:var(--muted);margin-bottom:6px}input[type=text],input[type=password],select{width:100%;min-height:52px;padding:8px 12px;font:inherit;font-size:24px;background:var(--deep);color:var(--cream);border:0;border-radius:0;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--rim);-webkit-appearance:none;appearance:none}input:focus,select:focus{outline:none;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--gold)}input.pin{letter-spacing:8px;font-size:28px}input::placeholder{color:#5d6390}.form-err{color:#ffb3a3;background:#3a1f2a;padding:8px 12px;box-shadow:0 0 0 2px #6b3a4a;margin:12px 4px}.welcome{min-height:100dvh;padding:calc(16px + var(--safe-t)) 16px calc(24px + var(--safe-b));position:relative;overflow:hidden;background:linear-gradient(to bottom,#0e1226 0%,#151a33 45%,transparent 75%),radial-gradient(circle at 100% 150%,#151a33 24%,#20284a 24%,#20284a 28%,#151a33 28%,#151a33 36%,#20284a 36%,#20284a 40%,transparent 40%,transparent),radial-gradient(circle at 0 150%,#151a33 24%,#20284a 24%,#20284a 28%,#151a33 28%,#151a33 36%,#20284a 36%,#20284a 40%,transparent 40%,transparent),radial-gradient(circle at 50% 100%,#20284a 10%,#151a33 10%,#151a33 23%,#20284a 23%,#20284a 30%,#151a33 30%,#151a33 43%,#20284a 43%,#20284a 50%,#151a33 50%,#151a33 63%,#20284a 63%,#20284a 71%,transparent 71%,transparent),radial-gradient(circle at 100% 50%,#20284a 5%,#151a33 5%,#151a33 15%,#20284a 15%,#20284a 20%,#151a33 20%,#151a33 29%,#20284a 29%,#20284a 34%,#151a33 34%,#151a33 44%,#20284a 44%,#20284a 49%,transparent 49%,transparent),radial-gradient(circle at 0 50%,#20284a 5%,#151a33 5%,#151a33 15%,#20284a 15%,#20284a 20%,#151a33 20%,#151a33 29%,#20284a 29%,#20284a 34%,#151a33 34%,#151a33 44%,#20284a 44%,#20284a 49%,transparent 49%,transparent);background-size:100% 100%,80px 40px,80px 40px,80px 40px,80px 40px,80px 40px;background-color:#151a33}.welcome-hero{text-align:center;position:relative;z-index:2}.hero-scene{position:relative;height:150px;margin:6px auto 0;width:260px}.hero-fuji{position:absolute;left:50%;bottom:0;transform:translate(-50%);opacity:.9}.hero-torii{position:absolute;left:6px;bottom:0}.hero-tanuki{position:absolute;right:18px;bottom:0}.hero-scene:after{content:"";position:absolute;left:-20px;right:-20px;bottom:-4px;height:4px;background:var(--rim)}.logo{font-size:76px;margin:14px 0 0;letter-spacing:4px;color:var(--cream);text-shadow:4px 4px 0 var(--verm),8px 8px 0 var(--shadow)}.logo span{font-family:var(--f-jp);font-size:64px}.tagline{color:var(--muted);max-width:320px;margin:10px auto 18px}.welcome-card{z-index:2;padding:16px 12px;box-shadow:var(--frame),var(--drop)}.avatar-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:4px}.av-pick{aspect-ratio:1;min-height:52px;border:0;background:var(--deep);box-shadow:0 0 0 2px var(--rim);cursor:pointer;display:grid;place-items:center}.av-pick.on{background:#2b2347;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--gold),var(--glow)}.start-choices{display:grid;gap:12px;padding:4px}.choice-card{display:flex;gap:12px;align-items:center;text-align:left;min-height:64px;padding:8px 12px;border:0;background:var(--deep);box-shadow:0 0 0 2px var(--rim);cursor:pointer}.choice-card b{display:block;font-size:22px;color:var(--cream)}.choice-card small{color:var(--muted);font-family:var(--f-jp-sans);font-size:14px}.choice-card.on{background:#3a1f2a;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--verm)}.hud{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:8px;padding:calc(6px + var(--safe-t)) 10px 8px;background:var(--deep);box-shadow:0 2px 0 var(--shadow),0 4px 0 var(--rim),0 8px #0a0d1c66}.hud-av{position:relative;border:0;background:var(--panel);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--rim);width:48px;height:48px;display:grid;place-items:center;cursor:pointer;margin:2px;flex:none}.hud-av .lv{position:absolute;bottom:-8px;left:50%;transform:translate(-50%);background:var(--gold);color:var(--ink);font-size:15px;padding:0 4px;line-height:16px;box-shadow:0 0 0 2px var(--shadow);white-space:nowrap}.hud-mid{flex:1;min-width:0;padding-left:4px}.hud-tier{display:flex;align-items:center;gap:5px;font-size:19px;white-space:nowrap;overflow:hidden}.hud-xp{margin-left:auto;font-size:16px}.xpbar{height:12px;background:var(--shadow);box-shadow:0 0 0 2px var(--rim);margin-top:5px;position:relative;overflow:hidden}.xpbar-fill{height:100%;background:repeating-linear-gradient(90deg,var(--gold) 0 6px,#f6cd6c 6px 8px);transition:width .6s steps(12)}.hud-stat{display:flex;align-items:center;gap:3px;font-size:22px;min-width:44px;justify-content:center}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;z-index:20;display:flex;background:var(--deep);padding-bottom:var(--safe-b);box-shadow:0 -2px 0 var(--shadow),0 -4px 0 var(--rim)}.tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:var(--tabh);gap:2px;color:var(--muted);font-size:17px;position:relative}.tab.active{color:var(--cream);background:var(--panel);box-shadow:inset 0 4px 0 var(--verm)}.tab:not(.active) .sprite{opacity:.7}.tab-ico{position:relative}.badge-dot{position:absolute;top:-6px;right:-14px;background:var(--verm);color:#fff;font-size:14px;line-height:16px;padding:0 4px;box-shadow:0 0 0 2px var(--shadow)}.journey{position:relative}.distance{position:sticky;top:74px;z-index:6;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;margin:10px 0 -46px 12px;font-size:18px;background:#0e1226e6}.map{position:relative;width:100%;overflow:hidden}.band{position:absolute;left:0;right:0}.band:after{content:"";position:absolute;inset:0;pointer-events:none}.sc-village:after{background-image:radial-gradient(#ffffff10 1px,transparent 1.5px);background-size:28px 28px}.sc-rice:after{background:repeating-linear-gradient(0deg,transparent 0 34px,#9bbf6b14 34px 38px,transparent 38px 46px,#4a6fb51a 46px 48px)}.sc-bamboo:after{background:repeating-linear-gradient(90deg,transparent 0 46px,#9bbf6b0f 46px 52px,transparent 52px 70px,#9bbf6b0a 70px 74px)}.sc-castle:after{background:radial-gradient(circle at 20% 30%,#e8b64c14,transparent 40%),radial-gradient(circle at 80% 70%,#e2553a12,transparent 40%)}.sc-snow:after{background-image:radial-gradient(#ffffff22 1px,transparent 1.6px),radial-gradient(#ffffff14 1px,transparent 1.6px);background-size:24px 24px,37px 37px;background-position:0 0,11px 17px}.decor{position:absolute;opacity:.8;filter:drop-shadow(3px 3px 0 #0a0d1c88)}.summit{position:absolute;top:0;left:0;right:0;background:linear-gradient(to bottom,#0e1226,#2a3360 70%,#3d4c7a);background-image:radial-gradient(#fff 1px,transparent 1.5px),linear-gradient(to bottom,#0e1226,#2a3360 70%,#3d4c7a);background-size:53px 41px,100% 100%}.summit-fuji{position:absolute;left:50%;bottom:0;transform:translate(-50%);opacity:.55}.summit-shrine{position:absolute;left:50%;bottom:18px;transform:translate(-50%);filter:drop-shadow(0 0 18px #e8b64c55)}.summit-label,.village-label{position:absolute;left:50%;transform:translate(-50%);white-space:nowrap;font-size:18px;color:var(--cream);background:#0e1226cc;padding:2px 10px;box-shadow:0 0 0 2px var(--rim)}.summit-label{top:16px}.village{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to bottom,#1d3a66,#24497a);overflow:hidden}.village-label{top:18px}.sea{position:absolute;left:0;right:0;bottom:0;height:64px;background:radial-gradient(circle at 100% 150%,#2f4a86 24%,#6f8fd0 24%,#6f8fd0 28%,#2f4a86 28%,#2f4a86 36%,#6f8fd0 36%,#6f8fd0 40%,transparent 40%,transparent),radial-gradient(circle at 0 150%,#2f4a86 24%,#6f8fd0 24%,#6f8fd0 28%,#2f4a86 28%,#2f4a86 36%,#6f8fd0 36%,#6f8fd0 40%,transparent 40%,transparent),radial-gradient(circle at 50% 100%,#6f8fd0 10%,#2f4a86 10%,#2f4a86 23%,#6f8fd0 23%,#6f8fd0 30%,#2f4a86 30%,#2f4a86 43%,#6f8fd0 43%,#6f8fd0 50%,#2f4a86 50%,#2f4a86 63%,#6f8fd0 63%,#6f8fd0 71%,transparent 71%,transparent),radial-gradient(circle at 100% 50%,#6f8fd0 5%,#2f4a86 5%,#2f4a86 15%,#6f8fd0 15%,#6f8fd0 20%,#2f4a86 20%,#2f4a86 29%,#6f8fd0 29%,#6f8fd0 34%,#2f4a86 34%,#2f4a86 44%,#6f8fd0 44%,#6f8fd0 49%,transparent 49%,transparent),radial-gradient(circle at 0 50%,#6f8fd0 5%,#2f4a86 5%,#2f4a86 15%,#6f8fd0 15%,#6f8fd0 20%,#2f4a86 20%,#2f4a86 29%,#6f8fd0 29%,#6f8fd0 34%,#2f4a86 34%,#2f4a86 44%,#6f8fd0 44%,#6f8fd0 49%,transparent 49%,transparent);background-size:48px 24px;background-color:#2f4a86;box-shadow:0 -4px #cfe0f5}.v-house1{position:absolute;left:8%;bottom:74px}.v-house2{position:absolute;left:26%;bottom:72px}.v-torii{position:absolute;right:12%;bottom:72px}.v-boat{position:absolute;right:30%;bottom:22px;animation:rock 3s steps(4) infinite alternate}.road{position:absolute;top:0;left:0;pointer-events:none}.road path{fill:none;stroke-linecap:square;stroke-linejoin:miter}.road-edge{stroke:#0a0d1c;stroke-width:20px}.road-base{stroke:#6b5a48;stroke-width:12px;stroke-dasharray:10 6}.road-walked{stroke:var(--gold);stroke-width:12px;stroke-dasharray:10 6}.chapter-banner{position:absolute;left:50%;transform:translate(-50%);z-index:3;width:max-content;max-width:92%}.banner-inner{display:flex;align-items:baseline;gap:8px;padding:6px 14px;background:var(--verm);color:#fff8ee;font-size:22px;white-space:nowrap;box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #a8392a,inset 0 3px #f58b70,6px 6px 0 2px #0a0d1caa}.chapter-banner:before,.chapter-banner:after{content:"";position:absolute;top:10px;width:16px;height:26px;background:#a8392a;box-shadow:0 0 0 2px var(--shadow);z-index:-1}.chapter-banner:before{left:-14px}.chapter-banner:after{right:-14px}.banner-title{overflow:hidden;text-overflow:ellipsis}.banner-count{font-size:16px;background:#0a0d1c66;padding:0 5px}.node-wrap{position:absolute;transform:translate(-50%,-50%);z-index:4}.node{width:64px;height:64px;display:grid;place-items:center;border:0;cursor:pointer;position:relative;margin:0;background:var(--panel);box-shadow:0 0 0 2px var(--shadow),0 0 0 5px var(--rim),0 6px 0 5px var(--shadow)}.node:active{transform:translateY(3px)}.done .node{background:#2b2a3f;box-shadow:0 0 0 2px var(--shadow),0 0 0 5px var(--gold),0 6px 0 5px var(--shadow)}.open .node{background:#3a2433;box-shadow:0 0 0 2px var(--shadow),0 0 0 5px var(--verm),0 6px 0 5px var(--shadow)}.locked .node{background:#181e3a;box-shadow:0 0 0 2px var(--shadow),0 0 0 5px #262e55,0 6px 0 5px var(--shadow)}.current .node{width:74px;height:74px;animation:pulse 1.6s steps(4) infinite}.node-check,.node-lock{position:absolute;right:-10px;bottom:-10px;background:var(--deep);box-shadow:0 0 0 2px var(--shadow);padding:2px;line-height:0}.me-marker{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translate(-50%);filter:drop-shadow(0 4px 0 #0a0d1c99)}.me-marker:after{content:"";position:absolute;left:50%;bottom:-8px;transform:translate(-50%);border:6px solid transparent;border-top-color:var(--gold)}.node-label{position:absolute;top:50%;transform:translateY(-50%);width:132px;background:#0e1226d9;padding:4px 8px;box-shadow:0 0 0 2px #0a0d1c;line-height:1.05}.node-label.right{left:calc(100% + 16px)}.node-label.left{right:calc(100% + 16px);text-align:right}.nl-unit{display:block;font-size:16px;color:var(--gold)}.nl-title{display:block;font-size:19px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.locked .node-label{opacity:.6}.locked .nl-unit{color:var(--muted)}.review-fab{position:fixed;left:50%;transform:translate(-50%);bottom:calc(var(--tabh) + var(--safe-b) + 14px);z-index:15;white-space:nowrap;background:var(--ai);box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #2f4a86,inset 0 3px #7d9be0,0 5px 0 2px var(--shadow),var(--drop)}.review-fab:active:not(:disabled){transform:translate(-50%) translateY(3px)}.sheet-backdrop{position:fixed;inset:0;background:#0a0d1cb3;z-index:40;display:flex;align-items:flex-end;justify-content:center;animation:fade .12s steps(3)}.sheet-backdrop.center{align-items:center;padding:16px}.sheet{width:100%;max-width:480px;margin:0;padding:20px 16px calc(20px + var(--safe-b));animation:up .16s steps(4);box-shadow:0 -2px 0 var(--shadow),0 -6px 0 var(--rim)}.unit-sheet .us-head{display:flex;gap:14px;align-items:center}.us-sprite{background:var(--deep);box-shadow:0 0 0 2px var(--rim);padding:8px;line-height:0}.us-meta{display:flex;gap:16px;color:var(--muted);margin:12px 4px}.locked-msg{color:var(--muted);display:flex;align-items:center;gap:8px}.particles{position:fixed;inset:0;pointer-events:none;z-index:5;overflow:hidden;max-width:480px;margin:0 auto}.pt{position:absolute;top:-12px;display:block;animation:fall linear infinite}.p-sakura .pt{background:var(--sakura);box-shadow:2px 2px #fbd3dc}.p-sakura .pt.v1{background:#fbd3dc;box-shadow:-2px 2px 0 var(--sakura)}.p-leaves .pt{background:#9bbf6b;box-shadow:2px 2px #5f8a4a}.p-momiji .pt{background:#e2553a;box-shadow:2px -2px #f08a3a,-2px 2px #b5562a}.p-momiji .pt.v1{background:#e8b64c;box-shadow:2px 2px #f08a3a}.p-snow .pt{background:#f7f3ea;opacity:.85}.p-fireflies .pt{top:auto;background:#ffe08a;box-shadow:0 0 6px 2px #e8b64c99;animation-name:drift;animation-timing-function:ease-in-out}@keyframes fall{0%{transform:translateY(-2vh) rotate(0)}50%{transform:translate(var(--sway),50vh) rotate(180deg)}to{transform:translateY(104vh) rotate(360deg)}}@keyframes drift{0%,to{transform:translate(0);opacity:0}30%{opacity:1}50%{transform:translate(var(--sway),-30px);opacity:.3}70%{opacity:1}}.lesson{min-height:100dvh;position:relative;padding-bottom:var(--safe-b)}.lesson-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;padding:calc(6px + var(--safe-t)) 10px 8px;background:var(--deep);box-shadow:0 2px 0 var(--shadow),0 4px 0 var(--rim)}.lesson-top .btn.icon{min-width:48px;min-height:48px;font-size:22px}.lesson-progress{flex:1;height:16px;background:var(--shadow);box-shadow:0 0 0 2px var(--rim);position:relative;margin-top:10px}.lp-fill{height:100%;background:repeating-linear-gradient(90deg,var(--matcha) 0 8px,#b4d48a 8px 10px);transition:width .4s steps(8)}.lp-walker{position:absolute;top:-20px;transition:left .4s steps(8)}.lesson-count{font-size:18px;color:var(--muted);min-width:44px;text-align:right}.step-wrap{position:relative;z-index:6;animation:stepin .18s steps(4)}.step{padding:16px 14px 20px;display:flex;flex-direction:column;gap:12px;min-height:calc(100dvh - 80px)}.step-title h2{font-size:30px}.step-title p{margin:2px 0 0}.step-actions{margin-top:auto;padding-top:10px;display:flex;flex-direction:column;gap:6px}.step-actions.row{flex-direction:row}.start-card{align-items:center;text-align:center}.sc-sprite{background:var(--panel);box-shadow:var(--frame),var(--glow);padding:16px;margin:20px 0 10px;line-height:0}.goals{list-style:none;padding:12px 16px;text-align:left;width:calc(100% - 8px)}.goals li{margin:4px 0;display:flex;gap:8px;align-items:center}.start-card .step-actions{width:100%}.sensei{display:flex;gap:10px;align-items:flex-start}.sensei .bubble{flex:1}.sensei .bubble:before{content:"";position:absolute;left:-14px;top:24px;border:7px solid transparent;border-right-color:var(--rim)}.bubble .body{font-size:22px;line-height:1.3}.examples{display:flex;flex-direction:column;gap:10px}.example{display:flex;align-items:center;gap:8px;cursor:pointer}.ex-main{flex:1}.en{color:inherit;opacity:.85}.jpblock .jp{font-size:24px;line-height:1.3}.jp-sm .jp{font-size:20px}.jp-lg .jp{font-size:34px}.jp-xl .jp{font-size:48px}.kana-reading{font-family:var(--f-jp-sans);font-size:15px;opacity:.75;margin-top:2px}.jp-xl .kana-reading{font-size:18px}.romaji{font-size:19px;color:var(--ai)}.panel.light .romaji{color:#3d5ea0}.romaji-reveal{border:0;background:transparent;color:var(--ai);font-size:16px;padding:4px 0;min-height:32px;text-decoration:underline dotted;cursor:pointer}.playbtns{display:flex;gap:6px;justify-content:center}.btn.big-play{min-width:84px;min-height:72px}.kana-strip{display:flex;gap:6px;overflow-x:auto;padding:6px 4px 8px;scrollbar-width:none}.kchip{flex:none;min-width:44px;height:44px;border:0;background:var(--deep);box-shadow:0 0 0 2px var(--rim);color:var(--muted);font-size:20px;cursor:pointer}.kchip.seen{color:var(--cream)}.kchip.on{background:var(--verm);color:#fff;box-shadow:0 0 0 2px var(--shadow)}.kana-card{text-align:center;padding:18px 12px 22px;cursor:pointer;animation:pop .18s steps(3)}.kana-big{font-size:128px;line-height:1.05;color:var(--ink)}.kana-romaji{font-size:44px;color:var(--verm);line-height:1}.kana-hint{margin-top:10px;font-size:21px}.vcard{text-align:center;padding:22px 14px;cursor:pointer;min-height:230px;display:flex;align-items:center;justify-content:center}.vcard-inner{display:flex;flex-direction:column;align-items:center;gap:4px}.vc-en{font-size:28px}.vc-example{margin-top:10px;padding:8px 10px;background:#e6dcc6;box-shadow:0 0 0 2px #c9b48e;font-size:17px}.vc-example .jp-sans{font-size:16px}.dots{display:flex;justify-content:center;gap:6px}.dots i{width:10px;height:10px;background:var(--rim)}.dots i.past{background:var(--muted)}.dots i.on{background:var(--gold)}.flash{display:flex;flex-direction:column;gap:12px}.fcard{position:relative;height:270px;width:100%;border:0;padding:0;background:transparent;cursor:pointer;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transition:transform .36s steps(6)}.fcard.flipped{transform:rotateY(180deg)}.fface{position:absolute;inset:4px;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;backface-visibility:hidden;-webkit-backface-visibility:hidden}.fface.back{transform:rotateY(180deg)}.grade-row{display:flex;gap:4px}.prompt-jp{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:18px;cursor:pointer}.choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:4px}.choices.stack{grid-template-columns:1fr}.choice{min-height:64px;padding:8px 10px;border:0;background:var(--panel);color:var(--cream);font-size:23px;cursor:pointer;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--rim),0 5px 0 4px var(--shadow)}.choice.jpc{font-size:26px}.choice:active:not(:disabled){transform:translateY(3px)}.choice.right{background:var(--matcha);color:var(--ink);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px #c3dc98,0 5px 0 4px var(--shadow)}.choice.wrong{background:var(--brick);color:#fff}.choice.dim{opacity:.45}.choice:disabled{cursor:default}.listen-box{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px 0}.match-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.match-col{display:flex;flex-direction:column;gap:12px}.mtile{min-height:58px;border:0;padding:6px 8px;background:var(--panel);color:var(--cream);font-size:21px;cursor:pointer;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--rim),0 5px 0 4px var(--shadow);margin:4px}.mtile.jpc{font-size:24px}.mtile.sel{background:var(--ai);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px #9fb8ee,0 5px 0 4px var(--shadow);transform:translateY(-2px)}.mtile.done{background:#2f4a2a;color:var(--matcha);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--matcha);opacity:.8}.mtile.wrong{background:var(--brick)}.build-answer{min-height:84px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px;background:var(--deep)}.build-answer:after{content:"";position:absolute;left:12px;right:12px;bottom:10px;height:2px;background:var(--rim)}.tile-bank{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:6px}.tile{min-height:52px;min-width:52px;padding:4px 12px;border:0;background:var(--cream);color:var(--ink);font-size:24px;cursor:pointer;box-shadow:0 0 0 2px var(--shadow),0 4px 0 2px #8c7c62;margin:2px}.tile:active:not(:disabled){transform:translateY(3px);box-shadow:0 0 0 2px var(--shadow),0 1px 0 2px #8c7c62}.tile.used{visibility:hidden}.tile.placed{background:#fff8ee}.kana-input input{font-family:var(--f-jp);font-size:30px;text-align:center;min-height:64px}.kana-preview{text-align:center;color:var(--muted);min-height:22px;font-size:18px;margin-top:8px}.hint{font-size:20px}.feedback{position:fixed;z-index:30;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;padding:14px 14px calc(14px + var(--safe-b));animation:up .16s steps(4)}.feedback.ok{background:#2c3d22;box-shadow:0 -4px 0 var(--matcha),0 -6px 0 var(--shadow)}.feedback.bad{background:#3a2226;box-shadow:0 -4px 0 var(--brick),0 -6px 0 var(--shadow)}.fb-row{display:flex;gap:12px;align-items:center;margin-bottom:10px}.fb-title{font-size:30px}.feedback.ok .fb-title{color:var(--matcha)}.feedback.bad .fb-title{color:#ffb3a3}.fb-answer{font-size:22px}.fb-answer [lang=ja]{font-size:24px;color:var(--gold)}.fb-explain{font-size:18px;color:var(--muted)}.flash-ok{position:fixed;inset:0;z-index:25;pointer-events:none;background:var(--matcha);animation:flashok .42s steps(4) forwards}.chat{display:flex;flex-direction:column;gap:12px;padding:4px 2px}.msg{display:flex;gap:8px;align-items:flex-end;cursor:pointer}.msg.right{flex-direction:row-reverse}.msg-who{display:flex;flex-direction:column;align-items:center;font-size:14px;color:var(--muted);max-width:64px;text-align:center}.msg-bubble{max-width:78%;padding:10px 12px;margin:4px}.msg-bubble .jp{font-size:22px}.msg.playing .msg-bubble{box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--gold),0 4px 0 4px var(--shadow),var(--glow)}.msg-bubble.you{background:var(--ai)}.msg-bubble.skipped{background:var(--deep)}.score-chip{display:inline-block;margin-top:4px;font-size:16px;padding:0 6px;color:var(--ink);background:var(--gold)}.score-chip.ok{background:var(--matcha)}.rp-partner{display:flex;gap:10px;align-items:center}.rp-start p{margin:0 0 12px}.rp-you{display:flex;flex-direction:column;gap:8px;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--verm),0 4px 0 4px var(--shadow)}.rp-prompt{font-size:24px}.rp-hint{background:var(--deep);padding:8px 10px;box-shadow:0 0 0 2px var(--rim);cursor:pointer}.rp-hint .jp{font-size:22px;color:var(--gold)}.recorder{display:flex;flex-direction:column;align-items:center;gap:8px;padding:6px 0}.rec-btn{min-height:72px;min-width:220px;font-size:28px;background:var(--verm);color:#fff8ee;box-shadow:0 0 0 2px var(--shadow),inset 0 -4px #a8392a,inset 0 3px #f58b70,0 5px 0 2px var(--shadow)}.rec-btn.recording{background:var(--brick);animation:pulse 1s steps(3) infinite}.rec-dot{width:14px;height:14px;background:#fff;animation:blink 1s steps(2) infinite}.meter{display:flex;gap:4px;height:26px;align-items:flex-end}.meter i{width:14px;height:26px;background:var(--deep);box-shadow:0 0 0 2px var(--rim)}.meter i.on{background:var(--matcha)}.meter i.on:nth-child(n+8){background:var(--gold)}.meter i.on:nth-child(n+11){background:var(--verm)}.rec-err{color:#ffcfc4;text-align:center;margin:0 4px}.typed-fallback{width:100%;display:flex;flex-direction:column;gap:8px}.typed-score{display:flex;gap:12px;align-items:center}.speech-result{width:100%;display:flex;flex-direction:column;gap:10px;align-items:stretch}.sr-top{display:flex;gap:14px;align-items:center}.sr-bars{flex:1;display:flex;flex-direction:column;gap:4px}.sr-verdict{font-size:26px;font-family:var(--f-ui)}.v-great{color:var(--matcha)}.v-good{color:var(--gold)}.v-close{color:var(--sakura)}.v-retry{color:#ffb3a3}.sr-bar{display:grid;grid-template-columns:80px 1fr 34px;gap:6px;align-items:center;font-size:17px}.sr-bar b{color:var(--cream);text-align:right}.pbar{height:10px;background:var(--shadow);box-shadow:0 0 0 2px var(--rim)}.pbar-fill{height:100%;background:var(--gold)}.diff{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;padding:10px 6px;background:var(--deep);box-shadow:0 0 0 2px var(--rim)}.dc{position:relative;font-size:28px;min-width:32px;padding:14px 2px 2px;text-align:center}.dc.ok{color:var(--matcha)}.dc.bad{color:#fff;background:var(--brick)}.dc.bad small{position:absolute;top:0;left:0;right:0;font-size:13px;line-height:14px;color:#ffe0d8}.dc.miss{color:#6b6f8a;box-shadow:inset 0 -3px #6b6f8a}.heard,.heard [lang=ja]{font-size:20px}.kw-miss{color:var(--sakura);font-size:19px}.sr-feedback{color:var(--cream);margin:0}.speech-result .btn{align-self:center}.speech-result.compact .diff .dc{font-size:22px;min-width:26px}.score-ring{position:relative;display:inline-grid;place-items:center;flex:none}.score-ring svg{position:absolute;inset:0}.score-num{font-size:40px;position:relative;text-shadow:3px 3px 0 var(--shadow)}.speak-card{text-align:center;padding:18px 12px;cursor:pointer}.finish{align-items:center;text-align:center}.finish h1{font-size:32px}.finish-scene{display:flex;align-items:flex-end;gap:24px;margin-top:16px}.finish-stats{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.stat{display:flex;flex-direction:column;align-items:center;min-width:92px;padding:10px}.stat b{font-size:28px;color:var(--cream)}.stat span{font-size:16px;color:var(--muted)}.xp-gain{display:flex;align-items:center;gap:10px;font-size:38px;color:var(--gold);padding:10px 24px;box-shadow:var(--frame),var(--glow)}.finish .step-actions{width:100%}.achv-pop{width:100%;max-width:360px;text-align:center;padding:22px 18px;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 0 0 2px var(--shadow),0 0 0 5px var(--gold),0 6px 0 5px var(--shadow),0 0 60px #e8b64c44;overflow:hidden}.achv-burst{position:absolute;inset:-40%;background:repeating-conic-gradient(#e8b64c14 0 10deg,transparent 10deg 20deg);animation:spin 12s linear infinite;z-index:0}.achv-pop>*{position:relative;z-index:1}.achv-sprite{background:var(--deep);padding:14px;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--gold);line-height:0}.xp-chip{display:inline-flex;align-items:center;gap:6px;color:var(--gold);font-size:24px}.lb-list{display:flex;flex-direction:column;gap:10px}.lb-row{display:flex;align-items:center;gap:10px;padding:8px 10px;min-height:60px}.lb-row.me{background:#2b2347;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--gold),0 4px 0 4px var(--shadow)}.lb-rank{width:30px;text-align:center;font-size:24px;color:var(--muted)}.lb-name{flex:1;min-width:0;display:flex;flex-direction:column}.lb-name b{color:var(--cream);font-size:22px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-name small{color:var(--muted);display:flex;align-items:center;gap:4px;font-size:16px}.you-tag{font-size:14px;background:var(--gold);color:var(--ink);padding:0 4px;margin-left:6px;vertical-align:middle}.lb-streak{display:flex;align-items:center;gap:2px;font-size:19px;min-width:40px}.lb-xp{text-align:right;font-size:22px;color:var(--gold);min-width:64px}.lb-xp small{font-size:14px;margin-left:2px;color:var(--muted)}.lb-gap{text-align:center;color:var(--muted)}.medal-2{filter:grayscale(1) brightness(1.3)}.medal-3{filter:sepia(1) hue-rotate(-20deg) saturate(1.5) brightness(.85)}.badge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 10px}.badge{display:flex;flex-direction:column;align-items:center;gap:6px;border:0;background:transparent;cursor:pointer;padding:4px}.badge-frame{width:72px;height:72px;display:grid;place-items:center;background:var(--panel);box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--rim),0 5px 0 4px var(--shadow);margin:4px}.badge.earned .badge-frame,.badge-frame.earned{background:#2b2347;box-shadow:0 0 0 2px var(--shadow),0 0 0 4px var(--gold),0 5px 0 4px var(--shadow),var(--glow)}.badge.locked .badge-frame{background:#262e55}.badge-name{font-size:16px;text-align:center;line-height:1.05;color:var(--cream)}.badge.locked .badge-name{color:var(--muted)}.badge-frame.big{width:120px;height:120px}.badge-sheet{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}.prof-head{display:flex;gap:16px;align-items:center}.prof-av{background:var(--deep);padding:8px;box-shadow:0 0 0 2px var(--rim);line-height:0}.prof-tier{display:flex;align-items:center;gap:6px;color:var(--gold)}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.stat-grid .stat{min-width:0;gap:2px}.stat-grid .stat span{text-align:center;line-height:1}.settings{display:flex;flex-direction:column;gap:10px}.set-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.set-row.col{flex-direction:column;align-items:stretch}.set-row small{display:block;color:var(--muted);font-size:16px}.set-row b{color:var(--cream)}.rate{display:flex;flex-direction:column;gap:4px;font-size:18px;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--gold);min-height:32px}.loading{display:flex;flex-direction:column;align-items:center;gap:10px;padding:80px 0}.errorbox{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}.toast{position:fixed;z-index:50;left:50%;transform:translate(-50%);bottom:calc(var(--tabh) + var(--safe-b) + 70px);padding:10px 16px}.center-col h1{margin-top:8px}.bob{animation:bob 1.4s steps(2) infinite}.hop{animation:hop .9s steps(3) infinite}.hop-once{animation:hop .5s steps(3) 1}.sway{animation:sway 2.4s steps(4) infinite alternate;transform-origin:top center}.pop-in{animation:pop .3s steps(4)}.slide-in{animation:stepin .18s steps(3)}.spin-y{animation:spiny 1s steps(6) 2}.shake{animation:shake .36s steps(6)}@keyframes bob{50%{transform:translateY(-3px)}}@keyframes hop{0%,to{transform:translateY(0)}40%{transform:translateY(-8px)}}@keyframes sway{0%{transform:rotate(-6deg)}to{transform:rotate(6deg)}}@keyframes rock{0%{transform:rotate(-3deg) translateY(0)}to{transform:rotate(3deg) translateY(-2px)}}@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}@keyframes stepin{0%{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes pulse{50%{filter:brightness(1.25)}}@keyframes blink{50%{opacity:.2}}@keyframes fade{0%{opacity:0}}@keyframes up{0%{transform:translate(var(--tx, 0),40px);opacity:0}}.feedback{--tx: -50%}@keyframes flashok{0%{opacity:.32}to{opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes spiny{50%{transform:scaleX(.1)}}@media(prefers-reduced-motion:reduce){.particles{display:none}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}@media(min-width:520px){html,body{background:#0a0d1c}body{background-image:radial-gradient(#ffffff08 1px,transparent 1.5px);background-size:24px 24px}.app{box-shadow:0 0 0 4px var(--shadow),0 0 0 8px var(--rim)}}
