:root{--paper:#f5f7fa;--grid:#e2e8f0;--grid-strong:#cfd9e5;--ink:#1e2940;--ink-2:#56627a;--ink-3:#8a94a8;--pencil:#3565d8;--pencil-deep:#2448a8;--pencil-tint:#e7eefc;--redpen:#e0453a;--margin-line:#f2a7a1;--marker:#ffe066;--marker-tint:#fff6cc;--ok:#16915f;--ok-tint:#ddf3e8;--orange:#c9650f;--orange-tint:#fdefdf;--card:#fff;--danger:#c43d33;--shadow:0 1px 0 #1e29400f, 0 8px 24px -12px #1e29402e;--kid-font:"Hiragino Maru Gothic ProN", "Hiragino Maru Gothic Pro", "BIZ UDPGothic", "Yu Gothic", system-ui, sans-serif;--num-font:"Hiragino Maru Gothic ProN", "Avenir Next Rounded", "Arial Rounded MT Bold", system-ui, sans-serif;--parent-font:"Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--paper);color:var(--ink);font-family:var(--kid-font);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,input:focus-visible{outline:3px solid var(--pencil);outline-offset:3px}button:disabled{cursor:default}.kid{word-break:keep-all;overflow-wrap:anywhere;line-break:strict;min-height:100dvh;padding:max(14px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));background-color:var(--paper);background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-position:-1px -1px;background-size:28px 28px}.btn-start,.btn-next{background:var(--pencil);color:#fff;box-shadow:0 6px 0 var(--pencil-deep);border:none;border-radius:20px;justify-content:center;align-items:center;gap:12px;padding:20px 44px;font-size:30px;font-weight:800;transition:transform 80ms,box-shadow 80ms;display:inline-flex}.btn-start:active:not(:disabled),.btn-next:active{box-shadow:0 2px 0 var(--pencil-deep);transform:translateY(4px)}.btn-start:disabled{background:var(--grid-strong);box-shadow:0 6px 0 var(--ink-3);color:var(--ink-2)}.home{grid-template-columns:minmax(0,1fr) minmax(380px,500px);align-content:center;align-items:center;gap:28px 40px;max-width:1200px;margin:0 auto;display:grid;position:relative}@media (orientation:portrait),(width<=860px){.home{grid-template-columns:minmax(0,1fr);justify-items:center;gap:22px;padding-top:64px}.home-main{width:min(560px,100%)}}.home-teacher{flex-direction:column;align-items:center;gap:16px;display:flex}.teacher-button{background:0 0;border:none;flex-direction:column;align-items:center;gap:6px;padding:0;display:flex}.teacher-button:active .teacher{transform:scale(.96)}.teacher-button .teacher{width:clamp(150px,18vw,210px);height:auto;transition:transform .12s}.teacher-tag{color:var(--ink-2);background:var(--card);border:2px solid var(--grid-strong);border-radius:999px;padding:3px 14px;font-size:15px;font-weight:800}.home-bubble{background:var(--card);border:3px solid var(--ink);text-align:center;text-wrap:balance;border-radius:24px;max-width:480px;margin:0;padding:14px 26px;font-size:clamp(21px,1.4vw + 10px,27px);font-weight:800;position:relative}.home-bubble:before{content:"";background:var(--card);border-left:3px solid var(--ink);border-top:3px solid var(--ink);width:20px;height:20px;position:absolute;top:-13px;left:calc(50% - 10px);transform:rotate(45deg)}.home-main{flex-direction:column;gap:16px;width:100%;display:flex}.home-card{background:var(--card);box-shadow:var(--shadow);border-radius:28px;flex-direction:column;gap:18px;width:100%;padding:24px 28px 28px 48px;display:flex;position:relative;overflow:hidden}.home-card:before,.page:before{content:"";background:var(--margin-line);width:2px;position:absolute;top:0;bottom:0;left:26px}.menu{flex-direction:column;align-items:flex-start;gap:4px;display:flex}.menu small{color:var(--ink-2);font-size:15px;font-weight:800}.menu b{background:linear-gradient(transparent 62%, var(--marker) 62%);align-items:center;gap:10px;padding:0 4px;font-size:clamp(24px,2.4vw + 6px,30px);font-weight:900;line-height:1.35;display:inline-flex}.menu b em{color:var(--pencil-deep);background:var(--pencil-tint);border-radius:999px;padding:2px 10px;font-size:14px;font-style:normal;font-weight:800}.menu b.closed{color:var(--ink-3);background:0 0}.home .btn-start{width:100%}.home-tiles{grid-template-columns:1fr 1fr;gap:14px;display:grid}.tile{background:var(--card);box-shadow:var(--shadow);text-align:left;border:none;border-radius:22px;grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;column-gap:12px;min-height:88px;padding:14px 12px 12px;display:grid}.tile:active{transform:translateY(2px)}.tile-art{grid-row:1/3;align-items:center;min-width:64px;display:flex}.tile b{white-space:nowrap;text-overflow:ellipsis;font-size:clamp(16px,.9vw + 7px,19px);font-weight:900;overflow:hidden}.tile small{color:var(--ink-2);font-size:14px;font-weight:800}.map-art{grid-template-columns:repeat(3,16px);gap:4px;display:grid}.map-art i{border:2px dashed var(--grid-strong);border-radius:50%;width:16px;height:16px}.map-art i.on{border:3px solid var(--redpen)}.parent-link{border:2px solid var(--grid-strong);color:var(--ink-2);z-index:1;background:#ffffffd9;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:700;position:absolute;top:0;right:0}.subpage{flex-direction:column;gap:18px;max-width:1100px;margin:0 auto;display:flex}.sub-head{grid-template-columns:auto 1fr auto;align-items:center;gap:14px;display:grid}.sub-head h1{text-align:center;margin:0;font-size:clamp(26px,2vw + 14px,34px);font-weight:900}.back{background:var(--card);border:2px solid var(--grid-strong);color:var(--ink-2);border-radius:999px;align-items:center;gap:6px;min-height:48px;padding:8px 16px 8px 10px;font-size:16px;font-weight:800;display:inline-flex}.flip{display:inline-grid;transform:scaleX(-1)}.count-badge{font-family:var(--num-font);background:var(--marker);border-radius:999px;padding:4px 14px;font-size:18px;font-weight:800}.empty{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:40px 0;display:flex}.empty p{max-width:26em;margin:0;font-size:22px;font-weight:800}.week-card{background:var(--card);box-shadow:var(--shadow);border-radius:22px;flex-wrap:wrap;align-items:center;gap:18px;padding:14px 20px;display:flex}.week-title{margin:0;font-size:20px;font-weight:900}.sticker-row{flex-wrap:wrap;gap:4px;display:flex}.sticker-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;margin:0;padding:4px;list-style:none;display:grid}.sticker-grid li{background:var(--card);box-shadow:var(--shadow);text-align:center;border-radius:20px;flex-direction:column;align-items:center;gap:4px;padding:14px 12px 12px;display:flex}.sticker-grid b{font-size:17px;font-weight:900}.sticker-grid span{color:var(--ink-2);font-size:15px;font-weight:700;line-height:1.45}.sticker-grid small{color:var(--ink-3);font-size:13px;font-weight:700}.map-legend{color:var(--ink-2);flex-wrap:wrap;justify-content:center;gap:8px 22px;font-size:16px;font-weight:800;display:flex}.map-legend span{align-items:center;gap:8px;display:inline-flex}.badge{border-radius:50%;flex:none;width:30px;height:30px;display:inline-block}.badge.none{border:3px dashed var(--grid-strong)}.badge.practice{border:3px solid var(--pencil);background:linear-gradient(90deg, var(--pencil-tint) 50%, #fff 50%)}.badge.can{background:var(--pencil);border:3px solid var(--pencil-deep)}.badge.master{border:5px solid var(--redpen);background:#fff;border-radius:48% 52% 50% 46%;rotate:-8deg}.map-groups{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));align-items:start;gap:16px;display:grid}.map-group{background:var(--card);box-shadow:var(--shadow);border-radius:22px;padding:16px 18px}.map-group h2{align-items:center;gap:8px;margin:0 0 10px;font-size:19px;font-weight:900;display:flex}.map-group h2 em{background:var(--pencil-tint);color:var(--pencil-deep);border-radius:999px;padding:2px 10px;font-size:13px;font-style:normal;font-weight:800}.map-group.japanese h2 em{color:#b4284a;background:#fde8ec}.map-group ul{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.map-group li{grid-template-columns:30px 1fr auto;align-items:center;gap:10px;font-size:18px;font-weight:800;display:grid}.map-group li small{color:var(--ink-3);font-size:13px}.map-group li.none span{color:var(--ink-3)}.look-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.look-card{background:var(--card);box-shadow:var(--shadow);border:4px solid #0000;border-radius:26px;flex-direction:column;align-items:center;gap:8px;padding:18px 10px 14px;display:flex}.look-card .teacher{width:min(150px,100%);height:auto}.look-card b{font-size:24px;font-weight:900}.look-card.on{border-color:var(--pencil);background:var(--pencil-tint)}.look-note{text-align:center;color:var(--ink-2);margin:0;font-size:20px;font-weight:800}.look-save{align-self:center}.new-stickers{flex-direction:column;gap:8px;display:flex}.new-title{color:var(--redpen);margin:0;font-size:18px;font-weight:900}.new-stickers ul{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.new-stickers li{align-items:center;gap:14px;animation:.5s cubic-bezier(.2,1.4,.4,1) both stick;display:flex}.new-stickers li b{font-size:18px;font-weight:900;display:block}.new-stickers li span{color:var(--ink-2);font-size:18px;font-weight:700}@keyframes stick{0%{opacity:0;transform:scale(.4)rotate(-20deg)}}.week{grid-template-columns:repeat(7,1fr);gap:6px;margin:0;padding:0;list-style:none;display:grid}.week li{flex-direction:column;align-items:center;gap:4px;display:flex}.week small{color:var(--ink-3);font-size:13px;font-weight:700}.week li.today small{color:var(--ink)}.stamp{border:2px dashed var(--grid-strong);border-radius:50%;width:40px;height:40px}.week li.today .stamp{border-color:var(--ink-3)}.week li.done .stamp{border:4px solid var(--redpen);border-radius:48% 52% 50% 46%;transform:rotate(-8deg)scale(1.02)}.lesson{flex-direction:column;gap:12px;height:100dvh;display:flex}.topbar{align-items:center;gap:16px;min-height:48px;display:flex}.quit{background:var(--card);border:2px solid var(--grid-strong);color:var(--ink-2);border-radius:999px;flex:none;align-items:center;gap:6px;padding:8px 14px 8px 12px;font-size:15px;font-weight:700;display:inline-flex}.progress-wrap{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.phase-chip{background:var(--pencil-tint);color:var(--pencil-deep);border-radius:999px;flex:none;padding:6px 12px;font-size:15px;font-weight:800}.phase-chip.warmup,.phase-chip.finale{background:var(--ok-tint);color:var(--ok)}.phase-chip.review{background:var(--orange-tint);color:var(--orange)}.phase-chip.choice{background:var(--marker-tint);color:#8a6a00}.progress{flex:1;gap:5px;min-width:0;display:flex}.progress span{background:var(--card);border:2px solid var(--grid-strong);border-radius:6px;flex:1;height:12px}.progress span.done{background:var(--pencil);border-color:var(--pencil)}.progress span.now{background:var(--marker);border-color:#d9b400}.count{font-family:var(--num-font);font-variant-numeric:tabular-nums;flex:none;font-size:22px;font-weight:800}.count small{color:var(--ink-3);font-size:15px}.lesson-grid{flex:1;grid-template:"talk talk""board panel"minmax(0,1fr)/minmax(0,1fr) clamp(300px,32vw,380px);gap:12px 18px;min-height:0;display:grid}.lesson-grid.wide{grid-template-columns:minmax(0,1fr);grid-template-areas:"talk""board"}@media (orientation:portrait),(width<=860px){.lesson{height:auto;min-height:100dvh}.lesson-grid{grid-template:"talk""board""panel"/minmax(0,1fr);align-content:start}.lesson-grid .page{min-height:300px}}.talk{grid-area:talk;align-items:flex-start;gap:12px;display:flex}.board{flex-direction:column;grid-area:board;min-height:0;display:flex}.panel{flex-direction:column;grid-area:panel;justify-content:flex-end;gap:12px;display:flex}.teacher{flex:none}.bubble{background:var(--card);border:3px solid var(--ink);border-radius:22px;flex-direction:column;flex:1;justify-content:center;gap:10px;min-height:92px;padding:14px 58px 14px 20px;display:flex;position:relative}.bubble:before{content:"";background:var(--card);border-left:3px solid var(--ink);border-bottom:3px solid var(--ink);width:20px;height:20px;position:absolute;top:30px;left:-13px;transform:rotate(45deg)}.bubble>p{text-wrap:pretty;margin:0;font-size:clamp(19px,1.2vw + 10px,24px);font-weight:800;line-height:1.55}.bubble>p:empty{display:none}.replay{background:var(--pencil-tint);width:48px;height:48px;color:var(--pencil);border:none;border-radius:50%;place-items:center;display:grid;position:absolute;top:50%;right:10px;translate:0 -50%}.hint{flex-direction:column;gap:6px;display:flex}.hint-chip{color:#8a6a00;background:var(--marker-tint);border-radius:999px;align-self:flex-start;align-items:center;gap:4px;padding:3px 10px 3px 7px;font-size:14px;font-weight:800;display:inline-flex}.hint p{margin:0;font-size:clamp(19px,1.2vw + 10px,24px);font-weight:800;line-height:1.6}.hint mark{color:inherit;background:linear-gradient(transparent 58%, var(--marker) 58%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 2px}.cards{gap:16px;margin-top:4px;display:grid}.cards.three{grid-template-columns:repeat(3,1fr)}.cards.two,.cards.four{grid-template-columns:repeat(2,1fr)}.card{background:var(--card);border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink);border-radius:22px;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:120px;padding:26px 16px;transition:transform 80ms,box-shadow 80ms;display:flex}.card:active{box-shadow:0 2px 0 var(--ink);transform:translateY(4px)}.card b{text-align:center;text-wrap:balance;font-size:28px;font-weight:900}.card small{color:var(--ink-2);align-items:center;gap:4px;font-size:16px;font-weight:700;display:inline-flex}.card.pick{min-height:190px}.card.challenge{background:var(--marker-tint)}.card.challenge small{color:#8a6a00}.card.think b{font-size:24px}.page{background:repeating-linear-gradient(transparent 0 43px, var(--grid) 43px 44px), var(--card);min-height:260px;box-shadow:var(--shadow);font-family:var(--num-font);font-variant-numeric:tabular-nums;border-radius:24px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:18px;padding:22px 24px 22px 52px;animation:.22s ease-out page-in;display:flex;position:relative;overflow:hidden;container-type:inline-size}@keyframes page-in{0%{transform:translateY(8px)}}.page:before{left:34px}.page-body{justify-content:center;width:100%;display:flex}.badge-nohint,.badge-reveal{font-family:var(--kid-font);border-radius:8px;padding:5px 12px;font-size:16px;font-weight:900;position:absolute;top:16px;right:18px;transform:rotate(4deg)}.badge-nohint{color:var(--redpen);border:3px solid var(--redpen)}.badge-reveal{color:var(--orange);border:3px solid var(--orange)}.eq{flex-wrap:wrap;justify-content:center;align-items:center;gap:.1em .2em;font-size:clamp(44px,12cqi,84px);font-weight:800;line-height:1.1;display:flex}.eq .op{color:var(--ink-3);font-weight:700}.eq small{color:var(--ink-2);margin-left:-.12em;font-size:.45em;font-weight:800}.eq.length{font-size:clamp(38px,8.5cqi,64px)}.answer{border-bottom:6px solid var(--pencil);min-width:1.9em;color:var(--pencil);justify-content:center;padding:0 .18em;display:inline-flex;position:relative}.answer.revealed{color:var(--orange);border-color:var(--orange)}.answer.correct{color:var(--pencil);border-color:#0000}.red-circle{pointer-events:none;width:160%;height:144%;position:absolute;inset:-22% -30%;overflow:visible}.red-circle path{fill:none;stroke:var(--redpen);stroke-width:7px;stroke-linecap:round;stroke-dasharray:480;stroke-dashoffset:0;animation:.45s ease-out draw}@keyframes draw{0%{stroke-dashoffset:480px}to{stroke-dashoffset:0}}.hissan{--u:clamp(46px, 11cqi, 74px);font-size:var(--u);gap:2px;font-weight:800;display:grid}.h-row{grid-template-columns:repeat(4, calc(var(--u) * 1.08));place-items:center;display:grid;position:relative}.h-row.marks{font-size:calc(var(--u) * .36);height:calc(var(--u) * .5)}.h-row.marks em{color:var(--orange);font-style:normal;font-weight:900}.h-row .op{color:var(--ink-3)}.cell{width:calc(var(--u) * .98);text-align:center;border-radius:12px;line-height:1.12}.h-row.marks .cell{width:auto}.cell.hot{background:var(--marker)}.cell s{text-decoration-thickness:5px;-webkit-text-decoration-color:var(--orange);text-decoration-color:var(--orange)}.h-rule{background:var(--ink);height:6px;margin:4px 0 6px calc(var(--u) * .5);border-radius:3px}.h-row.result .cell{color:var(--pencil);min-height:1.12em}.h-row.result.answering .cell{border:3px dashed var(--grid-strong);border-radius:12px;min-height:1.15em}.h-row.result.revealed .cell{color:var(--orange)}.h-row.result .red-circle{width:80%;height:136%;inset:-18% -2% -18% 30%}.story{width:100%;max-width:640px;font-family:var(--kid-font);flex-direction:column;gap:20px;display:flex}.story-text{text-wrap:pretty;margin:0;font-size:clamp(22px,4.6cqi,31px);font-weight:800;line-height:1.75}.story-text b{font-family:var(--num-font);color:var(--pencil-deep);padding:0 2px;font-size:1.3em}.story-eq{font-family:var(--num-font);flex-wrap:wrap;align-items:center;gap:14px;font-size:clamp(36px,8cqi,54px);font-weight:800;display:flex}.story-eq .label{font-family:var(--kid-font);color:var(--ink-2);border:2px solid var(--grid-strong);border-radius:8px;padding:2px 10px;font-size:20px;font-weight:800}.story-eq .expr.blank{color:var(--grid-strong)}.story-eq small{font-family:var(--kid-font);color:var(--ink-2);font-size:28px}.clock-wrap{flex-wrap:wrap;justify-content:center;align-items:center;gap:28px;display:flex}.clock-side{flex-direction:column;align-items:flex-start;gap:14px;display:flex}.clock-q{font-family:var(--kid-font);margin:0;font-size:clamp(20px,4cqi,26px);font-weight:800}.clock-q b{color:var(--pencil-deep)}.eq.time{font-size:clamp(40px,9cqi,64px)}.clock{width:clamp(200px,40cqi,290px);height:auto}.answer.now{background:var(--pencil-tint);border-radius:10px 10px 0 0}.answer.correct-step{border-color:#0000}.eq.fraction{font-size:clamp(42px,10cqi,66px)}.eq.fraction small{margin-left:0;font-size:30px}.frac{flex-direction:column;align-items:center;gap:4px;font-size:44px;line-height:1;display:inline-flex}.frac-bar{background:var(--ink);border-radius:2px;width:1.1em;height:4px}.frac-groups{flex-direction:column;align-items:center;gap:10px;display:flex}.frac-groups .dot-group{flex-wrap:wrap;justify-content:center;max-width:420px}.plates{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.plate{border:3px solid var(--grid-strong);border-radius:999px;flex-wrap:wrap;place-content:center;gap:4px;width:78px;min-height:44px;padding:8px;display:flex}.plate.one{border-color:var(--orange);background:var(--orange-tint)}.place-wrap{flex-direction:column;align-items:center;gap:16px;width:100%;display:flex}.place{width:100%;max-width:620px;font-family:var(--kid-font);grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.place-col{border-radius:12px;flex-direction:column;align-items:center;gap:6px;padding:6px;display:flex}.place.table .place-col{background:var(--pencil-tint)}.place.table .place-col:nth-child(2n){background:var(--marker-tint)}.place-head{color:var(--ink-2);font-size:15px;font-weight:800}.place-count{font-family:var(--num-font);font-size:22px;font-weight:800}.place-blocks{flex-wrap:wrap;place-content:flex-end center;gap:4px;width:100%;min-height:clamp(80px,16cqi,120px);display:flex}.place-blocks span{background:var(--pencil);border-radius:2px}.b1000 span{aspect-ratio:1;width:clamp(28px,6cqi,40px);box-shadow:inset 0 0 0 3px #fff, inset 0 0 0 6px var(--pencil)}.b100 span{aspect-ratio:1;opacity:.85;width:clamp(22px,4.6cqi,30px)}.b10 span{width:8px;height:clamp(30px,6cqi,42px)}.b1 span{border-radius:3px;width:11px;height:11px}.place-head{font-size:clamp(13px,2.6cqi,16px)}.answer.wide{min-width:3.4em}.shape-q{font-family:var(--kid-font);text-align:center;margin:0;font-size:clamp(28px,7cqi,44px);font-weight:900}.jp{width:100%;font-family:var(--kid-font);flex-direction:column;align-items:center;gap:16px;display:flex}.jp-sentence{text-align:center;text-wrap:balance;margin:0;font-size:clamp(28px,6.4cqi,46px);font-weight:800;line-height:2.1}.jp-sentence .target{border-bottom:5px solid var(--ink);padding:0 .08em;position:relative}.jp-sentence ruby.target{border-bottom-color:#0000}.jp-sentence ruby.target.correct{background:linear-gradient(transparent 60%, var(--marker) 60%)}.jp-sentence ruby.target.revealed{color:var(--orange)}.jp-sentence rt{color:var(--pencil-deep);font-size:.42em;font-weight:800}.jp-sentence .blank{border:3px dashed var(--pencil);vertical-align:.35em;color:var(--pencil-deep);background:var(--pencil-tint);border-radius:12px;margin:0 .1em;padding:0 .3em;font-size:.62em;line-height:1.6;display:inline-block}.jp-sentence ruby.filled{color:var(--pencil-deep)}.jp-ask{color:var(--ink-2);border:2px solid var(--grid-strong);border-radius:999px;margin:0;padding:2px 16px;font-size:clamp(18px,3.4cqi,22px);font-weight:800}.phrases .phrase{border-radius:8px;padding:0 .06em}.phrases .phrase.hit.correct{background:linear-gradient(transparent 55%, var(--marker) 55%)}.phrases .phrase.hit.revealed{color:var(--orange)}.katakana .jp-clue{color:var(--ink-2);text-align:center;margin:0;font-size:clamp(20px,4cqi,26px);font-weight:800}.jp-word{flex-wrap:wrap;justify-content:center;align-items:center;gap:.4em;margin:0;font-size:clamp(40px,10cqi,72px);font-weight:900;display:flex}.jp-word .arrow{color:var(--ink-3);font-size:.6em}.kana-to{color:var(--grid-strong);text-align:center;border-bottom:6px solid var(--pencil);min-width:2em}.kana-to.correct{color:var(--pencil);background:linear-gradient(transparent 60%, var(--marker) 60%);border-color:#0000}.kana-to.revealed{color:var(--orange);border-color:var(--orange)}.page:has(.reading){justify-content:flex-start;align-items:stretch;padding-left:28px}.page:has(.reading):before{display:none}.page:has(.reading) .page-body{flex:1;min-height:0}.reading{width:100%;min-height:0;font-family:var(--kid-font);flex-direction:column;flex:1;gap:10px;display:flex}.reading-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.listen{border:2px solid var(--pencil);background:var(--card);color:var(--pencil);border-radius:999px;align-items:center;gap:6px;min-height:44px;padding:6px 14px;font-size:16px;font-weight:800;display:inline-flex}.q-dots{gap:6px;margin:0;padding:0;list-style:none;display:flex}.q-dots li{width:32px;height:32px;font-family:var(--num-font);border:2px solid var(--grid-strong);color:var(--ink-3);background:var(--card);border-radius:50%;place-items:center;font-weight:800;display:grid}.q-dots li.done{background:var(--pencil);border-color:var(--pencil);color:#fff}.q-dots li.now{border-color:var(--pencil);color:var(--pencil)}.reading-body{writing-mode:vertical-rl;background:repeating-linear-gradient(to left, transparent 0 calc(2em - 1px), var(--grid) calc(2em - 1px) 2em) right top / auto;background-attachment:local;border-radius:12px;flex:1;min-height:300px;max-height:100%;padding:0 0 10px;font-size:clamp(20px,3.6cqi,27px);font-weight:700;line-height:2;overflow:auto hidden}.reading-body h3{color:var(--pencil-deep);margin:0 0 0 .6em;font-size:1.15em;font-weight:900}.reading-body p{text-indent:1em;margin:0}@media (orientation:portrait),(width<=860px){.reading-body{flex:none;height:46vh}}.dots{font-family:var(--kid-font);flex-direction:column;gap:5px;display:flex}.dot-row{align-items:center;gap:8px;display:flex}.dot-group{border:2px solid var(--pencil-tint);border-radius:999px;gap:4px;padding:3px 6px;display:flex}.dot{background:var(--pencil);border-radius:50%;width:13px;height:13px}.dot-row b{color:var(--ink-3);font-size:13px}.tape{width:100%;max-width:620px;height:54px;font-family:var(--kid-font);align-items:stretch;display:flex}.tape-seg{background:var(--marker-tint);border:2px solid #d9b400;border-right-width:0;flex:3;place-items:center;display:grid;position:relative}.tape-seg:first-child{border-radius:8px 0 0 8px}.tape-seg.rest{background:var(--pencil-tint);border-color:var(--pencil);border-right-width:2px;border-radius:0 8px 8px 0;flex:1.2}.tape-seg b{font-size:15px;font-weight:800;position:relative}.ticks{opacity:.5;background:repeating-linear-gradient(90deg,#0000 0 9.5%,#d9b400 9.5% 10%);position:absolute;inset:0}.step-head{align-items:flex-start;gap:10px;min-height:36px;display:flex}.step-prompt{color:var(--ink);text-wrap:pretty;font-size:clamp(21px,1.2vw + 11px,25px);font-weight:800;line-height:1.5}.step-dots{gap:4px;margin:0;padding:0;list-style:none;display:flex}.step-dots li{width:30px;height:30px;font-family:var(--num-font);background:var(--card);border:2px solid var(--grid-strong);color:var(--ink-3);border-radius:50%;place-items:center;font-size:15px;font-weight:800;display:grid}.step-dots li.done{background:var(--pencil);border-color:var(--pencil);color:#fff}.step-dots li.now{border-color:var(--pencil);color:var(--pencil)}.numpad{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.numpad button{background:var(--card);height:76px;font-family:var(--num-font);box-shadow:0 5px 0 var(--grid-strong), inset 0 0 0 2px var(--grid-strong);border:none;border-radius:18px;font-size:38px;font-weight:800;transition:transform 60ms,box-shadow 60ms}.numpad button:active:not(:disabled){box-shadow:0 2px 0 var(--grid-strong), inset 0 0 0 2px var(--grid-strong);transform:translateY(3px)}.numpad .erase{font-family:var(--kid-font);color:var(--ink-2);font-size:20px}.numpad .submit{font-family:var(--kid-font);background:var(--pencil);color:#fff;box-shadow:0 5px 0 var(--pencil-deep);font-size:21px}.numpad .submit:disabled{background:var(--grid-strong);box-shadow:0 5px 0 var(--ink-3);color:var(--ink-2)}.numpad .erase:disabled{color:var(--grid-strong)}.mode-toggle{background:var(--grid);border-radius:999px;flex:none;margin-left:auto;padding:3px;display:inline-flex}.mode-toggle button{color:var(--ink-2);background:0 0;border:none;border-radius:999px;min-height:38px;padding:6px 14px;font-size:16px;font-weight:800}.mode-toggle button.on{background:var(--card);color:var(--pencil-deep);box-shadow:0 1px 2px #1e294026}.handwrite{flex-direction:column;gap:10px;display:flex}.hw-boxes{gap:8px;display:grid}.ink-box{aspect-ratio:3/4;background:var(--card);border:3px solid var(--grid-strong);background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-position:50%;background-size:50% 50%;border-radius:16px;max-height:230px;position:relative;overflow:visible}.ink-box.has{border-color:var(--pencil)}.ink-box.unsure{border-color:#d9b400}.ink-box canvas{touch-action:none;border-radius:13px;width:100%;height:100%;position:absolute;inset:0}.ink-read{font-family:var(--num-font);color:var(--pencil-deep);background:var(--pencil-tint);pointer-events:none;border-radius:10px;padding:0 8px;font-size:26px;font-weight:800;position:absolute;bottom:2px;right:6px}.ink-clear{border:2px solid var(--grid-strong);background:var(--card);width:34px;height:34px;color:var(--ink-2);border-radius:50%;font-size:18px;font-weight:900;line-height:1;position:absolute;top:-8px;right:-8px}.ink-alt{background:var(--marker-tint);z-index:2;border:2px solid #d9b400;border-radius:999px;gap:4px;padding:3px;display:flex;position:absolute;bottom:-26px;left:50%;translate:-50%}.ink-alt button{background:var(--card);width:38px;height:38px;font-family:var(--num-font);border:none;border-radius:50%;font-size:22px;font-weight:800}.hw-actions{grid-template-columns:1fr 1.4fr;gap:10px;margin-top:12px;display:grid}.hw-actions button{border:none;border-radius:18px;min-height:64px;font-size:21px;font-weight:800}.hw-actions .erase{background:var(--card);color:var(--ink-2);box-shadow:0 5px 0 var(--grid-strong), inset 0 0 0 2px var(--grid-strong)}.hw-actions .submit{background:var(--pencil);color:#fff;box-shadow:0 5px 0 var(--pencil-deep)}.hw-actions button:disabled{background:var(--grid-strong);box-shadow:0 5px 0 var(--ink-3);color:var(--ink-2)}.choicepad{flex-direction:column;gap:12px;display:flex}.choicepad button{border:3px solid var(--ink);background:var(--card);min-height:84px;font-family:var(--num-font);box-shadow:0 5px 0 var(--ink);border-radius:18px;font-size:40px;font-weight:800}.choicepad button:active{box-shadow:0 2px 0 var(--ink);transform:translateY(3px)}.choicepad.long button{font-family:var(--kid-font);text-wrap:balance;min-height:68px;padding:8px 14px;font-size:clamp(20px,2vw + 6px,26px);font-weight:800;line-height:1.35}.choicepad.visual{grid-template-columns:repeat(2,1fr);display:grid}.choicepad.visual button{place-items:center;min-height:140px;padding:6px;display:grid;position:relative}.choicepad.visual small{color:var(--ink-3);font-size:16px;font-family:var(--num-font);position:absolute;top:6px;left:10px}.hint-btn{background:var(--marker-tint);color:#7a5d00;border:3px solid #d9b400;border-radius:16px;justify-content:center;align-items:center;gap:6px;min-height:58px;font-size:21px;font-weight:800;display:inline-flex}.hint-btn:disabled{border-color:var(--grid-strong);color:var(--ink-3);background:0 0}.after{flex-direction:column;align-items:stretch;gap:14px;margin-top:auto;display:flex}.after-label{text-align:center;margin:0;font-size:26px;font-weight:900}.after-label.correct{color:var(--redpen)}.after-label.revealed{color:var(--orange)}.btn-next{width:100%}.summary{background:var(--card);box-shadow:var(--shadow);border-radius:28px;flex-direction:column;gap:20px;width:100%;max-width:720px;margin:4px auto 0;padding:26px 30px 30px 56px;display:flex;position:relative;overflow:hidden}.summary:before{content:"";background:var(--margin-line);width:2px;position:absolute;top:0;bottom:0;left:34px}.summary-title{color:var(--ink-2);letter-spacing:.08em;margin:0;font-size:18px;font-weight:800}.summary-stats{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.summary-stats div{flex-direction:column;align-items:flex-start;display:flex}.summary-stats b{font-family:var(--num-font);color:var(--pencil);font-variant-numeric:tabular-nums;font-size:64px;font-weight:800;line-height:1}.summary-stats small{color:var(--ink-2);font-size:17px;font-weight:800}.growth{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.growth li{background:linear-gradient(transparent 60%, var(--marker) 60%);align-self:flex-start;padding:0 4px;font-size:22px;font-weight:800;line-height:1.5}.summary .btn-start{align-self:stretch}@media (height<=780px) and (orientation:landscape){.numpad button{height:62px;font-size:34px}.choicepad button{min-height:70px}.choicepad.visual button{min-height:118px}.hint-btn{min-height:50px}.card{min-height:100px;padding:18px 12px}.teacher{width:76px;height:76px}.bubble{min-height:76px}}.dialog-back{z-index:10;background:#1e294059;place-items:center;padding:24px;animation:.15s ease-out fade;display:grid;position:fixed;inset:0}@keyframes fade{0%{opacity:0}}.dialog{background:var(--card);width:min(520px,100%);box-shadow:var(--shadow);border-radius:28px;flex-direction:column;align-items:center;gap:18px;padding:28px 28px 24px;display:flex}.dialog p{text-align:center;text-wrap:balance;margin:0;font-size:26px;font-weight:900}.dialog small{color:var(--ink-2);text-align:center;font-size:17px;font-weight:700}.dialog-actions{grid-template-columns:1fr 1fr;gap:12px;width:100%;display:grid}.dialog-actions button{border:3px solid var(--ink);background:var(--card);min-height:72px;box-shadow:0 5px 0 var(--ink);border-radius:18px;font-size:22px;font-weight:800}.dialog-actions .keep{background:var(--pencil);color:#fff;border-color:var(--pencil-deep);box-shadow:0 5px 0 var(--pencil-deep)}@media (orientation:portrait),(width<=860px){.panel{grid-template-columns:minmax(0,1fr) 72px;grid-template-areas:"head head""pad hint";justify-self:center;align-items:stretch;gap:10px 12px;width:100%;max-width:580px;display:grid}.panel .step-head{grid-area:head}.panel .numpad,.panel .choicepad,.panel .handwrite{grid-area:pad}.panel .hint-btn{flex-direction:column;grid-area:hint;min-height:0;padding:12px 0;font-size:19px;line-height:1.1}.panel .hint-btn span{writing-mode:vertical-rl;letter-spacing:.15em}.panel .after{grid-column:1/-1}.numpad button{height:66px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.parent{font-family:var(--parent-font);-webkit-user-select:text;user-select:text;max-width:1080px;padding:max(20px, env(safe-area-inset-top)) 24px 56px;color:var(--ink);line-break:strict;margin:0 auto;font-size:16px;line-height:1.7}.parent h1{text-wrap:balance;letter-spacing:.02em;margin:0;font-size:24px}.parent h2{letter-spacing:.08em;color:var(--ink-2);margin:0 0 12px;font-size:14px;font-weight:700}.parent .lead{color:var(--ink-2);max-width:60ch}.parent label{color:var(--ink-2);flex-direction:column;gap:4px;margin-bottom:14px;font-size:14px;display:flex}.parent input:not([type=checkbox]):not([type=range]){font:inherit;color:var(--ink);border:2px solid var(--grid-strong);background:#fff;border-radius:12px;min-height:48px;padding:10px 12px;font-size:17px}.parent .btn{border:2px solid var(--grid-strong);background:#fff;border-radius:12px;min-height:46px;margin:4px 8px 4px 0;padding:10px 18px;font-size:15px;font-weight:700}.parent .btn.primary{background:var(--pencil);color:#fff;border-color:var(--pencil)}.parent .btn.primary:disabled{opacity:.45}.parent .btn.danger{color:var(--danger);border-color:var(--danger)}.setup{max-width:560px}.setup .btn.primary{width:100%;padding:14px;font-size:18px}.note,.muted{color:var(--ink-2)}.small{font-size:13px}.parent-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.tabs{background:var(--grid);border-radius:14px;gap:4px;width:fit-content;max-width:100%;margin:18px 0 20px;padding:4px;display:flex;overflow-x:auto}.tabs button{color:var(--ink-2);white-space:nowrap;background:0 0;border:none;border-radius:10px;min-height:42px;padding:9px 18px;font-weight:700}.tabs button.on{color:var(--ink);background:#fff;box-shadow:0 1px 2px #1e29401f}.panel-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:start;gap:16px;display:grid}.stack{flex-direction:column;gap:16px;display:flex}.box{border:1px solid var(--grid);background:#fff;border-radius:18px;padding:18px 20px}.wide{grid-column:1/-1}.note-text{max-width:70ch;margin:0;font-size:17px}.kpi-strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.kpi-strip div{border:1px solid var(--grid);background:#fff;border-radius:16px;flex-direction:column;padding:12px 16px;display:flex}.kpi-strip small{color:var(--ink-2);font-size:13px;font-weight:700}.kpi-strip b{font-variant-numeric:tabular-nums;font-size:32px;line-height:1.15}.kpi-strip b span{color:var(--ink-2);margin-left:2px;font-size:15px}@media (width<=700px){.kpi-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}.alert{background:var(--orange-tint);border-left:5px solid var(--orange);border-radius:6px;margin:12px 0 0;padding:8px 12px}.list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.list li{flex-wrap:wrap;align-items:baseline;gap:2px 10px;display:flex}.list li small{color:var(--ink-2);flex-basis:100%;font-size:13px}.list li{flex-wrap:nowrap}.list li:has(small){flex-wrap:wrap}.list .date{flex:none;min-width:3em}.list-text{flex:1;min-width:0}.date{font-variant-numeric:tabular-nums;color:var(--ink-2);font-size:14px}.chip{background:var(--pencil-tint);color:var(--pencil);white-space:nowrap;border-radius:999px;padding:1px 8px;font-size:12px;font-weight:700}.chip.confirmed{background:var(--orange-tint);color:var(--orange)}.legend{color:var(--ink-2);flex-wrap:wrap;gap:6px 18px;margin:0;font-size:14px;display:flex}.legend>span{align-items:center;gap:6px;display:inline-flex}.sym-chip{background:var(--grid);width:32px;height:32px;color:var(--ink-3);border-radius:50%;flex:none;place-items:center;font-size:17px;font-weight:700;display:inline-grid}.sym-chip[data-s=◎]{background:var(--ok-tint);color:var(--ok)}.sym-chip[data-s=○]{background:var(--pencil-tint);color:var(--pencil)}.sym-chip[data-s=△]{background:var(--orange-tint);color:var(--orange)}.skill-rows{margin:0;padding:0;list-style:none}.skill-rows li{border-bottom:1px solid var(--grid);grid-template-columns:32px minmax(0,1fr) 96px auto auto;align-items:center;gap:8px 14px;padding:10px 0;display:grid}.skill-rows li:last-child{border-bottom:none}.skill-rows li.off .skill-main,.skill-rows li.off .sym-chip,.skill-rows li.off .skill-meta{opacity:.45}.skill-main{flex-direction:column;gap:6px;min-width:0;display:flex}.skill-name{font-weight:700;line-height:1.45}.skill-meta{font-variant-numeric:tabular-nums;flex-direction:column;font-size:14px;line-height:1.35;display:flex}.skill-meta small{color:var(--ink-2);font-size:12px}@media (width<=700px){.skill-rows li{grid-template-columns:32px minmax(0,1fr) auto}.skill-meta{flex-direction:row;grid-column:2;gap:10px}}.bar{background:var(--grid);border-radius:3px;max-width:320px;height:6px;overflow:hidden}.bar span{background:var(--pencil);border-radius:3px;height:100%;display:block}.num{font-variant-numeric:tabular-nums;white-space:nowrap}.btn-mini{font:inherit;border:2px solid var(--pencil);min-height:38px;color:var(--pencil);white-space:nowrap;background:#fff;border-radius:10px;padding:6px 12px;font-size:14px;font-weight:700}.toggle{cursor:pointer;color:var(--ink-2);white-space:nowrap;align-items:center;font-size:13px;position:relative;flex-direction:row!important;gap:8px!important;margin:0!important;display:inline-flex!important}.toggle input{opacity:0;width:1px;height:1px;position:absolute}.toggle-track{background:var(--grid-strong);border-radius:999px;flex:none;width:46px;height:28px;transition:background .15s;position:relative}.toggle-track:after{content:"";background:#fff;border-radius:50%;width:22px;height:22px;transition:transform .15s;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #0003}.toggle input:checked+.toggle-track{background:var(--ok)}.toggle input:checked+.toggle-track:after{transform:translate(18px)}.toggle input:focus-visible+.toggle-track{outline:3px solid var(--pencil);outline-offset:2px}.toggle-label{min-width:4.5em}.table-wrap{overflow-x:auto}.log{border-collapse:collapse;width:100%;font-size:14px}.log th{text-align:left;color:var(--ink-2);border-bottom:2px solid var(--grid);white-space:nowrap;padding:6px 8px;font-weight:700}.log td{border-bottom:1px solid var(--grid);padding:7px 8px}.log .ng{color:var(--orange);font-weight:700}.log .okc{color:var(--ok);font-weight:700}.row{gap:12px;display:flex}.row label{flex:1}.switch{align-items:center;flex-direction:row!important;gap:8px!important}.toast{background:var(--ok-tint);color:var(--ok);border-radius:10px;margin:0;padding:10px 14px;font-weight:700}.pin{text-align:center;max-width:420px}.pin-dots{justify-content:center;gap:14px;margin:20px 0;display:flex}.pin-dots span{border:2px solid var(--ink);border-radius:50%;width:18px;height:18px}.pin-dots span.on{background:var(--ink)}.pin-pad{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.pin-pad button{border:2px solid var(--grid-strong);background:#fff;border-radius:12px;height:64px;font-size:26px}.pin-pad button.ghost{color:var(--ink-2);font-size:16px}
