:root{--bg:#f7f2e9;--bg-card:#fff;--bg-card-2:#f1ebdd;--border:#ddd2b8;--ink:#2e2a24;--text:#2e2a24;--text-dim:#756b58;--accent:#e4572e;--accent-2:#2e6fe4;--danger:#c0392b;--success:#1f9d55;--line-new:#e02424;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#1c1a16;--bg-card:#262319;--bg-card-2:#2e2a1f;--border:#46402f;--ink:#f3ede0;--text:#f3ede0;--text-dim:#b5ab93;--accent:#ff8255;--accent-2:#6fa4ff;--danger:#ff6b5b;--success:#4fd188;--line-new:#ff4d4d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif}#root{flex-direction:column;min-height:100vh;display:flex}.app{width:100%;max-width:980px;margin:0 auto;padding:12px 16px 40px}.app-header{letter-spacing:.02em;justify-content:space-between;align-items:center;padding:10px 4px 18px;font-size:1.3rem;font-weight:700;display:flex}.btn-link{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:8px;padding:6px 12px;font-size:.85rem}.btn-link:hover{color:var(--text);border-color:var(--accent-2)}.screen{animation:.25s fade-in}@keyframes fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}h1,h2,h3,h4{margin:0 0 8px}.hint{color:var(--text-dim);max-width:640px;font-size:.92rem;line-height:1.5}.btn-primary,.btn-secondary{cursor:pointer;border:none;border-radius:10px;padding:10px 20px;font-size:1rem;font-weight:600;transition:transform .1s,filter .15s}.btn-primary{background:linear-gradient(180deg, var(--accent) 0%, #c73f1a 100%);color:#fff6f1}.btn-secondary{background:var(--bg-card-2);color:var(--text);border:1px solid var(--border)}.btn-primary:hover,.btn-secondary:hover{filter:brightness(1.06)}.btn-primary:active,.btn-secondary:active{transform:scale(.97)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;filter:none}.setup-screen{text-align:center;flex-direction:column;align-items:center;max-width:460px;margin:0 auto;display:flex}.setup-form{background:var(--bg-card);border:1px solid var(--border);text-align:left;border-radius:16px;flex-direction:column;gap:18px;width:100%;max-width:420px;margin-top:14px;padding:22px;display:flex}.setup-form label{color:var(--text-dim);flex-direction:column;gap:6px;font-size:.9rem;display:flex}.setup-form input[type=text],.setup-form input[type=number]{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:8px;padding:10px 12px;font-size:1rem}.setup-form fieldset{border:1px solid var(--border);border-radius:10px;flex-direction:column;gap:8px;padding:12px 14px;display:flex}.setup-form legend{color:var(--text-dim);padding:0 6px}.radio-row{align-items:center;color:var(--text)!important;flex-direction:row!important;gap:8px!important}.difficulty-row{align-items:flex-start!important}.difficulty-row input{margin-top:3px}.difficulty-row span{flex-direction:column;gap:2px;display:flex}.difficulty-row small{color:var(--text-dim);font-size:.78rem;font-weight:400;line-height:1.4}.size-presets{flex-wrap:wrap;gap:8px;display:flex}.size-chip{border:1.5px solid var(--border);background:var(--bg);color:var(--text-dim);cursor:pointer;border-radius:999px;padding:7px 12px;font-size:.9rem;font-weight:600}.size-chip.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--bg))}.size-input{text-align:center;width:64px!important}.board-screen{max-width:680px;margin:0 auto}.score-bar{flex-wrap:wrap;gap:12px;margin-bottom:14px;display:flex}.score-card{background:var(--bg-card);border:1.5px solid var(--border);border-radius:14px;flex:220px;align-items:center;gap:12px;padding:10px 14px;display:flex;position:relative}.score-card.active{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}.score-mark{background:var(--bg-card-2);width:44px;height:44px;color:var(--text-dim);border-radius:50%;flex:none;place-items:center;font-size:1.5rem;display:grid}.score-info{flex:1;min-width:0}.score-name{white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.score-points{color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:.9rem}.score-turn{background:var(--accent);color:#fff6f1;text-transform:uppercase;letter-spacing:.04em;border-radius:999px;padding:2px 8px;font-size:.68rem;font-weight:700;position:absolute;top:-9px;right:10px}.turn-banner{background:var(--bg-card-2);border:1px solid var(--border);border-radius:10px;margin-bottom:16px;padding:10px 16px;font-size:1.02rem}.turn-banner strong{color:var(--accent)}.board-wrap{justify-content:center;display:flex}svg.pipo-grid{background:var(--bg-card);border:1px solid var(--border);touch-action:none;border-radius:12px;width:100%;max-width:620px;height:auto}svg.pipo-grid.interactive .edge-hit{cursor:pointer}.edge-ghost{transition:stroke .1s}@keyframes box-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.box-pop{transform-box:fill-box;transform-origin:50%;animation:.3s box-pop}.modal-backdrop{z-index:50;background:#14100a8c;justify-content:center;align-items:center;padding:16px;animation:.15s fade-in;display:flex;position:fixed;inset:0}.modal-card{background:var(--bg-card);border:1px solid var(--border);text-align:center;border-radius:18px;width:100%;max-width:420px;padding:28px}.mark-options{grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px;display:grid}.mark-option{border:2px solid var(--border);background:var(--bg);cursor:pointer;text-align:left;border-radius:12px;align-items:center;gap:10px;padding:10px 12px;display:flex}.mark-option:hover{background:var(--bg-card-2)}.mark-option-symbol{background:var(--bg-card-2);border-radius:50%;flex:none;place-items:center;width:38px;height:38px;font-size:1.3rem;display:grid}.mark-option-label{color:var(--text-dim);font-size:.85rem}.gameover-screen{justify-content:center;padding-top:60px;display:flex}.gameover-card{background:var(--bg-card);border:1px solid var(--accent);text-align:center;border-radius:18px;width:100%;max-width:420px;padding:36px 32px}.gameover-scores{flex-direction:column;gap:8px;margin:18px 0 22px;display:flex}.gameover-row{background:var(--bg-card-2);border-radius:10px;align-items:center;gap:10px;padding:8px 12px;display:flex}.gameover-row.winner{border:1.5px solid var(--accent)}.gameover-row span:nth-child(2){text-align:left;flex:1;font-weight:600}.pass-screen,.lobby-screen{justify-content:center;padding-top:60px;display:flex}.pass-card{background:var(--bg-card);border:1px solid var(--border);text-align:center;border-radius:18px;max-width:420px;padding:40px 32px}.pass-name{color:var(--accent);margin:8px 0 14px;font-size:1.6rem;font-weight:800}.lobby-list{text-align:left;flex-direction:column;gap:8px;margin:14px 0;display:flex}.lobby-entry{justify-content:flex-start;align-items:baseline;gap:6px;width:100%;display:flex}.lobby-entry small{color:var(--text-dim)}.coord-warning{color:var(--danger);margin:0 0 10px;font-size:.85rem}@media (width<=560px){svg.pipo-grid{max-width:100%}.mark-options{grid-template-columns:1fr}}