*,:before,:after{box-sizing:border-box;margin:0;padding:0}button,input,select,textarea{font-family:inherit}body{color:#e6edf3;background:#0e1117;flex-direction:column;min-height:100vh;font-family:system-ui,sans-serif;display:flex}#site-header{background:#161b22;border-bottom:1px solid #30363d;flex-shrink:0;justify-content:center;display:flex}#site-header-inner{align-items:center;width:100%;max-width:1200px;padding:.75rem 1.5rem;display:flex}#site-home-link{align-items:center;text-decoration:none;transition:opacity .15s;display:flex}#site-icon{flex-shrink:0;width:4rem;height:4rem;margin-right:.6rem}#site-title{color:#e6edf3;letter-spacing:-.01em;font-size:2rem;font-weight:700}#app{flex-direction:column;flex:1;justify-content:flex-start;align-items:center;gap:1.5rem;padding:2rem 1rem;display:flex}#status{color:#e6edf3;min-height:1.5rem;font-size:1.1rem;font-weight:500}#error{color:#f85149}#board{grid-template-rows:repeat(3,100px);grid-template-columns:repeat(3,100px);gap:10px;display:grid}.cell{cursor:pointer;color:#e6edf3;background:#161b22;border:2px solid #30363d;border-radius:8px;width:100px;height:100px;font-size:2.8rem;font-weight:700;transition:background .1s,border-color .1s}.cell:hover:not(:disabled){background:#21262d}.cell:disabled{cursor:default}.cell.x{color:#f87171}.cell.o{color:#60a5fa}.cell.winning{background:#0d2818;border-color:#3fb950}#rematch-bar{align-items:center;gap:.75rem;min-height:2rem;display:flex}#rematch-btn{color:#fff;cursor:pointer;background:#238636;border:none;border-radius:8px;padding:.5rem 1.25rem;font-size:1rem;transition:background .1s}#rematch-btn:hover{background:#2ea043}#rematch-waiting{color:#8b949e;font-size:.875rem;font-style:italic}#new-room{color:#fff;cursor:pointer;background:#238636;border:none;border-radius:8px;padding:.55rem 1.5rem;font-size:1rem;transition:background .1s}#new-room:hover{background:#2ea043}.divider{color:#8b949e;font-size:.875rem}#join-row{gap:.5rem;display:flex}#room-code-input{color:#e6edf3;letter-spacing:.12em;text-transform:lowercase;background:#161b22;border:2px solid #30363d;border-radius:8px;outline:none;width:130px;padding:.5rem .75rem;font-size:1rem;transition:border-color .1s}#room-code-input:focus{border-color:#58a6ff}#join-btn{color:#fff;cursor:pointer;background:#1f6feb;border:none;border-radius:8px;padding:.5rem 1.25rem;font-size:1rem;transition:background .1s}#join-btn:hover{background:#388bfd}.mode-toggle{background:#161b22;border:1px solid #30363d;border-radius:10px;gap:3px;padding:3px;display:flex}.mode-option{color:#8b949e;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:.4rem;padding:.4rem 1rem;font-family:inherit;font-size:.9rem;transition:background .1s,color .1s;display:flex}.mode-option:hover,.mode-option.active{color:#e6edf3;background:#21262d}#header-controls{border-left:1px solid #30363d;align-items:center;gap:.5rem;margin-left:auto;padding-left:1.5rem;display:flex}#header-room-label{color:#8b949e;letter-spacing:.05em;margin-right:.25rem;font-size:.875rem}#copy-link{color:#8b949e;cursor:pointer;background:#21262d;border:1px solid #30363d;border-radius:6px;padding:.3rem .75rem;font-size:.875rem;transition:background .1s,color .1s}#copy-link:hover{color:#e6edf3;background:#2d333b}.cube-help{color:#8b949e;font-size:.875rem}.cube-meta{color:#c9d1d9;align-items:center;gap:.5rem;font-size:.875rem;display:flex}.cube-score.active-player{color:#e6edf3;font-weight:700}.cube-score-divider{color:#8b949e}.cube-meta-row{align-items:center;gap:.75rem;display:flex}.rules-btn{color:#e6edf3;cursor:pointer;background:#21262d;border:1px solid #30363d;border-radius:6px;padding:.3rem .75rem;font-size:.875rem}.rules-btn:hover{background:#2d333b}.cube-scene{--cube-size:240px;--cube-half:120px;--cube-extent:420px;perspective:900px;width:var(--cube-extent);height:var(--cube-extent);-webkit-user-select:none;user-select:none;touch-action:none;cursor:grab;justify-content:center;align-items:center;display:flex}.cube-scene.is-clickable{cursor:pointer}.cube-scene.is-dragging{cursor:grabbing}.cube{width:var(--cube-size);height:var(--cube-size);transform-style:preserve-3d;cursor:inherit;will-change:transform;position:relative}.cube-face{backface-visibility:hidden;pointer-events:none;background:#161b22;border:2px solid #0003;border-radius:0;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:6px;width:100%;height:100%;padding:10px;display:grid;position:absolute;overflow:hidden}.face-f{transform:rotateY(0deg) translateZ(var(--cube-half))}.face-b{transform:rotateY(180deg) translateZ(var(--cube-half))}.face-r{transform:rotateY(90deg) translateZ(var(--cube-half))}.face-l{transform:rotateY(-90deg) translateZ(var(--cube-half))}.face-u{transform:rotateX(90deg) translateZ(var(--cube-half))}.face-d{transform:rotateX(-90deg) translateZ(var(--cube-half))}.cube-face.face-u{background:#e0e0e0}.cube-face.face-d{background:#ffd84d}.cube-face.face-f{background:#31b84b}.cube-face.face-r{background:#e84a3c}.cube-face.face-b{background:#2f74ff}.cube-face.face-l{background:#ff9d2e}.cube-cell{z-index:2;color:#111;pointer-events:none;background:#ffffffeb;border-color:#0000002e;border-radius:8px;width:auto;height:auto;font-size:1.6rem;position:relative}.cube-cell.x{color:#c0392b}.cube-cell.o{color:#1a5276}.cube-cell:hover:not(:disabled){background:#ffffffc7}.cube-cell.ray-hover:not(:disabled){background:#78829673}.cube-cell.recent{box-shadow:0 0 0 3px #b200ff}.claimed-face{border-color:#ffffff73}.claimed-face:before{content:"";z-index:1;pointer-events:none;background:#00000047;position:absolute;inset:0}.face-claim-badge{letter-spacing:.02em;color:#fff;text-shadow:none;z-index:3;pointer-events:none;background:#0009;border-radius:999px;padding:.2rem .45rem;font-size:.75rem;font-weight:700;position:absolute;top:8px;right:8px}.rules-overlay{z-index:1000;background:#0000008c;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.rules-panel{color:#e6edf3;background:#161b22;border:1px solid #30363d;border-radius:12px;width:min(560px,100%);padding:1rem 1.1rem}.rules-panel h3{margin-bottom:.55rem}.rules-panel p{color:#c9d1d9;margin-bottom:.65rem}.rules-panel ul{color:#c9d1d9;margin-bottom:.9rem;padding-left:1.1rem;line-height:1.4}.rules-close-btn{color:#fff;cursor:pointer;background:#238636;border:none;border-radius:8px;padding:.5rem 1.25rem;font-size:1rem}.rules-close-btn:hover{background:#2ea043}
