:root{color-scheme:dark;--bg:#0a1020;--panel:#111a2e;--gold:#e8c782;--teal:#69c7ba;--muted:#a3aec4}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top right,#263049,var(--bg) 65%);color:#eef0f6;font:16px/1.6 system-ui,sans-serif;min-height:100vh}button,input{font:inherit}button{cursor:pointer;border:1px solid #3b4760;border-radius:8px;background:var(--panel);color:inherit;padding:.65rem 1rem}button:hover{border-color:var(--gold)}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.primary{background:var(--gold);color:#111a2e;font-weight:700}header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem 4%;border-bottom:1px solid #28344b}nav{display:flex;gap:.5rem;flex-wrap:wrap}.brand{color:var(--gold);text-decoration:none;letter-spacing:.15em;font-weight:800}main{max-width:1200px;margin:auto;padding:3rem 1.5rem;min-height:75vh}h1,h2,h3{font-family:Georgia,serif;line-height:1.2}h1{font-size:clamp(2.2rem,6vw,4.5rem);margin:.5rem 0 1.4rem}h2{font-size:2rem}.eyebrow{letter-spacing:.2em;color:var(--gold);font-size:.8rem}p{color:var(--muted)}.hero{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;padding:2rem 0 4rem}.hero p{max-width:430px}.hero-art{display:flex;justify-content:center;gap:.5rem}.hero-art img{width:30%;transform:rotate(-9deg);filter:drop-shadow(0 20px 25px #0008)}.hero-art img:nth-child(2){transform:translateY(-25px)}.hero-art img:nth-child(3){transform:rotate(9deg)}.actions{display:flex;gap:.7rem;flex-wrap:wrap;margin:1rem 0}.panel{background:var(--panel);border:1px solid #2b3852;border-radius:16px;padding:1.5rem;margin:1rem 0}.stats{display:flex;gap:1.4rem;flex-wrap:wrap;color:var(--gold)}.game-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(200px,1fr);gap:1.3rem}.hand,.collection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.8rem}.hand{grid-template-columns:repeat(auto-fit,minmax(90px,1fr))}.card-button,.collection-card{padding:.4rem;text-align:left;position:relative;min-width:0}.card-button img,.collection-card img{width:100%;display:block;border-radius:6px}.selected{outline:3px solid var(--teal);transform:translateY(-6px)}.selected span{color:var(--teal)}.card-button span,.collection-card span{display:block;font-size:.85rem}.collection-grid{grid-template-columns:repeat(auto-fit,minmax(155px,1fr))}.result-line{border-top:1px solid #35425a;padding-top:1rem;color:var(--gold)}progress{width:100%;accent-color:var(--teal);height:12px;margin:1rem 0 2rem}.offer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem}.offer-grid button{text-align:left}.relic{padding:.7rem 0;border-bottom:1px solid #35425a}label{display:block;margin:1rem 0}input,select{width:100%;background:var(--bg);color:inherit;border:1px solid #526078;padding:.6rem;border-radius:6px}dialog{background:var(--panel);color:inherit;border:1px solid #526078;border-radius:12px;padding:2rem;width:min(520px,90vw)}dialog::backdrop{background:#000b}#close{float:right}#toast{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);max-width:90vw;padding:1rem;background:#28344b;color:white;border-radius:8px;display:none;z-index:5}#toast.visible{display:block}footer{text-align:center;border-top:1px solid #28344b;padding:1.4rem;color:var(--muted)}table{width:100%;text-align:left;border-collapse:collapse}td,th{padding:.6rem;border-bottom:1px solid #35425a}.detail-img{max-width:180px;display:block;margin:auto}.error{color:#ffb7c0}.notice{color:var(--teal)}@media(max-width:700px){header{flex-wrap:wrap}header nav{order:3;width:100%}nav button{flex:1;font-size:.8rem;padding:.5rem}.hero{grid-template-columns:1fr}.hero-art{padding:1rem 0}.game-layout{grid-template-columns:1fr}main{padding:1.5rem .8rem}.panel{padding:1rem}.hand{grid-template-columns:repeat(auto-fit,minmax(72px,1fr))}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}h1{overflow-wrap:anywhere}.stats{gap:.8rem}}
:is(.card-button,.collection-card) img{height:auto}
@media(max-width:700px){.hand{grid-template-columns:repeat(3,minmax(0,1fr))}}
