:root{color:#242522;font-synthesis:none;text-rendering:optimizelegibility;--paper:#f3efe5;--paper-deep:#e9e2d3;--ink:#242522;--muted:#77776f;--line:#cfc8b9;--accent:#d97745;--accent-deep:#b9572d;--teal:#287271;background:#f3efe5;font-family:Segoe UI,Arial,sans-serif}*{box-sizing:border-box}body{background:var(--paper);min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #2872714d}.shell{min-height:100vh;padding:0 clamp(22px,6vw,96px);position:relative;overflow:hidden}.shell:before{content:"";pointer-events:none;opacity:.24;background-image:linear-gradient(#282a2312 1px,#0000 1px),linear-gradient(90deg,#282a2312 1px,#0000 1px);background-size:48px 48px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#0000,#000 28%,#0000 92%);mask-image:linear-gradient(#0000,#000 28%,#0000 92%)}.topbar,.game-header{border-bottom:1px solid var(--line);z-index:2;justify-content:space-between;align-items:center;height:76px;display:flex;position:relative}.brand{letter-spacing:-.03em;align-items:baseline;gap:5px;font-size:18px;display:flex}.brand strong{font-weight:750}.brand-grid{letter-spacing:1px;border:2px solid var(--ink);place-content:center;align-self:center;width:24px;height:24px;margin-right:5px;font-family:monospace;font-size:12px;line-height:5px;display:grid}.live-pill,.connection{text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:7px;font-size:12px;font-weight:650;display:inline-flex}.live-pill span,.presence{background:#38a169;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #38a1691f}.welcome{z-index:1;text-align:center;max-width:700px;margin:clamp(48px,9vh,96px) auto 34px;position:relative}.eyebrow{color:var(--muted);text-transform:uppercase;letter-spacing:.13em;justify-content:center;align-items:center;gap:10px;font-size:11px;font-weight:700;display:flex}.eyebrow span{background:var(--accent);width:28px;height:1px}.welcome h1{letter-spacing:-.055em;margin:16px 0 8px;font-size:clamp(40px,5.5vw,68px);font-weight:600;line-height:.98}.welcome h1 em{color:var(--accent-deep);font-family:Georgia,serif;font-weight:500}.welcome p{max-width:570px;color:var(--muted);margin:18px auto 0;font-size:15px;line-height:1.7}.setup-panel{z-index:1;background:#faf8f1e0;border:1px solid #d9d2c4;max-width:780px;margin:auto;padding:30px;position:relative;box-shadow:0 24px 70px #38312314}.field-row{justify-content:space-between;align-items:end;gap:24px;display:flex}.text-field{gap:8px;width:min(100%,360px);display:grid}.text-field span,.control-label{color:#686861;text-transform:uppercase;letter-spacing:.11em;font-size:10px;font-weight:750}.text-field input{border:1px solid var(--line);background:#fffefa;border-radius:3px;width:100%;height:46px;padding:0 14px;transition:border .2s,box-shadow .2s}.text-field input:focus{border-color:var(--teal);outline:none;box-shadow:0 0 0 3px #28727117}.join-link,.back-link{color:var(--teal);cursor:pointer;background:0 0;border:0;align-items:center;gap:7px;padding:13px 0;font-size:13px;font-weight:700;display:inline-flex}.control-group{margin-top:28px}.mode-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:9px;display:grid}.mode-card{text-align:left;border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:4px;grid-template-rows:auto auto;grid-template-columns:38px 1fr;align-content:center;column-gap:11px;min-height:100px;padding:16px;transition:transform .18s,background .18s,border .18s;display:grid;position:relative}.mode-card:hover{border-color:#999384;transform:translateY(-2px)}.mode-card.active{border-color:var(--ink);box-shadow:inset 0 -3px var(--accent);background:#fffdfa}.mode-icon{border:1px solid var(--line);width:38px;height:38px;color:var(--teal);grid-row:1/3;place-items:center;display:grid}.mode-card strong{align-self:end;font-size:14px}.mode-card small{color:var(--muted);margin-top:3px;font-size:10px}.radio-dot{border:1px solid #aaa395;border-radius:50%;width:10px;height:10px;position:absolute;top:13px;right:13px}.mode-card.active .radio-dot{border:3px solid var(--accent)}.bottom-controls{border-top:1px solid #ded8cb;justify-content:space-between;align-items:end;gap:22px;margin-top:28px;padding-top:24px;display:flex}.control-group.compact{margin:0}.segments{border:1px solid var(--line);background:#eee8dc;border-radius:4px;margin-top:9px;padding:3px;display:flex}.segments button{cursor:pointer;min-width:84px;height:34px;color:var(--muted);background:0 0;border:0;border-radius:2px;font-size:12px}.segments button.active{color:var(--ink);background:#fffefa;font-weight:700;box-shadow:0 1px 4px #2d271c1f}.difficulty-grid{grid-template-columns:repeat(4,1fr);gap:7px;margin-top:9px;display:grid}.difficulty-grid button{text-align:left;border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:3px;align-content:center;gap:3px;min-height:56px;padding:9px 11px;transition:background .15s,border-color .15s,transform .15s;display:grid}.difficulty-grid button:hover{border-color:#999384;transform:translateY(-1px)}.difficulty-grid button.active{color:#fff;background:var(--teal);border-color:var(--teal)}.difficulty-grid strong{font-size:11px}.difficulty-grid small{color:var(--muted);font-size:8px;line-height:1.3}.difficulty-grid button.active small{color:#ffffffb8}.player-count-control .segments button{min-width:45px}.solo-note{color:var(--muted);margin:0;font-size:11px}.primary-button{background:var(--ink);color:#fff;cursor:pointer;height:46px;box-shadow:4px 4px 0 var(--accent);border:0;border-radius:3px;justify-content:center;align-items:center;gap:10px;padding:0 22px;font-size:13px;font-weight:700;transition:transform .15s,box-shadow .15s;display:inline-flex}.primary-button:hover{box-shadow:6px 6px 0 var(--accent);transform:translate(-1px,-1px)}.primary-button:active{box-shadow:2px 2px 0 var(--accent);transform:translate(2px,2px)}.primary-button:disabled{cursor:not-allowed;color:#aaa69d;background:#d8d2c6;transform:none;box-shadow:3px 3px #bcb5a7}.primary-button.wide{width:100%}.form-error{color:#b33e32;margin:16px 0 0;font-size:12px}.join-panel{gap:20px;max-width:480px;display:grid}.join-panel .text-field{width:100%}.join-panel .back-link{justify-self:start;padding:0 0 4px}.room-code-field input{letter-spacing:.2em;text-transform:uppercase;font-family:DM Mono,monospace;font-size:24px}footer{text-align:center;color:#8c897f;letter-spacing:.04em;padding:42px 0 28px;font-size:11px;position:relative}footer span{color:var(--accent);padding:0 7px}.lobby-shell{background:var(--paper);min-height:100vh;padding:0 clamp(20px,6vw,92px) 40px;position:relative;overflow:hidden}.lobby-shell:before{content:"";pointer-events:none;opacity:.2;background-image:linear-gradient(#282a2312 1px,#0000 1px),linear-gradient(90deg,#282a2312 1px,#0000 1px);background-size:48px 48px;position:fixed;inset:70px 0 0;-webkit-mask-image:linear-gradient(#000,#0000 85%);mask-image:linear-gradient(#000,#0000 85%)}.lobby-header{z-index:2;position:relative}.connection-pill{border:1px solid var(--line);height:32px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;background:#fffdf8;border-radius:3px;align-items:center;gap:7px;padding:0 11px;font-size:9px;font-weight:700;display:inline-flex}.connection-pill.online{color:var(--teal);border-color:#28727159}.connection-pill.offline{color:#b14a3a}.lobby-hero{text-align:center;max-width:720px;margin:56px auto 31px;position:relative}.lobby-hero h1{letter-spacing:-.05em;margin:13px 0 7px;font-size:clamp(38px,4.5vw,58px);font-weight:600;line-height:1}.lobby-hero h1 em{color:var(--accent-deep);font-family:Georgia,serif;font-weight:500}.lobby-hero p{color:var(--muted);font-size:13px;line-height:1.6}.lobby-layout{grid-template-columns:250px 1fr;align-items:stretch;gap:18px;width:min(910px,100%);margin:auto;display:grid;position:relative}.lobby-ticket,.lobby-table{border:1px solid var(--line);background:#fffdf8eb}.lobby-ticket{border-top:3px solid var(--accent);flex-direction:column;padding:24px;display:flex}.lobby-ticket>strong{letter-spacing:.13em;margin:12px 0 17px;font:29px DM Mono,Consolas,monospace}.lobby-ticket>button{border:1px solid var(--teal);height:35px;color:var(--teal);cursor:pointer;background:0 0;border-radius:3px;justify-content:center;align-items:center;gap:7px;font-size:9px;font-weight:700;display:inline-flex}.lobby-ticket dl{gap:11px;margin:auto 0 0;padding-top:22px;display:grid}.lobby-ticket dl div{border-top:1px solid #e1dbcf;justify-content:space-between;gap:12px;padding-top:10px;display:flex}.lobby-ticket dt{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:8px}.lobby-ticket dd{margin:0;font-size:10px;font-weight:750}.lobby-table{padding:22px 25px 24px}.lobby-table-heading{min-height:45px;color:var(--teal);border-bottom:1px solid var(--line);justify-content:space-between;align-items:start;padding-bottom:13px;display:flex}.lobby-table-heading div{gap:3px;display:grid}.lobby-table-heading span{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-size:8px}.lobby-table-heading strong{font-size:14px}.lobby-seats{grid-template-columns:1fr 1fr;column-gap:18px;display:grid}.lobby-player{border-bottom:1px solid #e1dbcf;grid-template-columns:38px 1fr auto auto;align-items:center;gap:10px;min-height:67px;padding:10px 3px;display:grid}.lobby-player.me{background:#d977450e}.lobby-player.disconnected{opacity:.55}.lobby-player>div{gap:3px;min-width:0;display:grid}.lobby-player strong{white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.lobby-player small{color:var(--muted);font-size:8px}.host-crown{color:#b98525}.ready-mark,.empty-avatar{color:#8c877e;border:1px solid #bbb4a7;border-radius:50%;place-items:center;width:24px;height:24px;font-size:9px;display:grid}.ready-mark.ready{color:#fff;border-color:var(--teal);background:var(--teal)}.empty-avatar{border-style:dashed;width:38px;height:38px}.lobby-player.empty{color:#8f8a80}.waiting-dot{background:#c3bcae;border-radius:50%;width:6px;height:6px;animation:1.4s ease-in-out infinite pulse}.lobby-actions{justify-content:space-between;align-items:center;gap:15px;padding-top:20px;display:flex}.ready-button{border:1px solid var(--teal);min-width:165px;height:42px;color:var(--teal);cursor:pointer;background:0 0;border-radius:3px;justify-content:center;align-items:center;gap:8px;padding:0 15px;font-size:10px;font-weight:750;display:inline-flex}.ready-button.active{background:#e5eee8}.ready-button:disabled{opacity:.45;cursor:not-allowed}.host-wait{max-width:210px;color:var(--muted);text-align:right;margin:0;font-size:9px;line-height:1.5}.lobby-exit{color:var(--muted);cursor:pointer;background:0 0;border:0;align-items:center;gap:7px;margin:22px auto 0;font-size:10px;display:flex;position:relative}@keyframes pulse{50%{opacity:.35;transform:scale(.75)}}.game-shell{background:#f5f1e8;min-height:100vh;padding:0 clamp(18px,4vw,68px) 36px}.game-header{height:70px}.button-brand{cursor:pointer;background:0 0;border:0;padding:0}.game-meta{text-transform:uppercase;letter-spacing:.09em;color:var(--muted);align-items:center;gap:12px;font-size:11px;display:flex}.game-meta i{background:#aaa397;border-radius:50%;width:3px;height:3px}.game-meta strong{color:var(--ink);font-family:DM Mono,monospace;font-size:13px}.room-button,.solo-badge{border:1px solid var(--line);cursor:pointer;background:#fffdf8;border-radius:3px;justify-content:center;align-items:center;gap:8px;min-width:112px;height:34px;padding:0 12px;font-family:DM Mono,monospace;font-size:12px;font-weight:500;display:inline-flex}.solo-badge{color:var(--muted);cursor:default;font-family:inherit;font-size:11px}.game-layout{grid-template-columns:minmax(400px,610px) 300px;align-items:start;gap:clamp(38px,7vw,90px);width:min(1100px,100%);margin:32px auto 0;display:grid}.board-column{width:min(100%,610px)}.board-status{min-height:20px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:10px;display:flex}.connection{color:#9b5541;font-size:9px}.connection.online{color:var(--teal)}.sudoku-board{aspect-ratio:1;border:2px solid var(--ink);background:#fffefa;grid-template-columns:repeat(9,1fr);width:100%;display:grid;box-shadow:12px 14px #e1d9ca}.sudoku-board>button{cursor:pointer;isolation:isolate;background:0 0;border:1px solid #c9c3b8;border-top:0;border-left:0;font-family:DM Mono,monospace;font-size:clamp(18px,3vw,30px);font-weight:500;transition:background .12s;position:relative}.sudoku-board>button:nth-child(9n){border-right:0}.sudoku-board>button:nth-child(n+73){border-bottom:0}.sudoku-board>button:nth-child(9n+3),.sudoku-board>button:nth-child(9n+6){border-right:2px solid var(--ink)}.sudoku-board>button:nth-child(n+19):nth-child(-n+27),.sudoku-board>button:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid var(--ink)}.sudoku-board>button.related{background:#f1ede3}.sudoku-board>button.same-value{color:#1f6662;background:#e5ebe4}.sudoku-board>button.selected{box-shadow:inset 0 0 0 2px var(--accent);z-index:2;background:#f6d9c8}.sudoku-board>button.given{color:#20211f;font-weight:700}.sudoku-board>button.entered{color:var(--teal)}.sudoku-board>button.error{color:#c43f35;background:#f5d9d5}.sudoku-board.complete{animation:.55s both solved}.notes{color:#746f66;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);font-family:DM Mono,monospace;font-size:clamp(6px,1vw,10px);line-height:1;display:grid;position:absolute;inset:3px}.notes i{place-content:center;font-style:normal;display:grid}.number-pad{grid-template-columns:repeat(9,1fr);gap:6px;margin-top:24px;display:grid}.number-pad button{aspect-ratio:1;border:1px solid var(--line);cursor:pointer;background:#fffefa;border-radius:3px;font-family:DM Mono,monospace;font-size:20px;transition:background .12s,border .12s}.number-pad button:hover{border-color:var(--teal);background:#eaf0e9}.tool-row{justify-content:center;gap:8px;margin-top:11px;display:flex}.tool-row button{border:1px solid var(--line);height:34px;color:var(--muted);cursor:pointer;background:0 0;border-radius:3px;align-items:center;gap:7px;padding:0 12px;font-size:11px;display:inline-flex}.tool-row button.active{color:var(--teal);border-color:var(--teal);background:#e9f0e9}.tool-row kbd{text-transform:uppercase;background:#e4ded1;border:0;border-radius:2px;padding:2px 5px;font:8px Manrope}.players-panel{border-top:2px solid var(--ink);margin-top:30px}.panel-heading{border-bottom:1px solid var(--line);color:var(--teal);justify-content:space-between;align-items:center;padding:18px 0;display:flex}.panel-heading>div{gap:3px;display:grid}.panel-heading span{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-size:9px}.panel-heading strong{font-size:14px}.players-list{display:grid}.player{border-bottom:1px solid #ded8cb;grid-template-columns:38px 1fr 8px;align-items:center;gap:11px;padding:14px 0;display:grid}.player.me{background:#ffffff57;margin:0 -10px;padding-left:10px;padding-right:10px}.avatar{color:#fff;border-radius:3px;place-items:center;width:38px;height:38px;font-size:13px;font-weight:800;display:grid}.player-data{gap:5px;min-width:0;display:grid}.player-data>div:first-child{justify-content:space-between;align-items:center;gap:8px;display:flex}.player-data strong{white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.player-data strong small{color:var(--muted);font-size:8px;font-weight:500}.player-data div>span{color:var(--muted);font-family:DM Mono,monospace;font-size:9px}.player-data>small{color:var(--muted);font-size:8px}.progress{background:#ded8cb;height:3px}.progress i{height:100%;transition:width .25s;display:block}.presence{box-shadow:none;width:6px;height:6px}.presence.away{background:#aaa}.invite-box{border:1px dashed #aaa397;grid-template-columns:1fr auto;align-items:center;gap:7px 12px;margin-top:22px;padding:17px;display:grid}.invite-box span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:9px}.invite-box strong{letter-spacing:.08em;grid-area:1/2/3;font:20px DM Mono,monospace}.invite-box button{color:var(--teal);cursor:pointer;background:0 0;border:0;justify-self:start;align-items:center;gap:5px;padding:0;font-size:9px;font-weight:700;display:inline-flex}.leave-button{color:var(--muted);cursor:pointer;background:0 0;border:0;align-items:center;gap:6px;margin-top:22px;padding:0;font-size:10px;display:inline-flex}.modal-backdrop{z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#2524207a;place-items:center;padding:20px;animation:.2s fade;display:grid;position:fixed;inset:0}.finish-modal{border:1px solid var(--ink);width:min(390px,100%);box-shadow:10px 10px 0 var(--accent);text-align:center;background:#fffdf7;padding:34px}.finish-mark{background:var(--teal);color:#fff;border-radius:50%;place-items:center;width:58px;height:58px;margin:0 auto 20px;display:grid}.finish-modal>small{text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-size:9px}.finish-modal h2{letter-spacing:-.04em;margin:8px 0;font-size:30px}.finish-modal p{color:var(--muted);margin-bottom:25px;font-size:13px}@keyframes solved{50%{transform:scale(1.008);box-shadow:12px 14px #9bc0b2}}@keyframes fade{0%{opacity:0}}@media (width<=820px){.game-layout{grid-template-columns:1fr;gap:30px;max-width:620px}.players-panel{margin-top:0}.game-meta{display:none}.lobby-layout{grid-template-columns:1fr;max-width:620px}.lobby-ticket dl{margin-top:20px}}@media (width<=620px){.shell{padding:0 16px}.topbar{height:62px}.welcome{margin:48px auto 25px}.welcome h1{font-size:42px}.welcome p{font-size:13px}.setup-panel{padding:20px}.field-row,.bottom-controls{flex-direction:column;align-items:stretch}.text-field{width:100%}.join-link{align-self:start}.mode-grid{grid-template-columns:1fr}.mode-card{min-height:76px}.segments button{flex:1;min-width:0}.segments{width:100%}.difficulty-grid{grid-template-columns:1fr 1fr}.difficulty-grid button:last-child{grid-column:1/-1}.game-shell{padding:0 10px 25px}.game-header{padding:0 5px}.game-header .brand{font-size:0}.game-header .brand-grid{margin:0}.room-button,.solo-badge{min-width:0}.game-layout{margin-top:18px}.board-status{padding:0 3px}.sudoku-board{box-shadow:6px 7px #e1d9ca}.sudoku-board>button{font-size:clamp(16px,6vw,25px)}.number-pad{gap:3px;margin-top:16px}.number-pad button{font-size:16px}.players-panel{margin-left:6px;margin-right:6px}.lobby-shell{padding:0 12px 28px}.lobby-hero{margin:38px auto 22px}.lobby-hero h1{font-size:37px}.lobby-hero p{padding:0 12px;font-size:11px}.lobby-layout{gap:10px}.lobby-ticket,.lobby-table{padding:18px}.lobby-seats{grid-template-columns:1fr}.lobby-actions{flex-direction:column;align-items:stretch}.lobby-actions>button,.ready-button{width:100%}.host-wait{text-align:center;max-width:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}