@import"https://fonts.googleapis.com/css2?family=Lilita+One&family=IBM+Plex+Mono:wght@400;500;600&display=swap";:root{--void: #0a1020;--panel: #14203a;--line: #24345a;--pump: #2bffb0;--dump: #ff4d6d;--gas: #ffc531;--violet: #7c5cff;--bone: #e8ecf7;--muted: #8b9ab8;--ink: #0b0d16;--cream: #fbf4e4;--stroke: 3px;--lift: 5px;--display: "Lilita One", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--void);color:var(--bone);font-family:var(--mono);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}#stage{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#ui{position:fixed;inset:0;pointer-events:none}.screen,.result,.scorebar,.dock,.soundbtn{pointer-events:auto}button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}button:focus-visible{outline:3px solid var(--gas);outline-offset:3px}.outlined{font-family:var(--display);color:var(--ink);-webkit-text-stroke:5px #fff;paint-order:stroke fill;text-transform:uppercase;letter-spacing:.01em}@supports not (-webkit-text-stroke: 1px #000){.outlined{text-shadow:-3px -3px 0 #fff,0 -3px 0 #fff,3px -3px 0 #fff,-3px 0 0 #fff,3px 0 0 #fff,-3px 3px 0 #fff,0 3px 0 #fff,3px 3px 0 #fff}}.ribbon{font-family:var(--display);font-size:15px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink);background:var(--gas);padding:9px 34px;justify-self:start;clip-path:polygon(0 0,100% 0,calc(100% - 16px) 50%,100% 100%,0 100%,16px 50%);filter:drop-shadow(0 4px 0 rgba(0,0,0,.55))}.bubble{position:relative;background:var(--cream);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:16px;padding:7px 16px;font-size:12px;font-weight:500;line-height:1.35;box-shadow:0 4px 0 var(--ink)}.bubble:before,.bubble:after{content:"";position:absolute;left:50%;transform:translate(-50%);width:0;height:0;border-style:solid}.bubble:before{bottom:100%;border-width:0 11px 13px 11px;border-color:transparent transparent var(--ink) transparent}.bubble:after{bottom:calc(100% - var(--stroke));border-width:0 8px 10px 8px;border-color:transparent transparent var(--cream) transparent}.bubble.tail-down:before{bottom:auto;top:100%;border-width:13px 11px 0 11px;border-color:var(--ink) transparent transparent transparent}.bubble.tail-down:after{bottom:auto;top:calc(100% - var(--stroke));border-width:10px 8px 0 8px;border-color:var(--cream) transparent transparent transparent}.screen.title{grid-template-rows:none;place-content:center;justify-items:center;gap:0;text-align:center;overflow:hidden;background:radial-gradient(120% 90% at 50% 8%,#6a5aa8 0%,transparent 62%),radial-gradient(90% 70% at 82% 92%,#b8623f 0%,transparent 58%),linear-gradient(180deg,#2a3160,#131a35)}.title-sky{position:absolute;inset:0;pointer-events:none}.title-rock{position:absolute;display:block;background:#3b3866;border:var(--stroke) solid rgba(11,13,22,.55);border-radius:38% 62% 46% 54%/58% 42%;opacity:.55;animation:drift 14s ease-in-out infinite}.title-rock.r1{width:190px;height:74px;left:6%;top:22%;animation-delay:0s}.title-rock.r2{width:128px;height:52px;right:9%;top:34%;animation-delay:-4.5s;opacity:.4}.title-rock.r3{width:240px;height:88px;right:16%;bottom:12%;animation-delay:-8s;opacity:.3}@keyframes drift{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-22px) rotate(2deg)}}.title-wordmark{position:relative;margin:0;font-size:clamp(46px,11vw,122px);line-height:.92;color:var(--cream);text-shadow:0 8px 0 rgba(0,0,0,.34)}.title-wordmark span{color:var(--pump)}.title-sub{position:relative;margin:14px 0 0;color:var(--muted);font-size:clamp(12px,1.6vw,15px);letter-spacing:.22em;text-transform:uppercase}.wallet-chip{position:relative;margin:16px 0 0;padding:8px 14px;border-radius:999px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--pump)}.wallet-chip.muted{background:transparent;color:var(--muted);border:1px solid var(--line)}.play-btn{position:relative;margin-top:clamp(28px,5vh,54px);font-size:clamp(22px,3vw,32px);padding:16px clamp(56px,12vw,104px);animation:play-pulse 2.4s ease-in-out infinite}.play-btn:hover,.play-btn:active,.play-btn:focus-visible{animation:none}@keyframes play-pulse{0%,to{transform:translateY(0);box-shadow:0 var(--lift) 0 var(--ink)}50%{transform:translateY(-4px);box-shadow:0 9px 0 var(--ink)}}.title-hint{position:relative;margin:clamp(22px,4vh,40px) 0 0;color:var(--muted);font-size:12.5px;max-width:34ch;line-height:1.6}.screen.loading{grid-template-rows:none;place-content:center;justify-items:center;gap:18px;text-align:center}.screen.loading .brand{font-size:clamp(30px,6vw,56px);line-height:.95;margin:0;color:var(--cream);text-shadow:0 6px 0 rgba(0,0,0,.32)}.load-track{width:min(340px,70vw);height:12px;border-radius:99px;background:#0408108c;box-shadow:inset 0 2px 5px #00000080;overflow:hidden}.load-fill{width:0%;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--pump),#7fe9ff);transition:width .22s ease-out}.load-count{margin:0;color:var(--muted);font-size:12px;letter-spacing:.09em}.screen{position:absolute;inset:0;display:grid;grid-template-rows:auto auto 1fr auto;gap:14px;padding:22px clamp(14px,4vw,56px) 16px;background:radial-gradient(120% 80% at 50% -10%,#4a6091 0%,transparent 70%),linear-gradient(180deg,#2b3a5e,#1a2540);overflow-y:auto}.masthead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}.wordmark{font-size:clamp(34px,7vw,66px);line-height:.95;margin:0;text-shadow:0 6px 0 rgba(0,0,0,.32)}.wordmark span{color:var(--pump)}.tagline{margin:10px 0 0;color:var(--muted);font-size:12.5px;max-width:44ch;line-height:1.5}.ticker-tape{max-width:30ch}.ticker-tape b{color:#b8451f;font-weight:600}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(146px,1fr));gap:13px;align-content:start;padding-bottom:4px}.card,.slot,.drag-ghost{--rarity: #9fb0c9;position:relative;text-align:left;border:var(--stroke) solid var(--ink);background:var(--cream);border-radius:14px;padding:0;overflow:hidden;display:grid;grid-template-rows:auto auto;color:var(--ink)}.rarity-common{--rarity: #93a6c2}.rarity-rare{--rarity: #3fb5f0}.rarity-epic{--rarity: #a56bff}.rarity-legendary{--rarity: #ffab21}.card{box-shadow:0 var(--lift) 0 var(--ink);transition:transform .14s ease,box-shadow .14s ease}.card:hover{transform:translateY(-3px) rotate(-1deg);box-shadow:0 8px 0 var(--ink)}.card:active{transform:translateY(2px);box-shadow:0 2px 0 var(--ink)}.card[aria-pressed=true]{background:#fffdf6;box-shadow:0 var(--lift) 0 var(--ink),0 0 0 3px var(--pump)}.card-art{position:relative;aspect-ratio:1 / .82;overflow:hidden;border-bottom:var(--stroke) solid var(--ink)}.card-art svg{width:100%;height:100%;display:block}.card-art:after{content:"";position:absolute;left:0;right:0;bottom:0;height:7px;background:var(--rarity);box-shadow:inset 0 2px #00000038}.card-art:before{content:"";position:absolute;inset:4px;border:2px solid var(--rarity);border-radius:6px;opacity:.65;pointer-events:none}.rarity-legendary .card-art:before{inset:3px;border-width:3px;opacity:.9;box-shadow:0 0 0 2px #ffab2147}.card-cost{position:absolute;top:7px;left:7px;font-family:var(--display);font-size:16px;color:var(--ink);background:var(--gas);border:var(--stroke) solid var(--ink);border-radius:50%;min-width:30px;height:30px;display:grid;place-items:center;box-shadow:0 3px 0 var(--ink)}.kind-spell .card-cost{background:var(--violet);color:#fff}.card-tag{position:absolute;top:9px;right:8px;font-family:var(--display);font-size:9px;letter-spacing:.14em;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:5px;padding:1px 5px}.card-id{padding:8px 10px 10px;display:grid;gap:2px}.card-name{font-family:var(--display);font-size:15px;line-height:1.1;color:var(--ink)}.card-ticker{font-size:9px;color:#6c7690;letter-spacing:.1em;font-weight:600}.card-stats{font-size:9px;color:#6c7690;letter-spacing:.03em;border-top:2px solid rgba(11,13,22,.16);margin-top:4px;padding-top:5px;font-weight:500}.card-check{position:absolute;bottom:8px;right:8px;width:22px;height:22px;border-radius:50%;border:2px solid var(--ink);display:grid;place-items:center;font-size:12px;color:transparent;background:#ffffffbf}.card[aria-pressed=true] .card-check{color:var(--ink);background:var(--pump)}.tray{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:6px}.deck-count{font-family:var(--display);font-size:26px;color:var(--bone);line-height:1}.deck-count small{display:block;font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.08em;margin-top:3px}.primary,.ghost{font-family:var(--display);font-size:18px;letter-spacing:.05em;text-transform:uppercase;padding:13px 34px;border:var(--stroke) solid var(--ink);border-radius:999px;color:var(--ink);box-shadow:0 var(--lift) 0 var(--ink);transition:transform .1s ease,box-shadow .1s ease}.primary{background:var(--pump)}.ghost{background:var(--cream)}.primary:hover:not(:disabled),.ghost:hover{transform:translateY(-2px);box-shadow:0 7px 0 var(--ink)}.primary:active:not(:disabled),.ghost:active{transform:translateY(var(--lift));box-shadow:0 0 0 var(--ink)}.primary:disabled{background:#55617d;color:#2b3247;box-shadow:0 var(--lift) 0 #1b2133;border-color:#1b2133;cursor:not-allowed}.hud{position:absolute;inset:0;display:grid;grid-template-rows:auto 1fr auto}.scorebar{display:flex;align-items:center;justify-content:center;gap:clamp(10px,3vw,30px);padding:10px 16px 12px;justify-self:center}.crowns{font-family:var(--display);font-size:30px;min-width:62px;text-align:center;color:var(--ink);background:var(--cream);border:var(--stroke) solid var(--ink);border-radius:12px;padding:2px 10px 4px;box-shadow:0 4px 0 var(--ink);line-height:1.05}.crowns small{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:#0b0d16ad;font-weight:600}.crowns.you{background:var(--pump)}.crowns.them{background:var(--dump)}.clock{font-family:var(--display);font-size:24px;padding:3px 16px 5px;border:var(--stroke) solid var(--ink);border-radius:12px;background:var(--cream);color:var(--ink);text-align:center;min-width:104px;box-shadow:0 4px 0 var(--ink);line-height:1.05}.clock small{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;color:#0b0d169e;font-weight:600}.clock.urgent{background:var(--gas)}.soundbtn{position:absolute;top:12px;right:12px;width:38px;height:38px;border-radius:50%;border:var(--stroke) solid var(--ink);background:var(--cream);color:var(--ink);display:grid;place-items:center;font-size:15px;box-shadow:0 4px 0 var(--ink)}.soundbtn:active{transform:translateY(4px);box-shadow:0 0 0 var(--ink)}.dock{display:grid;gap:8px;width:min(100%,860px);justify-self:center;padding:8px clamp(8px,3vw,20px) max(10px,env(safe-area-inset-bottom))}.gas-rail{display:flex;align-items:center;gap:8px}.gas-label{font-family:var(--display);font-size:12px;letter-spacing:.12em;color:var(--ink);background:var(--gas);border:2px solid var(--ink);border-radius:6px;padding:1px 7px}.gas-bar{flex:1;display:flex;gap:3px;height:16px;border:2px solid var(--ink);border-radius:8px;padding:2px;background:#16223c}.pip{flex:1;border-radius:2px;background:#ffffff24;position:relative;overflow:hidden}.pip i{position:absolute;inset:0;transform-origin:left;background:linear-gradient(180deg,#ffe08a,var(--gas));transform:scaleX(0)}.gas-count{font-family:var(--display);font-size:20px;color:var(--gas);min-width:24px;text-align:right;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill}.hand{display:grid;grid-template-columns:.6fr repeat(4,1fr);gap:7px;align-items:end}.slot{box-shadow:0 4px 0 var(--ink);touch-action:none;transition:transform .12s ease,box-shadow .12s ease}.slot .card-art{aspect-ratio:1 / .66}.slot .card-id{padding:4px 7px 6px}.slot .card-name{font-size:12.5px}.slot .card-cost{min-width:24px;height:24px;font-size:13px;top:4px;left:4px;border-width:2px}.slot.ready:hover{transform:translateY(-4px);box-shadow:0 8px 0 var(--ink)}.slot.armed{transform:translateY(-11px) rotate(-3deg);box-shadow:0 13px 0 var(--ink),0 0 0 3px var(--pump)}.slot.broke{filter:saturate(.2) brightness(.82);cursor:not-allowed}.slot.broke:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 6px,rgba(11,13,22,.28) 6px 12px)}.slot.next{opacity:.62;cursor:default}.slot.next .card-id{padding:3px 6px 5px}.slot.next .card-name{font-size:10.5px}.slot-label{position:absolute;top:4px;right:5px;font-family:var(--display);font-size:8px;letter-spacing:.12em;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:4px;padding:0 4px}.hint{justify-self:center;text-align:center;max-width:42ch}.drag-ghost{position:fixed;z-index:50;width:98px;pointer-events:none;box-shadow:0 14px #0b0d168c;transform:translate(-50%,-120%) rotate(-4deg) scale(1.05)}.drag-ghost.invalid{border-color:var(--dump);box-shadow:0 14px #0b0d168c,0 0 0 3px var(--dump)}.drag-ghost .card-art{aspect-ratio:1 / .8}.drag-ghost .card-id{padding:4px 7px 6px}.drag-ghost .card-name{font-size:11.5px}.result{position:absolute;inset:0;display:grid;place-content:center;gap:14px;justify-items:center;background:#0a1020db;backdrop-filter:blur(6px);text-align:center}.verdict{font-size:clamp(46px,12vw,96px);line-height:.92;margin:0;text-shadow:0 8px 0 rgba(0,0,0,.5)}.verdict.win{color:var(--pump)}.verdict.loss{color:var(--dump)}.verdict.draw{color:var(--gas)}.result-line{color:var(--bone);font-size:13px;letter-spacing:.06em}.result-actions{display:flex;gap:12px;margin-top:8px;flex-wrap:wrap;justify-content:center}@media (max-width: 640px){:root{--stroke: 2.5px;--lift: 4px}.hand{grid-template-columns:.5fr repeat(4,1fr);gap:5px}.slot .card-ticker{display:none}.slot .card-art{aspect-ratio:1 / .78}.grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:9px}.slot.next .card-id{display:none}.hint{font-size:11px;padding:6px 12px}.card-stats{display:none}.outlined{-webkit-text-stroke-width:4px}.crowns{font-size:24px;min-width:52px}.clock{font-size:20px;min-width:88px}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}
