:root{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",Inter,sans-serif;color:#173f3a;background:#efe9db;--ink:#173f3a;--paper:#fffdf7;--orange:#ed8456;--green:#65aa75;--blue:#599ccb;--yellow:#e9c84f;--pink:#d9809b}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 10% 0,#fff9e9 0,transparent 35%),#efe9db;padding:calc(env(safe-area-inset-top) + 18px) max(14px,env(safe-area-inset-right)) calc(env(safe-area-inset-bottom) + 30px) max(14px,env(safe-area-inset-left));-webkit-tap-highlight-color:transparent}main{max-width:720px;margin:auto}.brand{display:flex;align-items:center;gap:13px;margin:6px 2px 22px}.brand h1{font-size:28px;line-height:1;margin:0;letter-spacing:-1px}.brand p{margin:5px 0 0;color:#5b6f69;font-size:14px}.logo{display:grid;place-items:center;background:var(--ink);color:#fff;width:48px;height:48px;border-radius:15px;font-size:31px;font-weight:700}.card{background:var(--paper);border:1px solid #ded7c9;border-radius:20px;padding:18px;box-shadow:0 8px 30px #29443b12}.lobby{display:grid;gap:10px;max-width:440px;margin:auto}.lobby label{font-weight:700;font-size:13px;margin-top:4px}.lobby input{font:inherit;font-size:17px;padding:13px 14px;border:1.5px solid #c8c2b6;border-radius:12px;background:white;color:var(--ink)}button{font:inherit;font-weight:750;border:1.5px solid var(--ink);border-radius:12px;background:transparent;color:var(--ink);min-height:46px;cursor:pointer}.primary{background:var(--ink);color:white}.room-input{text-transform:uppercase;letter-spacing:4px;font-weight:800}.or{display:flex;align-items:center;gap:10px;color:#847f75;font-size:12px;margin:7px 0}.or:before,.or:after{content:"";height:1px;flex:1;background:#ddd6ca}.error{color:#a33d35;font-size:14px}.room-bar{display:flex;align-items:center;gap:11px;margin-bottom:12px}.room-bar>div,.opponent>div:first-child{display:flex;flex-direction:column}.room-bar small,.opponent small{font-size:9px;letter-spacing:1.5px}.room-bar strong{font-size:21px;letter-spacing:3px}.compact{min-height:34px;padding:4px 11px;font-size:12px}.connection{margin-left:auto;font-size:12px;font-weight:700}.connection:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.online:before{background:#3caa63}.offline:before{background:#d38a34}.waiting{text-align:center;margin:15px 0}.waiting h2{font-size:18px;margin:8px}.waiting p{color:#64736f;margin:0}.pulse{width:13px;height:13px;background:#e9c84f;border-radius:50%;margin:auto;animation:pulse 1.5s infinite}@keyframes pulse{70%{box-shadow:0 0 0 10px transparent}}.opponent{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;padding:12px 15px}.mini-progress{text-align:right;display:flex;flex-direction:column;font-size:12px;color:#61706d;gap:2px}.board-wrap{overflow-x:auto;margin:10px -4px;padding:4px;overscroll-behavior-x:contain}.column-numbers{display:grid;grid-template-columns:repeat(15,minmax(31px,1fr));min-width:510px}.column-numbers span{text-align:center;font-size:9px;color:#71807b;margin-bottom:3px}.board{display:grid;grid-template-columns:repeat(var(--columns),minmax(31px,1fr));gap:3px;min-width:510px;background:#173f3a;padding:4px;border-radius:10px}.cell{aspect-ratio:1;min-height:0;border:0;border-radius:5px;color:#173f3a;display:grid;place-items:center;position:relative}.cell span{font-size:31px;line-height:.7;font-weight:900;transform:rotate(-7deg)}.cell.marked:after{content:"";position:absolute;inset:4px;border:2px solid #173f3a;border-radius:50%;opacity:.8}.yellow{background:var(--yellow)}.green{background:var(--green)}.blue{background:var(--blue)}.pink{background:var(--pink)}.orange{background:var(--orange)}.completion{margin-top:14px;padding:14px}.completion h2{font-size:16px;margin:0 0 12px}.completion-row{display:flex;align-items:center;gap:6px;margin:9px 0;overflow-x:auto}.status-label{font-size:11px;font-weight:800;width:50px;flex:0 0 50px}.badge{display:grid;place-items:center;min-width:25px;height:25px;border-radius:7px;background:#e7e2d8;font-size:10px;font-weight:800;border:2px solid transparent}.badge.mine,.color-dot.mine{border-color:#173f3a}.badge.theirs,.color-dot.theirs{box-shadow:0 0 0 2px #fff,0 0 0 4px #ed8456}.color-dot{width:29px;height:29px;border:2px solid transparent;border-radius:50%;margin:0 4px}.legend{display:flex;gap:18px;justify-content:flex-end;font-size:10px;color:#6b7774}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}.legend i.mine{background:#173f3a}.legend i.theirs{background:#ed8456}.danger-text{display:block;border:0;color:#9d4a42;font-size:12px;margin:14px auto;background:none;min-height:35px}.loading{height:70vh;display:grid;place-items:center;color:#61706d}#blazor-error-ui{display:none;position:fixed;bottom:0;left:0;right:0;background:#b53a32;color:#fff;padding:12px;text-align:center;z-index:10}@media(min-width:650px){.board,.column-numbers{min-width:0}.cell span{font-size:38px}}