*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{color:#1f2937;background:linear-gradient(#7dd3fc 0%,#bbf7d0 100%);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16px;line-height:1.5}.app-shell{color:#1f2937;max-width:1200px;margin:0 auto;padding:1rem}.top-progress{z-index:20;background:#e5e7eb;border:2px solid #111827;width:100%;height:8px;margin:0 0 .8rem;position:sticky;top:0;overflow:hidden}.top-progress__bar{background:linear-gradient(90deg,#22c55e,#3b82f6);height:100%;transition:width .2s}.hero{background:linear-gradient(135deg,#0ea5e9,#22c55e);border:4px solid #111827;margin-bottom:1rem;padding:1.25rem;box-shadow:6px 6px #00000040}.hero h1{color:#111827;margin:0 0 .5rem;font-size:clamp(2rem,5vw,3rem);line-height:1.05}.hero-top{justify-content:space-between;align-items:flex-start;gap:.8rem;display:flex}.hero-menu-btn{background:#fff;border-width:3px;padding:.45rem .75rem;font-size:1rem}.hero p{color:#1f2937;margin:0;font-size:1.05rem;line-height:1.6}.story-grid,.play-layout{gap:1rem;display:grid}.story-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.story-grid .card{flex-direction:column;display:flex}.story-grid .card p{flex:1}.play-layout{grid-template-columns:1.6fr 1fr}.card{background:#fff9db;border:4px solid #111827;padding:1.1rem;box-shadow:6px 6px #0003}.play-layout .card:last-child{flex-direction:column;min-height:0;display:flex}.meta-row,.actions,.mode-switch,.score-line{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.mode-switch{z-index:12;background:#fff9db;padding:.35rem 0;position:sticky;top:14px}.tag{background:#fff;border:2px solid #111827;padding:.15rem .4rem;font-size:.95rem;font-weight:700}.difficulty-meter{align-items:center;gap:.35rem;display:inline-flex}.difficulty-block{background:#e5e7eb;border:2px solid #111827;width:14px;height:14px;box-shadow:1px 1px #11182759}.difficulty-block--active{background:#84cc16}.difficulty-label{color:#374151;margin-left:.2rem;font-size:.95rem;font-weight:700}.primary-btn,.secondary-btn,.mode,.token,.pill,.option{cursor:pointer;border:3px solid #111827;min-height:44px;font-size:1rem;line-height:1.3}.primary-btn{background:#84cc16;padding:.7rem 1rem;font-weight:700}.primary-btn:disabled{opacity:.5;cursor:not-allowed}.secondary-btn{background:#e5e7eb;padding:.7rem 1rem;font-weight:600}.story-text{margin-top:.5rem;line-height:2.1}.token{color:#1f2937;background:0 0;border:0;border-radius:.25rem;min-height:auto;margin:0 .35rem .35rem 0;padding:0 .15rem;font-size:1.05rem;line-height:1.9;transition:background-color .15s,color .15s,box-shadow .15s}.token--noun{color:#14532d;background:#dcfce7;box-shadow:inset 0 -2px #22c55e}.token--verb{color:#1e3a8a;background:#dbeafe;box-shadow:inset 0 -2px #3b82f6}.token:hover{background:#f3f4f6}.token:focus-visible{outline-offset:1px;outline:2px solid #111827}.selection-wrap{gap:.75rem;margin-top:.75rem;display:grid}.pill-wrap{flex-wrap:wrap;gap:.5rem;display:flex}.pill{padding:.45rem .7rem;font-weight:700}.pill--noun{background:#bbf7d0}.pill--verb{background:#bfdbfe}.questions{flex:1;gap:.7rem;display:grid}.question{background:#fff;border:3px solid #111827;padding:.7rem}.option-wrap{gap:.4rem;margin-top:.5rem;display:grid}.option{text-align:left;background:#f9fafb;padding:.6rem .7rem}.option--active{background:#fde047}.mode{background:#fff;padding:.45rem .65rem}.mode--active{background:#fde047}.score-box{background:#fff9db;border-top:3px solid #111827;margin-top:1rem;padding-top:.9rem}.player-controls{gap:.6rem;display:grid}.new-player-row{grid-template-columns:1fr auto;gap:.5rem;display:grid}.player-select,.player-input{color:#1f2937;background:#fff;border:3px solid #111827;border-radius:10px;width:100%;min-height:44px;padding:.45rem .55rem;font-size:1rem;box-shadow:0 2px #1118272e}.player-picker{position:relative}.player-select-trigger{color:#1f2937;background:#fff;border:3px solid #111827;border-radius:10px;justify-content:space-between;align-items:center;width:100%;min-height:44px;padding:.45rem .65rem;font-size:1rem;display:flex;box-shadow:0 2px #1118272e}.player-options{z-index:30;background:#fff;border:3px solid #111827;border-radius:10px;max-height:220px;position:absolute;top:calc(100% + .3rem);left:0;right:0;overflow-y:auto;box-shadow:0 8px 20px #0f172a2e}.player-option{color:#1f2937;text-align:left;background:#fff;border:0;border-bottom:1px solid #e5e7eb;width:100%;min-height:44px;padding:.45rem .65rem;font-size:1rem}.player-option:last-child{border-bottom:0}.player-option:hover{background:#f3f4f6}.player-option--active{color:#1e3a8a;background:#dbeafe;font-weight:700}.player-option--empty{cursor:default}.player-select:focus-visible,.player-input:focus-visible,.player-select-trigger:focus-visible{outline-offset:1px;outline:3px solid #93c5fd}.highscore-head,.highscore-row{grid-template-columns:1.5fr 1fr auto;align-items:center;gap:.5rem;font-size:.95rem;display:grid}.highscore-head{border-bottom:2px solid #111827;margin-bottom:.4rem;padding-bottom:.4rem;font-weight:700}.highscore-row{border-bottom:1px solid #d1d5db;padding:.45rem 0}.error-text{color:#991b1b;font-weight:600}.highscore-card{margin-top:1rem}.dialog-backdrop{z-index:40;background:#0f172a7a;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.dialog-card{background:#fff9db;width:min(640px,100%)}.dialog-actions{margin-top:.75rem}.result{margin-top:1rem}.big-score{margin:.2rem 0 .6rem;font-size:2rem;font-weight:800}.result-note{color:#374151;align-items:center;gap:.4rem;font-size:.95rem;display:flex}.mode-hint{color:#374151;margin:.6rem 0 .2rem;font-size:1rem}.helper-text{color:#374151;margin:.2rem 0 .5rem;font-size:.95rem;line-height:1.45}.helper-text--panel{margin-top:.55rem}h2{margin:0 0 .65rem;font-size:clamp(1.45rem,3.5vw,2.1rem);line-height:1.2}h3{color:#1f2937;margin:.2rem 0;font-size:1.1rem}@media (width<=960px){.play-layout{grid-template-columns:1fr}.app-shell{padding:.75rem}.card{padding:.9rem}.hero-top{flex-direction:column;align-items:stretch}.new-player-row{grid-template-columns:1fr}.highscore-head,.highscore-row{grid-template-columns:1fr;gap:.2rem}}.highscore-title{color:#6b7280;font-size:.85rem;display:block}.math-start{margin-top:1rem}.math-ops{margin-bottom:.9rem;position:static}.math-op-symbol{min-width:1ch;font-size:1.2rem;font-weight:800;display:inline-block}.math-level-card{background:#fff}.math-level-card h3{font-size:1.25rem}.math-card{max-width:760px;margin:0 auto}.math-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem;display:flex}.math-head h2{margin-bottom:.3rem}.math-task{background:#fff;border:3px solid #111827;flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;margin:1.2rem 0 .8rem;padding:1.2rem .5rem;font-size:clamp(2rem,7vw,3.2rem);font-weight:800;display:flex}.math-token--small{color:#374151;font-size:.55em;font-weight:700}.math-input{width:4ch;font:inherit;text-align:center;color:#111827;background:#fde047;border:3px solid #111827;padding:.05em .1em}.math-input:focus-visible{outline-offset:2px;outline:3px solid #3b82f6}.math-input:disabled{background:#f3f4f6}.math-feedback{border:3px solid #111827;justify-content:center;align-items:center;gap:.4rem;margin:.4rem 0;padding:.6rem;font-size:1.2rem;font-weight:700;display:flex}.math-feedback--correct{color:#14532d;background:#bbf7d0}.math-feedback--retry{color:#92400e;background:#fef3c7}.math-feedback--wrong{color:#7f1d1d;background:#fecaca}.math-review{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.3rem;margin:.4rem 0 1rem;padding:0;list-style:none;display:grid}.math-review li{align-items:center;gap:.4rem;font-size:1.05rem;font-weight:600;display:flex}.math-review .helper-text{margin:0}.math-review__ok{color:#15803d}.math-review__miss{color:#b91c1c}.math-task,.result{position:relative}.confetti{pointer-events:none;z-index:5;width:0;height:0;position:absolute;top:50%;left:50%}.confetti__piece{display:block;position:absolute;top:0;left:0}.countdown-btn{background:#d9f99d;position:relative;overflow:hidden}.countdown-btn__bar{background:#84cc16;width:0;animation:2.5s linear forwards countdown-fill;position:absolute;inset:0 auto 0 0}.countdown-btn__label{position:relative}@keyframes countdown-fill{to{width:100%}}.math-progress-link{margin-top:1rem}.math-saved{color:#15803d;align-items:center;gap:.35rem;font-weight:700;display:flex}.link-btn{font:inherit;color:#1d4ed8;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.progress-card h3{margin-top:1.4rem}.progress-filters{flex-wrap:wrap;align-items:flex-end;gap:.8rem;margin:.6rem 0 .4rem;display:flex}.progress-filter{gap:.25rem;min-width:200px;font-weight:700;display:grid}.progress-levels{background:0 0;padding:0;position:static}.stat-row{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin-top:1rem;display:grid}.stat-tile{background:#fff;border:3px solid #111827;gap:.2rem;padding:.7rem .8rem;display:grid}.stat-tile__label{color:#4b5563;font-size:.9rem;font-weight:700}.stat-tile__value{color:#111827;font-size:2rem;font-weight:800}.stat-tile__delta{color:#374151;align-items:center;gap:.3rem;font-size:.9rem;display:flex}.trend-chart{background:#fff;border:3px solid #111827;padding:.4rem;position:relative}.trend-chart svg{display:block;overflow:visible}.trend-chart__grid{stroke:#e5e7eb;stroke-width:1px}.trend-chart__axis{fill:#6b7280;font-size:12px}.trend-chart__line{fill:none;stroke:#2563eb;stroke-width:2px;stroke-linejoin:round;stroke-linecap:round}.trend-chart__dot{fill:#2563eb;stroke:#fff;stroke-width:2px;pointer-events:none}.trend-chart__hit{fill:#0000;cursor:pointer}.trend-chart__cross{stroke:#9ca3af;stroke-width:1px;stroke-dasharray:3 3}.trend-chart__tooltip{color:#fff;white-space:nowrap;pointer-events:none;z-index:3;background:#111827;padding:.4rem .6rem;font-size:.85rem;line-height:1.4;position:absolute;transform:translate(-50%,calc(-100% - 12px))}.op-bars{gap:.5rem;display:grid}.op-bars__row{grid-template-columns:7.5rem 1fr 3.5rem 3.5rem;align-items:center;gap:.6rem;display:grid}.op-bars__label{font-weight:700}.op-bars__track{background:#e5e7eb;border-radius:0 4px 4px 0;height:18px;overflow:hidden}.op-bars__fill{background:#2563eb;border-radius:0 4px 4px 0;height:100%;display:block}.op-bars__value{text-align:right;white-space:nowrap;font-weight:800}.op-bars__count{color:#6b7280;font-size:.85rem}.progress-table-wrap{overflow-x:auto}.progress-table{border-collapse:collapse;background:#fff;border:3px solid #111827;width:100%;font-size:.95rem}.progress-table th,.progress-table td{text-align:left;white-space:nowrap;border-bottom:1px solid #e5e7eb;padding:.45rem .6rem}.progress-table th{border-bottom:2px solid #111827}.progress-table__ops{letter-spacing:.15em;font-weight:800}@media (width<=600px){.op-bars__row{grid-template-columns:6rem 1fr 3.4rem}.stat-row{grid-template-columns:repeat(3,1fr);gap:.5rem}.stat-tile{padding:.5rem}.stat-tile__label{font-size:.8rem}.stat-tile__value{font-size:1.4rem}.op-bars__count{display:none}}
