:root{--bg: #050607;--bg-2: #0d1111;--surface: rgba(12, 15, 15, .94);--surface-2: rgba(245, 232, 202, .06);--surface-3: rgba(245, 232, 202, .1);--border: rgba(226, 184, 101, .34);--border-muted: rgba(245, 232, 202, .14);--text: #f7ead1;--muted: #b8ad9b;--faint: #746d63;--gold: #d6a847;--gold-2: #f5d27a;--teal: #5ee0c2;--teal-2: #0c766f;--danger: #f06e63;--shadow: rgba(0, 0, 0, .58);color:var(--text);background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden;background:radial-gradient(circle at 16% 0%,rgba(214,168,71,.1),transparent 34rem),linear-gradient(180deg,#101412 0%,var(--bg) 72%)}button,input,select,textarea{font:inherit}button{min-height:46px;border:1px solid rgba(214,168,71,.46);border-radius:8px;padding:0 16px;color:var(--text);background:linear-gradient(180deg,#f5e8ca14,#f5e8ca06),#0a0b0ac7;cursor:pointer;font-size:.9rem;font-weight:800;letter-spacing:0;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease}button:hover:not(:disabled){border-color:#f5d27ad1;background:linear-gradient(180deg,#f5e8ca1f,#f5e8ca0a),#0d1111e0;transform:translateY(-1px)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(214,168,71,.28);outline-offset:2px}button:disabled{border-color:#f5e8ca1a;color:var(--faint);background:#f5e8ca09;cursor:not-allowed;transform:none}input,select{width:100%;min-height:48px;border:1px solid var(--border-muted);border-radius:8px;padding:0 14px;color:var(--text);background:#030505c7}input:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 3px #d6a8472e}h1,h2,p{margin-top:0}.app-shell{display:grid;width:100%;min-height:100vh;align-items:start;justify-items:center;padding:clamp(12px,2.6vw,32px)}.app-shell.game-shell{padding-bottom:24px}.intro-panel{position:relative;overflow:hidden;width:100%;max-width:1180px;border:1px solid var(--border);border-radius:8px;padding:clamp(16px,3vw,28px);background:linear-gradient(180deg,rgba(245,232,202,.055),transparent 18rem),linear-gradient(145deg,#0b1010fa,#040607fa);box-shadow:0 26px 80px var(--shadow),inset 0 1px #f5e8ca14}.game-table{max-width:1440px;min-height:calc(100vh - clamp(24px,5.2vw,64px))}.app-header{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(280px,1.4fr) auto;gap:18px;align-items:center;padding-bottom:18px;border-bottom:1px solid rgba(245,232,202,.13)}.brand-block{min-width:0}.brand-title{margin:0;color:var(--gold-2);font-family:Georgia,Times New Roman,serif;font-size:clamp(1.4rem,3.4vw,2.55rem);font-weight:700;line-height:1.05;letter-spacing:0}h1{margin:8px 0 0;color:var(--text);font-size:clamp(1.3rem,4vw,2.1rem);line-height:1.08;letter-spacing:0}.room-code{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center;min-width:142px;border:1px solid var(--border-muted);border-radius:8px;padding:10px;background:#030505ad}.room-code span{grid-column:1 / -1;color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase}.room-code strong{color:var(--gold-2);font-size:1.2rem;letter-spacing:0}.icon-button{display:inline-grid;width:38px;min-width:38px;height:38px;min-height:38px;place-items:center;padding:0}.header-actions{grid-column:3;display:flex;justify-self:end;gap:10px;align-items:center}.rules-button{display:inline-flex;gap:8px;align-items:center;min-height:42px;padding:0 13px;white-space:nowrap}.round-progress{display:grid;gap:8px;justify-items:center;min-width:0}.round-progress-label{color:var(--gold-2);font-family:Georgia,Times New Roman,serif;font-size:clamp(1rem,2.5vw,1.55rem);font-weight:700}.round-steps{display:grid;width:100%;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none}.round-step{position:relative;display:grid;min-width:0;min-height:36px;align-items:center;margin-right:-14px;padding:0 22px 0 14px;color:#f7ead1bd;background:#1c2425;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%,14px 50%);font-size:.78rem;font-weight:850;text-align:center;text-transform:uppercase}.round-step:first-child{border-radius:7px 0 0 7px;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%)}.round-step:last-child{margin-right:0;border-radius:0 7px 7px 0}.round-step[data-complete=true]{color:#07110d;background:var(--teal)}.round-step[data-active=true]{color:#171009;background:linear-gradient(180deg,var(--gold-2),var(--gold));box-shadow:inset 0 0 0 1px #f5e8ca38}.round-step span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lobby-panel{margin:18px 0 0}.lobby-form,.lobby-room{display:grid;gap:16px;max-width:760px;margin:0 auto}.lobby-form label,.join-row label,.share-fields label{display:grid;gap:8px;color:var(--muted);font-size:.78rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.join-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}.join-link,.qr-card,.panel-surface,.self-card,.phase-panel,.player-row{border:1px solid var(--border-muted);border-radius:8px;background:linear-gradient(180deg,#f5e8ca0d,#f5e8ca06),#0507079e;box-shadow:inset 0 1px #f5e8ca0e}.join-link,.qr-card{padding:14px}.join-link span{display:block;margin:0 0 8px;color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase}.join-link code{display:block;overflow:hidden;color:var(--text);font-size:.9rem;text-overflow:ellipsis;white-space:nowrap}.qr-card{display:grid;justify-items:center;gap:10px}.qr-card img{width:180px;max-width:100%;border-radius:8px}.qr-card span{color:var(--muted);font-size:.86rem;font-weight:800}.game-room{display:grid;grid-template-columns:minmax(230px,.56fr) minmax(360px,1.24fr) minmax(290px,.72fr);grid-template-areas:"status phase side";gap:14px;align-items:stretch}.player-status-panel{grid-area:status;display:grid;gap:18px;align-content:start;padding:18px}.status-identity{display:grid;gap:6px;padding-bottom:14px;border-bottom:1px solid rgba(245,232,202,.14)}.status-identity span,.meter-label span,.mini-mados>span{color:var(--muted);font-size:.78rem;font-weight:800;text-transform:uppercase}.status-identity strong{overflow:hidden;color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:clamp(1.6rem,3vw,2.15rem);line-height:1.05;text-overflow:ellipsis;white-space:nowrap}.status-identity small,.shield-row small,.mini-mados small{color:var(--teal);font-size:.82rem;font-weight:800;text-transform:uppercase}.meter-block{display:grid;gap:9px}.meter-label{display:flex;gap:9px;align-items:center;color:var(--danger)}.meter-label strong{margin-left:auto;color:#ffb7ae;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.3rem,6vw,3.4rem);font-weight:700;line-height:.95}.meter-label.compact{color:var(--teal)}.meter-track{overflow:hidden;height:10px;border:1px solid rgba(245,232,202,.14);border-radius:999px;background:#f5e8ca14}.meter-fill{display:block;height:100%;border-radius:inherit}.health-fill{background:linear-gradient(90deg,#db5049,#f18973)}.shield-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding-bottom:14px;border-bottom:1px solid rgba(245,232,202,.14)}.mini-mados{display:grid;gap:11px}.mini-mados div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.mini-mado{position:relative;display:grid;aspect-ratio:1;place-items:center;border:1px solid rgba(214,168,71,.7);border-radius:999px;color:var(--gold-2);background:#030505b8;font-family:Georgia,Times New Roman,serif;font-size:1rem}.mini-mado-marker{position:absolute;top:50%;left:50%;width:6px;height:6px;border:1px solid rgba(3,5,5,.8);border-radius:999px;background:#5ee0c2;box-shadow:0 0 8px #5ee0c27a;transform:translate(-50%,-50%) rotate(var(--mado-frequency)) translateY(-18px)}.mini-mado[data-empty=true]{border-color:#f5e8ca24;color:var(--faint)}.frequency-wheel{display:block;width:72px;height:72px;flex:0 0 auto}.wheel-ring{fill:#0505088c;stroke:#f5e8ca57;stroke-width:2}.wheel-segment{fill:#d6a8474d;stroke:#f5d27ae6;stroke-width:1.5}.wheel-marker{fill:var(--gold-2);stroke:#15110a;stroke-width:2}.wheel-axis{stroke:#f5e8ca6b;stroke-linecap:round;stroke-width:2}.phase-panel{display:grid;gap:14px;align-content:start;padding:18px}.primary-phase{position:relative;overflow:hidden;grid-area:phase;min-height:560px;justify-items:center;align-content:center;border-color:var(--border);background:linear-gradient(180deg,#d6a84714,#f5e8ca07),#060808d1}.primary-phase>:not(.exchange-impact){position:relative;z-index:1}.phase-transition{animation:phase-panel-in .44s cubic-bezier(.2,.82,.22,1) both}.phase-heading{display:grid;gap:14px;justify-items:center;max-width:580px;text-align:center}.phase-heading:after{content:"";width:min(100%,330px);height:1px;background:linear-gradient(90deg,transparent,rgba(214,168,71,.55),transparent)}.phase-panel h2{margin:0;color:var(--gold-2);font-family:Georgia,Times New Roman,serif;font-size:clamp(1.35rem,4.6vw,2.5rem);line-height:1.08;letter-spacing:0}.phase-panel p,.waiting-copy{margin:0;color:var(--muted);line-height:1.5}.mado-grid{display:grid;width:min(100%,520px);grid-template-columns:repeat(5,minmax(76px,1fr));gap:10px}.mado-button{display:grid;min-height:124px;gap:8px;justify-items:center;align-content:center;padding:12px 8px;border-color:#d6a84794;background:linear-gradient(145deg,#f5e8ca12,#f5e8ca06),#050707b8}.mado-button[data-selected=true]{border-color:#f06e63db;background:linear-gradient(145deg,#f06e6333,#f06e6314),#050707c2;box-shadow:0 0 0 1px #f06e6333,inset 0 0 30px #f06e6314}.mado-button strong{color:var(--gold-2);font-family:Georgia,Times New Roman,serif;font-size:clamp(1.75rem,6vw,2.5rem);line-height:1}.mado-button span{color:var(--muted);font-size:.76rem;font-weight:800}.mado-button .frequency-wheel{width:54px;height:54px}.primary-button{width:100%;border-color:#f5d27adb;color:#171009;background:linear-gradient(180deg,var(--gold-2),var(--gold));box-shadow:0 12px 28px #d6a84729}.primary-button:hover:not(:disabled){color:#171009;background:linear-gradient(180deg,#ffe199,#dbaf50)}.action-button{display:inline-flex;justify-content:center;gap:12px;align-items:center;width:min(100%,380px);min-height:58px;font-size:1.03rem}.target-list,.battle-list{display:grid;gap:9px}.target-list{width:min(100%,560px);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.battle-result-card,.battle-row{border:1px solid var(--border-muted);border-radius:8px;padding:12px;background:#03050580}.battle-row{color:var(--text);font-size:.92rem;font-weight:700;line-height:1.4}.battle-result-card{display:grid;gap:4px;width:min(100%,420px);border-color:#d6a8476b;background:#d6a8471f}.battle-result-card span{color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase}.battle-result-card strong{color:var(--text);font-size:1.15rem}.battle-result-card small{color:var(--teal);font-size:.82rem;font-weight:800;text-transform:uppercase}.battle-result-card.large{padding:18px}.battle-result-card.large strong{font-size:clamp(1.45rem,6vw,2.2rem)}.exchange-impact{position:absolute;z-index:0;inset:0;display:grid;place-items:center;pointer-events:none}.exchange-impact span{grid-area:1 / 1;width:min(62vw,420px);aspect-ratio:1;border:1px solid rgba(245,210,122,.72);border-radius:999px;opacity:0;animation:exchange-shockwave .84s ease-out both}.exchange-impact span:nth-child(2){width:min(44vw,300px);border-color:#f06e639e;animation-delay:70ms}.exchange-impact span:nth-child(3){width:min(24vw,160px);border-color:#5ee0c29e;background:radial-gradient(circle,rgba(245,210,122,.18),transparent 62%);animation-delay:.14s}.exchange-card{animation:exchange-card-hit .56s cubic-bezier(.2,.82,.22,1) both}.desktop-side-panels{grid-area:side;display:grid;gap:14px;align-content:start}.panel-title{display:flex;gap:10px;align-items:center;min-width:0;color:var(--gold-2)}.panel-title h2{margin:0;color:var(--text);font-size:1.26rem}.player-list{display:grid;gap:8px}.player-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 12px;align-items:center;min-height:68px;padding:12px}.opponent-row{grid-template-columns:minmax(0,1fr) auto}.player-row div{display:grid;gap:4px;min-width:0}.player-row span{min-width:0;overflow:hidden;color:var(--text);font-weight:800;text-overflow:ellipsis;white-space:nowrap}.player-row .frequency-wheel{grid-row:span 2;width:48px;height:48px;margin-left:auto}.player-row small{color:var(--teal);font-size:.8rem;line-height:1.35}.insight-copy{grid-column:1 / -1;color:var(--muted)!important}.share-fields{display:grid;gap:10px}.teal-button{display:inline-flex;justify-content:center;gap:9px;align-items:center;border-color:#5ee0c294;color:#d8fff7;background:linear-gradient(180deg,#0c766fe6,#07524eeb)}.teal-button:hover:not(:disabled){border-color:#5ee0c2e6;background:linear-gradient(180deg,#0e8980f2,#085d58f2)}.game-error{grid-column:1 / -1}.form-error{margin:0;color:var(--danger);font-size:.95rem;line-height:1.45}.game-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:18px -28px -28px;border-top:1px solid rgba(245,232,202,.13);padding:12px 28px;color:var(--muted);font-size:.88rem}.game-footer>span,.connection-pill{display:inline-flex;gap:8px;align-items:center}.connection-pill[data-state=connected]{color:var(--teal)}.connection-pill[data-state=connecting]{color:var(--gold-2)}.connection-pill[data-state=disconnected]{color:var(--danger)}.status-details{margin:18px 0 0}.status-details summary{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:42px;border:1px solid rgba(245,232,202,.12);border-radius:8px;padding:0 12px;color:var(--muted);background:#f5e8ca0a;cursor:pointer;font-size:.82rem;font-weight:800;list-style:none}.status-details summary::-webkit-details-marker{display:none}.status-details summary:after{content:"+";color:var(--gold-2);font-size:1.1rem}.status-details[open] summary:after{content:"-"}.status-details summary span{min-width:0;margin-left:auto;overflow:hidden;text-overflow:ellipsis;text-transform:capitalize;white-space:nowrap}.status-details summary span[data-state=connected],.status-grid dd[data-state=connected]{color:var(--teal)}.status-details summary span[data-state=connecting],.status-grid dd[data-state=connecting]{color:var(--gold-2)}.status-details summary span[data-state=disconnected],.status-grid dd[data-state=disconnected]{color:var(--danger)}.status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0 0}.status-grid div{min-width:0;border:1px solid var(--border-muted);border-radius:8px;padding:14px;background:var(--surface-2)}.status-grid dt{margin:0 0 8px;color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase}.status-grid dd{min-height:1.35rem;margin:0;overflow:hidden;color:var(--text);font-size:.95rem;font-weight:650;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.panel-drawer,.mobile-bottom-bar{display:none}.rules-modal{position:fixed;z-index:60;inset:0;display:grid;place-items:center;padding:clamp(14px,3vw,28px)}.modal-backdrop{position:absolute;inset:0;width:100%;min-height:0;border:0;border-radius:0;padding:0;background:#000000a8}.modal-backdrop:hover:not(:disabled){background:#000000a8;transform:none}.rules-dialog{position:relative;display:grid;width:min(100%,780px);max-height:min(86vh,760px);overflow:auto;border:1px solid var(--border);border-radius:8px;background:linear-gradient(180deg,#f5e8ca12,#f5e8ca06),#070909;box-shadow:0 26px 80px #000000ad;animation:modal-in .22s ease-out both}.rules-header{position:sticky;z-index:1;top:0;display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid rgba(245,232,202,.13);padding:14px;background:#070909f5}.rules-content{display:grid;gap:14px;padding:16px}.rules-section{display:grid;gap:9px}.rules-section h3{margin:0;color:var(--gold-2);font-family:Georgia,Times New Roman,serif;font-size:1.28rem;line-height:1.15}.rules-section p,.rules-section li{color:var(--muted);line-height:1.55}.rules-section p,.rules-section ol{margin:0}.rules-section ol{display:grid;gap:8px;padding-left:20px}@keyframes phase-panel-in{0%{opacity:.42;filter:blur(3px);transform:translateY(14px) scale(.985)}to{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}}@keyframes exchange-shockwave{0%{opacity:0;transform:scale(.28)}18%{opacity:.95}to{opacity:0;transform:scale(1.18)}}@keyframes exchange-card-hit{0%{border-color:#f5d27afa;box-shadow:0 0 0 1px #f5d27a57,0 0 34px #f5d27a33;transform:scale(.98)}54%{transform:scale(1.025)}to{transform:scale(1)}}@keyframes modal-in{0%{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:1120px){.game-room{grid-template-columns:minmax(220px,.62fr) minmax(340px,1fr);grid-template-areas:"status phase" "side side"}.desktop-side-panels{grid-template-columns:repeat(3,minmax(0,1fr))}.primary-phase{min-height:500px}}@media(max-width:760px){.intro-panel{width:calc(100vw - 24px)}.app-shell.game-shell{padding:0 0 86px}.game-table{width:100%;min-height:auto;border-right:0;border-left:0;border-radius:0;padding:12px}.app-header{grid-template-columns:1fr;gap:10px;padding-bottom:12px}.header-actions{grid-column:auto;justify-self:stretch;justify-content:space-between}.rules-button{min-height:40px}.brand-block{display:flex;justify-content:space-between;gap:12px;align-items:center}.brand-title{font-size:1.18rem}h1:not(.brand-title){display:none}.room-code{display:none}.rules-dialog{max-height:82vh}.round-progress{justify-items:stretch}.round-progress-label{justify-self:start;font-size:.9rem}.round-step{min-height:32px;padding:0 15px 0 9px;font-size:.64rem}.lobby-panel{margin-top:12px}.game-room{grid-template-columns:1fr;grid-template-areas:"phase" "status";gap:12px}.primary-phase{min-height:min(70vh,620px);padding:18px 12px}.phase-heading{gap:12px}.phase-panel h2{font-size:clamp(1.6rem,9vw,2.35rem)}.mado-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.mado-button{min-height:132px}.player-status-panel{padding:14px}.desktop-side-panels,.game-footer{display:none}.mobile-bottom-bar{position:fixed;z-index:30;right:0;bottom:0;left:0;display:grid;grid-template-columns:minmax(90px,1fr) repeat(3,70px);gap:6px;border-top:1px solid rgba(214,168,71,.36);padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#141817f0,#050707fa),var(--bg);box-shadow:0 -18px 44px #0000006b}.bottom-health,.mobile-bottom-bar button{display:flex;justify-content:center;gap:7px;align-items:center;min-height:50px;border:1px solid rgba(245,232,202,.13);border-radius:8px;color:var(--text);background:#f5e8ca0e}.bottom-health{justify-content:flex-start;padding:0 12px;color:var(--danger)}.bottom-health strong{color:var(--text);font-size:1.45rem}.mobile-bottom-bar button{padding:0;color:var(--gold-2)}.mobile-bottom-bar button span{color:var(--text);font-size:.72rem;font-weight:900}.panel-drawer{position:fixed;z-index:40;inset:0;display:block}.drawer-backdrop{position:absolute;inset:0;width:100%;min-height:0;border:0;border-radius:0;padding:0;background:#00000085}.drawer-backdrop:hover:not(:disabled){background:#00000085;transform:none}.drawer-sheet{position:absolute;right:0;bottom:0;left:0;max-height:min(78vh,640px);overflow:auto;border:1px solid var(--border);border-bottom:0;border-radius:8px 8px 0 0;padding:12px;background:linear-gradient(180deg,#f5e8ca0f,#f5e8ca05),#070909;box-shadow:0 -26px 70px #0000009e}.drawer-header{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.drawer-content .phase-panel{border:0;padding:0;background:transparent;box-shadow:none}.drawer-content .phase-panel>.panel-title{display:none}}@media(max-width:520px){.intro-panel{width:calc(100vw - 24px);padding:14px}.join-row,.status-grid,.target-list{grid-template-columns:1fr}.mado-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.status-identity strong{font-size:1.55rem}.mini-mados div{gap:6px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:1ms!important}}