:root{color:#24324a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--ink:#24324a;--muted:#667085;--surface:#fff;--primary:#6558d3;--primary-dark:#5045b5;--primary-soft:#eeeafd;--accent:#ffb84d;--page-bg:#f7f4ff;--card-bg:#fffffff0;--tile-bg:#fff;--tile-border:#d9d4f4;--track-bg:#e8e5f4;--overlay-bg:#ffffffc7;--soft-overlay-bg:#ffffff4d;--on-primary:#fff;--danger:#912018;--danger-border:#b42318;--best-color:#8a4f00;background:#f7f4ff;font-family:Inter,ui-rounded,Segoe UI,system-ui,sans-serif}:root[data-theme=dark]{color:#f4f1ff;--ink:#f4f1ff;--muted:#c9c3df;--surface:#2a2542;--primary:#9d90ff;--primary-dark:#c0b7ff;--primary-soft:#342e52;--accent:#ffc66d;--page-bg:#171426;--card-bg:#211d34f7;--tile-bg:#2a2542;--tile-border:#554d78;--track-bg:#48415f;--overlay-bg:#171426d6;--soft-overlay-bg:#17142673;--on-primary:#171426;--danger:#ffaaa3;--danger-border:#ff8178;--best-color:#ffd089;background:#171426}*{box-sizing:border-box}body{background:radial-gradient(circle at 10% 5%, #ffb84d33, transparent 28%), radial-gradient(circle at 90% 15%, #6558d32e, transparent 30%), var(--page-bg);min-width:320px;min-height:100vh;margin:0}button{font:inherit}button:focus-visible{outline:4px solid var(--primary-dark);outline-offset:3px;box-shadow:0 0 0 7px #ffb84da6}#root{min-height:100vh}.app{background:var(--card-bg);text-align:center;border:1px solid #6558d324;border-radius:28px;width:min(100% - 24px,620px);min-height:calc(100vh - 32px);margin:16px auto;padding:24px clamp(14px,4vw,32px) 30px;position:relative;box-shadow:0 18px 50px #41357e1f}.top-controls{justify-content:space-between;align-items:center;display:flex;position:absolute;top:18px;left:20px;right:20px}.theme-toggle,.language-toggle,.settings-toggle{border:1px solid var(--tile-border);background:var(--surface);min-height:38px;color:var(--ink);cursor:pointer;border-radius:999px;justify-content:center;align-items:center;gap:5px;padding:7px 10px;font-size:13px;font-weight:750;display:inline-flex}.theme-toggle:hover,.language-toggle:hover,.settings-toggle:hover{background:var(--primary-soft)}.language-toggle{min-width:44px}.app h1{color:var(--ink);letter-spacing:-1.5px;margin:0;font-size:clamp(32px,8vw,46px);line-height:1.05}.tagline{color:var(--primary);margin:6px 0 4px;font-size:19px;font-weight:800}.active-mode{color:var(--primary);margin:0 0 8px;font-size:15px;font-weight:850}.settings-panel{z-index:30;border:1px solid var(--tile-border);background:var(--surface);border-radius:16px;flex-direction:column;justify-content:center;align-items:stretch;gap:14px;width:min(100% - 40px,330px);padding:14px;display:flex;position:absolute;top:64px;right:20px;box-shadow:0 14px 34px #241c4c3d}.settings-panel:before{border-top:1px solid var(--tile-border);border-left:1px solid var(--tile-border);background:var(--surface);content:"";width:12px;height:12px;position:absolute;top:-7px;right:28px;transform:rotate(45deg)}.instructions{min-height:24px;color:var(--muted);margin:0 auto 14px;font-size:15px}.mode-selector,.level-selector{justify-content:center;align-items:center;gap:10px;margin:0 0 16px;display:flex}.mode-selector label,.level-selector label{color:var(--ink);font-size:14px;font-weight:800}.mode-selector select,.level-selector select{border:2px solid var(--primary);background:var(--surface);width:min(100%,280px);min-height:44px;color:var(--primary-dark);cursor:pointer;border-radius:14px;padding:8px 38px 8px 14px;font-size:15px;font-weight:800;transition:background-color .15s,border-color .15s}.mode-selector select:hover:not(:disabled),.level-selector select:hover:not(:disabled){background:var(--primary-soft)}.mode-selector select:disabled{cursor:not-allowed;opacity:.62}.level-selector{justify-content:center;align-items:center;gap:10px;margin:-8px 0 16px;display:flex}.timer{min-height:26px;color:var(--muted);font-variant-numeric:tabular-nums;justify-content:center;gap:18px;font-size:16px;font-weight:750;display:flex}.best-time{color:var(--primary)}.best-time-button{font:inherit;text-underline-offset:4px;cursor:pointer;background:0 0;border:0;padding:0 2px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.best-time-button:hover{color:var(--primary-dark);text-decoration-style:solid}.action-area{justify-content:center;align-items:center;min-height:58px;display:flex}.start-button,.play-again{background:var(--primary);min-height:46px;box-shadow:0 5px 0 var(--primary-dark);color:var(--on-primary);cursor:pointer;border:0;border-radius:14px;padding:10px 24px;font-size:17px;font-weight:800}.cancel-button{border:2px solid var(--danger-border);background:var(--tile-bg);min-height:44px;color:var(--danger);cursor:pointer;border-radius:14px;padding:9px 18px;font-size:15px;font-weight:800}.cancel-button:hover{background:var(--primary-soft)}.round-active .action-area{min-height:48px}.round-active .cancel-button{border-width:1px;min-height:36px;padding:6px 12px;font-size:13px}.start-button:hover,.play-again:hover{background:var(--primary-dark)}.start-button:active,.play-again:active{box-shadow:0 2px 0 var(--primary-dark);transform:translateY(3px)}.target{justify-content:center;align-items:center;gap:14px;margin:4px auto 18px;display:flex}.target-label{color:var(--ink);letter-spacing:3px;font-size:19px;font-weight:850}.target-number{background:var(--primary);width:68px;height:68px;box-shadow:0 7px 0 var(--primary-dark);color:var(--on-primary);border-radius:18px;justify-content:center;align-items:center;font-size:38px;font-weight:900;display:flex}.question-target{min-height:68px}.question-target .target-label{letter-spacing:0;font-size:22px}.more-emphasis{color:var(--accent);text-shadow:0 1px 0 var(--primary-dark);font-weight:950}.order-target{flex-direction:column;gap:8px}.order-target .target-label{letter-spacing:0}.order-sequence{max-width:min(100%,520px);color:var(--primary);font-variant-numeric:tabular-nums;text-align:center;font-size:clamp(18px,4vw,24px);font-weight:850;line-height:1.35}.grid-wrapper{width:fit-content;margin:0 auto;position:relative}.grid-wrapper.comparison-wrapper{box-sizing:border-box;width:min(100% - 24px,680px)}.grid-wrapper.equivalence-wrapper{box-sizing:border-box;width:min(100% - 24px,520px)}.preview-board{opacity:.78;margin-top:10px}.preview-board .number-box{opacity:1}.grid{grid-template-columns:repeat(4,70px);justify-content:center;gap:8px;display:grid}.grid.grid-small{grid-template-columns:repeat(3,70px)}.grid.grid-emojis{grid-template-columns:repeat(3,92px)}.grid.grid-ten-frames{grid-template-columns:repeat(2,132px);gap:10px}.grid.grid-number-order{grid-template-columns:repeat(4,76px)}.grid-number-order .number-box{width:76px;height:76px}.grid-number-order .number-box:nth-child(9){grid-column:2}.comparison-grid{box-sizing:border-box;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,4vw,32px);width:100%;display:grid}.comparison-choice{justify-items:stretch;gap:8px;min-width:0;display:grid}.comparison-choice-label{color:var(--primary);text-align:center;font-size:clamp(24px,4vw,34px);font-weight:900;line-height:1}.number-box.comparison-box{box-sizing:border-box;width:100%;height:clamp(170px,27vw,250px);padding:clamp(10px,2vw,20px);overflow:hidden}.comparison-box .emoji-pattern{grid-template-columns:repeat(3,minmax(0,1fr));justify-items:center;gap:clamp(3px,1vw,10px);width:100%;max-width:260px;font-size:clamp(36px,6vw,58px)}.comparison-box .emoji-pattern span{place-items:center;width:clamp(42px,7vw,68px);height:clamp(42px,7vw,68px);display:grid}.missing-board{justify-items:center;gap:12px;display:grid}.equivalence-board{justify-items:center;gap:14px;width:100%;display:grid}.equivalence-label{color:var(--ink);font-size:clamp(18px,4vw,23px);font-weight:850}.equivalence-prompt{box-sizing:border-box;border:2px solid var(--primary);background:var(--primary-soft);width:min(100%,390px);min-height:92px;color:var(--ink);font-variant-numeric:tabular-nums;border-radius:18px;place-items:center;padding:14px 18px;font-size:clamp(34px,8vw,48px);font-weight:900;display:grid}.equivalence-prompt.revealed{color:var(--primary);font-size:clamp(20px,5vw,30px)}.equivalence-answers{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:min(100%,350px);display:grid}.number-box.equivalence-answer{box-sizing:border-box;font-variant-numeric:tabular-nums;width:100%;height:76px;padding:8px;font-size:clamp(21px,5vw,28px)}.equivalence-entry{text-align:left;gap:6px;width:min(100%,390px);display:grid}.equivalence-entry label{color:var(--ink);font-size:14px;font-weight:800}.equivalence-entry>div{gap:8px;display:flex}.equivalence-entry input{border:2px solid var(--tile-border);background:var(--surface);min-width:0;color:var(--ink);border-radius:12px;flex:1;padding:10px 12px;font-size:22px;font-weight:800}.equivalence-entry button,.equivalence-hints button,.next-question-button{background:var(--primary);min-height:44px;color:var(--on-primary);cursor:pointer;border:0;border-radius:12px;padding:9px 14px;font-weight:800}.equivalence-entry button:disabled,.equivalence-hints button:disabled{cursor:default;opacity:.55}.equivalence-feedback{color:var(--danger);margin:0;font-weight:800}.equivalence-hints,.worked-solution{box-sizing:border-box;background:var(--primary-soft);width:min(100%,430px);color:var(--ink);border-radius:14px;padding:12px 14px}.equivalence-hints p,.worked-solution p{margin:0 0 8px;line-height:1.4}.hint-equation,.worked-solution li{color:var(--primary-dark);font-variant-numeric:tabular-nums;font-size:18px;font-weight:850}.worked-solution ol{text-align:left;gap:7px;margin:0 0 14px;padding-left:28px;display:grid}.missing-question-card{border:1px solid var(--tile-border);background:var(--primary-soft);border-radius:18px;padding:18px 22px}.missing-sequence{justify-content:center;align-items:center;gap:8px;display:flex}.missing-sequence span{background:var(--primary-soft);width:56px;height:56px;color:var(--ink);border-radius:13px;place-items:center;font-size:25px;font-weight:850;display:grid}.missing-sequence .sequence-blank{border:2px dashed var(--primary);color:var(--primary)}.missing-answer-prompt{color:var(--muted);margin:8px 0 0;font-size:16px;font-weight:800}.missing-sequence .revealed-number{border-style:solid;animation:.45s ease-out fill-missing-number}@keyframes fill-missing-number{0%{opacity:0;transform:translateY(34px)scale(.82)}to{opacity:1;transform:translateY(0)scale(1)}}.missing-answers{grid-template-columns:repeat(4,64px);gap:10px;display:grid}.missing-answers .number-box{width:64px;height:64px}.number-box{border:2px solid var(--tile-border);background:var(--tile-bg);width:70px;height:70px;box-shadow:0 4px 0 var(--tile-border);color:var(--ink);cursor:pointer;border-radius:15px;font-size:22px;font-weight:850;transition:background-color .12s,transform .12s}.number-box:hover:not(:disabled){background:var(--primary-soft);transform:translateY(-2px)}.number-box:active:not(:disabled){box-shadow:0 1px 0 var(--tile-border);transform:translateY(3px)}.number-box:disabled{cursor:default;opacity:.82}.number-box.completed-number{border-color:var(--primary);background:var(--primary-soft);box-shadow:none;color:var(--primary);opacity:.48}.number-box.emoji-box{width:92px;height:92px}.number-box.ten-frame-box{width:132px;height:72px}.dot-pattern{grid-template-rows:repeat(3,12px);grid-template-columns:repeat(3,12px);place-content:center;gap:5px;display:grid}.dot,.dot-space{width:12px;height:12px}.dot{background:var(--ink);border-radius:50%}.emoji-pattern{grid-template-columns:repeat(3,24px);justify-content:center;align-items:center;gap:2px;font-size:23px;line-height:1;display:grid}.ten-frame{grid-template-rows:repeat(2,18px);grid-template-columns:repeat(5,18px);justify-content:center;gap:3px;display:grid}.ten-frame-dot{border:2px solid var(--muted);border-radius:4px;width:18px;height:18px}.ten-frame-dot.filled{border-color:var(--primary);background:var(--primary);border-radius:50%}.progress-container{background:var(--track-bg);border-radius:999px;width:304px;height:12px;margin:18px auto 0;overflow:hidden}.progress-container.small{width:226px}.progress-container.emojis{width:292px}.progress-container.ten-frames{width:274px}.progress-bar{border-radius:inherit;background:linear-gradient(90deg, var(--primary), #8a7ff0);height:100%;transition:width .2s}.results{background:var(--primary-soft);min-height:150px;color:var(--ink);border-radius:18px;margin-top:18px;padding:16px}.results h3{margin:0 0 6px;font-size:23px}.results p{margin:4px 0 12px}.results .new-best{color:var(--best-color);font-weight:850}.play-again{margin-top:6px}.countdown-overlay{z-index:10;background:var(--overlay-bg);color:var(--primary);border-radius:22px;justify-content:center;align-items:center;font-size:72px;font-weight:900;display:flex;position:absolute;inset:-6px}.wrong-answer-overlay{z-index:100;background:var(--soft-overlay-bg);cursor:not-allowed;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.wrong-answer-overlay span{color:#dc2626d1;text-shadow:0 8px 24px #7f1d1d40;font-size:clamp(180px,45vw,420px);font-weight:900;line-height:.75}.best-scores-backdrop{z-index:120;background:#171426b8;justify-content:center;align-items:center;padding:18px;display:flex;position:fixed;inset:0}.best-scores-dialog{border:2px solid var(--primary);background:var(--surface);width:min(100%,430px);max-height:calc(100dvh - 36px);color:var(--ink);border-radius:22px;padding:24px;overflow-y:auto;box-shadow:0 22px 60px #120d2d61}.best-scores-dialog h2{color:var(--primary);margin:0 0 18px;font-size:25px}.best-scores-nickname-row{justify-content:space-between;align-items:baseline;gap:10px;margin:-10px 0 16px;display:flex}.best-scores-nickname{min-width:0;color:var(--ink);overflow-wrap:anywhere;margin:0;font-size:20px;font-weight:850}.best-scores-list{gap:9px;display:grid}.best-score-row{background:var(--primary-soft);text-align:left;border-radius:12px;justify-content:space-between;align-items:center;gap:16px;padding:11px 13px;display:flex}.best-score-row span{font-size:14px;font-weight:750}.best-score-row strong{color:var(--best-color);font-variant-numeric:tabular-nums;flex:none}.best-scores-challenge{color:var(--ink);margin:20px 0 2px;font-size:18px;font-weight:850}.best-scores-site{color:var(--muted);margin:0 0 18px;font-size:13px}.nickname-form{text-align:left;gap:5px;margin:0 0 18px;display:grid}.nickname-form label{font-size:14px;font-weight:800}.nickname-hint,.nickname-error{color:var(--muted);font-size:12px;line-height:1.35}.nickname-error{color:#c62828;font-weight:750}.nickname-controls{gap:7px;display:flex}.nickname-controls input{border:1px solid var(--muted);background:var(--surface);min-width:0;color:var(--ink);font:inherit;border-radius:10px;flex:1;padding:9px 10px}.nickname-controls button,.nickname-remove{color:var(--on-primary);background:var(--primary);cursor:pointer;border:0;border-radius:10px;font-weight:750}.nickname-remove{color:var(--primary);background:0 0;flex:none;padding:5px 9px;font-size:12px;text-decoration:underline}.best-scores-close{background:var(--primary);min-height:42px;color:var(--on-primary);cursor:pointer;border:0;border-radius:12px;padding:8px 20px;font-weight:800}.creator-credit{color:var(--muted);border-top:1px solid #6558d31f;margin-top:52px;padding-top:18px;font-size:13px}.footer-meta{justify-content:center;gap:7px;margin-top:8px;display:flex}.reset-best-button{border:1px solid var(--tile-border);background:var(--surface);min-height:38px;color:var(--ink);cursor:pointer;border-radius:10px;padding:7px 10px;font-size:13px;font-weight:750}.reset-best-button:hover{color:var(--primary-dark)}.reset-confirmation{width:min(100%,300px)}.reset-confirmation p{color:var(--ink);margin:0 0 12px;font-size:14px;font-weight:700}.reset-confirmation-actions{justify-content:center;gap:10px;display:flex}.reset-confirmation-actions button{border:1px solid var(--tile-border);background:var(--tile-bg);min-height:38px;color:var(--ink);cursor:pointer;border-radius:10px;padding:7px 12px;font-weight:750}.reset-confirmation-actions .confirm-reset-button{border-color:var(--danger-border);color:var(--danger)}.creator-credit a{color:var(--primary-dark);text-underline-offset:3px;font-weight:700}.creator-credit a:hover{color:var(--primary)}@media (width<=420px){.app{border:0;border-radius:0;width:100%;min-height:100vh;margin:0;padding:18px 10px 26px}.top-controls{margin-bottom:12px;position:static}.settings-panel{width:min(100% - 20px,330px);top:66px;right:10px}.mode-selector,.level-selector{flex-direction:column;align-items:stretch;gap:5px}.mode-selector select,.level-selector select{width:min(100%,300px);margin:0 auto}.comparison-grid{gap:10px}.number-box.comparison-box{height:160px;padding:8px}.comparison-box .emoji-pattern{gap:2px;font-size:30px}.comparison-box .emoji-pattern span{width:36px;height:36px}.missing-sequence span{width:52px;height:52px}}@media (width<=350px){.grid{grid-template-columns:repeat(4,66px);gap:6px}.number-box{width:66px;height:66px}.grid.grid-emojis{grid-template-columns:repeat(3,90px)}.grid.grid-number-order{grid-template-columns:repeat(4,66px)}.grid-number-order .number-box{width:66px;height:66px}.number-box.emoji-box{width:90px;height:90px}.progress-container,.progress-container.emojis{width:282px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}