:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b1f14;--ink:#f4efe1;--accent:#c9a227}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);overscroll-behavior:none;-webkit-tap-highlight-color:transparent;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#app{min-height:100dvh;padding:max(1.5rem, env(safe-area-inset-top)) max(1.5rem, env(safe-area-inset-right)) max(1.5rem, env(safe-area-inset-bottom)) max(1.5rem, env(safe-area-inset-left));text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}body.game-active #app,body.identity-active #app{text-align:initial;justify-content:flex-start;align-items:stretch;padding:0}body.identity-active #app{overflow-y:auto}.home-title{letter-spacing:.01em;margin:0;font-size:clamp(1.75rem,8vw,2.5rem);font-weight:700}.home-subtitle{color:color-mix(in srgb, var(--ink) 65%, transparent);margin-top:.5rem;font-size:.95rem}.avatar{object-fit:cover;border-radius:999px;flex:none;display:block;box-shadow:0 1px 3px #0006}.avatar-sm{width:28px;height:28px}.avatar-md{width:56px;height:56px}.avatar-lg{width:96px;height:96px}.identity-card{background:color-mix(in srgb, var(--ink) 8%, transparent);border:1px solid color-mix(in srgb, var(--ink) 20%, transparent);color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:16px;align-items:center;gap:.85rem;width:min(100%,320px);margin-top:1.75rem;padding:.75rem 1.1rem;display:flex}.identity-card:active{background:color-mix(in srgb, var(--ink) 14%, transparent)}.identity-card-text{min-width:0}.identity-name{font-size:1.05rem;font-weight:700}.identity-hint{color:var(--accent);margin-top:.15rem;font-size:.78rem}.home-primary{width:min(100%,320px);margin-top:1.75rem}.join-form{gap:.5rem;width:min(100%,320px);margin-top:.85rem;display:flex}.join-input{background:color-mix(in srgb, var(--ink) 8%, transparent);border:1px solid color-mix(in srgb, var(--ink) 30%, transparent);min-width:0;color:var(--ink);font:inherit;border-radius:999px;flex:auto;min-height:44px;padding:0 1rem;font-size:.95rem}.join-input::placeholder{color:color-mix(in srgb, var(--ink) 50%, transparent)}.join-note{max-width:320px;color:color-mix(in srgb, var(--ink) 65%, transparent);margin-top:.6rem;font-size:.82rem}.home-score{color:color-mix(in srgb, var(--ink) 75%, transparent);margin-top:2.25rem;font-size:.9rem;font-weight:600}.identity-screen{width:100%;min-height:100dvh;padding:max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1.5rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));flex-direction:column;gap:1.1rem;display:flex}.identity-header{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.identity-title{font-size:1rem;font-weight:700}.big-button.small,.ghost-button.small{min-height:38px;padding:.5rem 1.1rem;font-size:.9rem}.save-error{color:#e8846b;font-size:.82rem}.nickname-field{flex-direction:column;gap:.35rem;display:flex}.field-label{letter-spacing:.04em;text-transform:uppercase;color:color-mix(in srgb, var(--ink) 60%, transparent);font-size:.78rem;font-weight:600}.nickname-field input{background:color-mix(in srgb, var(--ink) 8%, transparent);border:1px solid color-mix(in srgb, var(--ink) 30%, transparent);color:var(--ink);font:inherit;border-radius:12px;min-height:44px;padding:.7rem .9rem;font-size:1rem}.tabs{gap:.5rem;display:flex}.tab-button{background:color-mix(in srgb, var(--ink) 6%, transparent);border:1px solid color-mix(in srgb, var(--ink) 22%, transparent);color:color-mix(in srgb, var(--ink) 75%, transparent);font:inherit;cursor:pointer;border-radius:999px;flex:1 1 0;min-height:44px;padding:.55rem 1rem;font-weight:600}.tab-button.is-active{background:color-mix(in srgb, var(--accent) 22%, transparent);border-color:var(--accent);color:var(--ink)}.tab-panel[hidden]{display:none}.preset-grid{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:.6rem;display:grid}.preset-swatch{aspect-ratio:1;cursor:pointer;background:0 0;border:2px solid #0000;border-radius:12px;padding:0;overflow:hidden}.preset-swatch img{width:100%;height:100%;display:block}.preset-swatch.is-selected{border-color:var(--accent)}.doodle-canvas{aspect-ratio:1;touch-action:none;border-radius:16px;width:100%;max-width:360px;margin:0 auto;display:block;box-shadow:0 2px 8px #00000073}.doodle-controls{justify-content:space-between;align-items:center;gap:1rem;margin-top:.85rem;display:flex}.brush-sizes,.color-swatches{align-items:center;gap:.5rem;display:flex}.brush-swatch{border:1px solid color-mix(in srgb, var(--ink) 30%, transparent);background:color-mix(in srgb, var(--ink) 6%, transparent);cursor:pointer;border-radius:999px;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.brush-swatch span{background:var(--ink);border-radius:999px;display:block}.brush-swatch.is-active{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 20%, transparent)}.color-swatch{border:2px solid color-mix(in srgb, var(--ink) 25%, transparent);cursor:pointer;border-radius:999px;width:44px;height:44px;padding:0}.color-swatch.is-active{border-color:var(--accent)}.doodle-actions{justify-content:center;gap:.6rem;margin-top:.85rem;display:flex}.game-screen{flex-direction:column;width:100%;height:100dvh;display:flex;position:relative;overflow:hidden}.top-bar{padding:max(.75rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) .5rem max(1rem, env(safe-area-inset-left));flex:none;justify-content:space-between;align-items:center;display:flex}.score-strip{letter-spacing:.02em;color:color-mix(in srgb, var(--ink) 85%, transparent);font-size:.9rem;font-weight:600}.top-bar-actions{align-items:center;gap:.5rem;display:flex}.icon-button{border:1px solid color-mix(in srgb, var(--ink) 30%, transparent);color:var(--ink);cursor:pointer;background:0 0;border-radius:999px;width:2.75rem;height:2.75rem;font-size:1.1rem;line-height:1}.icon-button:active{background:color-mix(in srgb, var(--ink) 12%, transparent)}.zone{flex-direction:column;align-items:center;gap:.3rem;padding:.6rem 1rem;display:flex}.zone-opponent{opacity:.68;filter:saturate(.85);flex:none}.zone-name{letter-spacing:.04em;text-transform:uppercase;color:color-mix(in srgb, var(--ink) 75%, transparent);font-size:.8rem;font-weight:600}.zone-count{color:color-mix(in srgb, var(--ink) 55%, transparent);font-size:.78rem}.deck-stack{width:64px;height:90px;position:relative}.deck-stack .deck-layer{border-radius:8px;position:absolute;inset:0;overflow:hidden;box-shadow:0 1px 3px #0006}.deck-stack .deck-layer img{object-fit:cover;width:100%;height:100%;display:block}.deck-stack .deck-layer:first-child{transform:translate(0)}.deck-stack .deck-layer:nth-child(2){transform:translate(2px,-2px)}.deck-stack .deck-layer:nth-child(3){transform:translate(4px,-4px)}.deck-stack .deck-layer:nth-child(4){transform:translate(6px,-6px)}.deck-stack.deck-empty{border:1.5px dashed color-mix(in srgb, var(--ink) 30%, transparent);border-radius:8px}.battlefield{flex-direction:column;flex:auto;justify-content:center;align-items:center;gap:.75rem;min-height:0;padding:.5rem 1rem;display:flex;position:relative}.pile{transform-origin:50%;width:96px;height:132px;position:relative}.pile.pile--empty{border:1.5px dashed color-mix(in srgb, var(--ink) 25%, transparent);border-radius:8px}.pile-card{border-radius:8px;width:96px;height:132px;position:absolute;top:0;left:0;overflow:hidden;box-shadow:0 2px 6px #00000073}.pile-card img{object-fit:cover;width:100%;height:100%;display:block}.pile-count{color:color-mix(in srgb, var(--ink) 60%, transparent);font-size:.8rem}.payment-banner-slot{justify-content:center;align-items:center;min-height:2.4rem;display:flex}.payment-banner{text-align:center;border-radius:999px;padding:.6rem 1.1rem}.payment-banner--warning{color:#ffe3df;background:#c0392b59;border:1px solid #c0392bb3;font-size:.95rem;font-weight:700}.zone-player{width:100%;padding:.75rem 1rem max(1rem, env(safe-area-inset-bottom));color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;flex-direction:column;flex:none;align-items:center;gap:.35rem;transition:background-color .15s;display:flex;position:relative}.zone-player.is-active{background:radial-gradient(ellipse at center, color-mix(in srgb, var(--accent) 18%, transparent), transparent 70%)}.zone-player.is-active .deck-stack .deck-layer{box-shadow:0 0 0 2px var(--accent), 0 4px 10px #00000080}.zone-player .deck-stack{width:104px;height:146px}.zone-identity{align-items:center;gap:.4rem;display:flex}.zone-player.is-busy,.zone-player:disabled{cursor:default}.zone-player.is-busy .turn-indicator{opacity:.7}.turn-indicator{color:var(--accent);letter-spacing:.01em;font-size:1.05rem;font-weight:700}.pass-overlay,.win-overlay{background:color-mix(in srgb, var(--bg) 92%, transparent);text-align:center;z-index:10;flex-direction:column;justify-content:center;align-items:center;gap:1.25rem;padding:2rem;display:flex;position:absolute;inset:0}.pass-overlay-text,.win-title{font-size:clamp(1.3rem,6vw,1.9rem);font-weight:700}.win-avatars{gap:1.5rem;display:flex}.win-avatar-card{flex-direction:column;align-items:center;gap:.4rem;display:flex}.win-avatar-name{color:color-mix(in srgb, var(--ink) 80%, transparent);font-size:.85rem;font-weight:600}.win-score{color:var(--accent);font-size:1rem;font-weight:700}.win-buttons{gap:.75rem;display:flex}.big-button{background:var(--accent);color:#20241f;cursor:pointer;border:none;border-radius:999px;min-height:44px;padding:.85rem 2rem;font-size:1.05rem;font-weight:700}.big-button:active{filter:brightness(.92)}.ghost-button{color:var(--ink);border:1px solid color-mix(in srgb, var(--ink) 40%, transparent);cursor:pointer;background:0 0;border-radius:999px;min-height:44px;padding:.85rem 2rem;font-size:1.05rem;font-weight:700}.back-button{align-self:flex-start;margin-bottom:.25rem}.room-code-display{letter-spacing:.04em;color:var(--accent);margin-top:1.5rem;font-size:clamp(1.8rem,10vw,2.6rem);font-weight:700}.waiting-text{color:color-mix(in srgb, var(--ink) 70%, transparent);margin-top:.35rem;font-size:.9rem}.waiting-actions{gap:.6rem;margin-top:1.25rem;display:flex}.waiting-status{color:var(--accent);margin-top:.6rem;font-size:.82rem}.waiting-note{max-width:320px;color:color-mix(in srgb, var(--ink) 60%, transparent);margin-top:2rem;font-size:.82rem}.confirm-overlay{z-index:30;background:#0000008c;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.confirm-dialog{background:var(--bg);border:1px solid color-mix(in srgb, var(--ink) 20%, transparent);text-align:center;border-radius:16px;width:min(100%,340px);padding:1.25rem;box-shadow:0 8px 24px #00000080}.confirm-title{font-size:1.05rem;font-weight:700}.confirm-body{color:color-mix(in srgb, var(--ink) 70%, transparent);margin-top:.5rem;font-size:.88rem}.confirm-actions{justify-content:center;gap:.6rem;margin-top:1.1rem;display:flex}.big-button.danger{color:#ffe3df;background:#c0392b}.menu-overlay{z-index:30;background:#0000008c;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.menu-sheet{background:var(--bg);border:1px solid color-mix(in srgb, var(--ink) 20%, transparent);padding:1rem 1.1rem max(1.1rem, env(safe-area-inset-bottom));border-radius:20px 20px 0 0;flex-direction:column;gap:.5rem;width:min(100%,420px);display:flex;box-shadow:0 -8px 24px #00000080}.menu-header{justify-content:space-between;align-items:center;margin-bottom:.35rem;display:flex}.menu-title{font-size:1rem;font-weight:700}.menu-section{background:color-mix(in srgb, var(--ink) 6%, transparent);text-align:center;border-radius:14px;margin-bottom:.35rem;padding:.85rem}.menu-section-label{letter-spacing:.05em;text-transform:uppercase;color:color-mix(in srgb, var(--ink) 55%, transparent);font-size:.72rem;font-weight:600}.menu-room-code{letter-spacing:.03em;color:var(--accent);margin-top:.25rem;font-size:1.3rem;font-weight:700}.menu-room-actions{justify-content:center;gap:.5rem;margin-top:.65rem;display:flex}.menu-status{color:var(--accent);margin-top:.5rem;font-size:.8rem}.menu-item{border:none;border-top:1px solid color-mix(in srgb, var(--ink) 12%, transparent);color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:0 0;min-height:44px;padding:.85rem .3rem;font-size:.98rem;font-weight:600}.menu-item--danger{color:#e8846b}.home-resume{width:min(100%,320px);margin-top:.75rem}.zone-player:not(.is-active){opacity:.72;filter:saturate(.85)}.presence-dot{background:#e8846b;border-radius:999px;flex:none;width:7px;height:7px;display:inline-block}.presence-dot.is-online{background:#59c27a}.net-status-banner{color:#ffd9cd;text-align:center;background:#e8846b33;border:1px solid #e8846b73;border-radius:999px;flex:none;margin:0 1rem .25rem;padding:.4rem .8rem;font-size:.8rem;font-weight:600}.payment-banner--accent{background:color-mix(in srgb, var(--accent) 22%, transparent);color:var(--ink);border:1px solid color-mix(in srgb, var(--accent) 55%, transparent);font-size:.95rem;font-weight:700}.net-toast{top:max(4.5rem, calc(env(safe-area-inset-top) + 3.5rem));background:var(--bg);border:1px solid color-mix(in srgb, var(--ink) 25%, transparent);z-index:40;border-radius:999px;padding:.5rem 1rem;font-size:.85rem;font-weight:600;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 4px 14px #0006}