:root{color:#e2e8f0;font-synthesis:none;background:#111827;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}.app{place-items:center;max-width:1200px;min-height:100vh;margin:auto;padding:24px;display:grid}.panel{background:#1f2937;border:1px solid #374151;border-radius:16px;width:100%;padding:24px;box-shadow:0 16px 48px #0005}h1,p{margin:0 0 16px}.login form,label{gap:12px;display:grid}label{color:#cbd5e1;margin:16px 0}input{width:100%;color:inherit;font:inherit;background:#111827;border:1px solid #4b5563;border-radius:8px;padding:12px}button{color:#fff;font:inherit;cursor:pointer;background:#7c3aed;border:0;border-radius:8px;padding:12px 16px}button:disabled{opacity:.45;cursor:not-allowed}.players{gap:8px;margin:24px 0;padding:0;list-style:none;display:grid}.players li{background:#111827;border-radius:8px;justify-content:space-between;padding:12px;display:flex}.online{color:#86efac}.offline,.message{color:#fca5a5}.share{overflow-wrap:anywhere;border-top:1px solid #374151;padding-top:16px}a{color:#c4b5fd}.game-shell{gap:24px;width:100%;display:grid}.game-header,.board-heading,.hand-heading{justify-content:space-between;align-items:center;gap:16px;display:flex}.game-header h1{margin:0;font-size:clamp(2rem,5vw,3.5rem)}.eyebrow{color:#a78bfa;letter-spacing:.16em;overflow-wrap:anywhere;margin:0 0 4px;font-size:.72rem;font-weight:800}.status-pill{color:#e0e7ff;text-align:center;background:#312e81;border-radius:999px;padding:12px 18px;font-weight:700}.score-row{grid-template-columns:1fr minmax(140px,.7fr) 1fr;gap:12px;display:grid}.player-card,.pile-card,.board-area,.hand-area{background:#1f2937;border:1px solid #374151;border-radius:16px}.player-card,.pile-card{gap:4px;padding:16px;display:grid}.player-card.active{border-color:#a78bfa;box-shadow:0 0 0 2px #7c3aed55}.player-card strong,.pile-card strong{font-size:1.35rem}.player-card small,.pile-card small{color:#94a3b8}.player-name{overflow-wrap:anywhere}.pile-card{text-align:center;background:#312e81}.board-area,.hand-area{min-width:0;padding:22px}h2{margin:0;font-size:1.1rem}.board-heading,.hand-heading{margin-bottom:14px}.board-heading span,.hand-heading span{color:#94a3b8;font-size:.9rem}.board-instruction{color:#a5b4fc;margin:0 0 14px;font-size:.9rem}.board-scroll{background:#111827;border-radius:12px;padding:18px 14px 32px;overflow:hidden}.branch-board{grid-template-rows:64px 64px;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:0 12px;display:grid}.start-anchor{color:#fcd34d;text-transform:uppercase;letter-spacing:.08em;grid-row:1/3;justify-content:center;align-items:center;height:100%;font-size:.72rem;font-weight:800;display:flex;position:relative}.start-anchor>span:last-child{position:absolute;bottom:-20px}.branch-lane{scrollbar-color:#6d5dab #111827;align-items:center;gap:9px;min-width:0;height:100%;display:flex;overflow-x:auto}.branch-name{color:#a5b4fc;text-transform:uppercase;flex:none;min-width:54px;font-size:.82rem;font-weight:800}.placement-target{color:#cbd5e1;background:#1e293b;border:2px dashed #64748b;border-radius:8px;flex:0 0 88px;place-items:center;height:38px;padding:4px;font-size:.76rem;line-height:1.2;display:grid}.placement-target.can-place{color:#fff;background:#4c1d95;border-color:#a78bfa;box-shadow:0 0 0 2px #a78bfa55}.placement-target.can-place:hover{background:#6d28d9}.placement-target:disabled{opacity:.6}.hand-tiles{flex-wrap:wrap;gap:20px;min-height:128px}.domino{--tile-width:82px;width:var(--tile-width);flex:0 0 var(--tile-width);color:#1e293b;background:#fafaf9;border:2px solid #d6d3d1;border-radius:7px;align-items:stretch;height:42px;padding:4px;display:inline-flex;box-shadow:0 3px 6px #0005}.domino.vertical{--tile-width:58px;flex-direction:column;height:128px}.domino.starting-tile{border-color:#fbbf24;box-shadow:0 0 0 3px #fbbf2444}button.domino{cursor:pointer;transition:transform .12s,border-color .12s}button.domino:hover:not(:disabled),button.domino.selected{border-color:#a78bfa;transform:translateY(-5px);box-shadow:0 0 0 3px #a78bfa66}button.domino:disabled{opacity:.55}.tile-half{flex:1;min-width:0;min-height:0;position:relative}.tile-divider{background:#64748b;width:2px;margin:1px 3px}.vertical .tile-divider{width:auto;height:2px;margin:3px 1px}.vertical .tile-half{width:100%}.pip{background:#1e293b;border-radius:50%;width:6px;height:6px;position:absolute;transform:translate(-50%,-50%)}.pip-1,.pip-4,.pip-7{left:20%}.pip-2,.pip-5,.pip-8{left:50%}.pip-3,.pip-6,.pip-9{left:80%}.pip-1,.pip-2,.pip-3{top:20%}.pip-4,.pip-5,.pip-6{top:50%}.pip-7,.pip-8,.pip-9{top:80%}.actions{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.actions .secondary{background:#475569}.hint{color:#a5b4fc;margin:14px 0 0;font-size:.9rem}.hand-area .message{margin-top:14px}@media (width<=650px){.app{place-items:start center;padding:16px}.game-header{flex-direction:column;align-items:flex-start}.score-row{grid-template-columns:1fr 1fr}.pile-card{grid-area:2/1/auto/-1}.board-area,.hand-area{padding:16px}.hand-heading{flex-direction:column;align-items:flex-start;gap:4px}.branch-board{grid-template-columns:62px minmax(0,1fr);gap:0 8px}.board-scroll{padding:12px 8px 28px}}