:root{--ink:#f6f1e4;--ink-dim:#f6f1e4b8;--ink-faint:#f6f1e473;--panel:#0c122094;--panel-strong:#0a0e1adb;--edge:#ffe9b438;--gold:#ffd36b;--gold-deep:#c9962e;--hp:#ff5d6c;--aura:#5de8ff;--common:#c9ced8;--uncommon:#5fe0a6;--rare:#6aa8ff;--mythic:#ffcf4d;--display:"Cinzel", "Iowan Old Style", Georgia, serif;--ui:"Nunito", ui-rounded, "SF Pro Rounded", system-ui, sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font-family:var(--ui);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;background:#0b1020;margin:0;overflow:hidden}#app{position:fixed;inset:0}#app canvas{outline:none;width:100%;height:100%;display:block}kbd{min-width:1.6em;font:800 11px/1.4 var(--ui);color:var(--ink);text-align:center;letter-spacing:.02em;background:#ffffff1f;border:1px solid #ffffff38;border-bottom-width:2px;border-radius:6px;padding:.1em .45em;display:inline-block}.hud{pointer-events:none;text-shadow:0 1px 2px #00000073;position:fixed;inset:0}.hud.hidden,.overlay.hidden{display:none}.hud-tl{position:absolute;top:18px;left:20px}.brand{font:800 15px/1 var(--display);letter-spacing:.22em;color:var(--gold)}.day{font:700 13px/1 var(--ui);color:var(--ink-dim);margin-top:6px}.hand{background:var(--panel);border:1px solid var(--edge);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:12px;margin-top:12px;padding:9px 11px 10px}.hand-head{font:800 10.5px/1 var(--ui);letter-spacing:.14em;color:var(--ink-dim);justify-content:space-between;gap:18px;display:flex}.hand-count{color:var(--gold);letter-spacing:.04em}.hand-strip,.binder-hand{grid-template-columns:repeat(8,18px);gap:5px;margin-top:8px;display:grid}.mini{background:repeating-linear-gradient(45deg,#ffd36b29 0 2px,#0000 2px 5px),#18204a;border:1.5px solid #ffd36b59;border-radius:4px;place-items:center;width:18px;height:25px;font-size:11px;display:grid}.mini.found{background:color-mix(in srgb, var(--c) 38%, #141a2e);border-color:var(--c);box-shadow:0 0 8px color-mix(in srgb, var(--c) 55%, transparent)}.mini.cotd{border-color:#fff3c4;box-shadow:0 0 0 1.5px #fff3c459,0 0 10px #ffdc7899}.hud-tr{flex-direction:column;align-items:center;display:flex;position:absolute;top:18px;right:20px}.map-wrap{background:#1a4f7a;border:3px solid #ffe9b48c;border-radius:50%;width:184px;height:184px;position:relative;box-shadow:0 6px 24px #00000059,inset 0 0 0 1px #0006}.minimap{border-radius:50%;width:100%;height:100%;display:block}.map-n{font:800 11px/20px var(--display);text-align:center;width:20px;height:20px;color:var(--gold);background:#141a2e;border:1.5px solid #ffe9b48c;border-radius:50%;position:absolute;top:-11px;left:50%;transform:translate(-50%)}.region-label{font:700 12.5px/1 var(--display);letter-spacing:.08em;color:var(--ink);margin-top:9px}.hud-bl{gap:8px;display:grid;position:absolute;bottom:22px;left:20px}.bar{background:#080c18a8;border:1px solid #ffffff29;border-radius:11px;width:250px;height:22px;position:relative;overflow:hidden}.bar-fill{transform-origin:0;transition:transform .12s linear;position:absolute;inset:0}.bar.hp .bar-fill{background:linear-gradient(90deg,#e2334e,#ff7a62)}.bar.aura .bar-fill{background:linear-gradient(90deg,#3fb5ff,#6ff0ff 70%,#c8fbff)}.bar-label,.bar-num{font:800 11px/22px var(--ui);letter-spacing:.12em;text-shadow:0 1px 2px #000000e6,0 0 6px #0009;position:absolute;top:0}.bar-label{left:11px}.bar-num{letter-spacing:.02em;right:11px}.spellbar{align-items:flex-end;gap:10px;display:flex;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.slot{flex-direction:column;align-items:center;gap:5px;width:64px;display:flex}.slot-card{width:52px;height:72px;color:var(--c);background:radial-gradient(120% 80% at 50% 30%, color-mix(in srgb, var(--c) 30%, transparent), transparent 70%), linear-gradient(180deg, #1d2756, #10152e);border:2px solid color-mix(in srgb, var(--c) 70%, #ffe7a3);border-radius:9px;place-items:center;transition:transform .12s,filter .2s;display:grid;position:relative;overflow:hidden;box-shadow:0 4px 14px #0006,inset 0 0 0 2px #0a0e1e99}.slot-card svg{width:30px;height:30px;filter:drop-shadow(0 0 6px color-mix(in srgb, var(--c) 70%, transparent))}.slot-cd{background:conic-gradient(#040710c7 calc(var(--cd,0) * 360deg), transparent 0);position:absolute;inset:0}.slot-cost{font:900 10px/1 var(--ui);color:#bff6ff;position:absolute;bottom:3px;right:4px}.slot kbd{background:#141a2e;margin-top:-14px;position:relative}.slot-name{font:800 10px/1.1 var(--ui);letter-spacing:.04em;color:var(--ink-dim);text-align:center;white-space:nowrap}.slot.low .slot-card{filter:grayscale(.85)brightness(.7)}.slot.active .slot-card{box-shadow:0 0 0 2px var(--c), 0 0 22px var(--c)}.slot.fired .slot-card{animation:.28s fired}.slot.deny .slot-card{animation:.3s deny}@keyframes fired{0%{transform:translateY(0)scale(1)}35%{box-shadow:0 0 26px var(--c);transform:translateY(-7px)scale(1.06)}to{transform:translateY(0)scale(1)}}@keyframes deny{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.hud-br{position:absolute;bottom:22px;right:20px}.binder-btn{pointer-events:auto;border:1px solid var(--edge);background:var(--panel);color:var(--ink);font:800 13px/1 var(--display);letter-spacing:.08em;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:12px;align-items:center;gap:8px;padding:10px 14px;display:flex}.binder-count{color:var(--gold);font-family:var(--ui)}.crosshair{border:1.5px solid #ffffff8c;border-radius:50%;width:22px;height:22px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.crosshair i{background:#fff;border-radius:50%;width:4px;height:4px;margin:-2px 0 0 -2px;position:absolute;top:50%;left:50%}.toasts{gap:8px;width:260px;display:grid;position:absolute;top:250px;right:20px}.toast{background:var(--panel-strong);border:1px solid color-mix(in srgb, var(--c) 60%, transparent);box-shadow:0 6px 20px #00000059, 0 0 18px color-mix(in srgb, var(--c) 25%, transparent);border-radius:12px;align-items:center;gap:10px;padding:8px 12px 8px 8px;animation:.35s cubic-bezier(.2,1.4,.4,1) toast-in;display:flex}.toast.cotd{border-color:#fff3c4;box-shadow:0 0 26px #ffdc788c}.toast.out{opacity:0;transition:all .5s;transform:translate(20px)}.toast img{border-radius:4px;width:40px;height:56px}.toast-kicker{font:800 10px/1 var(--ui);letter-spacing:.12em;color:var(--c);text-transform:uppercase}.toast-name{font:700 15px/1.15 var(--display);margin-top:4px}.toast-rarity{font:700 11px/1 var(--ui);color:var(--ink-faint);margin-top:3px}@keyframes toast-in{0%{opacity:0;transform:translate(30px)scale(.96)}}.notices{font:700 13px/1 var(--ui);opacity:0;white-space:nowrap;background:#080c18b3;border-radius:999px;padding:7px 14px;transition:opacity .25s;position:absolute;bottom:136px;left:50%;transform:translate(-50%)}.notices.show{opacity:1}.banner{text-align:center;opacity:0;transition:opacity .7s;position:absolute;top:15%;left:50%;transform:translate(-50%)}.banner.show{opacity:1}.banner-rule{background:linear-gradient(90deg,#0000,#ffd36bd9,#0000);width:280px;height:1px;margin:0 auto 12px}.banner-title{font:800 38px/1.05 var(--display);letter-spacing:.14em;color:#fff8e6;text-shadow:0 2px 18px #00000073}.banner-sub{font:italic 600 15px/1.3 var(--ui);color:var(--ink-dim);margin-top:8px}.channel{text-align:center;font:800 12px/1 var(--display);letter-spacing:.14em;color:#c8fbff;display:none;position:absolute;top:62%;left:50%;transform:translate(-50%)}.channel.show{display:block}.channel-track{background:#080c18b3;border-radius:3px;width:220px;height:6px;margin-top:8px;overflow:hidden}.channel-fill{transform-origin:0;background:linear-gradient(90deg,#5de8ff,#c8fbff);height:100%}.hurt-veil{opacity:0;background:radial-gradient(#0000 55%,#dc1e3c73);position:absolute;inset:0}.hurt-veil.on{animation:.55s hurt}@keyframes hurt{0%{opacity:1}to{opacity:0}}.overlay{place-items:center;padding:24px;display:grid;position:fixed;inset:0;overflow:auto}.overlay.intro{background:radial-gradient(at 50% 40%,#080c1c40,#080c1cb8)}.overlay.pause,.overlay.binder{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0609149e}.intro-panel,.pause-panel{text-align:center;border:1px solid var(--edge);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(#0e1428d6,#0a0e1ce6);border-radius:22px;width:min(720px,100%);padding:34px 38px 26px;box-shadow:0 30px 80px #00000080}.intro-kicker{font:800 12px/1 var(--ui);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-dim)}.title{font:800 clamp(40px, 7vw, 68px)/1 var(--display);letter-spacing:.08em;background:linear-gradient(#fff3c4,#ffd36b 55%,#c9962e);color:#0000;text-shadow:none;filter:drop-shadow(0 3px 14px #ffc85a59);-webkit-background-clip:text;background-clip:text;margin:12px 0 0}.tagline{font:italic 700 18px/1.3 var(--ui);color:var(--ink);margin:10px 0 0}.pitch{max-width:540px;font:600 14.5px/1.55 var(--ui);color:var(--ink-dim);margin:14px auto 0}.enter,.resume,.share,.close{cursor:pointer;font-family:var(--display);border:none}.enter,.resume{letter-spacing:.12em;color:#1a1206;background:linear-gradient(#ffe7a3,#ffc94f);border-radius:14px;margin-top:22px;padding:14px 34px;font-size:17px;font-weight:800;transition:transform .15s,box-shadow .15s;box-shadow:0 8px 26px #ffc45066,inset 0 -3px #965a0059}.enter:hover,.resume:hover{transform:translateY(-2px);box-shadow:0 12px 30px #ffc4508c,inset 0 -3px #965a0059}.controls{text-align:left;grid-template-columns:repeat(3,1fr);gap:8px 14px;margin-top:22px;display:grid}.ctl{font:600 12.5px/1.2 var(--ui);color:var(--ink-dim);align-items:center;gap:8px;display:flex}.ctl kbd{flex:none}.disclaimer{max-width:600px;font:600 11px/1.5 var(--ui);color:var(--ink-faint);margin:22px auto 0}.pause-panel h2{font:800 34px/1 var(--display);letter-spacing:.12em;color:var(--gold);margin:0}.binder-panel{background:linear-gradient(#1b1430,#120e22);border:1px solid #ffd36b4d;border-radius:22px;width:min(1100px,100%);max-height:calc(100vh - 32px);padding:22px 26px;overflow:auto;box-shadow:0 30px 80px #0000008c,inset 0 0 0 6px #ffd36b0f}.binder-panel header,.binder-panel footer{justify-content:space-between;align-items:center;gap:16px;display:flex}.binder-title{font:800 28px/1 var(--display);letter-spacing:.12em;color:var(--gold)}.binder-stats{font:600 13.5px/1 var(--ui);color:var(--ink-dim);margin-top:6px}.binder-stats b{color:var(--ink)}.close,.share{letter-spacing:.08em;color:var(--ink);background:#ffffff14;border:1px solid #ffffff29;border-radius:11px;align-items:center;gap:8px;padding:10px 16px;font-size:13px;font-weight:700;display:flex}.share{color:#1a1206;background:linear-gradient(#ffe7a3,#ffc94f);border:none}.binder-body{grid-template-columns:1fr 280px;gap:22px;margin:18px 0;display:grid}.binder-grid{grid-template-columns:repeat(8,1fr);align-content:start;gap:9px;display:grid}.bslot{aspect-ratio:63/88;cursor:pointer;color:var(--ink-faint);font-family:var(--ui);background:#ffffff08;border:1.5px dashed #ffd36b47;border-radius:8px;padding:0;transition:transform .12s;position:relative;overflow:hidden}.bslot:hover{transform:translateY(-3px)}.bslot.owned{background:0 0;border:none;box-shadow:0 6px 16px #0006}.bslot img{width:100%;height:100%;display:block}.bno{font:800 11px/1 var(--ui);letter-spacing:.1em;position:absolute;top:7px;left:0;right:0}.bq{font:800 30px/1 var(--display);color:#ffd36b59}.dupes{font:900 11px/1 var(--ui);color:var(--gold);background:#0a0e1ad9;border-radius:6px;padding:2px 6px;position:absolute;bottom:4px;right:4px}.binder-detail{text-align:center;background:#ffffff0a;border:1px solid #ffffff14;border-radius:16px;padding:14px}.detail-card{border-radius:10px;width:168px;box-shadow:0 14px 36px #00000080}.detail-card.unknown{filter:brightness(.6)saturate(.6)}.binder-detail h3{font:700 20px/1.15 var(--display);margin:14px 0 6px}.detail-meta{font:700 12.5px/1.3 var(--ui);color:var(--ink-dim)}.detail-flavor,.detail-hint,.detail-owned{font:600 13.5px/1.45 var(--ui);color:var(--ink-dim);margin:10px 0 0}.detail-flavor{color:var(--ink);font-style:italic}.binder-today{font:800 11px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);align-items:center;gap:12px;display:flex}.binder-hand{grid-template-columns:repeat(16,18px);margin-top:0}@media (width<=900px){.binder-body{grid-template-columns:1fr}.binder-grid{grid-template-columns:repeat(5,1fr)}.controls{grid-template-columns:repeat(2,1fr)}.spellbar .slot-name{display:none}}.mini{border-bottom:2px solid var(--land,transparent)}.binder-tabs{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.btab{cursor:pointer;color:var(--ink-dim);font:700 12.5px/1 var(--ui);background:#ffffff0d;border:1px solid #ffffff24;border-radius:10px;padding:8px 12px}.btab span{color:var(--ink-faint);margin-left:4px}.btab.on{color:var(--ink);border-color:var(--accent);background:color-mix(in srgb, var(--accent) 18%, transparent)}.overlay.worldmap{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#060914a8}.map-panel{background:linear-gradient(#121a2e,#0c1222);border:1px solid #ffd36b4d;border-radius:22px;width:min(1100px,100%);max-height:calc(100vh - 32px);padding:22px 26px 26px;overflow:auto;box-shadow:0 30px 80px #0000008c}.map-panel header{justify-content:space-between;align-items:center;display:flex}.land-grid{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px;display:grid}.land-card{cursor:pointer;text-align:left;color:var(--ink);background:radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 60%), #ffffff0a;border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);font-family:var(--ui);border-radius:16px;grid-template-columns:64px 1fr auto;align-items:center;gap:14px;padding:16px;transition:transform .12s,box-shadow .12s;display:grid}.land-card:hover{box-shadow:0 10px 30px color-mix(in srgb, var(--accent) 25%, transparent);transform:translateY(-2px)}.land-card.current{cursor:default;box-shadow:inset 0 0 0 2px var(--accent)}.land-icon{text-align:center;font-size:46px}.land-title{font:800 11px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}.land-name-big{font:800 21px/1.1 var(--display);margin-top:5px}.land-card p{font:600 13px/1.45 var(--ui);color:var(--ink-dim);margin:6px 0 0}.land-meta{font:700 12px/1 var(--ui);color:var(--ink-dim);margin-top:8px}.cotd-tag{color:#fff3c4}.land-go{font:800 13px/1 var(--display);letter-spacing:.08em;color:#121212;background:var(--accent);border-radius:10px;padding:10px 14px}.land-card.current .land-go{color:var(--accent);border:1px solid var(--accent);background:0 0}.overlay.loading{z-index:50;background:radial-gradient(#1a2440,#070a14);transition:opacity .45s}.overlay.loading.fade{opacity:0}.loading-card{text-align:center}.loading-icon{font-size:64px;animation:1.6s ease-in-out infinite bob}.loading-title{font:800 34px/1.1 var(--display);letter-spacing:.1em;color:var(--gold);margin-top:10px}.loading-sub{font:italic 600 15px/1.3 var(--ui);color:var(--ink-dim);margin-top:8px}.loading-bar{background:#ffffff1f;border-radius:2px;width:220px;height:4px;margin:22px auto 0;overflow:hidden}.loading-bar i{background:var(--gold);width:40%;height:100%;animation:1.1s ease-in-out infinite slide;display:block}@keyframes bob{50%{transform:translateY(-8px)}}@keyframes slide{0%{transform:translate(-110%)}to{transform:translate(260%)}}@media (width<=900px){.land-grid{grid-template-columns:1fr}}.overlay.select{background:linear-gradient(90deg,#060914e0 0%,#0609149e 38%,#06091400 62%);place-items:center start;padding-left:4vw}.select-panel{width:min(520px,92vw)}.roster{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;display:grid}.pick{cursor:pointer;aspect-ratio:1;background:#10162a;border:2px solid #ffffff24;border-radius:14px;padding:0;transition:transform .12s,border-color .12s,box-shadow .12s;position:relative;overflow:hidden}.pick img{object-fit:cover;filter:saturate(.85)brightness(.85);width:100%;height:100%;transition:filter .12s;display:block}.pick:hover img,.pick.on img{filter:none}.pick:hover{transform:translateY(-2px)}.pick.on{border-color:var(--aura);box-shadow:0 0 0 2px color-mix(in srgb, var(--aura) 40%, transparent), 0 10px 30px color-mix(in srgb, var(--aura) 35%, transparent)}.pick-name{font:800 13px/1 var(--display);letter-spacing:.1em;color:#fff;background:linear-gradient(#0000,#060914d9);padding:18px 8px 7px;position:absolute;bottom:0;left:0;right:0}.select-detail{margin-top:18px}.sel-title{font:800 11px/1 var(--ui);letter-spacing:.18em;text-transform:uppercase;color:var(--aura)}.sel-name{font:800 40px/1 var(--display);letter-spacing:.04em;margin-top:6px}.sel-bio{font:600 15px/1.5 var(--ui);color:var(--ink-dim);margin:10px 0 0}.sel-perk{background:color-mix(in srgb, var(--aura) 14%, transparent);border:1px solid color-mix(in srgb, var(--aura) 40%, transparent);font:700 14px/1.3 var(--ui);border-radius:12px;align-items:center;gap:10px;margin-top:12px;padding:10px 12px;display:flex}.sel-perk-dot{background:var(--aura);width:10px;height:10px;box-shadow:0 0 10px var(--aura);border-radius:50%;flex:none}.sel-status{min-height:18px;font:italic 600 13px/1.3 var(--ui);color:var(--ink-faint);margin-top:10px}.begin:disabled{opacity:.45;cursor:progress}.player-name{color:var(--ink);font-weight:800}.sel-field{font:800 11px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);gap:6px;margin-top:14px;display:grid}.sel-input{width:min(320px,100%);color:var(--ink);font:700 17px/1.2 var(--ui);letter-spacing:.02em;text-transform:none;background:#080c1c99;border:1px solid #ffffff2e;border-radius:12px;outline:none;padding:11px 14px}.sel-input:focus{border-color:var(--aura);box-shadow:0 0 0 3px color-mix(in srgb, var(--aura) 30%, transparent)}.sel-input::placeholder{color:#ffffff59}.select-detail .begin{margin-top:14px}.nameplate{font:800 12px/1.2 var(--ui);letter-spacing:.04em;color:#fff;text-shadow:0 1px 2px #0009;pointer-events:none;white-space:nowrap;opacity:0;will-change:transform;background:#080c1c73;border-radius:999px;align-items:center;gap:6px;padding:3px 9px 3px 7px;display:flex;position:fixed;top:0;left:0}.nameplate i{background:var(--aura,#c8fbff);width:7px;height:7px;box-shadow:0 0 8px var(--aura,#c8fbff);border-radius:50%}.gfx{justify-items:center;gap:8px;margin:18px 0 4px;display:grid}.gfx-label{font:800 11px/1 var(--ui);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint)}.gfx-opts{background:#ffffff0f;border-radius:12px;gap:6px;padding:4px;display:flex}.gfx-opts button{color:var(--ink-dim);font:800 13px/1 var(--ui);cursor:pointer;background:0 0;border:0;border-radius:9px;padding:7px 14px}.gfx-opts button:hover{color:var(--ink)}.gfx-opts button.on{background:var(--gold,#f3c969);color:#1a1206}.gfx-note{font:600 13px/1.4 var(--ui);color:var(--ink-faint)}