:root{--bg:#eef1f6;--board-bg:#fff;--given-color:#1e293b;--user-color:#2563eb;--wrong-color:#dc2626;--line:#cbd5e1;--line-strong:#64748b;--selected-bg:#bfdbfe;--peer-bg:#f1f5f9;--same-bg:#dbeafe;--primary:#2563eb;--primary-active:#1d4ed8;--flash-green:#22c55e73;--flash-red:#ef444466}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;height:100%;margin:0;padding:0;overflow:hidden}body{background:var(--bg);color:var(--given-color);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,Arial,sans-serif;position:fixed;inset:0}#root{height:100dvh}.app{max-width:480px;height:100%;padding:calc(12px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));flex-direction:column;margin:0 auto;display:flex;overflow-y:auto}.status-bar{justify-content:space-between;align-items:center;gap:8px;padding:6px 2px 10px;display:flex}.status-info{align-items:baseline;gap:12px;display:flex}.difficulty-label{font-size:15px;font-weight:700}.mistakes{color:#94a3b8;font-size:13px}.mistakes.has-mistakes{color:var(--wrong-color);font-weight:700}.status-right{align-items:center;gap:10px;display:flex}.timer{font-variant-numeric:tabular-nums;color:#475569;font-size:15px;font-weight:600}.icon-button{color:#475569;cursor:pointer;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;display:flex}.icon-button:active{background:#e2e8f0}.game-main{flex-direction:column;gap:14px;display:flex}.board{background:var(--line-strong);border:2.5px solid var(--line-strong);aspect-ratio:1;border-radius:10px;grid-template-columns:repeat(9,1fr);gap:1px;width:100%;display:grid;overflow:hidden}.cell{background:var(--board-bg);cursor:pointer;justify-content:center;align-items:center;font-size:clamp(18px,5.4vw,30px);display:flex;position:relative}.cell.border-right-strong{border-right:2px solid var(--line-strong)}.cell.border-bottom-strong{border-bottom:2px solid var(--line-strong)}.cell.peer{background:var(--peer-bg)}.cell.same-number{background:var(--same-bg)}.cell.selected{background:var(--selected-bg)}.cell-value{z-index:1;line-height:1;position:relative}.cell.given .cell-value{color:var(--given-color);font-weight:700}.cell.user .cell-value{color:var(--user-color);font-weight:600}.cell.wrong .cell-value{color:var(--wrong-color);font-weight:700}.cell.same-number.given .cell-value,.cell.same-number.user .cell-value,.cell.same-number.wrong .cell-value{color:var(--primary-active)}.flash-overlay{z-index:0;pointer-events:none;position:absolute;inset:0}.flash-overlay.correct{background:var(--flash-green);border-radius:4px;animation:.7s ease-out forwards correct-pulse}.flash-overlay.wrong{background:var(--flash-red);border-radius:4px;animation:.7s ease-out forwards wrong-fade}.cell.shaking .cell-value{animation:.45s ease-in-out wrong-shake}.cell.wrong .cell-value{animation:.3s ease-out settle}@keyframes correct-pulse{0%{opacity:0;transform:scale(.75)}35%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1)}}@keyframes wrong-fade{0%{opacity:.9}to{opacity:0}}@keyframes wrong-shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}@keyframes settle{0%{transform:scale(1.35)}to{transform:scale(1)}}.number-pad{grid-template-columns:repeat(9,1fr);gap:6px;display:grid}.number-key{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:8px 0 6px;transition:background .15s,transform .1s;display:flex}.number-key:active{background:var(--selected-bg);transform:scale(.94)}.number-key:disabled{opacity:.35;cursor:default}.number-key .digit{color:var(--user-color);font-size:clamp(20px,6vw,26px);font-weight:700;line-height:1}.number-key .remaining{color:#94a3b8;min-height:13px;font-size:11px;font-weight:600;line-height:13px}.action-bar{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.action-button{color:#475569;cursor:pointer;background:0 0;border:none;border-radius:12px;flex-direction:column;align-items:center;gap:4px;padding:10px 0 8px;transition:background .15s;display:flex}.action-button:active:not(:disabled){background:#e2e8f0}.action-button:disabled{opacity:.35;cursor:default}.action-label{font-size:12px;font-weight:600}.overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:calc(24px + env(safe-area-inset-top)) calc(24px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(24px + env(safe-area-inset-left));z-index:10;background:#0f172aa6;justify-content:center;align-items:center;animation:.25s ease-out fade-in;display:flex;position:fixed;inset:0}.dialog{text-align:center;background:#fff;border-radius:20px;flex-direction:column;gap:14px;width:100%;max-width:340px;max-height:100%;padding:32px 24px;animation:.3s cubic-bezier(.34,1.56,.64,1) pop-in;display:flex;overflow-y:auto;box-shadow:0 20px 50px #0f172a4d}.dialog.won{outline:3px solid #22c55e80}.dialog.lost{outline:3px solid #ef444473}.title{letter-spacing:8px;color:var(--primary);margin:4px 0 0;font-size:40px}.subtitle{color:#64748b;margin:0;font-size:14px}.dialog-title{margin:0;font-size:26px}.result-stats{color:#64748b;font-variant-numeric:tabular-nums;margin:0;font-size:14px}.menu-buttons{flex-direction:column;gap:10px;display:flex}.primary-button{color:#fff;background:var(--primary);cursor:pointer;border:none;border-radius:14px;padding:14px;font-size:16px;font-weight:700;transition:background .15s}.primary-button:active{background:var(--primary-active)}.secondary-button{color:var(--primary);border:1.5px solid var(--line);cursor:pointer;background:#fff;border-radius:14px;padding:13px;font-size:15px;font-weight:600}.secondary-button:active{background:#f1f5f9}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media (width>=700px) and (height>=501px){.app{max-width:980px;padding:calc(20px + env(safe-area-inset-top)) calc(24px + env(safe-area-inset-right)) calc(16px + env(safe-area-inset-bottom)) calc(24px + env(safe-area-inset-left))}.game-main{flex:1;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) minmax(250px,330px);align-content:start;align-items:start;gap:16px 24px;display:grid}.board{grid-area:1/1/span 2}.cell{font-size:clamp(22px,4.2vw,34px)}.number-pad{grid-area:1/2;grid-template-columns:repeat(3,1fr);gap:10px}.number-key{padding:12px 0 10px}.number-key .digit{font-size:28px}.action-bar{grid-area:2/2;align-self:start}}@media (orientation:landscape) and (height<=500px){.app{padding-top:calc(6px + env(safe-area-inset-top))}.status-bar{padding:2px 2px 6px}.game-main{flex:1;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) minmax(200px,260px);align-content:start;align-items:start;gap:8px 16px;min-height:0;display:grid}.board{width:auto;height:calc(100dvh - 110px - env(safe-area-inset-top));grid-area:1/1/span 2;align-self:center;max-width:100%}.number-pad{grid-area:1/2;grid-template-columns:repeat(3,1fr);gap:8px}.action-bar{grid-area:2/2}}@keyframes pop-in{0%{opacity:0;transform:scale(.85)translateY(12px)}to{opacity:1;transform:scale(1)translateY(0)}}html{background:var(--bg)}.cell-notes{color:#64748b;pointer-events:none;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);font-size:clamp(8px,2.3vw,12px);line-height:1;display:grid;position:absolute;inset:3px}.cell-notes span{justify-content:center;align-items:center;display:flex}.page{flex-direction:column;gap:18px;width:100%;max-width:480px;margin:0 auto;padding-bottom:16px;display:flex}.page h1{margin:12px 0 0}.option-row{background:#fff;border-radius:14px;justify-content:space-between;align-items:center;gap:16px;padding:18px;display:flex}.option-row small,.records small{color:#64748b;margin-top:6px;font-size:12px;line-height:1.6;display:block}.option-row input{width:24px;height:24px;accent-color:var(--primary);flex-shrink:0}.difficulty-tabs{gap:8px;display:flex}.difficulty-tabs button{flex:1}.records{gap:10px;margin:0;padding:0;list-style:none;display:grid}.records li{background:#fff;border-radius:12px;padding:14px 18px}.record-banner{color:#15803d;margin:0;font-weight:700}.game-effects{z-index:20;pointer-events:none;position:fixed;inset:0;overflow:hidden}.game-effects canvas{pointer-events:none;display:block}.status-bar,.status-bar .timer,.status-bar .icon-button,.status-bar .mistakes{color:#000}@media (prefers-reduced-motion:reduce){.game-effects{display:none}.flash-overlay,.cell-value,.overlay,.dialog{animation:none!important}}.install-help{background:#fff;border-radius:14px;padding:18px;font-size:14px;line-height:1.6}.install-help h2{margin:0;font-size:17px}.install-help p{margin:10px 0}.install-help small{color:#64748b}
