:root{--bg-a: #091429;--bg-b: #0e1f3b;--line: #2d4268;--text: #e7efff;--muted: #9ab0d7;--host: #3b85ff;--guest: #cf6639;--ok: #5cd9a3;--cell-size: 34px}*{box-sizing:border-box}body{margin:0;color:var(--text);font-family:Source Han Sans SC,Noto Sans SC,Segoe UI,sans-serif;background:radial-gradient(circle at 12% 8%,rgba(59,133,255,.2),transparent 32%),radial-gradient(circle at 88% 85%,rgba(207,102,57,.15),transparent 36%),linear-gradient(170deg,var(--bg-a),var(--bg-b));min-height:100vh}.layout-shell{width:min(1580px,calc(100vw - 20px));margin:10px auto;min-height:calc(100vh - 20px);display:grid;grid-template-columns:220px minmax(0,1fr) 300px;gap:12px}.sidebar{background:linear-gradient(180deg,#182b48,#13243e);border:1px solid var(--line);border-radius:16px;padding:12px;display:grid;gap:10px;align-content:start}.brand-title{margin:4px 0 8px;font-size:24px;line-height:1.05;letter-spacing:.01em;font-family:DIN Alternate,Segoe UI,sans-serif}.panel-block{display:grid;gap:8px;background:#0a15286b;border:1px solid var(--line);border-radius:12px;padding:10px}.panel-block h3{margin:0;font-size:15px}label{color:var(--muted);font-size:13px}input{width:100%;border:1px solid #3a527e;border-radius:8px;background:#263a5d;color:#f4f8ff;padding:9px 10px;outline:none}input::placeholder{color:#89a1ca}.size-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}.size-sep{color:var(--muted);font-size:16px}button{border:none;border-radius:9px;padding:8px 10px;font-weight:700;cursor:pointer;color:#f7fbff;background:linear-gradient(135deg,#2a66c8,#397eea);transition:transform .12s ease,filter .16s ease}button:hover{transform:translateY(-1px);filter:brightness(1.05)}.status-info p{margin:0;font-size:13px;color:#d9e4fd}.notice{min-height:20px;color:var(--ok)}.game-main{background:linear-gradient(180deg,#1b2d4d,#172843);border:1px solid var(--line);border-radius:16px;padding:10px;display:grid;gap:8px}.game-header{border-radius:12px;border:1px solid #304a75;background:#1f3458;padding:5px 8px;display:flex;justify-content:space-between;align-items:center;gap:8px}h1{margin:0;font-size:20px;line-height:1;font-family:DIN Alternate,Segoe UI,sans-serif}.player-status{display:grid;grid-template-columns:1fr 1fr;gap:8px}.player-status p{margin:0;padding:5px 8px;border-radius:10px;border:1px solid #456095;font-weight:700;min-width:92px;font-size:12px}.player-status .host{background:linear-gradient(135deg,#3b85ff8f,#1d4ea880)}.player-status .guest{background:linear-gradient(135deg,#cf66398f,#833a1e80)}.chat-panel{background:linear-gradient(180deg,#1a2d4c,#13243f);border:1px solid var(--line);border-radius:16px;padding:10px;display:grid;grid-template-rows:auto 1fr auto;gap:8px;min-height:0}.chat-panel h3{margin:0;font-size:16px}.chat-log{border:1px solid #385485;border-radius:10px;padding:8px;background:#101e38b8;overflow-y:auto;min-height:260px;max-height:calc(100vh - 170px)}.chat-empty{margin:0;color:var(--muted);font-size:13px}.chat-line{margin:0 0 8px;font-size:13px;line-height:1.35;color:#e9f1ff;word-break:break-word}.chat-role{color:#8cb2ff;margin-right:4px;font-weight:700}.chat-form{display:grid;grid-template-columns:1fr auto;gap:8px}.chat-form button{min-width:64px}@media (max-width: 1280px){.layout-shell{grid-template-columns:220px minmax(0,1fr)}.chat-panel{grid-column:1 / -1;min-height:280px}.chat-log{max-height:260px}}@media (max-width: 980px){.layout-shell{grid-template-columns:1fr}.sidebar{order:1}.game-main{order:2}.chat-panel{order:3;grid-column:auto}.game-header{flex-direction:column;align-items:stretch}}.board-wrap{border:1px solid var(--line);border-radius:16px;background:#2a3f63;padding:12px;overflow:auto}.board-grid{display:grid;width:fit-content;min-width:100%;justify-content:center}.cell{position:relative;transition:transform .12s ease,filter .16s ease}.dot:before{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:#d4def3;left:50%;top:50%;transform:translate(-50%,-50%)}.edge{cursor:pointer}.edge:before{content:"";position:absolute;background:#61779f;border-radius:8px}.h-edge:before{left:8%;right:8%;top:50%;height:8px;transform:translateY(-50%)}.v-edge:before{top:8%;bottom:8%;left:50%;width:8px;transform:translate(-50%)}.edge:hover{filter:brightness(1.08);transform:scale(1.05)}.edge.host:before{background:var(--host)}.edge.guest:before{background:var(--guest)}.box{border-radius:8px;display:flex;align-items:center;justify-content:center}.box.host{background:#3b85ff38}.box.guest{background:#cf663938}.box-owner{font-size:14px;font-weight:800;color:#f4f8ff}