:root{color:#eef7ff;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;background:#05070d;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{background:radial-gradient(circle at 50% 40%,#17395433,#0000 48%),#05070d}button,select{color:inherit;font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}canvas{display:block;position:absolute;inset:0}.sfx-controls{z-index:60;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#040a12d6;border:1px solid #75d3f12e;border-radius:4px;align-items:center;gap:8px;padding:7px 9px;display:flex;position:fixed;top:112px;right:22px;box-shadow:0 12px 28px #00000052}.sfx-mute{color:#bfeeff;letter-spacing:.1em;background:#103a4cd1;border:1px solid #6fdafa47;border-radius:3px;min-width:74px;min-height:28px;font-size:7px;font-weight:850}.sfx-volume{color:#6f8fa1;letter-spacing:.1em;align-items:center;gap:6px;font-size:7px;font-weight:800;display:flex}.sfx-volume input{accent-color:#59d8ff;width:72px}.screen-layer{z-index:40;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:radial-gradient(circle at 50% 36%,#289bc229,#0000 34%),linear-gradient(#03070db3,#03060beb);position:fixed;inset:0;overflow:auto}.screen-layer.is-hidden{display:none}.flow-screen{text-align:center;min-height:100%;padding:52px clamp(24px,5vw,76px)}.title-screen,.handoff-screen,.result-screen{align-content:center;justify-items:center;display:grid}.title-mark{filter:drop-shadow(0 20px 38px #000000b3);font-family:Arial Narrow,Impact,sans-serif;display:grid;position:relative;transform:skewY(-3deg)}.title-mark:before,.title-mark:after{content:"";background:linear-gradient(90deg,#0000,#62ddff,#0000);height:2px;position:absolute;left:-16%;right:-16%;box-shadow:0 0 18px #62ddffcc}.title-mark:before{top:48%}.title-mark:after{bottom:-8px}.title-mark span{color:#a6b9c6;letter-spacing:.22em;font-size:clamp(38px,7vw,74px);font-weight:700;line-height:.8}.title-mark strong{color:#f0fbff;letter-spacing:.035em;text-shadow:0 0 32px #3fc1eb47;font-size:clamp(66px,12vw,136px);line-height:.9}.title-tagline{color:#849cab;letter-spacing:.16em;text-transform:uppercase;margin:34px 0 26px;font-size:12px}.build-label{color:#405463;letter-spacing:.2em;margin-top:18px;font-size:8px;font-weight:800}.flow-primary,.flow-secondary,.flow-back,.mode-card,.archetype-card{color:inherit;border:1px solid #66dcff57;transition:border-color .14s,transform .14s,filter .14s}.flow-primary,.flow-secondary{letter-spacing:.15em;background:linear-gradient(#2594b9,#0c506d);border-radius:4px;min-width:190px;min-height:50px;padding:0 28px;font-size:10px;font-weight:900}.flow-secondary{color:#a7bbc6;background:#111d28e0;border-color:#91acbb47}.flow-primary:hover,.flow-secondary:hover,.mode-card:hover,.archetype-card:hover{filter:brightness(1.15);border-color:#7be6ff;transform:translateY(-3px)}.selection-screen,.deck-screen{flex-direction:column;align-items:center;display:flex}.screen-heading{margin-bottom:34px}.screen-kicker{color:#66dfff;letter-spacing:.28em;font-size:9px;font-weight:850}.screen-heading h1,.handoff-screen h1,.result-screen h1{letter-spacing:.04em;margin:8px 0 5px;font-family:Arial Narrow,Impact,sans-serif;font-size:clamp(42px,7vw,76px);font-weight:700;line-height:1}.screen-heading p,.handoff-screen p,.result-screen p{color:#829baa;margin:0;font-size:12px}.mode-grid{grid-template-columns:repeat(2,minmax(0,300px));gap:18px;width:min(100%,620px);display:grid}.mode-card{background:linear-gradient(145deg,#0e1f2df5,#050c15eb);border-radius:5px 18px;gap:8px;min-height:230px;padding:34px 24px;display:grid;box-shadow:0 22px 50px #00000061}.mode-card strong{letter-spacing:.06em;align-self:end;font-family:Arial Narrow,Impact,sans-serif;font-size:32px}.mode-card small{color:#7893a3;font-size:10px}.mode-icon{color:#79e3ff;text-shadow:0 0 30px #42cff673;align-self:center;font-family:Arial Narrow,Impact,sans-serif;font-size:66px;line-height:1}.flow-back{color:#6d8493;letter-spacing:.14em;background:0 0;border:0;margin-top:30px;padding:10px 18px;font-size:9px;font-weight:850}.archetype-grid{grid-template-columns:repeat(5,minmax(150px,1fr));gap:11px;width:min(100%,1100px);display:grid}.archetype-card{background:linear-gradient(150deg,#0d1b28f5,#050b13f0);border-radius:4px 13px;grid-template-rows:auto auto 1fr;gap:10px;min-width:0;min-height:170px;padding:20px 14px 16px;display:grid;box-shadow:0 14px 28px #00000052}.archetype-card strong{letter-spacing:.03em;font-size:12px}.archetype-card small{overflow-wrap:anywhere;color:#688492;font-size:8px;line-height:1.4}.element-pair{justify-content:center;align-items:center;display:flex}.element-orb{background:currentColor;border:2px solid;border-radius:50%;width:34px;height:34px;display:block;box-shadow:0 0 18px}.element-link{background:#617786;width:20px;height:1px}.handoff-lock{color:#6fe1ff;border:1px solid #6be0ff61;border-radius:50%;place-items:center;width:90px;height:90px;margin-bottom:30px;font-size:31px;display:grid;box-shadow:0 0 42px #36c1e629}.handoff-screen p,.result-screen p{max-width:470px;margin:12px 0 28px;line-height:1.6}.result-actions{gap:10px;display:flex}.match-hud{z-index:3;pointer-events:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0}.match-hud button,.match-hud select{pointer-events:auto}.match-topbar{grid-template-columns:180px minmax(240px,360px) 180px;justify-content:space-between;align-items:start;display:grid;position:absolute;top:18px;left:22px;right:22px}.life-panel,.turn-panel,.extra-deck-panel,.action-dock,.floating-prompt,.response-prompt,.decision-panel{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(145deg,#0a1422f0,#050911db);border:1px solid #97dcff38;box-shadow:0 18px 45px #0000006b,inset 0 1px #ffffff0d}.life-panel{border-radius:12px 3px;grid-template-rows:auto auto;grid-template-columns:1fr auto;min-height:84px;padding:13px 17px;display:grid;position:relative;overflow:hidden}.life-panel:before{content:"";background:#2cc6ff;width:4px;position:absolute;inset:0 auto 0 0;box-shadow:0 0 18px #2cc6ff}.life-opponent:before{background:#ff4f79;left:auto;right:0;box-shadow:0 0 18px #ff4f79}.life-label{color:#a8c0d1;letter-spacing:.2em;align-self:center;font-size:11px;font-weight:800}.life-panel strong{grid-area:1/2/3;align-self:center;font-family:Arial Narrow,Impact,sans-serif;font-size:49px;font-weight:700;line-height:.85}.life-panel small{color:#5d7a8f;letter-spacing:.18em;font-size:10px}.turn-panel{text-align:center;border-top-color:#5edaffa6;border-radius:3px 3px 14px 14px;gap:2px;min-height:74px;padding:10px 24px 12px;display:grid}.turn-panel span,.turn-panel small,.eyebrow{color:#72dfff;letter-spacing:.22em;font-size:10px;font-weight:800}.turn-panel strong{letter-spacing:.11em;font-family:Arial Narrow,Impact,sans-serif;font-size:25px;font-weight:700}.turn-panel small{color:#70899a;font-size:8px}.extra-deck-panel{pointer-events:auto;border-radius:4px 14px 14px 4px;width:210px;padding:12px;position:absolute;top:126px;left:22px}.panel-heading{color:#9fe9ff;letter-spacing:.14em;justify-content:space-between;align-items:baseline;margin-bottom:10px;font-size:10px;font-weight:800;display:flex}.panel-heading small{color:#61798a;letter-spacing:0;font-size:8px}.extra-deck-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.extra-card{min-width:0;transition:opacity .18s,filter .18s}.extra-card img{aspect-ratio:.714;object-fit:cover;border:1px solid #80e0ff4d;border-radius:5px;width:100%;display:block}.extra-card span,.extra-card small{text-overflow:ellipsis;white-space:nowrap;margin-top:4px;font-size:8px;line-height:1.15;display:block;overflow:hidden}.extra-card small{color:#6e9bb2;margin-top:2px;font-size:7px}.extra-card.is-spent{filter:grayscale();opacity:.35}.board-readout{pointer-events:auto;gap:8px;width:min(46vw,650px);display:flex;position:absolute;left:50%;transform:translate(-50%)}.board-opponent{justify-content:center;top:108px}.board-player{justify-content:center;bottom:218px}.board-card,.empty-board,.board-transition{background:#040b13b8;border:1px solid #76cef22e;border-radius:5px;min-width:124px;padding:7px 10px;box-shadow:0 8px 18px #00000047}.board-card{text-align:left;grid-template-columns:1fr auto;gap:2px 8px;transition:border-color .14s,transform .14s,background .14s;display:grid}.board-card:hover,.board-card.is-selected{background:#104f69c7;border-color:#6ce5ff;transform:translateY(-3px)}.board-card span{text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:750;overflow:hidden}.board-card strong{color:#dff8ff;font-size:11px}.board-card small{color:#65869a;letter-spacing:.14em;grid-column:1/3;font-size:7px;font-weight:800}.empty-board,.board-transition{color:#4d6575;letter-spacing:.12em;text-align:center;text-transform:uppercase;border-style:dashed;font-size:9px}.board-transition{color:#72dfff;border-color:#6ce5ff61;box-shadow:0 0 18px #3ac5ef1f}.land-readout{color:#627c8e;letter-spacing:.1em;white-space:nowrap;align-items:center;gap:5px;font-size:8px;display:flex;position:absolute;top:43px;left:50%;transform:translate(-50%)}.land-readout span{margin-left:4px}.land-pip{opacity:.25;border:1px solid;border-radius:50%;width:9px;height:9px;display:inline-block}.land-pip.is-ready{opacity:.95;background:currentColor;box-shadow:0 0 9px}.element-fire{color:#ff5d3d}.element-water{color:#31baff}.element-earth{color:#cf995c}.element-air{color:#93ebd5}.element-lightning{color:#bd9aff}.no-lands{color:#4d6575}.hand-fan{pointer-events:auto;width:min(62vw,900px);height:260px;position:absolute;bottom:4px;left:50%;transform:translate(-50%)}.hand-card{--spread:76px;width:126px;height:176px;transform:translateX(calc(-50% + var(--fan-index) * var(--spread))) rotate(calc(var(--fan-index) * 3deg));transform-origin:50% 115%;background:#070d17;border:1px solid #9bd3ed47;border-radius:9px;padding:0;transition:transform .15s,border-color .15s,filter .15s;position:absolute;bottom:0;left:50%;overflow:hidden;box-shadow:0 14px 30px #0000008c}.hand-card:hover,.hand-card:focus-visible{z-index:20;transform:translateX(calc(-50% + var(--fan-index) * var(--spread))) translateY(-48px) rotate(0deg) scale(1.12);border-color:#8ce8ff;outline:none}.hand-card:not(.is-playable){filter:saturate(.58)brightness(.72)}.hand-card.is-playable{border-color:#67e1ffb8;box-shadow:0 0 18px #3ac5ef3d,0 14px 30px #0000008c}.hand-card img{object-fit:cover;width:100%;height:100%;display:block}.card-name,.card-meta{text-overflow:ellipsis;white-space:nowrap;background:#03080ee0;border-radius:3px;padding:4px 5px;font-size:10px;font-weight:800;position:absolute;bottom:25px;left:7px;right:7px;overflow:hidden}.card-meta{color:#8fc4da;letter-spacing:.06em;font-size:7px;font-weight:700;bottom:7px}.action-dock{pointer-events:auto;border-radius:13px 4px 4px 13px;grid-template-columns:minmax(180px,280px) auto auto;align-items:center;gap:8px;min-height:56px;padding:8px 9px 8px 15px;display:grid;position:absolute;bottom:24px;right:22px}.notice{color:#8da8ba;max-width:280px;margin:0;font-size:10px;line-height:1.35}.notice.is-empty-combat{color:#c8f4ff;animation:.8s ease-out both empty-combat-notice}.primary-action,.quiet-action,.text-action,.prompt-options button{color:#effbff;letter-spacing:.1em;background:linear-gradient(#1e89aeeb,#0b4863f2);border:1px solid #65ddff80;border-radius:4px;min-height:38px;padding:0 16px;font-size:9px;font-weight:850;transition:filter .12s,transform .12s}.primary-action:hover,.quiet-action:hover,.prompt-options button:hover{filter:brightness(1.24);transform:translateY(-1px)}.quiet-action{color:#b3c5d0;background:#1b2733db;border-color:#9ab5c540}.text-action{color:#7793a5;background:0 0;border:0;min-height:28px}.floating-prompt{pointer-events:auto;border-left-color:#70e3ffb3;border-radius:4px 14px 14px 4px;width:min(330px,30vw);max-height:54vh;padding:18px;position:absolute;top:50%;right:24px;overflow:auto;transform:translateY(-50%)}.floating-prompt h2,.response-prompt h2{letter-spacing:.03em;margin:5px 0 12px;font-family:Arial Narrow,Impact,sans-serif;font-size:24px;font-weight:700}.prompt-options{gap:7px;display:grid}.prompt-options button{text-align:left;gap:2px;height:auto;min-height:48px;padding:8px 11px;display:grid}.prompt-options button small{color:#9bb5c4;letter-spacing:0;font-size:8px;font-weight:500}.upgrade-prompt{top:calc(50% + 155px)}.response-prompt{pointer-events:auto;border-color:#6b98ffb3;border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;width:min(680px,100vw - 44px);padding:16px 18px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.response-prompt h2{margin-bottom:2px}.response-prompt p{color:#8ca3b4;margin:0;font-size:10px}.response-pulse{border:2px solid #799cff;border-radius:50%;width:18px;height:18px;animation:1.5s infinite response-pulse;box-shadow:0 0 #799cff8c}.decision-actions{justify-content:center;gap:8px;display:flex}.privacy-curtain{z-index:100;pointer-events:auto;background:linear-gradient(#43bce809 1px,#0000 1px) 0 0/42px 42px,linear-gradient(90deg,#43bce809 1px,#0000 1px) 0 0/42px 42px,radial-gradient(circle at 50% 46%,#10283a 0,#07101b 34%,#020408 76%);place-items:center;display:grid;position:fixed;inset:0;overflow:hidden}.privacy-curtain:before,.privacy-curtain:after{content:"";background:linear-gradient(90deg,#03060b,#0a1e2df5);border-color:#68deff1f;width:min(18vw,230px);position:absolute;top:0;bottom:0}.privacy-curtain:before{border-right:1px solid #68deff1f;left:0}.privacy-curtain:after{background:linear-gradient(-90deg,#03060b,#0a1e2df5);border-left:1px solid #68deff1f;right:0}.privacy-curtain-panel{z-index:1;text-align:center;background:linear-gradient(150deg,#0c1a29,#050a12);border:1px solid #75deff4d;border-top-color:#75deffd1;border-radius:4px 4px 18px 18px;justify-items:center;width:min(560px,100vw - 48px);padding:48px 38px 42px;display:grid;position:relative;box-shadow:0 28px 90px #000,inset 0 1px #ffffff0d}.privacy-curtain-panel h1{letter-spacing:.025em;margin:8px 0 10px;font-family:Arial Narrow,Impact,sans-serif;font-size:clamp(44px,7vw,72px);font-weight:700}.privacy-curtain-panel p{color:#91adbe;margin:0 0 28px;font-size:13px}.privacy-curtain-panel .primary-action{min-width:210px}.decision-backdrop{z-index:30;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;background:#02050ab8;place-items:center;display:grid;position:absolute;inset:0}.decision-panel{text-align:center;border-top-color:#68e0ffb8;border-radius:5px 5px 18px 18px;width:min(760px,100vw - 48px);padding:26px}.decision-panel h1{letter-spacing:.025em;margin:7px 0 22px;font-family:Arial Narrow,Impact,sans-serif;font-size:clamp(34px,5vw,58px);font-weight:700}.decision-panel p{color:#91aaba}.mulligan-cards{justify-content:center;margin:0 0 25px;display:flex}.mulligan-cards img{aspect-ratio:.714;object-fit:cover;border:1px solid #82ddff59;border-radius:8px;width:132px;margin-left:-20px;box-shadow:0 16px 28px #0000006b}.mulligan-cards img:first-child{margin-left:0}.blocker-panel{width:min(650px,100vw - 48px)}.blocker-rows{text-align:left;gap:8px;margin-bottom:20px;display:grid}.blocker-rows label{background:#070e18c2;border:1px solid #7bbad829;grid-template-columns:1fr minmax(180px,.8fr);align-items:center;gap:18px;padding:9px 11px;display:grid}.blocker-rows select{background:#0b1622;border:1px solid #7ccbed4d;border-radius:4px;min-width:0;height:36px}.result-panel{width:min(480px,100vw - 48px)}@keyframes response-pulse{0%{box-shadow:0 0 #799cff94}70%{box-shadow:0 0 0 14px #799cff00}to{box-shadow:0 0 #799cff00}}@keyframes empty-combat-notice{0%{opacity:0;transform:translateY(4px)}20%,75%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-2px)}}@media (width<=980px){.archetype-grid{grid-template-columns:repeat(2,minmax(140px,1fr))}.match-topbar{grid-template-columns:132px minmax(180px,280px) 132px}.extra-deck-panel{width:170px}.board-readout{width:48vw}.board-card{min-width:96px}.action-dock{grid-template-columns:minmax(130px,190px) auto auto}.hand-card{width:108px;height:151px}}@media (width<=620px){.flow-screen{padding:34px 18px}.mode-grid{grid-template-columns:1fr}.mode-card{min-height:170px}.archetype-grid{grid-template-columns:1fr}.archetype-card{min-height:140px}.result-actions{flex-direction:column}}