:root{--night:#07131f;--night2:#0b1e2c;--paper:#f3eedf;--ink:#17313b;--muted:#75909a;--teal:#20b7ad;--teal2:#7ce1d1;--amber:#dca95d;--danger:#d86b70;--line:#b8c5bf;--ease:cubic-bezier(.2,.8,.2,1)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 18% 16%,#123348 0,transparent 28%),radial-gradient(circle at 86% 72%,#102d39 0,transparent 30%),var(--night);color:#e9f2ed;font-family:Inter,"Pretendard",system-ui,sans-serif;overflow-x:hidden}.stars{position:fixed;inset:0;pointer-events:none;opacity:.42;background-image:radial-gradient(#fff 1px,transparent 1px),radial-gradient(#80d7cf 1px,transparent 1px);background-size:83px 83px,131px 131px;background-position:0 0,37px 23px;mask-image:linear-gradient(to bottom,#000,transparent 90%)}button{font:inherit}.app-shell{width:min(1180px,calc(100% - 32px));margin:auto;padding:24px 0 44px}.topbar{height:58px;display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.brand{display:flex;align-items:center;gap:11px;letter-spacing:.18em}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid #396071;border-radius:50%;color:var(--amber);box-shadow:0 0 24px #dca95d33}.brand strong{font-family:Georgia,serif;font-size:18px}.brand small{display:block;margin-top:3px;color:#7894a0;font-size:9px;letter-spacing:.25em}.top-actions{display:flex;gap:8px}.icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid #315062;background:#0b2130;color:#b8ced2;cursor:pointer}.game-layout{display:grid;grid-template-columns:minmax(540px,720px) minmax(260px,1fr);gap:44px;align-items:center}.game-main{min-width:0}.game-meta{display:flex;align-items:end;justify-content:space-between;margin-bottom:12px}.eyebrow{display:block;text-transform:uppercase;letter-spacing:.2em;color:var(--teal2);font-size:10px;font-weight:700}.game-meta h1{font:500 26px/1.1 Georgia,serif;margin:7px 0 0}.meta-right{display:flex;align-items:center;gap:16px;color:#98afb4}.meta-right span{border:1px solid #345664;border-radius:20px;padding:5px 10px;font-size:11px;color:var(--teal2)}.meta-right time{font-variant-numeric:tabular-nums;letter-spacing:.12em}.progress-track{height:2px;background:#173745;margin-bottom:14px}.progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--amber));transition:width .45s var(--ease)}.board-wrap{position:relative;aspect-ratio:1}.board{height:100%;display:grid;grid-template-columns:repeat(9,1fr);background:var(--paper);border:7px solid #d8d3c5;border-radius:7px;overflow:hidden;box-shadow:0 24px 70px #0008,0 0 0 1px #789089;position:relative}.board:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.3;background:repeating-radial-gradient(circle at 30% 20%,#766d5120 0 1px,transparent 1px 4px);mix-blend-mode:multiply}.cell{position:relative;display:grid;place-items:center;min-width:0;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#f4efdf;color:#167f7b;font:500 clamp(18px,3.6vw,34px)/1 Georgia,serif;cursor:pointer;transition:background .15s,color .15s,transform .15s}.cell:nth-child(9n){border-right:0}.cell:nth-child(9n+3),.cell:nth-child(9n+6){border-right:2px solid #536b69}.cell:nth-child(n+19):nth-child(-n+27),.cell:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid #536b69}.cell.given{color:var(--ink);font-weight:700;background:#efe9d8}.cell.peer{background:#dceae2}.cell.same{background:#c8e8dd;color:#087d77}.cell.selected{background:#a8ddd1;box-shadow:inset 0 0 0 3px #158f88;z-index:2}.cell.conflict{color:#a23e46;background:#f2ced0}.cell.hinted:before{content:"";position:absolute;inset:9%;border:2px solid var(--amber);border-radius:50%;animation:pulse 1.5s infinite}.notes{position:absolute;inset:5px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);color:#567b7c;font:600 clamp(7px,1vw,11px)/1 system-ui}.notes i{display:grid;place-items:center;font-style:normal}.board-overlay{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#071722ed;backdrop-filter:blur(8px);border-radius:7px}.board-overlay.hidden{display:none}.board-overlay>span{font-size:45px;color:var(--amber);animation:float 3s ease-in-out infinite}.board-overlay h2{font:500 28px Georgia,serif}.board-overlay p{color:var(--teal2);letter-spacing:.12em}.complete-star{font-size:72px!important;text-shadow:0 0 50px #dca95d}.primary{border:0;border-radius:4px;padding:12px 24px;color:#052320;background:var(--teal2);font-weight:800;cursor:pointer}.status-line{min-height:34px;padding:11px 4px 5px;color:#8da9ad;font-size:12px;text-align:center}.keypad{display:grid;grid-template-columns:repeat(9,1fr);gap:6px;margin-top:7px}.keypad button{border:1px solid #294857;border-radius:7px;background:#0c2230;color:#dbe9e5;padding:9px 2px 6px;cursor:pointer}.keypad button:hover{background:#143646;border-color:#3d7a7c}.keypad strong{display:block;font:500 20px Georgia,serif}.keypad small{font-size:8px;color:#5f8990}.keypad button:disabled{opacity:.3}.tools{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:9px}.tools button{border:0;border-radius:7px;background:transparent;color:#77969c;padding:8px 2px;cursor:pointer;font-size:10px}.tools button span{display:block;color:#b9ced0;font-size:19px;margin-bottom:5px}.tools button.active{background:#123847;color:var(--teal2)}.tools button:disabled{opacity:.25}.tools kbd{font:inherit;border:1px solid #42616b;padding:0 3px;border-radius:3px}.insight-panel{padding:20px 8px;text-align:center}.orb{width:170px;height:170px;border:1px solid #244b59;border-radius:50%;margin:0 auto 34px;position:relative;display:grid;place-items:center;box-shadow:inset 0 0 40px #19b4a31c,0 0 70px #0bb6a312}.orb i{position:absolute;border:1px solid #33616d;border-radius:50%;inset:18px;animation:spin 12s linear infinite}.orb i:nth-child(2){inset:34px;transform:rotate(60deg);animation-duration:8s}.orb i:nth-child(3){inset:51px;animation-direction:reverse}.orb b{color:var(--amber);font-size:33px;text-shadow:0 0 22px var(--amber)}.insight-panel h2{font:500 24px/1.3 Georgia,serif;margin:12px 0}.insight-panel>p{color:#86a0a5;font-size:13px;line-height:1.8;min-height:48px}.hint-steps{height:14px;display:flex;justify-content:center;gap:5px}.hint-steps i{width:18px;height:2px;background:#294553}.hint-steps i.on{background:var(--amber)}.insight-btn{width:100%;margin-top:18px;border:1px solid #2e6067;background:#0b2531;color:#bfe5df;border-radius:6px;padding:13px;cursor:pointer}.insight-btn span{float:right;color:#66848b}.session-stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:26px;border-top:1px solid #193a47;padding-top:18px}.session-stats strong{display:block;font:500 20px Georgia,serif;color:#e1ede8}.session-stats small{color:#5d7e87;font-size:9px;letter-spacing:.12em}dialog{border:1px solid #315963;border-radius:12px;background:#0b202c;color:#e8f0ed;padding:32px;width:min(430px,calc(100% - 28px));box-shadow:0 30px 100px #000b}dialog::backdrop{background:#020a0fcc;backdrop-filter:blur(4px)}dialog h2{font:500 25px Georgia,serif}.dialog-close{position:absolute;right:14px;top:12px;border:0;background:none;color:#91a7aa;font-size:24px}.difficulty-list{display:grid;gap:8px}.difficulty-list button{text-align:left;border:1px solid #294956;background:#0d2936;color:#e5efeb;border-radius:7px;padding:13px 15px;cursor:pointer}.difficulty-list b,.difficulty-list small{display:block}.difficulty-list small{color:#78969b;margin-top:4px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{transform:scale(.88);opacity:.45}}@keyframes float{50%{transform:translateY(-7px)}}@media(max-width:850px){.game-layout{grid-template-columns:1fr}.insight-panel{display:none}.app-shell{width:min(650px,calc(100% - 18px));padding-top:8px}.topbar{margin-bottom:6px}.tools button{font-size:9px}}@media(max-width:480px){.game-meta h1{font-size:20px}.meta-right{gap:8px}.board{border-width:4px}.keypad{gap:3px}.keypad button{padding:7px 0}.tools{gap:1px}.status-line{font-size:10px}.cell{font-size:22px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
