*{box-sizing:border-box} :root{color-scheme:dark;--gold:#e6bd75;--muted:#a7a99d;--ink:#101715}body{margin:0;background:#0c1211;color:#f1eadb;font-family:Segoe UI,Arial,sans-serif}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 15%,#34403544,transparent 65%)}main{position:relative;max-width:1336px;padding:0 36px;margin:auto}header{height:88px;display:flex;align-items:center;gap:30px}.brand{font-family:Georgia,serif;font-size:19px;letter-spacing:3px;text-decoration:none;color:#ede3cb}.sigil{color:var(--gold);font-size:29px;margin-right:10px}.edition{flex:1;color:#979c8c;font-size:10px;letter-spacing:2px}.edition span{border-left:1px solid #4c5042;margin-left:18px;padding-left:18px}button{font:inherit;cursor:pointer}button:focus-visible{outline:2px solid #ffe1a0;outline-offset:4px}.quiet{border:1px solid #4f5747;background:#101713a8;color:#d3d3be;font-size:10px;letter-spacing:1.5px;padding:11px 16px}.game-frame{position:relative;border:1px solid #6c6b4c;box-shadow:0 20px 80px #0008;background:#19251c;overflow:hidden;aspect-ratio:8/5}#game{display:block;width:100%;height:100%;image-rendering:pixelated;outline:none;cursor:crosshair}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0c1514d9}.selection{justify-content:space-between;padding:5%;gap:4%;background:linear-gradient(90deg,#0a1314f2,#12201cdb)}.eyebrow{font-size:10px;letter-spacing:2.4px;color:var(--gold);margin-bottom:22px}.intro{width:38%}h1{font-family:Georgia,serif;font-size:clamp(36px,5.5vw,76px);font-weight:400;line-height:1.03;margin:0 0 24px}h1 em{color:var(--gold);font-weight:400}.intro p{color:#b4bcac;font-size:14px;line-height:1.9}.intro-rule{width:48px;height:1px;background:var(--gold);margin:30px 0}.intro small{font-size:8px;letter-spacing:1.5px;color:#879581}.roster{width:59%;max-width:590px}.cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hero-card{text-align:left;border:1px solid #546047;background:#18251c9c;color:#eae9d6;padding:18px 16px 14px;transition:background .2s,border-color .2s}.hero-card:hover{background:#303c2a}.hero-card.selected{border-color:var(--gold);background:linear-gradient(145deg,#3a3c27d9,#1d281ed9);box-shadow:inset 0 0 0 3px #e6bd7510}.card-index{font-size:8px;letter-spacing:2px;color:#aeb29b}.hero-card canvas{display:block;width:100%;height:auto;max-height:180px;object-fit:contain;image-rendering:pixelated}.hero-card h2{font-family:Georgia,serif;font-size:23px;line-height:1.05;font-weight:400;margin:5px 0 18px}.hero-card p{font-size:10px;color:#c4c8b4;margin:10px 0}.hero-card p span{float:right;color:#999c7d;font-size:8px;padding-top:2px}.pick{display:block;border-top:1px solid #62644a;margin-top:18px;padding-top:13px;font-size:9px;letter-spacing:1.5px;color:var(--gold)}.primary{background:var(--gold);border:1px solid #ffe3a6;color:#292b1d;padding:16px 20px;font-size:11px;letter-spacing:2px;font-weight:700;display:block;width:100%;margin-top:18px}.primary:hover{background:#f8d79a}.primary:disabled{opacity:.6;cursor:wait}.roster-note{display:block;text-align:center;font-size:10px;color:#97a08c;margin-top:13px}footer{display:flex;justify-content:space-between;gap:12px;padding:25px 0;border-bottom:1px solid #303b2e}footer>div{display:flex;align-items:center;gap:10px}kbd{font-family:inherit;color:#d5cfb7;font-size:9px;border:1px solid #4b5545;padding:7px;white-space:nowrap}footer span{font-size:10px;color:#9ba58f}.footnote{display:flex;justify-content:space-between;padding:17px 0;color:#788770;font-size:8px;letter-spacing:1.4px}.hidden{display:none!important}#hud{position:absolute;inset:0;pointer-events:none;padding:24px;display:flex;flex-direction:column;justify-content:space-between}.hud-top,.hud-bottom{display:flex;justify-content:space-between;align-items:start;gap:16px}.hud-top .quiet{pointer-events:auto}.vitals,.wave,.ability,.level,.stance{background:#0b1512d9;border:1px solid #677052;padding:11px 14px}.vitals{width:210px}.vitals>span{font-family:Georgia,serif;font-size:16px}.health-track,.charge-track,.xp-track{height:6px;background:#303729;margin:9px 0 5px;overflow:hidden}i{display:block;height:100%;transition:width .08s linear}#health{background:#b85145;width:100%}.vitals small,.level small{font-size:9px;color:#b8bba6}.wave{text-align:center}.wave small{display:block;font-size:8px;letter-spacing:2px;color:#9ba68e}.wave b{display:block;font-size:12px;letter-spacing:2px;margin:5px}.wave span{font-size:9px;color:#bbbda6}.hud-bottom{align-items:end}.ability{width:280px}.ability>span{font-family:Georgia,serif;font-size:17px;color:#ead2a3}.ability small{font-size:10px;color:#bfc3ad}#charge{background:var(--gold);width:0}#xp{background:#87a77b}.level{width:165px}.level b{font-size:10px;letter-spacing:2px}.stance{font-size:9px;color:var(--gold);letter-spacing:1px}.modal-card{width:400px;text-align:center;border:1px solid #93805b;background:#121e18;padding:35px}.modal-card h2{font:42px Georgia,serif;margin:20px 0;color:#efd7a9}.modal-card p{color:#aeb8a1;font-size:13px;line-height:1.8}.secondary{width:100%;padding:13px;background:none;border:1px solid #827b55;color:#e6d3a5;letter-spacing:2px;font-size:10px;margin:12px 0}.modal-card .quiet{border:0}#toast{position:absolute;top:27%;left:50%;transform:translateX(-50%);background:#101c16eb;border:1px solid #a08b54;color:#f2d599;padding:12px 24px;font-size:12px;letter-spacing:2px;pointer-events:none;opacity:0;transition:opacity .2s;text-align:center;white-space:nowrap}#toast.show{opacity:1}@media(max-width:900px){main{padding:0 12px}header{height:64px}.brand{font-size:14px;letter-spacing:1px}.edition{display:none}header .quiet{margin-left:auto}.selection{padding:3%}.eyebrow{font-size:8px;margin-bottom:12px}.intro p{font-size:11px}.intro small,.roster-note{display:none}.hero-card{padding:10px}.hero-card h2{font-size:18px;margin-bottom:10px}.hero-card canvas{max-height:110px}.hero-card p{font-size:8px}.pick{margin-top:8px;padding-top:8px}.primary{padding:12px;margin-top:10px}.intro-rule{margin:14px 0}footer{flex-wrap:wrap;justify-content:center;padding:14px 0}.footnote{font-size:7px}#hud{padding:10px}.vitals{width:150px}.ability{width:220px}.stance{display:none}.hud-bottom{gap:8px}}@media(max-width:580px){.game-frame{min-height:410px;aspect-ratio:auto}#game{object-fit:contain}.intro{display:none}.roster{width:100%;max-width:none}.hero-card canvas{max-height:140px}.selection{padding:20px}.hud-top .wave{display:none}.footnote span:first-child{display:none}.modal-card{width:90%;padding:20px}}
