@charset "UTF-8";:root{color-scheme:light;font-synthesis:none;text-rendering:optimizeLegibility}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}body{min-width:320px;min-height:100dvh;line-height:1.55;overscroll-behavior:none}button,input,summary{-webkit-tap-highlight-color:transparent}button:not(.fit-shape-block),summary,input{min-height:44px}button,summary{touch-action:manipulation}button:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:4px solid color-mix(in srgb,var(--app-secondary) 72%,#ffffff);outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:.5rem;left:.5rem;z-index:1000;transform:translateY(-150%);border-radius:.75rem;background:var(--app-heading);color:var(--app-surface);padding:.75rem 1rem;font-weight:800;text-decoration:none}.skip-link:focus{transform:translateY(0)}.app-shell{width:100%;height:100dvh;min-height:100svh}.view{padding-top:max(1rem,env(safe-area-inset-top));padding-right:max(1rem,env(safe-area-inset-right));padding-bottom:max(1rem,env(safe-area-inset-bottom));padding-left:max(1rem,env(safe-area-inset-left))}.portal-view{container-type:inline-size}.portal-sticky-header,.content-list,.portal-empty-state,.portal-storage-note{width:min(100%,68rem);margin-right:auto;margin-left:auto}.portal-sticky-header{top:calc(-1*max(1rem,env(safe-area-inset-top)));margin-top:calc(-1*max(1rem,env(safe-area-inset-top)));padding-top:max(1rem,env(safe-area-inset-top));padding-right:clamp(.25rem,1.5vw,1rem);padding-left:clamp(.25rem,1.5vw,1rem);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.portal-heading-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.portal-eyebrow{margin:0 0 .15rem;color:var(--app-primary-strong);font-size:.78rem;font-weight:900;letter-spacing:.08em}.portal-title{font-size:clamp(1.55rem,5vw,2.3rem);line-height:1.2}.portal-subtitle{margin-top:.35rem;font-size:clamp(.9rem,2.8vw,1rem);font-weight:700}.portal-content-count{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:3.5rem;min-height:3.5rem;border:2px solid color-mix(in srgb,var(--app-primary) 50%,var(--app-border));border-radius:50%;background:var(--app-surface);color:var(--app-primary-strong);box-shadow:0 5px 12px #0f172a1a;font-size:.95rem;font-weight:900}.portal-settings{margin:.5rem 0 .65rem;border:1px solid var(--app-border);border-radius:.9rem;background:color-mix(in srgb,var(--app-surface) 90%,transparent)}.portal-settings summary{display:flex;align-items:center;cursor:pointer;padding:.45rem .75rem;color:var(--app-subtext);font-size:.85rem;font-weight:800;list-style:none}.portal-settings summary::-webkit-details-marker{display:none}.portal-settings summary:before{content:"🎨";margin-right:.45rem}.portal-settings summary:after{content:"＋";margin-left:auto;font-size:1rem}.portal-settings[open] summary:after{content:"−"}.portal-theme-switch{margin:0;padding:.45rem;border-radius:0 0 .85rem .85rem}.portal-theme-btn{min-height:40px;padding:.5rem .8rem;font-size:.82rem}.portal-tools{display:grid;gap:.65rem}.portal-search-box input{min-height:48px;border-width:2px;font-size:1rem}.portal-filter-group{margin-top:0;padding:.1rem 0 .2rem;scroll-snap-type:x proximity}.portal-filter-btn{min-height:44px;padding:.55rem .9rem;scroll-snap-align:start;font-size:.9rem}.content-list{grid-template-columns:minmax(0,1fr);gap:.9rem;margin-top:1rem}.content-card{position:relative;min-height:9.5rem;border-width:2px;padding:1rem 3.2rem 1rem 1rem;overflow:hidden;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.content-card:after{content:"あそぶ →";position:absolute;right:.9rem;bottom:.85rem;color:var(--app-primary-strong);font-size:.82rem;font-weight:900}.content-card:hover,.content-card:focus-visible{border-color:color-mix(in srgb,var(--app-primary) 72%,var(--app-border));box-shadow:0 10px 22px #0f172a21}.content-card:active{transform:scale(.985)}.content-icon{width:3.2rem;height:3.2rem;flex:0 0 auto;font-size:1.75rem}.content-title{font-size:clamp(1.15rem,4vw,1.4rem);line-height:1.25}.content-description{max-width:36rem;font-size:.95rem;line-height:1.55}.content-tags{font-size:.8rem}.portal-empty-state{border:2px dashed var(--app-border);border-radius:1rem;background:var(--app-surface-soft)}.portal-empty-hint{margin-bottom:0;font-size:.85rem}.portal-storage-note{margin-top:.5rem;margin-bottom:calc(.5rem + env(safe-area-inset-bottom));color:var(--app-muted);font-size:.75rem;text-align:center}.home-content,.parent-view>*,.play-view>*{margin-right:auto;margin-left:auto}.home-content{width:min(100%,64rem)}.home-header-row{align-items:center}.link-btn,.stroke-clear-btn,.stroke-model-replay,.calendar-nav,.action-quit{min-height:44px;padding-right:.75rem;padding-left:.75rem}.mission-card{border-width:2px}.mission-start-btn{min-height:64px}.mission-delete-btn{min-height:44px}.play-view{padding-bottom:calc(1rem + env(safe-area-inset-bottom))}.play-actions{padding-bottom:.5rem}.action-primary{min-height:58px}.parent-view{padding-right:max(.75rem,env(safe-area-inset-right));padding-left:max(.75rem,env(safe-area-inset-left))}.parent-view>*{width:min(100%,58rem)}.card{border:1px solid var(--app-border)}.text-input,.count-input{min-height:48px;font-size:1rem}.calendar-day{min-height:44px}.history-action{min-height:36px}.overlay-panel{max-height:calc(100dvh - 2rem);overflow-y:auto}body[data-theme=cyber] .portal-settings{background:#0d1a33;border-color:#2a4566}body[data-theme=cyber] .portal-settings summary{color:#c2dff4}body[data-theme=cyber] .portal-content-count{background:#112344;color:#e6fbff}body[data-theme=cyber] .content-card:after{color:#67f0ff}@container (min-width: 42rem){.portal-tools{grid-template-columns:minmax(16rem,1.1fr) minmax(18rem,1fr);align-items:center}.portal-filter-group{justify-content:flex-end}}@media (min-width: 44rem){.view{padding-right:clamp(1.5rem,4vw,3rem);padding-left:clamp(1.5rem,4vw,3rem)}.content-list{grid-template-columns:repeat(2,minmax(0,1fr))}.content-card{min-height:11rem}.mission-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.new-mission-row{align-items:center}}@media (min-width: 64rem){.content-list{grid-template-columns:repeat(3,minmax(0,1fr))}.portal-sticky-header{position:relative;top:auto;margin-top:0;padding-top:1.25rem}}@media (max-width: 34rem){.home-header-row{align-items:flex-start}.page-title{font-size:1.3rem}.new-mission-row{flex-wrap:wrap}.text-input{flex-basis:100%}.count-input{flex:1;width:auto}.storage-actions>*{flex:1 1 9rem}.replay-canvas-wrap{width:min(280px,calc(100vw - 4rem));height:min(280px,calc(100vw - 4rem))}}@media (max-height: 44rem) and (orientation: landscape){.portal-sticky-header{position:relative;top:auto}.fit-shape-canvas{height:clamp(250px,58vh,360px)}}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (forced-colors: active){.portal-title{background:none;color:CanvasText}.content-card,.portal-settings,.portal-empty-state{border:2px solid CanvasText}}*,*:before,*:after{box-sizing:border-box}html,body{width:100%;height:100%;margin:0}body{--app-bg: #fffdf5;--app-text: #243240;--app-surface: #ffffff;--app-surface-soft: #fff7ed;--app-surface-muted: #f8fafc;--app-heading: #0f172a;--app-subtext: #475569;--app-muted: #64748b;--app-primary: #f97316;--app-primary-strong: #ea580c;--app-primary-soft: #fb923c;--app-secondary: #2563eb;--app-tag: #f97316;--app-tab-idle: #94a3b8;--app-tab-active: #ffb300;--app-canvas-border: #ffb300;--app-canvas-shadow: #e6a100;--app-guide-char: #dbeafe;--app-guide-shadow: #bfdbfe;--app-success-soft: #f0fdf4;--app-overlay-card: #fff;--app-border: #e2e8f0;font-family:Hiragino Kaku Gothic ProN,Yu Gothic,sans-serif;background:var(--app-bg);color:var(--app-text)}body[data-theme=cool]{--app-bg: #f2f8ff;--app-text: #1f2b3a;--app-surface: #ffffff;--app-surface-soft: #edf5ff;--app-surface-muted: #f5faff;--app-heading: #0f1f35;--app-subtext: #405570;--app-muted: #5f738b;--app-primary: #2563eb;--app-primary-strong: #1d4ed8;--app-primary-soft: #60a5fa;--app-secondary: #0f766e;--app-tag: #1d4ed8;--app-tab-idle: #8aa1bb;--app-tab-active: #2563eb;--app-canvas-border: #60a5fa;--app-canvas-shadow: #3b82f6;--app-guide-char: #dbeafe;--app-guide-shadow: #bfdbfe;--app-success-soft: #ecfeff;--app-overlay-card: #fafdff;--app-border: #bfdbfe}body[data-theme=fancy]{--app-bg: #fff7fb;--app-text: #3f3347;--app-surface: #ffffff;--app-surface-soft: #fff1f8;--app-surface-muted: #fff8fd;--app-heading: #4a2a46;--app-subtext: #6b4f66;--app-muted: #8a6d86;--app-primary: #ec4899;--app-primary-strong: #db2777;--app-primary-soft: #f472b6;--app-secondary: #0ea5a4;--app-tag: #db2777;--app-tab-idle: #b59ab2;--app-tab-active: #ec4899;--app-canvas-border: #f472b6;--app-canvas-shadow: #db2777;--app-guide-char: #fde2f3;--app-guide-shadow: #fac7e8;--app-success-soft: #ecfdf5;--app-overlay-card: #fffafd;--app-border: #fbcfe8}body[data-theme=cyber]{--app-bg: #070b16;--app-text: #d9ebff;--app-surface: #0f1830;--app-surface-soft: #12213f;--app-surface-muted: #0b1427;--app-heading: #e6f9ff;--app-subtext: #a8c6e6;--app-muted: #8eaed0;--app-primary: #0ea5e9;--app-primary-strong: #38bdf8;--app-primary-soft: #7dd3fc;--app-secondary: #f472b6;--app-tag: #7dd3fc;--app-tab-idle: #6d8ca7;--app-tab-active: #22d3ee;--app-canvas-border: #22d3ee;--app-canvas-shadow: #0b7ea8;--app-guide-char: #16304d;--app-guide-shadow: #245880;--app-success-soft: #133127;--app-overlay-card: #111c35;--app-border: #2a4566}body[data-theme=cyber] .portal-subtitle{color:#a8c7df}body[data-theme=cyber] .content-card{background:linear-gradient(145deg,#142646,#182d52);border:1px solid #2d5f90;box-shadow:0 8px 20px #00d4ff26}body[data-theme=cyber] .content-title{color:#e6fbff}body[data-theme=cyber] .content-description{color:#c2dff4}body[data-theme=cyber] .content-tags{color:#67f0ff}body[data-theme=cyber] .active-tab{color:#041322}body[data-theme=cyber] .portal-sticky-header{background:linear-gradient(180deg,#050a14,#071124);border-bottom-color:#2a4566}body[data-theme=cyber] .portal-theme-switch{background:#0d1a33;border:1px solid #2a4566}body[data-theme=cyber] .portal-theme-btn{color:#9bb8d8}body[data-theme=cyber] .portal-theme-btn.is-active{background:#1a2f55;color:#e9f7ff;box-shadow:0 0 0 1px #3b82f6 inset}body[data-theme=cyber] .portal-search-box input{background:#0f1d39;color:#ecf8ff;border-color:#2c4a70}body[data-theme=cyber] .portal-search-box input::placeholder{color:#8ca6c4}body[data-theme=cyber] .portal-filter-btn{background:#0f1d39;border-color:#357;color:#aec7e4}body[data-theme=cyber] .portal-filter-btn.is-active{background:#22d3ee;border-color:#22d3ee;color:#06131f}body[data-theme=cyber] .content-card{background:linear-gradient(155deg,#112344,#132a50);border-color:#3a5f89;box-shadow:0 8px 20px #22d3ee29}body[data-theme=cyber] .action-primary,body[data-theme=cyber] .flashcard-primary-btn,body[data-theme=cyber] .dotburst-menu-btn,body[data-theme=cyber] .fit-shape-retry-btn{color:#051220;border:1px solid color-mix(in srgb,var(--app-primary-soft) 60%,#ffffff)}body[data-theme=cyber] .action-secondary,body[data-theme=cyber] .action-warning,body[data-theme=cyber] .action-danger{color:#041322}button,input{font:inherit}.hidden{display:none!important}.app-shell{width:100vw;height:100vh;display:flex;flex-direction:column;overflow:hidden}.tab-bar{display:flex;background:var(--app-surface);box-shadow:0 1px 6px #00000014;z-index:2}.tab{flex:1;border:0;background:transparent;color:var(--app-tab-idle);font-weight:700;font-size:1rem;padding:1rem 0}.active-tab{background:var(--app-tab-active);color:#fff}.view-root{position:relative;flex:1;overflow:hidden}.view{position:absolute;top:0;right:0;bottom:0;left:0;padding:1.25rem}.scrollable{overflow-y:auto;-webkit-overflow-scrolling:touch}.portal-sticky-header{position:sticky;top:-1.25rem;z-index:4;margin:-1.25rem -1.25rem 0;padding:1rem 1.25rem .75rem;background:var(--app-bg);border-bottom:1px solid color-mix(in srgb,var(--app-border) 70%,transparent)}.portal-title{margin:0;font-size:1.4rem;font-weight:900;background:linear-gradient(90deg,var(--app-primary),var(--app-secondary));-webkit-background-clip:text;background-clip:text;color:transparent}.portal-subtitle{margin:.3rem 0 .8rem;color:var(--app-subtext);font-size:.84rem}.portal-theme-switch{display:flex;gap:.25rem;padding:.25rem;border-radius:999px;background:color-mix(in srgb,var(--app-border) 45%,transparent);margin-bottom:.7rem;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none}.portal-theme-switch::-webkit-scrollbar{display:none}.portal-theme-btn{border:0;border-radius:999px;padding:.35rem .7rem;font-size:.72rem;font-weight:700;color:var(--app-muted);background:transparent;white-space:nowrap}.portal-theme-btn.is-active{background:var(--app-surface);color:var(--app-heading);box-shadow:0 2px 5px #0f172a1f}.portal-search-box{position:relative}.portal-search-box svg{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);fill:var(--app-muted)}.portal-search-box input{width:100%;border:1px solid var(--app-border);border-radius:.85rem;background:var(--app-surface-soft);color:var(--app-text);padding:.72rem .75rem .72rem 2.4rem;outline:0}.portal-search-box input:focus{border-color:var(--app-primary-soft)}.portal-filter-group{margin-top:.55rem;display:flex;gap:.4rem;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none}.portal-filter-group::-webkit-scrollbar{display:none}.portal-filter-btn{border:1px solid color-mix(in srgb,var(--app-border) 90%,transparent);border-radius:999px;background:color-mix(in srgb,var(--app-surface) 88%,transparent);color:var(--app-muted);font-size:.78rem;font-weight:700;padding:.38rem .72rem;white-space:nowrap}.portal-filter-btn.is-active{background:var(--app-primary);border-color:var(--app-primary);color:#fff}.content-list{display:grid;grid-template-columns:1fr;gap:.8rem;margin-top:.8rem;padding-bottom:1.5rem}.content-card{border:1px solid color-mix(in srgb,var(--app-border) 80%,transparent);border-radius:1.2rem;text-align:left;background:var(--app-surface);box-shadow:0 6px 14px #0f172a14;padding:1rem;display:flex;flex-direction:column}.content-card:active{transform:scale(.98)}.content-card-top{display:flex;align-items:center;gap:.7rem;margin-bottom:.4rem}.content-icon{width:2.55rem;height:2.55rem;border-radius:.8rem;display:inline-flex;align-items:center;justify-content:center;font-size:1.4rem;background:color-mix(in srgb,var(--app-primary-soft) 18%,transparent)}.content-card[data-category=language] .content-icon{background:#4ade8026}.content-card[data-category=math] .content-icon{background:#fb923c26}.content-card[data-category=memory] .content-icon{background:#c084fc26}.content-card[data-category=shape] .content-icon{background:#22d3ee2e}.content-title{margin:0;font-size:1.05rem;color:var(--app-heading)}.content-description{margin:0;color:var(--app-subtext);font-size:.84rem}.content-tags{margin:.7rem 0 0;color:var(--app-tag);font-size:.75rem;font-weight:700}.portal-empty-state{text-align:center;color:var(--app-muted);padding:1.8rem 0 2.2rem}@media (min-width: 640px){.content-list{grid-template-columns:repeat(2,minmax(0,1fr))}}.page-title{margin:0 0 1.25rem;font-size:1.5rem;color:var(--app-primary-strong)}.home-header-row{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem}.page-title.dark{color:var(--app-heading)}.mission-list{display:flex;flex-direction:column;gap:.75rem;padding-bottom:5rem}.mission-card{width:100%;border:1px solid var(--app-border);border-radius:1rem;background:var(--app-surface);box-shadow:0 2px 8px #0f172a14;padding:.45rem;display:flex;gap:.5rem;align-items:center;justify-content:flex-start;text-align:left}.mission-card--new{border-color:color-mix(in srgb,var(--app-primary-soft) 60%,#ffffff);background:var(--app-surface-soft)}.mission-card--practiced{border-color:color-mix(in srgb,#16a34a 40%,#ffffff);background:var(--app-success-soft)}.mission-start-btn{flex:1;border:0;border-left:8px solid var(--app-primary-soft);border-radius:.8rem;background:transparent;padding:.7rem .75rem;display:flex;align-items:center;justify-content:space-between;gap:.45rem;text-align:left}.mission-card--new .mission-start-btn{border-left-color:var(--app-primary)}.mission-card--practiced .mission-start-btn{border-left-color:#16a34a}.mission-delete-btn{border:1px solid #fca5a5;border-radius:.7rem;background:#fff1f2;color:#be123c;font-size:.72rem;font-weight:700;padding:.48rem .58rem;white-space:nowrap}.mission-main{display:flex;flex-direction:column;gap:.2rem}.mission-title{font-size:1.2rem;font-weight:700}.mission-date{font-size:.74rem;color:#64748b}.mission-status{font-size:.85rem;color:#0f172a;font-weight:700}.play-view{display:flex;flex-direction:column;align-items:center;overflow-y:auto;-webkit-overflow-scrolling:touch}.play-header{width:100%;max-width:320px;display:flex;justify-content:center;align-items:center;margin-bottom:.3rem}.play-title{margin:0;color:var(--app-secondary);font-weight:700}.play-lap{margin:0 0 .45rem;color:var(--app-primary);font-weight:700;font-size:.9rem}.link-btn{border:0;background:transparent;color:var(--app-muted);font-weight:700;white-space:nowrap}.canvas-area{position:relative;width:min(320px,100vw - 2.5rem);aspect-ratio:1/1;min-width:220px;min-height:220px;flex-shrink:0;border:8px solid var(--app-canvas-border);border-radius:1.25rem;box-shadow:0 6px 0 var(--app-canvas-shadow);background:var(--app-surface);overflow:hidden}#draw-canvas,#guide-canvas{position:absolute;top:0;right:0;bottom:0;left:0}#draw-canvas{z-index:20;touch-action:none}#guide-canvas{z-index:10;pointer-events:none}.guide-char-base{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:0;font-size:240px;color:var(--app-guide-char);text-shadow:0 2px 0 var(--app-guide-shadow);font-weight:700;opacity:.95;line-height:1;-webkit-user-select:none;user-select:none}.play-progress{width:100%;max-width:320px;margin:0 0 .5rem}.play-progress-text{margin:0 0 .25rem;text-align:right;font-size:.78rem;font-weight:700;color:var(--app-subtext)}.play-progress-track{width:100%;height:.7rem;border-radius:999px;background:#e2e8f0;overflow:hidden}.play-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,#22c55e,#16a34a);transition:width .22s ease}.play-progress-pips{margin-top:.35rem;display:flex;flex-wrap:wrap;gap:.3rem;min-height:.7rem}.play-progress-pip{width:.6rem;height:.6rem;border-radius:50%;background:#cbd5e1}.play-progress-pip--done{background:#16a34a}.play-progress-pip--current{background:#f59e0b;box-shadow:0 0 0 2px #fde68a}.stroke-info{margin-top:.9rem;text-align:center}.stroke-info-head{display:flex;align-items:center;justify-content:center;gap:.45rem}.stroke-badge{margin:0;min-width:7rem;padding:.28rem 1rem;border-radius:999px;color:#fff;font-weight:700;background:#ef4444}.stroke-note{margin:.2rem 0 0;font-size:.75rem;color:#94a3b8}.stroke-clear-btn{border:1px solid var(--app-border);border-radius:999px;background:var(--app-surface-soft);color:var(--app-muted);font-weight:700;font-size:.72rem;padding:.28rem .7rem;white-space:nowrap}.stroke-model{width:100%;max-width:320px;margin-top:.8rem;padding:.55rem;border-radius:.85rem;background:#f8fafc;border:1px solid #e2e8f0}.stroke-model-title{margin:0;font-size:.78rem;color:#334155;font-weight:700}.stroke-model-head{display:flex;align-items:center;justify-content:space-between;gap:.4rem}.stroke-model-replay{border:1px solid #cbd5e1;border-radius:999px;background:#fff;color:#334155;font-size:.68rem;font-weight:700;padding:.2rem .55rem}.stroke-model-view{margin-top:.35rem;height:140px;border-radius:.65rem;border:1px dashed #cbd5e1;background:#fff;display:flex;align-items:center;justify-content:center;color:#64748b;font-size:.72rem;overflow:hidden}.stroke-model-view svg{width:100%;height:100%}.stroke-model-view--error{color:#b91c1c;border-color:#fecaca;background:#fff1f2}.play-actions{width:100%;max-width:320px;margin-top:1.25rem;display:flex;flex-direction:column;gap:.75rem}.action-primary,.action-secondary,.action-neutral{border:0;border-radius:.9rem;font-weight:700}.action-primary{padding:1rem;background:var(--app-primary);color:#fff;font-size:1.35rem;box-shadow:0 6px 12px #f9731640}.parent-view{background:var(--app-surface-muted)}.card{background:var(--app-surface);border-radius:1rem;box-shadow:0 2px 8px #0f172a14;padding:1rem}.card-form{margin-bottom:1.5rem}.card-title{margin:0 0 .8rem;color:var(--app-secondary)}.card-subtitle{margin:0 0 .45rem;color:#334155;font-size:.9rem}.new-mission-row{display:flex;gap:.5rem}.text-input{flex:1;border:1px solid #cbd5e1;border-radius:.75rem;padding:.75rem;background:#fff}.count-input{width:5rem;border:1px solid #cbd5e1;border-radius:.75rem;padding:.75rem .5rem;background:#fff}.action-secondary{background:var(--app-secondary);color:#fff;padding:.7rem 1rem}.error-text{margin:.5rem 0 0;color:#ef4444;font-size:.78rem}.storage-card{margin:0 0 .75rem}.storage-summary{margin:0;color:#475569;font-size:.76rem;line-height:1.45}.storage-actions{margin-top:.55rem;display:flex;flex-wrap:wrap;gap:.45rem}.action-compact{padding:.5rem .7rem;border-radius:.75rem;font-size:.75rem}.action-warning{border:0;border-radius:.75rem;background:#f59e0b;color:#fff;padding:.5rem .7rem;font-weight:700;font-size:.75rem}.action-danger{margin-top:.6rem;border:0;border-radius:.75rem;background:#dc2626;color:#fff;padding:.55rem .8rem;font-weight:700;font-size:.78rem}.action-quit{border:1px solid #fca5a5;border-radius:.9rem;background:#fff1f2;color:#be123c;padding:.65rem;font-weight:700}.action-secondary:disabled,.action-warning:disabled{opacity:.55}.history-title{margin:0 0 .75rem}.history-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.7rem;padding-bottom:5rem}.history-card{background:#fff;border:1px solid #e2e8f0;border-radius:1rem;padding:.55rem;width:100%;max-width:280px}.history-preview-wrap{position:relative;width:100%;aspect-ratio:1;background:#f8fafc;border-radius:.7rem;overflow:hidden}.history-preview{width:100%;height:100%;object-fit:contain}.history-meta{margin-top:.45rem;display:flex;align-items:center;justify-content:space-between;gap:.35rem}.history-char{font-size:1rem;font-weight:700}.history-actions{display:flex;align-items:center;gap:.25rem}.history-action{border:0;border-radius:.5rem;padding:.24rem .4rem;font-size:.72rem;font-weight:700}.history-action.replay{position:absolute;right:.35rem;bottom:.35rem;background:#0f172ab3;color:#fff}.history-action.download-image{background:#e2e8f0;color:#334155}.history-action.download-video{background:#dbeafe;color:#1d4ed8}.history-detail{margin:.35rem 0 0;font-size:.65rem;line-height:1.3;color:#64748b}.card-calendar{margin-bottom:1rem}.calendar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.calendar-label{margin:0;font-size:1rem}.calendar-nav{border:1px solid #cbd5e1;background:#fff;border-radius:.6rem;padding:.28rem .5rem}.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.3rem}.calendar-weekdays{margin-bottom:.2rem;color:#64748b;font-size:.7rem;text-align:center}.calendar-day{border:1px solid #e2e8f0;border-radius:.55rem;min-height:2.6rem;background:#fff;padding:.1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.05rem}.calendar-day--blank{border:0;background:transparent}.calendar-day--empty{background:#f8fafc}.calendar-day--practiced{background:#ecfdf5;border-color:#86efac}.calendar-day--selected{outline:2px solid var(--app-secondary)}.calendar-day-num{font-size:.78rem;color:#0f172a}.calendar-day-count{font-size:.56rem;color:#16a34a;min-height:.6rem}.calendar-log-wrap{margin-top:.65rem;border-top:1px solid #e2e8f0;padding-top:.5rem}.calendar-log-title{margin:0 0 .3rem;font-size:.85rem}.calendar-log-list{margin:0;padding-left:1rem;display:flex;flex-direction:column;gap:.2rem;max-height:120px;overflow-y:auto}.calendar-log-item,.calendar-log-empty{font-size:.72rem;color:#334155}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#000c;display:flex;align-items:center;justify-content:center;padding:1rem}.overlay-panel{width:100%;max-width:360px;background:var(--app-overlay-card);border-radius:1.4rem;padding:1rem;display:flex;flex-direction:column;align-items:center}.overlay-title{margin:0 0 .9rem;font-size:1.4rem}.replay-canvas-wrap{width:280px;height:280px;border:6px solid var(--app-canvas-border);border-radius:1rem;background:#fff;margin-bottom:1rem}.action-neutral{width:100%;padding:.7rem;background:#e2e8f0;color:#334155}.celebrate-stamp{position:fixed;right:1rem;bottom:1rem;z-index:120;background:var(--app-surface-soft);border:3px solid var(--app-primary-soft);border-radius:1rem;padding:.55rem .85rem;box-shadow:0 8px 20px #f9731647;text-align:center}.stamp-mark{margin:0;font-size:1.5rem}.stamp-text{margin:.1rem 0 0;color:#9a3412;font-size:.84rem;font-weight:700}.home-content{min-height:100%}.dotburst-root{display:flex;flex-direction:column;min-height:420px;height:min(820px,100dvh - 10rem)}.flashcard-root,.larger-number-root,.fit-shape-root{display:flex;flex-direction:column;min-height:calc(100vh - 10rem)}.larger-number-game{flex:1;display:flex;flex-direction:column}.fit-shape-game{flex:1;position:relative}.fit-shape-panel{border-radius:1.35rem;border:1px solid var(--app-border);background:var(--app-surface);box-shadow:0 8px 18px #0f172a14;padding:.75rem;min-height:100%;display:flex;flex-direction:column}.fit-shape-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.55rem}.fit-shape-score{font-size:1.1rem;font-weight:900;color:var(--app-primary-strong)}.fit-shape-score span{color:var(--app-secondary)}.fit-shape-timer{min-width:5.4rem;text-align:right;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:1.05rem;font-weight:900;color:#ef4444}.fit-shape-canvas{position:relative;width:100%;height:clamp(330px,58vh,500px);border:3px dashed color-mix(in srgb,var(--app-primary-soft) 35%,transparent);border-radius:1rem;background:color-mix(in srgb,var(--app-primary-soft) 10%,#ffffff);overflow:hidden;touch-action:none}.fit-shape-foot{margin-top:.55rem;display:flex;justify-content:space-between;align-items:center}.fit-shape-link-btn{border:0;background:transparent;color:var(--app-muted);font-weight:700}.fit-shape-foot-note{color:var(--app-muted);font-size:.72rem}.fit-shape-zone{position:absolute;pointer-events:none}.fit-shape-zone-svg{width:100%;height:100%;fill:color-mix(in srgb,var(--fit-zone-color, var(--app-heading)) 24%,transparent);stroke:color-mix(in srgb,var(--fit-zone-color, var(--app-primary-soft)) 82%,#ffffff);stroke-width:4.5;opacity:.9;transition:opacity .2s ease}.fit-shape-zone.is-matched .fit-shape-zone-svg{opacity:.9;stroke-width:6.5}body[data-theme=cyber] .fit-shape-canvas{background:#0b1b36;border-color:#3b5d86}body[data-theme=cyber] .fit-shape-zone-svg{fill:color-mix(in srgb,var(--fit-zone-color, #7dd3fc) 38%,transparent);stroke:color-mix(in srgb,var(--fit-zone-color, #7dd3fc) 72%,#e6f9ff);stroke-width:7;opacity:.96}body[data-theme=cyber] .fit-shape-zone.is-matched .fit-shape-zone-svg{fill:color-mix(in srgb,var(--fit-zone-color, #7dd3fc) 55%,transparent);stroke:#e6f9ff;opacity:1}.fit-shape-block{position:absolute;border:0;background:transparent;padding:0;cursor:grab;z-index:10;filter:drop-shadow(0 4px 6px rgba(0,0,0,.2))}.fit-shape-block.is-dragging{cursor:grabbing;transform:scale(1.08);z-index:40}.fit-shape-block-svg{width:100%;height:100%}.fit-shape-block.is-success{animation:fit-shape-pop .35s ease-out}.fit-shape-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:70;background:color-mix(in srgb,var(--app-surface) 95%,#ffffff);border-radius:1.35rem;padding:.95rem}.fit-shape-start-head{text-align:center;margin-top:.4rem}.fit-shape-title{margin:0;font-size:1.8rem;color:var(--app-primary-strong)}.fit-shape-subtitle{margin:.2rem 0 .75rem;color:var(--app-subtext);font-weight:700}.fit-shape-level-list{display:grid;gap:.6rem}.fit-shape-level-btn{border:0;border-radius:999px;color:#fff;font-size:1rem;font-weight:900;padding:.78rem 1rem}.fit-shape-level-btn--easy{background:#22c55e}.fit-shape-level-btn--medium{background:#eab308}.fit-shape-level-btn--hard{background:#ef4444}.fit-shape-history{margin-top:.85rem;border:1px solid var(--app-border);border-radius:1rem;background:var(--app-surface-soft);padding:.7rem}.fit-shape-history-title{margin:0 0 .4rem;color:var(--app-primary-strong)}.fit-shape-history-list{display:grid;gap:.35rem;max-height:170px;overflow-y:auto}.fit-shape-history-item{display:flex;justify-content:space-between;gap:.5rem;font-size:.8rem;color:var(--app-subtext);border-bottom:1px solid color-mix(in srgb,var(--app-border) 70%,transparent);padding-bottom:.2rem}.fit-shape-history-empty{color:var(--app-muted);font-size:.82rem}.fit-shape-result-card{height:100%;display:flex;flex-direction:column;justify-content:center;text-align:center}.fit-shape-result-title{margin:0;font-size:1.9rem;color:var(--app-heading)}.fit-shape-result-label{margin:.3rem 0 0;color:var(--app-subtext)}.fit-shape-result-score{margin-top:.2rem;font-size:4.2rem;line-height:1;color:var(--app-primary);font-weight:900}.fit-shape-record{margin-top:.4rem;color:#f97316;font-weight:900}.fit-shape-retry-btn{margin-top:1rem;border:0;border-radius:999px;background:var(--app-primary);color:#fff;font-size:1.05rem;font-weight:900;padding:.85rem 1rem}.fit-shape-confetti{position:absolute;width:10px;height:10px;border-radius:2px;top:0;z-index:90;pointer-events:none}@keyframes fit-shape-pop{0%{transform:scale(1)}50%{transform:scale(1.22)}to{transform:scale(1)}}.larger-screen{display:none;width:100%;flex:1}.larger-screen.active{display:flex}.larger-screen[data-role=start-screen]{flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:.25rem 0 .75rem}.larger-start-icon{font-size:4.2rem}.larger-start-title{margin:.3rem 0 1rem;color:var(--app-primary-strong);font-size:2rem;line-height:1.15}.larger-start-actions{width:100%;display:flex;flex-direction:column;gap:.6rem}.larger-level-btn,.larger-primary-btn,.larger-gray-btn,.larger-danger-btn{border:0;border-radius:1.1rem;padding:.95rem;color:#fff;font-size:1.05rem;font-weight:900}.larger-level-btn--easy{background:#22c55e;box-shadow:0 6px #15803d}.larger-level-btn--normal{background:#60a5fa;box-shadow:0 6px #1d4ed8}.larger-level-btn--hard{background:#f87171;box-shadow:0 6px #dc2626}.larger-sub-btn{margin-top:.3rem;border:1px solid var(--app-border);border-radius:.95rem;background:var(--app-surface-soft);color:var(--app-primary-strong);font-size:.95rem;font-weight:700;padding:.7rem}.larger-screen[data-role=game-screen]{position:relative;flex-direction:column;gap:.6rem}.larger-head{border:1px solid var(--app-border);border-radius:1rem;background:var(--app-surface);padding:.7rem .75rem;display:flex;align-items:center;gap:.6rem}.larger-head-score{font-size:.94rem;font-weight:900;color:var(--app-primary-strong);min-width:4.6rem}.larger-head-score span{font-size:1.24rem}.larger-timer-track{flex:1;height:.7rem;background:#e2e8f0;border-radius:999px;overflow:hidden}.larger-timer-fill{width:100%;height:100%;background:linear-gradient(90deg,#fb923c,#ef4444)}.larger-timer-text{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:1.05rem;font-weight:900;color:var(--app-heading);min-width:4.4rem;text-align:right}.timer-warning{color:#ef4444;animation:timer-blink .5s infinite}@keyframes timer-blink{0%,to{opacity:1}50%{opacity:.55}}.larger-cards{flex:1;display:flex;flex-direction:column;gap:.55rem;min-height:0}.larger-choice-card{border:2px solid var(--app-border);border-radius:1.35rem;background:var(--app-surface);padding:.55rem;flex:1;display:flex;flex-direction:column;align-items:center;gap:.35rem}.larger-choice-card:active{transform:scale(.98)}.larger-choice-card--hard{justify-content:center}.larger-choice-number{font-size:clamp(2rem,8vw,3.5rem);font-weight:900;color:var(--app-secondary);line-height:1}.larger-apple-wrap{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-start;gap:.35rem;overflow-y:auto;padding-right:.1rem}.larger-apple-box{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:6px;border-radius:.5rem;background:var(--app-surface-soft);border:1px solid var(--app-border);width:min(100%,24rem)}.larger-apple-emoji{font-size:clamp(1.15rem,5.5vmin,2.4rem);line-height:1;animation:apple-pop .2s ease-out}@keyframes apple-pop{0%{transform:scale(0)}80%{transform:scale(1.2)}to{transform:scale(1)}}.larger-feedback{position:absolute;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;align-items:center;justify-content:center;font-size:6.5rem;pointer-events:none}.larger-feedback--correct{color:#ef4444}.larger-feedback--wrong{color:#2563eb}.animate-feedback{animation:larger-feedback-pop .5s cubic-bezier(.175,.885,.32,1.275) forwards}@keyframes larger-feedback-pop{0%{opacity:0;transform:scale(.3)}40%{opacity:1;transform:scale(1.1)}to{opacity:0;transform:scale(1)}}.larger-combo-wrap{position:absolute;top:22%;left:50%;transform:translate(-50%);pointer-events:none;z-index:65}.larger-combo{color:#f97316;font-size:1.6rem;font-weight:900;animation:combo-up .5s ease-out forwards}@keyframes combo-up{0%{transform:translateY(20px);opacity:0}50%{transform:translateY(0);opacity:1}to{transform:translateY(-20px);opacity:0}}.shake{animation:shake-anim .3s}@keyframes shake-anim{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-8px)}80%{transform:translate(8px)}}.larger-screen[data-role=scores-screen]{flex-direction:column}.larger-scores-title{margin:0;color:var(--app-primary-strong);text-align:center}.larger-score-list{flex:1;min-height:0;overflow-y:auto;margin-top:.75rem;padding-right:.15rem}.larger-score-empty{margin-top:1.4rem;text-align:center;color:var(--app-muted)}.larger-score-item{border:2px solid var(--app-border);border-radius:1rem;background:var(--app-surface);padding:.7rem .8rem;margin-bottom:.55rem}.larger-score-item--easy{border-color:#4ade80}.larger-score-item--normal{border-color:#60a5fa}.larger-score-item--hard{border-color:#f87171}.larger-score-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.2rem}.larger-score-date{font-size:.66rem;font-weight:700;color:var(--app-muted)}.larger-score-level{border-radius:999px;padding:.15rem .45rem;font-size:.62rem;font-weight:900}.larger-score-level--easy{background:#dcfce7;color:#16a34a}.larger-score-level--normal{background:#dbeafe;color:#2563eb}.larger-score-level--hard{background:#fee2e2;color:#dc2626}.larger-score-foot{display:flex;align-items:flex-end;justify-content:space-between}.larger-score-correct{color:var(--app-subtext);font-size:.8rem}.larger-score-correct span{color:var(--app-primary);font-size:1.1rem;font-weight:900}.larger-score-point{font-size:1.6rem;font-weight:900;color:var(--app-heading)}.larger-score-point small{font-size:.64rem;margin-left:.2rem}.larger-scores-actions{margin-top:.7rem;display:flex;gap:.55rem}.larger-gray-btn{flex:1;background:#94a3b8}.larger-danger-btn{flex:1;background:#fecdd3;color:#e11d48}.larger-screen[data-role=result-screen]{flex-direction:column;align-items:center;justify-content:center;text-align:center}.larger-result-icon{font-size:4rem}.larger-result-title{margin:.3rem 0 .9rem;color:var(--app-heading)}.larger-result-card{width:100%;border:2px solid var(--app-border);border-radius:1.5rem;background:var(--app-surface);padding:1rem}.larger-result-score{font-size:3rem;font-weight:900;color:var(--app-primary);line-height:1}.larger-result-unit{color:var(--app-muted);font-weight:700}.larger-result-stats{margin-top:.45rem;border-radius:.7rem;background:var(--app-surface-soft);color:var(--app-subtext);font-size:.9rem;font-weight:700;padding:.4rem .45rem}.larger-primary-btn{margin-top:.8rem;width:100%;background:var(--app-primary)}.flashcard-game{flex:1;display:flex;flex-direction:column;gap:.8rem}.flashcard-header{display:flex;align-items:center;justify-content:space-between;padding:.8rem .95rem;border-radius:1rem;background:var(--app-surface);border:1px solid var(--app-border);box-shadow:0 4px 12px #0f172a14}.flashcard-brand{display:flex;align-items:center;gap:.5rem}.flashcard-brand-icon{width:1.8rem;height:1.8rem;display:inline-flex;align-items:center;justify-content:center;border-radius:.5rem;background:var(--app-primary);color:#fff}.flashcard-brand-title{margin:0;font-size:.88rem;color:var(--app-heading)}.flashcard-header-right{display:flex;align-items:center;gap:.55rem}.flashcard-history-btn{border:1px solid var(--app-border);border-radius:999px;background:var(--app-surface-soft);color:var(--app-muted);font-size:.74rem;font-weight:700;padding:.3rem .65rem}.flashcard-progress{min-width:3.5rem;text-align:right;font-size:1rem;font-weight:900;color:var(--app-primary)}.flashcard-main{flex:1;display:flex;align-items:center;justify-content:center}.flashcard-view{width:100%}.flashcard-idle-title{margin:0 0 .9rem;text-align:center;color:var(--app-heading)}.flashcard-level-list{display:flex;flex-direction:column;gap:.75rem}.flashcard-level-btn{border:0;border-radius:1.4rem;padding:1rem;display:flex;flex-direction:column;gap:.22rem;text-align:left;background:var(--app-surface);border-bottom:4px solid var(--app-border);box-shadow:0 6px 14px #0f172a14}.flashcard-level-btn--easy{border-left:8px solid #22c55e}.flashcard-level-btn--normal{border-left:8px solid #f59e0b}.flashcard-level-btn--hard{border-left:8px solid #ef4444}.flashcard-level-btn--expert{border-left:8px solid #dc2626}.flashcard-level-btn--master{border-left:8px solid #a855f7}.flashcard-level-label{font-size:1.08rem;font-weight:900;color:var(--app-heading)}.flashcard-level-meta{font-size:.68rem;color:var(--app-muted);font-weight:700}.flashcard-card{width:min(320px,100%);aspect-ratio:3/4;margin:0 auto;border-radius:2rem;background:var(--app-surface);border:1px solid var(--app-border);border-bottom:8px solid color-mix(in srgb,var(--app-primary-soft) 55%,#ffffff);box-shadow:0 14px 24px #0f172a24;display:flex;flex-direction:column;align-items:center;justify-content:center}.flashcard-emoji{font-size:5.5rem;line-height:1}.flashcard-kana{margin-top:.6rem;font-size:2rem;font-weight:900;color:var(--app-heading)}.flashcard-quiz-head{text-align:center;margin-bottom:.8rem}.flashcard-quiz-step{margin:0;font-size:.7rem;color:var(--app-muted);font-weight:900}.flashcard-quiz-title{margin:.2rem 0 0;color:var(--app-heading)}.flashcard-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.flashcard-choice-btn{border:1px solid var(--app-border);background:var(--app-surface);border-radius:1.4rem;padding:1rem .6rem;display:flex;flex-direction:column;align-items:center;gap:.38rem;box-shadow:0 6px 12px #0f172a14}.flashcard-choice-emoji{font-size:3.3rem}.flashcard-choice-kana{font-size:.8rem;color:var(--app-subtext);font-weight:700}.flashcard-result-card{border-radius:1.8rem;background:var(--app-surface);border:1px solid var(--app-border);padding:1.2rem;box-shadow:0 10px 18px #0f172a1a;text-align:center}.flashcard-result-title{margin:0;color:var(--app-heading)}.flashcard-result-score{margin-top:.35rem;font-size:3rem;font-weight:900;color:var(--app-primary)}.flashcard-result-message{margin-top:.35rem;font-size:1.05rem;font-weight:900}.flashcard-result-message--best{color:#ef4444}.flashcard-result-message--good{color:#f97316}.flashcard-result-message--retry{color:var(--app-secondary)}.flashcard-primary-btn{margin-top:.9rem;width:100%;border:0;border-radius:.95rem;background:var(--app-primary);color:#fff;font-size:1rem;font-weight:900;padding:.9rem}.flashcard-feedback{position:fixed;top:0;right:0;bottom:0;left:0;z-index:160;display:flex;align-items:center;justify-content:center;background:#0000001a;pointer-events:none}.flashcard-feedback-icon{font-size:9rem;font-weight:900;line-height:1}.flashcard-feedback-icon--ok{color:#ef4444}.flashcard-feedback-icon--ng{color:#111827}.flashcard-history-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:170;background:#0000008c;display:flex;align-items:center;justify-content:center;padding:1rem}.flashcard-history-panel{width:min(100%,420px);max-height:85vh;border-radius:1.6rem;background:var(--app-surface);border:1px solid var(--app-border);box-shadow:0 16px 30px #0f172a40;display:flex;flex-direction:column}.flashcard-history-head{padding:.9rem 1rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--app-border)}.flashcard-history-title{margin:0;color:var(--app-heading)}.flashcard-history-close{border:0;border-radius:999px;width:1.8rem;height:1.8rem;background:var(--app-surface-soft);color:var(--app-muted);font-weight:900}.flashcard-history-list{flex:1;overflow-y:auto;padding:.85rem;display:flex;flex-direction:column;gap:.6rem}.flashcard-history-empty{text-align:center;color:var(--app-muted);padding:1.4rem;font-weight:700}.flashcard-history-item{border:1px solid var(--app-border);border-radius:1rem;background:var(--app-surface-muted);padding:.7rem}.flashcard-history-row{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}.flashcard-history-meta{display:flex;flex-direction:column}.flashcard-history-date{font-size:.66rem;color:var(--app-muted);font-weight:700}.flashcard-history-level{font-size:.95rem;color:var(--app-heading);font-weight:900}.flashcard-history-score-wrap{text-align:right}.flashcard-history-acc{font-size:1.2rem;font-weight:900}.flashcard-history-acc--best{color:#22c55e}.flashcard-history-acc--good{color:#f97316}.flashcard-history-acc--retry{color:#ef4444}.flashcard-history-score{font-size:.7rem;color:var(--app-muted);font-weight:700}.flashcard-history-emojis{margin-top:.45rem;border-radius:.65rem;background:var(--app-surface);border:1px solid var(--app-border);padding:.3rem .45rem;font-size:1.15rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flashcard-history-foot{padding:.75rem 1rem;border-top:1px solid var(--app-border);text-align:center}.flashcard-clear-btn{border:0;background:transparent;color:#ef4444;font-weight:700;font-size:.72rem}.dotburst-game{--dotburst-bg: var(--app-bg);--dotburst-panel: var(--app-surface);--dotburst-text: var(--app-text);--dotburst-accent-ok: #16a34a;--dotburst-accent-ng: #dc2626;--dotburst-dot-color: var(--app-primary-soft);--dotburst-btn-bg: var(--app-surface-soft);position:relative;display:flex;flex-direction:column;flex:1;border-radius:1rem;overflow:hidden;background:var(--dotburst-bg);color:var(--dotburst-text);border:2px solid color-mix(in srgb,var(--app-primary-soft) 55%,#ffffff)}.dotburst-header{display:flex;justify-content:space-between;align-items:center;height:50px;padding:10px 15px}.dotburst-time{font-size:28px;font-weight:700}.dotburst-score{font-size:18px;opacity:.8}.dotburst-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;border-top:2px solid color-mix(in srgb,var(--app-primary-soft) 85%,#ffffff);border-bottom:2px solid color-mix(in srgb,var(--app-primary-soft) 85%,#ffffff);background:color-mix(in srgb,var(--app-primary-soft) 85%,#ffffff)}.dotburst-stat{background:var(--dotburst-bg);text-align:center;padding:4px 0}.dotburst-emoji{display:block;font-size:18px}.dotburst-val{display:block;font-size:34px;font-weight:900;line-height:1.1}.dotburst-val--ok{color:var(--dotburst-accent-ok)}.dotburst-val--ng{color:var(--dotburst-accent-ng)}.dotburst-display{position:relative;margin:10px;border-radius:20px;border:3px solid var(--app-primary-soft);background:var(--dotburst-panel);flex-grow:1;overflow:hidden;min-height:280px}.dotburst-dot{position:absolute;width:55px;height:55px;border-radius:50%;transform:scale(0);background:radial-gradient(circle,#ffffff 0%,var(--dotburst-dot-color) 50%,transparent 80%)}.dotburst-dot.is-show{animation:dotburst-pop .2s cubic-bezier(.175,.885,.32,1.2) forwards}.dotburst-feedback{position:absolute;top:50%;left:50%;z-index:100;transform:translate(-50%,-50%);font-size:100px;opacity:0;pointer-events:none}.dotburst-feedback.is-animating{animation:dotburst-feedback .4s ease-out}.dotburst-input{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:10px 15px 15px}.dotburst-num-btn{border:3px solid var(--dotburst-text);border-radius:15px;background:var(--dotburst-btn-bg);color:var(--dotburst-text);font-size:34px;font-weight:700;aspect-ratio:1/1}.dotburst-num-btn:active{transform:scale(.92);background:var(--dotburst-text);color:var(--dotburst-bg)}.dotburst-modal{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center;background:var(--dotburst-bg)}.dotburst-title-area{margin-bottom:15px}.dotburst-title-emoji{font-size:58px}.dotburst-title{margin:0;font-size:44px;font-weight:900;color:var(--app-primary-strong)}.dotburst-menu-btn{width:85%;margin:8px 0;border:3px solid var(--dotburst-text);border-radius:20px;padding:16px;background:var(--dotburst-btn-bg);color:var(--dotburst-text);font-family:inherit;font-size:22px;font-weight:700}.dotburst-link-btn{margin-top:8px;border:0;background:transparent;color:var(--dotburst-text);font-size:16px;text-decoration:underline}.dotburst-result-icon{font-size:50px}.dotburst-result-title{margin:5px 0}.dotburst-result-score-wrap{margin:10px 0}.dotburst-result-label{opacity:.8;font-size:14px}.dotburst-result-score{font-size:52px;font-weight:900;line-height:1}.dotburst-result-stats{width:80%;margin:15px 0;border-radius:10px;padding:10px;display:flex;justify-content:space-around;font-size:20px;background:#8080801a}.dotburst-best{margin-bottom:20px;color:var(--dotburst-accent-ok);font-size:14px}.dotburst-history-title{margin:0;font-size:1.5rem}.dotburst-history-sort{margin:10px 0 6px;display:flex;gap:8px}.dotburst-sort-btn{border:1px solid #fdba74;background:var(--app-surface-soft);color:var(--app-primary-strong);border-radius:999px;padding:6px 12px;font-weight:700;font-size:13px}.dotburst-sort-btn.is-active{background:var(--app-primary);color:#fff;border-color:var(--app-primary)}.dotburst-history-box{width:100%;max-height:40vh;margin:15px 0;overflow-y:auto;border:2px solid var(--dotburst-text);border-radius:10px;padding:8px}.dotburst-history-section+.dotburst-history-section{margin-top:10px}.dotburst-history-section-title{margin:0 0 6px;font-size:14px;color:var(--app-primary-strong)}.dotburst-history-section-empty{border:1px dashed #fdba74;border-radius:8px;padding:8px;font-size:13px;color:#78716c}.dotburst-history-item{display:grid;grid-template-columns:1.8fr 1fr .8fr .8fr;border-bottom:1px solid rgba(128,128,128,.3);padding:12px 8px;font-size:14px}.dotburst-history-empty{padding:40px}.dotburst-history-score{color:var(--dotburst-text);font-weight:700}.dotburst-history-ok{color:var(--dotburst-accent-ok)}.dotburst-history-ng{color:var(--dotburst-accent-ng)}@keyframes dotburst-pop{to{transform:scale(1)}}@keyframes dotburst-feedback{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}to{opacity:0;transform:translate(-50%,-50%) scale(1.3)}}@media (max-width: 390px){.view{padding:1rem}.portal-sticky-header{top:-1rem;margin:-1rem -1rem 0;padding:.85rem 1rem .6rem}.canvas-area,.play-actions,.play-progress,.play-header,.stroke-model{max-width:100%;width:100%}.canvas-area{max-width:320px;width:min(320px,100vw - 2rem);margin:0 auto}.home-header-row{flex-direction:column;align-items:flex-start;gap:.25rem}.dotburst-root{min-height:400px;height:min(760px,100dvh - 9.6rem)}.flashcard-root{min-height:calc(100vh - 11rem)}}.learning-path-note{margin:.85rem 0 0;padding:.8rem .95rem;border:1px solid color-mix(in srgb,var(--app-primary) 35%,var(--app-border));border-radius:1rem;background:color-mix(in srgb,var(--app-primary-soft) 12%,var(--app-surface));display:flex;flex-direction:column;gap:.25rem;color:var(--app-heading)}.learning-path-note span{color:var(--app-subtext);font-size:.78rem}.content-card-top{flex-wrap:wrap}.content-step-badge{margin-left:auto;border-radius:999px;background:var(--app-primary);color:#fff;padding:.28rem .52rem;font-size:.68rem;font-weight:900;letter-spacing:.03em}.number-sequence-experience{position:absolute;top:0;right:0;bottom:0;left:0;z-index:12;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));background:var(--app-bg);color:var(--app-text)}.number-sequence-shell{width:min(100%,760px);margin:0 auto}.number-sequence-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.number-sequence-header h2{margin:.15rem 0 0;color:var(--app-heading);font-size:1.45rem}.number-sequence-step{margin:0;color:var(--app-primary-strong);font-size:.75rem;font-weight:900}.number-sequence-back,.number-sequence-sub,.number-sequence-primary,.number-sequence-result-actions button{min-height:48px;border:1px solid var(--app-border);border-radius:.9rem;background:var(--app-surface);color:var(--app-heading);padding:.65rem .9rem;font-weight:800}.number-sequence-screen{display:none}.number-sequence-screen.is-active{display:block}.number-sequence-screen>h3{margin:.75rem 0;text-align:center;color:var(--app-heading)}.number-sequence-hero,.number-sequence-finish{margin:.7rem 0 .3rem;text-align:center;font-size:clamp(2rem,9vw,4.2rem)}.number-sequence-limit{margin:.5rem 0 1rem;text-align:center;color:var(--app-subtext);font-weight:700}.number-sequence-levels{display:grid;grid-template-columns:1fr;gap:.7rem}.number-sequence-levels button{min-height:72px;border:2px solid color-mix(in srgb,var(--app-primary) 45%,var(--app-border));border-radius:1rem;background:var(--app-surface);color:var(--app-heading);padding:.75rem 1rem;font-size:1rem;font-weight:900}.number-sequence-levels small{color:var(--app-subtext);font-size:.75rem}.number-sequence-sub{width:100%;margin-top:.8rem}.number-sequence-status{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;margin-bottom:.55rem}.number-sequence-status span{border:1px solid var(--app-border);border-radius:.8rem;background:var(--app-surface);padding:.55rem .35rem;text-align:center;font-size:.82rem}.number-sequence-timer-track{height:.75rem;border-radius:999px;background:color-mix(in srgb,var(--app-border) 75%,transparent);overflow:hidden}.number-sequence-timer-fill{width:100%;height:100%;border-radius:inherit;background:var(--app-primary)}.number-sequence-instruction{margin:1rem 0 .7rem;text-align:center;color:var(--app-subtext);font-weight:800}.number-sequence-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.35rem;min-height:110px;border:2px solid color-mix(in srgb,var(--app-primary) 28%,var(--app-border));border-radius:1.15rem;background:var(--app-surface);padding:1rem .6rem}.number-sequence-cell{min-width:2.8rem;min-height:3rem;border-radius:.75rem;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--app-secondary) 10%,var(--app-surface));color:var(--app-heading);font-size:clamp(1.45rem,7vw,2.5rem);font-weight:900}.number-sequence-cell.is-blank{border:3px dashed var(--app-primary);background:color-mix(in srgb,var(--app-primary-soft) 16%,var(--app-surface))}.number-sequence-arrow{color:var(--app-muted);font-weight:900}.number-sequence-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin-top:.9rem}.number-sequence-choice{min-height:76px;border:2px solid var(--app-primary);border-radius:1rem;background:var(--app-surface);color:var(--app-heading);font-size:clamp(1.5rem,8vw,2.4rem);font-weight:900}.number-sequence-choice:active,.number-sequence-levels button:active,.number-sequence-back:active,.number-sequence-sub:active,.number-sequence-primary:active{transform:scale(.97)}.number-sequence-feedback{margin-top:.7rem;min-height:2.5rem;border-radius:.8rem;padding:.55rem .8rem;text-align:center;font-weight:900}.number-sequence-feedback.is-correct{background:var(--app-success-soft);color:#15803d}.number-sequence-feedback.is-wrong{background:#fff1f2;color:#be123c}.number-sequence-history{display:flex;flex-direction:column;gap:.55rem;max-height:min(56vh,430px);overflow-y:auto}.number-sequence-history-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.7rem;border:1px solid var(--app-border);border-radius:.9rem;background:var(--app-surface);padding:.7rem .8rem}.number-sequence-history-item div{display:flex;flex-direction:column;gap:.15rem}.number-sequence-history-item span,.number-sequence-history-item p{margin:0;color:var(--app-subtext);font-size:.75rem}.number-sequence-history-item b{color:var(--app-primary-strong)}.number-sequence-empty{text-align:center;color:var(--app-muted)}.number-sequence-result-card{border:2px solid color-mix(in srgb,var(--app-primary) 40%,var(--app-border));border-radius:1.2rem;background:var(--app-surface);padding:1.2rem;text-align:center}.number-sequence-result-card strong{color:var(--app-primary-strong);font-size:clamp(3rem,14vw,5rem)}.number-sequence-result-card span{margin-left:.2rem;font-weight:800}.number-sequence-result-card p{margin:.5rem 0 0;color:var(--app-subtext)}.number-sequence-primary{width:100%;margin-top:.8rem;border-color:var(--app-primary);background:var(--app-primary);color:#fff}.number-sequence-result-actions{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin-top:.8rem}.number-sequence-result-actions .number-sequence-danger{border-color:#fca5a5;background:#fff1f2;color:#be123c}body[data-theme=cyber] .number-sequence-feedback.is-wrong,body[data-theme=cyber] .number-sequence-result-actions .number-sequence-danger{background:#3a1522;color:#fecdd3}@media (min-width: 640px){.number-sequence-levels{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (prefers-reduced-motion: reduce){.number-sequence-choice:active,.number-sequence-levels button:active,.number-sequence-back:active,.number-sequence-sub:active,.number-sequence-primary:active{transform:none}}.child-action-with-icon{display:inline-flex;align-items:center;justify-content:center;gap:.48rem;min-height:48px;line-height:1.15;text-align:center}.child-button-icon{flex:0 0 auto;font-size:1.35em;line-height:1}.child-button-label{min-width:0;font-weight:900}.child-action-with-icon--portal,.child-action-with-icon--back,.child-action-with-icon--menu,.child-action-with-icon--close{min-height:52px;border:2px solid var(--app-border);border-radius:999px;padding:.58rem .9rem;font-size:.95rem;font-weight:900;box-shadow:0 4px color-mix(in srgb,var(--app-border) 78%,transparent);transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}.child-action-with-icon--portal{border-color:var(--app-primary-strong);background:var(--app-primary);color:#fff}.child-action-with-icon--back{background:var(--app-surface);color:var(--app-primary-strong)}.child-action-with-icon--menu{border-color:color-mix(in srgb,var(--app-secondary) 70%,var(--app-border));background:var(--app-secondary);color:#fff}.child-action-with-icon--close{border-color:#fca5a5;background:#fff1f2;color:#be123c}.child-action-with-icon--portal:active,.child-action-with-icon--back:active,.child-action-with-icon--menu:active,.child-action-with-icon--close:active{transform:translateY(3px);box-shadow:0 1px color-mix(in srgb,var(--app-border) 78%,transparent)}.home-header-row{position:sticky;top:0;z-index:35;align-items:center;margin:0 0 1rem;padding:.72rem;border:2px solid var(--app-border);border-radius:1.15rem;background:color-mix(in srgb,var(--app-surface) 94%,transparent);box-shadow:0 7px 16px #0f172a1a;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.child-page-title{display:inline-flex;align-items:center;gap:.45rem;margin:0;color:var(--app-heading);font-size:clamp(1.15rem,4vw,1.55rem);line-height:1.2}.child-page-title-icon{font-size:1.35em;line-height:1}.child-play-header{position:sticky;top:0;z-index:35;width:min(100%,360px);max-width:360px;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.65rem;margin:0 0 .5rem;padding:.55rem;border:2px solid var(--app-border);border-radius:1rem;background:color-mix(in srgb,var(--app-surface) 95%,transparent);box-shadow:0 6px 14px #0f172a1a;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.child-play-header .play-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}.child-play-header #btn-back-home{min-width:7rem}.tab-bar{padding-top:env(safe-area-inset-top)}.tab.child-action-with-icon{min-height:56px;gap:.4rem;padding:.7rem .45rem;font-size:.95rem}.tab.child-action-with-icon .child-button-icon{font-size:1.45rem}.portal-title{display:inline-flex;align-items:center;gap:.45rem}.portal-title-icon{color:initial;-webkit-text-fill-color:initial;font-size:1.1em}.portal-content-count{flex-direction:column;gap:.05rem;line-height:1}.portal-content-count>span:first-child{font-size:1.3rem}.portal-filter-btn.child-filter-button,.portal-theme-btn.child-theme-button{gap:.32rem}.portal-filter-btn.child-filter-button .child-button-icon{font-size:1.15rem}.portal-theme-btn.child-theme-button .child-button-icon{font-size:1.05rem}.content-card:after{content:"▶ あそぶ"}.action-primary.child-action-with-icon,.action-secondary.child-action-with-icon,.action-neutral.child-action-with-icon,.action-warning.child-action-with-icon,.action-danger.child-action-with-icon,.stroke-clear-btn.child-action-with-icon,.stroke-model-replay.child-action-with-icon,.dotburst-menu-btn.child-action-with-icon,.dotburst-link-btn.child-action-with-icon,.flashcard-history-btn.child-action-with-icon,.flashcard-primary-btn.child-action-with-icon,.flashcard-history-close.child-action-with-icon,.flashcard-clear-btn.child-action-with-icon,.larger-sub-btn.child-action-with-icon,.larger-gray-btn.child-action-with-icon,.larger-danger-btn.child-action-with-icon,.larger-primary-btn.child-action-with-icon,.fit-shape-link-btn.child-action-with-icon,.fit-shape-retry-btn.child-action-with-icon,.larger-level-btn.child-action-with-icon,.fit-shape-level-btn.child-action-with-icon{align-items:center;justify-content:center;gap:.5rem}.flashcard-history-close.child-action-with-icon--close{width:auto;min-width:7rem;height:auto;padding:.5rem .75rem}.fit-shape-link-btn.child-action-with-icon--menu{border:2px solid color-mix(in srgb,var(--app-secondary) 70%,var(--app-border));background:var(--app-secondary);color:#fff}.child-level-button .child-button-icon{font-size:1.35rem}body[data-theme=cyber] .home-header-row,body[data-theme=cyber] .child-play-header{background:color-mix(in srgb,#0f1830 96%,transparent);border-color:#315a82}body[data-theme=cyber] .child-action-with-icon--back{background:#12213f;border-color:#3a628b;color:#e6f9ff}body[data-theme=cyber] .child-action-with-icon--portal,body[data-theme=cyber] .child-action-with-icon--menu{color:#041322}@media (max-width: 25rem){.home-header-row{gap:.45rem;padding:.55rem}.child-action-with-icon--portal,.child-action-with-icon--back,.child-action-with-icon--menu,.child-action-with-icon--close{padding-right:.68rem;padding-left:.68rem;font-size:.84rem}.child-page-title{font-size:1.05rem}.child-play-header #btn-back-home{min-width:6.2rem}}@media (prefers-reduced-motion: reduce){.child-action-with-icon--portal,.child-action-with-icon--back,.child-action-with-icon--menu,.child-action-with-icon--close{transition:none}}@media (forced-colors: active){.home-header-row,.child-play-header,.child-action-with-icon--portal,.child-action-with-icon--back,.child-action-with-icon--menu,.child-action-with-icon--close{border:2px solid ButtonText}}.clock-reading-experience{position:absolute;top:0;right:0;bottom:0;left:0;z-index:8;overflow-y:auto;background:var(--app-bg);color:var(--app-text);padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));-webkit-overflow-scrolling:touch}.clock-reading-shell{width:min(100%,720px);margin:0 auto}.clock-reading-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.clock-reading-header h2{margin:.15rem 0 0;color:var(--app-heading);font-size:clamp(1.25rem,5vw,1.75rem)}.clock-reading-step{margin:0;color:var(--app-primary-strong);font-size:.78rem;font-weight:900;letter-spacing:.08em}.clock-reading-back,.clock-reading-levels button,.clock-reading-sub,.clock-reading-choice,.clock-reading-actions button,.clock-reading-primary{min-height:48px;border:1px solid var(--app-border);border-radius:1rem;font:inherit;font-weight:800;cursor:pointer}.clock-reading-back{flex:0 0 auto;background:var(--app-surface);color:var(--app-text);padding:.65rem .9rem}.clock-reading-screen{display:none}.clock-reading-screen.is-active{display:flex;flex-direction:column;align-items:center}.clock-reading-screen h3{margin:.4rem 0 .7rem;color:var(--app-heading);text-align:center;font-size:clamp(1.15rem,4.5vw,1.55rem)}.clock-reading-hero{font-size:clamp(4rem,22vw,7rem);line-height:1}.clock-reading-limit{margin:0 0 1rem;border-radius:999px;background:color-mix(in srgb,var(--app-primary-soft) 18%,var(--app-surface));color:var(--app-heading);padding:.5rem .85rem;font-weight:800;text-align:center}.clock-reading-levels{width:min(100%,520px);display:grid;gap:.7rem}.clock-reading-levels button{width:100%;background:var(--app-surface);color:var(--app-heading);padding:.8rem 1rem;font-size:1.05rem;box-shadow:0 4px color-mix(in srgb,var(--app-border) 80%,transparent)}.clock-reading-levels button:nth-child(1){border-color:color-mix(in srgb,#22c55e 55%,var(--app-border))}.clock-reading-levels button:nth-child(2){border-color:color-mix(in srgb,#f59e0b 55%,var(--app-border))}.clock-reading-levels button:nth-child(3){border-color:color-mix(in srgb,#8b5cf6 55%,var(--app-border))}.clock-reading-levels small{display:inline-block;margin-top:.2rem;color:var(--app-subtext);font-size:.8rem}.clock-reading-sub{margin-top:1rem;background:var(--app-surface-soft);color:var(--app-text);padding:.65rem 1rem}.clock-reading-status{width:min(100%,560px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem;text-align:center}.clock-reading-status span{border:1px solid var(--app-border);border-radius:.8rem;background:var(--app-surface);padding:.5rem .3rem;font-size:.82rem}.clock-reading-timer-track{width:min(100%,560px);height:.7rem;margin-top:.55rem;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--app-border) 80%,transparent)}.clock-reading-timer-fill{width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#22c55e,#f59e0b,#ef4444)}.clock-reading-instruction{margin:.8rem 0 .4rem;color:var(--app-heading);font-weight:900}.clock-face-wrap{width:min(60vw,280px);min-width:210px;aspect-ratio:1}.clock-face{width:100%;height:100%;overflow:visible}.clock-face-ring{fill:var(--app-surface);stroke:var(--app-primary);stroke-width:7}.clock-face-ticks line{stroke:var(--app-text);stroke-width:4;stroke-linecap:round}.clock-face text{fill:var(--app-heading);font-size:18px;font-weight:900;dominant-baseline:middle}.clock-hand{stroke-linecap:round}.clock-hand--hour{stroke:var(--app-heading);stroke-width:10}.clock-hand--minute{stroke:var(--app-secondary);stroke-width:6}.clock-center{fill:var(--app-primary-strong)}.clock-reading-choices{width:min(100%,560px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin-top:.6rem}.clock-reading-choice{background:var(--app-surface);color:var(--app-heading);padding:.8rem .35rem;font-size:clamp(.9rem,3.5vw,1.15rem);box-shadow:0 4px color-mix(in srgb,var(--app-primary) 35%,var(--app-border))}.clock-reading-back:active,.clock-reading-levels button:active,.clock-reading-sub:active,.clock-reading-choice:active,.clock-reading-actions button:active,.clock-reading-primary:active{transform:translateY(2px);box-shadow:none}.clock-reading-feedback{min-height:2.2rem;margin-top:.6rem;border-radius:999px;padding:.45rem .85rem;font-weight:900}.clock-reading-feedback.is-correct{background:#dcfce7;color:#166534}.clock-reading-feedback.is-wrong{background:#fee2e2;color:#991b1b}.clock-reading-history{width:min(100%,560px);display:grid;gap:.55rem}.clock-reading-history-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.75rem;border:1px solid var(--app-border);border-radius:.9rem;background:var(--app-surface);padding:.75rem}.clock-reading-history-item div{display:flex;flex-direction:column}.clock-reading-history-item span,.clock-reading-history-item p{margin:0;color:var(--app-subtext);font-size:.78rem}.clock-reading-history-item b{color:var(--app-primary-strong)}.clock-reading-empty{color:var(--app-muted);text-align:center}.clock-reading-actions{display:flex;gap:.7rem;margin-top:1rem}.clock-reading-actions button,.clock-reading-primary{background:var(--app-surface);color:var(--app-text);padding:.65rem 1rem}.clock-reading-actions .clock-reading-danger{border-color:#fca5a5;background:#fff1f2;color:#be123c}.clock-reading-finish{font-size:4.5rem}.clock-reading-result-card{width:min(100%,340px);border:2px solid color-mix(in srgb,var(--app-primary) 55%,var(--app-border));border-radius:1.2rem;background:var(--app-surface);padding:1rem;text-align:center}.clock-reading-result-card strong{color:var(--app-primary-strong);font-size:3rem}.clock-reading-result-card span{margin-left:.3rem;font-weight:800}.clock-reading-result-card p{margin:.5rem 0 0;color:var(--app-subtext);font-weight:700}.clock-reading-primary{margin-top:1rem;border-color:var(--app-primary);background:var(--app-primary);color:#fff}body[data-theme=cyber] .clock-reading-feedback.is-correct{background:#133127;color:#bbf7d0}body[data-theme=cyber] .clock-reading-feedback.is-wrong,body[data-theme=cyber] .clock-reading-actions .clock-reading-danger{background:#3a1620;color:#fecdd3}@media (min-width: 640px){.clock-reading-levels{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 420px){.clock-reading-header{align-items:flex-start}.clock-reading-back{padding-inline:.7rem}.clock-reading-status span{font-size:.72rem}.clock-reading-choices{grid-template-columns:1fr}.clock-reading-choice{min-height:52px}}@media (prefers-reduced-motion: reduce){.clock-reading-timer-fill,.clock-reading-choice,.clock-reading-levels button{transition:none}}@media (forced-colors: active){.clock-face-ring,.clock-face-ticks line,.clock-hand,.clock-center{forced-color-adjust:auto}}.pencil-practice-experience{position:absolute;top:0;right:0;bottom:0;left:0;z-index:9;overflow-y:auto;background:var(--app-bg);color:var(--app-text);padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));-webkit-overflow-scrolling:touch}.pencil-practice-shell{width:min(100%,720px);margin:0 auto}.pencil-practice-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.pencil-practice-header h2{margin:.15rem 0 0;color:var(--app-heading);font-size:clamp(1.25rem,5vw,1.75rem)}.pencil-practice-step{margin:0;color:var(--app-primary-strong);font-size:.78rem;font-weight:900;letter-spacing:.08em}.pencil-practice-back,.pencil-practice-levels button,.pencil-practice-sub,.pencil-practice-game-actions button,.pencil-practice-actions button,.pencil-practice-menu{min-height:48px;border:1px solid var(--app-border);border-radius:1rem;font:inherit;font-weight:800;cursor:pointer}.pencil-practice-back{flex:0 0 auto;background:var(--app-surface);color:var(--app-text);padding:.65rem .9rem}.pencil-practice-screen{display:none}.pencil-practice-screen.is-active{display:flex;flex-direction:column;align-items:center}.pencil-practice-screen h3{margin:.45rem 0 .55rem;color:var(--app-heading);text-align:center;font-size:clamp(1.15rem,4.5vw,1.55rem)}.pencil-practice-hero{font-size:clamp(3.4rem,18vw,6rem);line-height:1}.pencil-practice-limit{margin:0 0 1rem;border-radius:999px;background:color-mix(in srgb,var(--app-primary-soft) 18%,var(--app-surface));color:var(--app-heading);padding:.5rem .85rem;font-weight:800;text-align:center}.pencil-practice-levels{width:min(100%,560px);display:grid;gap:.7rem}.pencil-practice-levels button{width:100%;background:var(--app-surface);color:var(--app-heading);padding:.85rem 1rem;font-size:1.02rem;box-shadow:0 4px color-mix(in srgb,var(--app-border) 80%,transparent)}.pencil-practice-levels button:nth-child(1){border-color:color-mix(in srgb,#22c55e 55%,var(--app-border))}.pencil-practice-levels button:nth-child(2){border-color:color-mix(in srgb,#f59e0b 55%,var(--app-border))}.pencil-practice-levels button:nth-child(3){border-color:color-mix(in srgb,#8b5cf6 55%,var(--app-border))}.pencil-practice-levels small{display:inline-block;margin-top:.2rem;color:var(--app-subtext);font-size:.78rem}.pencil-practice-sub{margin-top:1rem;background:var(--app-surface-soft);color:var(--app-text);padding:.65rem 1rem}.pencil-practice-progress{width:min(100%,560px);display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.7rem}.pencil-practice-progress strong{min-width:3.8rem;color:var(--app-heading);font-size:.9rem;text-align:center}.pencil-practice-progress-track{height:.72rem;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--app-border) 80%,transparent)}.pencil-practice-progress-fill{width:20%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#22c55e,#f59e0b);transition:width .22s ease}.pencil-practice-hint{min-height:1.5rem;margin:0 0 .55rem;color:var(--app-subtext);font-weight:700;text-align:center}.pencil-practice-canvas-wrap{width:min(82vw,390px);min-width:250px;aspect-ratio:1;overflow:hidden;border:6px solid color-mix(in srgb,var(--app-primary) 65%,var(--app-border));border-radius:1.25rem;background:var(--app-surface);box-shadow:0 6px color-mix(in srgb,var(--app-primary) 30%,var(--app-border))}.pencil-practice-canvas-wrap canvas{width:100%;height:100%;display:block;touch-action:none;user-select:none;-webkit-user-select:none}.pencil-practice-feedback{min-height:2.2rem;margin-top:.65rem;border-radius:999px;padding:.45rem .85rem;font-weight:900;text-align:center}.pencil-practice-feedback.is-positive{background:#dcfce7;color:#166534}.pencil-practice-feedback.is-notice{background:#fef3c7;color:#92400e}.pencil-practice-game-actions{width:min(100%,560px);display:grid;grid-template-columns:1fr 1.2fr;gap:.7rem;margin-top:.7rem}.pencil-practice-game-actions button,.pencil-practice-actions button,.pencil-practice-menu{background:var(--app-surface);color:var(--app-text);padding:.7rem 1rem}.pencil-practice-game-actions .pencil-practice-primary,.pencil-practice-menu{border-color:var(--app-primary);background:var(--app-primary);color:#fff}.pencil-practice-back:active,.pencil-practice-levels button:active,.pencil-practice-sub:active,.pencil-practice-game-actions button:active,.pencil-practice-actions button:active,.pencil-practice-menu:active{transform:translateY(2px);box-shadow:none}.pencil-practice-history{width:min(100%,560px);display:grid;gap:.55rem}.pencil-practice-history-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.75rem;border:1px solid var(--app-border);border-radius:.9rem;background:var(--app-surface);padding:.75rem}.pencil-practice-history-item div{display:flex;flex-direction:column}.pencil-practice-history-item span,.pencil-practice-history-item p{margin:0;color:var(--app-subtext);font-size:.78rem}.pencil-practice-history-item b{color:var(--app-primary-strong)}.pencil-practice-empty{color:var(--app-muted);text-align:center}.pencil-practice-actions{display:flex;gap:.7rem;margin-top:1rem}.pencil-practice-actions .pencil-practice-danger{border-color:#fca5a5;background:#fff1f2;color:#be123c}.pencil-practice-finish{font-size:4.5rem}.pencil-practice-result-card{width:min(100%,350px);border:2px solid color-mix(in srgb,var(--app-primary) 55%,var(--app-border));border-radius:1.2rem;background:var(--app-surface);padding:1rem;text-align:center}.pencil-practice-stars{min-height:2rem;margin-bottom:.2rem;font-size:1.75rem;letter-spacing:.08em}.pencil-practice-result-card strong{color:var(--app-primary-strong);font-size:3rem}.pencil-practice-result-card span{margin-left:.3rem;font-weight:800}.pencil-practice-result-card p{margin:.5rem 0 0;color:var(--app-subtext);font-weight:700}.pencil-practice-menu{margin-top:1rem}body[data-theme=cyber] .pencil-practice-feedback.is-positive{background:#133127;color:#bbf7d0}body[data-theme=cyber] .pencil-practice-feedback.is-notice{background:#3d2e0f;color:#fde68a}body[data-theme=cyber] .pencil-practice-actions .pencil-practice-danger{background:#3a1620;color:#fecdd3}@media (min-width: 640px){.pencil-practice-levels{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 420px){.pencil-practice-header{align-items:flex-start}.pencil-practice-back{padding-inline:.7rem}.pencil-practice-canvas-wrap{width:min(88vw,360px);min-width:230px}.pencil-practice-game-actions{grid-template-columns:1fr}.pencil-practice-game-actions button{min-height:52px}}@media (prefers-reduced-motion: reduce){.pencil-practice-progress-fill,.pencil-practice-levels button,.pencil-practice-game-actions button{transition:none}}@media (forced-colors: active){.pencil-practice-canvas-wrap,.pencil-practice-feedback,.pencil-practice-result-card{forced-color-adjust:auto}}.pencil-video-history-actions{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.pencil-video-history-actions button,.pencil-video-heading button,.pencil-video-actions button{min-height:48px;border:1px solid var(--app-border);border-radius:.9rem;background:var(--app-surface-soft);color:var(--app-text);padding:.6rem .75rem;font:inherit;font-weight:800;cursor:pointer}.pencil-video-history-actions button:disabled{cursor:not-allowed;opacity:.55}.pencil-video-result-button{margin-top:.65rem}.pencil-video-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:grid;place-items:center;overflow-y:auto;background:#0f172ab8;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}.pencil-video-overlay.hidden{display:none}.pencil-video-panel{width:min(100%,680px);border:2px solid var(--app-border);border-radius:1.25rem;background:var(--app-bg);color:var(--app-text);padding:clamp(.75rem,3vw,1.25rem);box-shadow:0 24px 70px #0f172a52}.pencil-video-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;margin-bottom:.75rem}.pencil-video-heading h3,.pencil-video-heading p{margin:0}.pencil-video-heading p{color:var(--app-primary-strong);font-size:.82rem;font-weight:900}.pencil-video-heading h3{margin-top:.2rem;color:var(--app-heading);font-size:clamp(1.15rem,5vw,1.5rem)}.pencil-video-canvas-wrap{width:min(100%,540px);margin:0 auto;overflow:hidden;border:2px solid var(--app-border);border-radius:1rem;background:var(--app-surface);aspect-ratio:1}.pencil-video-canvas-wrap canvas{display:block;width:100%;height:100%}.pencil-video-status{min-height:1.5rem;margin:.7rem 0 0;color:var(--app-subtext);font-weight:800;text-align:center}.pencil-video-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-top:.7rem}.pencil-video-actions button:last-child{border-color:var(--app-primary);background:var(--app-primary);color:#fff}.pencil-video-actions button:disabled{cursor:progress;opacity:.65}@media (max-width: 420px){.pencil-video-history-actions,.pencil-video-actions{grid-template-columns:1fr}.pencil-video-heading{align-items:center}.pencil-video-heading button{flex:0 0 auto;min-height:44px;padding-inline:.65rem}}@media (forced-colors: active){.pencil-video-panel,.pencil-video-canvas-wrap,.pencil-video-history-actions button{border:2px solid CanvasText}}.pencil-practice-progress--timed{grid-template-columns:auto minmax(0,1fr) auto;width:min(100%,590px)}.pencil-practice-progress--timed .pencil-practice-progress-fill{width:100%;background:linear-gradient(90deg,#22c55e,#f59e0b,#ef4444)}.pencil-practice-timer{min-width:3.3rem!important;border-radius:999px;background:color-mix(in srgb,var(--app-primary-soft) 20%,var(--app-surface));padding:.38rem .55rem;font-size:1rem!important;font-variant-numeric:tabular-nums}.pencil-practice-skip{border-color:color-mix(in srgb,#f59e0b 58%,var(--app-border))!important;background:color-mix(in srgb,#fef3c7 65%,var(--app-surface))!important;color:#92400e!important}.pencil-practice-history-item--timed{grid-template-columns:minmax(0,1fr) auto auto}.pencil-practice-history-item--timed>span{grid-column:1/-1}.pencil-practice-history-item--timed .pencil-video-history-actions{grid-column:1/-1}.pencil-practice-result-card [data-role=result-count]{display:inline}.pencil-video-result-button:disabled{display:none}body[data-theme=cyber] .pencil-practice-skip{background:#3d2e0f!important;color:#fde68a!important}@media (max-width: 420px){.pencil-practice-progress--timed{grid-template-columns:auto minmax(0,1fr) auto;gap:.4rem}.pencil-practice-progress--timed strong{min-width:2.9rem;font-size:.82rem}.pencil-practice-timer{padding-inline:.42rem}}
