:root{--bg:#1d2a2a;--panel:#10161ae0;--ink:#eef2ee;--muted:#9db0a8;--accent:#e3b45a;--silver:#c9d1d6;--gold:#e3b45a;--prismatic:#c58cff}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);background:radial-gradient(at top,#2d4544,#142020);margin:0;font:15px/1.4 system-ui,sans-serif}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.error{color:#ff8a7a;min-height:1em}button{background:var(--accent);color:#1b1b1b;font:inherit;cursor:pointer;border:0;border-radius:8px;padding:9px 14px;font-weight:600}button.secondary{color:var(--ink);background:#34444a;font-weight:500}button:disabled{opacity:.4;cursor:default}input,select,textarea{width:100%;color:var(--ink);font:inherit;background:#0f1416;border:1px solid #3a4a4e;border-radius:8px;padding:9px}.row{align-items:center;gap:8px;display:flex}.card{background:var(--panel);border-radius:14px;flex-direction:column;gap:10px;padding:22px;display:flex}.screen{max-width:380px;margin:12vh auto}.screen h1{margin:0}form{flex-direction:column;gap:10px;display:flex}#game{display:flex;position:fixed;inset:0}#board{flex:1;min-width:0;position:relative}#hud{background:linear-gradient(#161e22f2,#0c1013f2);border-left:1px solid #2e3d40;flex-direction:column;gap:8px;width:300px;padding:14px;display:flex;overflow-y:auto;box-shadow:-8px 0 30px #00000059}.clock{background:linear-gradient(#172024,#0c1113);border:1px solid #2a383b;border-radius:10px;justify-content:space-between;align-items:center;padding:8px 12px;font:700 28px ui-monospace,monospace;transition:box-shadow .3s;display:flex}.clock .who{color:var(--muted);font:500 13px system-ui}.clock.active{border-color:var(--accent);box-shadow:0 0 18px #e3b45a59}.clock.low{color:#ff8a7a}#status{font-weight:600}.aug{border-left:4px solid var(--silver);background:#0f1416;border-radius:8px;padding:6px 8px;font-size:13px}.aug.gold{border-color:var(--gold)}.aug.prismatic{border-color:var(--prismatic)}.aug.spent{opacity:.4}.aug button{margin-top:4px;padding:4px 10px;font-size:12px}h3{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:4px 0 0;font-size:12px}#log{color:var(--muted);flex-shrink:0;max-height:160px;margin:0;padding-left:18px;font-size:12px;overflow-y:auto}#actions{flex-direction:column;gap:6px;display:flex}#modal,#request-modal{z-index:10;background:#00000080;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.timer{color:var(--accent);font:700 22px ui-monospace,monospace}#toast{background:var(--panel);z-index:20;border-radius:10px;max-width:90vw;padding:10px 16px;position:fixed;top:124px;left:50%;transform:translate(-50%)}#request-btn{z-index:5;position:fixed;bottom:12px;right:12px}#request-modal .card{width:100%;max-width:480px}@media (width<=760px){#game{flex-direction:column}#board{flex:none;height:55vh}#hud{flex:1;width:100%}#request-btn{top:8px;bottom:auto}}.gem{clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%);flex-shrink:0;width:18px;height:18px;display:inline-block}.gem.big{width:44px;height:44px}.g-silver{background:linear-gradient(135deg,#f4f7f9,#9aa6ad 55%,#5d6970)}.g-gold{background:linear-gradient(135deg,#fff1b8,#e3b45a 50%,#9a6a1c)}.g-prismatic{background:conic-gradient(from 30deg,#ff7ad9,#a77bff,#5ad1ff,#6dffb0,#ffe36d,#ff7ad9)}.t-silver{color:var(--silver)}.t-gold{color:var(--gold)}.t-prismatic{color:#d7a8ff}#board{overflow:hidden}#stage-track{z-index:3;background:var(--panel);pointer-events:none;border:1px solid #2e3d40;border-radius:14px;min-width:330px;padding:8px 14px 10px;position:absolute;top:12px;left:12px;box-shadow:0 6px 24px #00000059}.st-head{justify-content:center;align-items:baseline;gap:10px;font-size:14px;display:flex}.st-turn{color:var(--accent);font-weight:700}.st-pips{justify-content:center;align-items:center;margin-top:6px;display:flex}.pip{opacity:.55;flex-direction:column;align-items:center;gap:1px;display:flex}.pip .pt{color:var(--muted);font-size:10px}.pip.done{opacity:.25}.pip.next{opacity:1;transform:scale(1.25)}.pip.now{opacity:1;filter:drop-shadow(0 0 6px #fff8);transform:scale(1.35)}.st-pips .link{background:#3a4a4e;width:18px;height:2px;margin:0 2px 12px}.st-bar{background:#0f1416;border-radius:3px;height:4px;margin-top:6px;overflow:hidden}.st-bar div{background:#6b7c80;height:100%;transition:width .4s}.st-bar .b-silver{background:var(--silver)}.st-bar .b-gold{background:var(--gold)}.st-bar .b-prismatic{background:linear-gradient(90deg,#ff7ad9,#a77bff,#5ad1ff)}.augs{z-index:3;pointer-events:none;gap:8px;display:flex;position:absolute}.augs>*{pointer-events:auto}.augs.icons{flex-direction:column;top:50%;transform:translateY(-50%)}.augs.icons.me{left:12px}.augs.icons.opp{right:12px}.aug-icon{background:var(--panel);cursor:default;border:2px solid #3a4a4e;border-radius:12px;place-items:center;width:46px;height:46px;transition:transform .15s;display:grid;position:relative}.aug-icon.silver{border-color:var(--silver)}.aug-icon.gold{border-color:var(--gold)}.aug-icon.prismatic{border-color:#b98aff;box-shadow:0 0 12px #b98aff66}.aug-icon:hover{transform:scale(1.12)}.aug-icon .badge{background:#0f1416;border:1px solid #556;border-radius:9px;padding:0 5px;font-size:10px;position:absolute;top:-6px;right:-6px}.spent{opacity:.38;filter:grayscale(.6)}.usable{cursor:pointer;animation:1.6s infinite pulse}.active{outline:3px solid #3d8bff}@keyframes pulse{50%{box-shadow:0 0 16px #ffffff73}}.augs.cards{flex-direction:row;justify-content:center;max-width:96%;left:50%;transform:translate(-50%)}.augs.cards.me{bottom:8px}.augs.cards.opp{top:10px}.augs .none{pointer-events:none;color:var(--muted);background:var(--panel);border-radius:8px;padding:4px 10px;font-size:12px}.aug-card{text-align:center;background:linear-gradient(#1c262a,#0d1214);border:2px solid #3a4a4e;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:78px;height:96px;padding:7px 5px;transition:transform .15s;display:flex;box-shadow:0 6px 16px #00000073}.aug-card:hover{z-index:2;transform:translateY(-6px)scale(1.06)}.augs.cards.opp .aug-card:hover{transform:translateY(6px)scale(1.06)}.aug-card.silver{border-color:var(--silver);background:linear-gradient(#343c41,#11171a)}.aug-card.gold{border-color:var(--gold);background:linear-gradient(#4a3a1c,#141109)}.aug-card.prismatic{background:linear-gradient(#3b2a55,#110d18);border-color:#b98aff;box-shadow:0 0 14px #b98aff59}.c-tier{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:9px}.c-name{font-size:11px;font-weight:700;line-height:1.15}.aug-svg{filter:drop-shadow(0 1px 2px #0009);display:block}.c-desc{color:#c9d3d0;flex:1;font-size:9.5px;line-height:1.2;overflow:hidden}.c-status{color:var(--accent);font-size:9px}#tip{z-index:30;pointer-events:none;background:#0b0f11;border:1px solid #3a4a4e;border-radius:10px;max-width:260px;padding:9px 11px;font-size:13px;display:none;position:fixed;box-shadow:0 8px 26px #00000080}.tip-tier{text-transform:uppercase;letter-spacing:.08em;font-size:10px}.tip-status{color:var(--accent);margin-top:5px;font-size:11px}.picker{--tc:var(--silver);--tbg:#2a3236;background:radial-gradient(ellipse at top, var(--tbg), #0c1012 70%);border:2px solid var(--tc);width:100%;max-width:860px;box-shadow:0 0 60px color-mix(in srgb, var(--tc) 45%, transparent);border-radius:18px;flex-direction:column;gap:14px;padding:20px;display:flex}.picker.tier-gold{--tc:var(--gold);--tbg:#4a3712}.picker.tier-prismatic{--tc:#b98aff;--tbg:#3a1f5a;border-image:linear-gradient(90deg,#ff7ad9,#a77bff,#5ad1ff,#6dffb0) 1;border-radius:0}.pk-banner{align-items:center;gap:14px;display:flex}.pk-tier{color:var(--tc);text-transform:uppercase;letter-spacing:.06em;font-size:28px;font-weight:800}.tier-prismatic .pk-tier{background:linear-gradient(90deg,#ff7ad9,#a77bff,#5ad1ff,#6dffb0);color:#0000;-webkit-background-clip:text;background-clip:text}.pk-sub{color:var(--muted);font-size:13px}.pk-banner .timer{color:var(--tc);margin-left:auto;font-size:30px}.offers{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;display:grid}.offer{background:linear-gradient(180deg, color-mix(in srgb, var(--tc) 18%, #11171a), #0b0f11);border:2px solid var(--tc);cursor:pointer;text-align:left;color:var(--ink);border-radius:14px;flex-direction:column;gap:6px;min-height:190px;padding:16px;font-weight:400;transition:transform .15s,box-shadow .15s;display:flex;position:relative}.offer:hover{box-shadow:0 10px 30px color-mix(in srgb, var(--tc) 50%, transparent);transform:translateY(-4px)}.offer .gem{width:30px;height:30px}.offer h4{color:var(--tc);margin:0;font-size:18px}.tier-prismatic .offer h4{color:#e3c8ff}.offer .tag{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px}.offer .desc{flex:1;font-size:14px}.offer .buff{color:#111;background:var(--tc);border-radius:6px;align-self:flex-start;padding:2px 7px;font-size:11px;font-weight:700}.icon-btn{z-index:4;background:var(--panel);width:38px;height:38px;color:var(--ink);border:1px solid #3a4a4e;padding:0;font-size:18px;position:absolute;top:12px;right:12px}#settings-modal{z-index:25;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#settings-modal .card{width:100%;max-width:420px}.seg button{color:var(--ink);background:#34444a;flex:1;font-weight:500}.seg button.on{background:var(--accent);color:#1b1b1b;font-weight:700}@media (width<=760px){#stage-track{transform-origin:0 0;min-width:0;padding:6px 8px;top:8px;left:8px;transform:scale(.85)}.augs.icons{flex-direction:row;top:auto;bottom:8px;transform:none}.aug-icon{width:36px;height:36px}.aug-card{width:62px;height:78px}.aug-card .aug-svg{width:34px;height:34px}.augs.cards.opp{top:96px}}
