:root{--bg:#070b12;--panel:#101824;--panel2:#172231;--gold:#d7ad5b;--cyan:#42d6d0;--red:#ef5367;--green:#74d680;--text:#eef5f4;--muted:#91a2ad;--line:#263747;--shadow:0 18px 55px #0009}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -20%,#203243 0,#0a111b 38%,#05080d 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;filter:grayscale(.7);opacity:.45}.hidden{display:none!important}
#particles{position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(#d7ad5b55 1px,transparent 1px);background-size:47px 47px;mask-image:linear-gradient(to bottom,#000,transparent 75%);opacity:.28}.setup-screen{min-height:100vh;display:grid;place-content:center;justify-items:center;padding:40px 20px;text-align:center}.brand-mark,.logo-mini{display:inline-grid;place-items:center;border:1px solid #d7ad5b88;color:var(--gold);background:#15130e;box-shadow:0 0 30px #d7ad5b22;font-family:Georgia,serif}.brand-mark{width:72px;height:72px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);font-size:26px;font-weight:800}.eyebrow{margin:22px 0 4px;color:var(--cyan);letter-spacing:.24em;font-size:12px}.setup-screen h1{font:800 clamp(48px,8vw,92px)/.9 Georgia,serif;margin:12px;text-transform:uppercase;letter-spacing:.04em;background:linear-gradient(#fff0c0,#ba843a);background-clip:text;color:transparent}.lead{color:var(--muted);font-size:18px}.setup-panel{width:min(620px,94vw);margin-top:25px;padding:26px;border:1px solid var(--line);background:linear-gradient(145deg,#15202dcc,#0b111bcc);box-shadow:var(--shadow);border-radius:22px;backdrop-filter:blur(14px)}.player-count{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.player-count button,.ghost-btn{border:1px solid var(--line);background:#0c141f;color:var(--muted);padding:11px;border-radius:10px}.player-count button.active{border-color:var(--gold);color:#ffe2a1;background:#352817}.name-inputs{display:grid;gap:10px;margin:18px 0}.name-inputs input{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:10px;background:#080e16;color:#fff;outline:none}.name-inputs input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px #42d6d018}.primary-btn{width:100%;border:0;border-radius:12px;padding:15px;color:#171006;font-weight:900;background:linear-gradient(135deg,#f0cd79,#b98131);box-shadow:0 8px 30px #d7ad5b33}.quick-rules{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:15px;color:var(--muted);font-size:12px}.quick-rules span:before{content:"◆";color:var(--cyan);margin-right:6px}
.game-screen{min-height:100vh;padding-bottom:92px}.topbar{height:66px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#080d15dd;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}.logo-mini{width:34px;height:34px;margin-right:10px;font-size:12px}.turn-info{text-align:center;display:grid;color:var(--muted);font-size:12px}.turn-info strong{color:var(--gold);font-size:15px}.opponents{display:flex;justify-content:center;gap:12px;min-height:185px;padding:18px 18px 8px}.opponent{width:min(220px,30vw);display:grid;grid-template-columns:74px 1fr;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:14px;background:#101924;transition:.25s}.opponent.current{border-color:var(--gold);box-shadow:0 0 25px #d7ad5b22}.opponent.dead{filter:grayscale(1);opacity:.5}.opponent img{width:74px;height:112px;object-fit:cover;border-radius:8px}.opponent h3{margin:0 0 3px;font-size:14px}.element{font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:var(--cyan)}.mini-hand{font-size:11px;color:var(--muted);margin-top:8px}.healthbar{height:12px;border-radius:99px;background:#35151c;overflow:hidden;border:1px solid #5d2832}.healthbar>i{display:block;height:100%;background:linear-gradient(90deg,#df3e54,#ff7e61);transition:width .45s cubic-bezier(.2,.8,.2,1)}.health-text{font-size:11px;margin-top:4px;color:#ffb1b8}.status-row{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}.status-chip{padding:2px 6px;border-radius:99px;background:#422532;color:#ffb4bf;font-size:9px;border:1px solid #7e3548}
.table-zone{display:grid;grid-template-columns:110px minmax(0,1fr) 100px;gap:18px;align-items:center;max-width:1180px;margin:auto;padding:10px 22px 20px}.deck-stack,.discard-stack{text-align:center;color:var(--muted);font-size:11px}.card-back,.discard-card{width:82px;aspect-ratio:2/3;border-radius:10px;border:2px solid #b68a42;background:repeating-linear-gradient(45deg,#172638 0 8px,#0c1420 8px 16px);color:var(--gold);display:grid;place-content:center;box-shadow:5px 6px 0 #05080c,8px 10px 22px #0008}.card-back span{font:800 24px Georgia}.card-back small,.discard-card small{color:#fff}.discard-card{border-color:#46515b;background:#14171b;margin:auto}.section-label,.hand-header{display:flex;justify-content:space-between;color:var(--gold);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:11px;margin-bottom:9px}.section-label small,.hand-header small{color:var(--muted);font-weight:500}.market{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr));gap:10px}.support-card{position:relative;border:1px solid #47576a;background:#0c121b;border-radius:11px;overflow:hidden;box-shadow:0 8px 24px #0006;transition:transform .2s,border-color .2s;isolation:isolate}.support-card:hover{transform:translateY(-8px);border-color:var(--gold);z-index:3}.support-card img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover}.support-card .card-name{position:absolute;left:5px;right:5px;bottom:5px;padding:5px;background:#071018e8;border-radius:6px;font-size:10px;text-align:center}.support-card.playable:after{content:"OYNA";position:absolute;top:7px;right:7px;background:var(--cyan);color:#071113;font-size:9px;font-weight:900;padding:4px 7px;border-radius:99px}.market .support-card.drawable:after{content:"AL";position:absolute;inset:0;display:grid;place-content:center;background:#07101899;color:#fff;font-weight:900;font-size:18px;opacity:0;transition:.2s}.market .support-card.drawable:hover:after{opacity:1}
.active-player{max-width:1100px;margin:0 auto 16px;padding:0 22px}.hero-card{display:grid;grid-template-columns:150px 1fr;gap:18px;padding:14px;border:1px solid var(--gold);border-radius:17px;background:linear-gradient(135deg,#211b12,#101925 55%);box-shadow:0 12px 36px #0008}.hero-card>img{width:150px;height:225px;object-fit:cover;border-radius:10px;border:1px solid #d7ad5b77}.hero-top{display:flex;justify-content:space-between;align-items:start}.hero-top h2{font:800 30px Georgia;margin:0}.stat-pills{display:flex;gap:7px}.stat-pill{padding:7px 10px;border:1px solid var(--line);background:#09111a;border-radius:9px;font-size:12px}.abilities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:10px}.ability{padding:7px 9px;border-left:3px solid var(--cyan);background:#0a121bcc;border-radius:5px;font-size:10px}.ability strong{display:block;color:#cce9e8;margin-bottom:2px}.ability.weakness{border:1px solid #8f3343;border-left:4px solid var(--red);background:linear-gradient(90deg,#3a1822,#160e14);color:#ffb4bd}.ability.weakness strong{color:#ff667a}.weakness-label{color:#ff6879;font-size:9px;font-weight:900;letter-spacing:.12em}.hand-zone{max-width:1160px;margin:auto;padding:0 22px}.hand{display:flex;gap:10px;min-height:170px;overflow-x:auto;padding:6px 4px 18px}.hand .support-card{flex:0 0 112px}.actionbar{position:fixed;z-index:18;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:10px;padding:13px;background:#080d15ed;border-top:1px solid var(--line);backdrop-filter:blur(14px)}.actionbar button{border:1px solid var(--line);border-radius:10px;padding:11px 22px;font-weight:800;color:#fff}.attack-btn{background:#6e2230}.ability-btn{background:#164a50}.end-btn{background:#4d3c1d}.game-log{position:fixed;right:14px;bottom:82px;width:280px;max-height:150px;overflow:auto;padding:10px;background:#05090dcc;border:1px solid var(--line);border-radius:10px;font-size:10px;color:var(--muted);pointer-events:none}.game-log p{margin:4px}.game-log b{color:#fff}
.modal{border:1px solid #536579;border-radius:18px;background:#101824;color:#fff;padding:0;box-shadow:0 30px 100px #000;max-width:min(720px,92vw)}.modal::backdrop{background:#02050bc9;backdrop-filter:blur(5px)}#modalBody{padding:24px}.modal h2{margin-top:0;font:700 26px Georgia}.target-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.target-option{padding:10px;border:1px solid var(--line);border-radius:10px;background:#0a111a;color:#fff;text-align:left}.target-option:hover{border-color:var(--gold)}.target-option img{width:100%;height:130px;object-fit:cover;border-radius:7px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.toast{position:fixed;z-index:50;left:50%;top:82px;translate:-50% -20px;padding:11px 18px;border:1px solid #4b6072;border-radius:99px;background:#101a25;color:#fff;opacity:0;transition:.25s;pointer-events:none}.toast.show{opacity:1;translate:-50% 0}.damage-float{position:fixed;z-index:60;color:#ff586f;font-size:30px;font-weight:900;text-shadow:0 3px 10px #000;animation:floatUp 1s forwards;pointer-events:none}@keyframes floatUp{to{transform:translateY(-80px);opacity:0}}.flash{animation:flash .35s}@keyframes flash{50%{filter:brightness(2) saturate(1.5)}}
@media(max-width:760px){.topbar strong{font-size:12px}.opponents{justify-content:start;overflow-x:auto}.opponent{min-width:170px}.table-zone{grid-template-columns:66px 1fr;gap:10px;padding-inline:10px}.discard-stack{display:none}.card-back{width:58px}.market{grid-template-columns:repeat(4,92px);overflow-x:auto}.hero-card{grid-template-columns:100px 1fr;padding:10px}.hero-card>img{width:100px;height:150px}.hero-top h2{font-size:22px}.abilities{grid-template-columns:1fr}.actionbar button{padding:10px 12px;font-size:12px}.game-log{display:none}.hand-zone,.active-player{padding-inline:10px}}