:root{--bg:#0f1524;--panel:#18213a;--panel2:#1f2a48;--ink:#eef0f7;--mute:#a7b0c8;--amber:#f2b544;--amber2:#ffd27a;--blue:#4aa3ff;--line:#2c3860;
--common:#c9ced9;--rare:#4aa3ff;--epic:#b56cff;--legendary:#ff9a2e}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(1000px 480px at 85% -10%,rgba(74,163,255,.16),transparent 60%),radial-gradient(800px 420px at 0% 0%,rgba(242,181,68,.12),transparent 60%),var(--bg);color:var(--ink);font:17px/1.7 "Nunito Sans",system-ui,sans-serif}
.wrap{max-width:980px;margin:0 auto;padding:0 16px}
a{color:var(--amber2);text-decoration:none}a:hover{color:#fff}
a:focus-visible,button:focus-visible,textarea:focus-visible{outline:2px solid var(--amber2);outline-offset:3px;border-radius:6px}
h1,h2,h3,.brand{font-family:"Alegreya SC",Georgia,serif;letter-spacing:-.01em;line-height:1.2}
h1{font-size:clamp(28px,5vw,44px);margin:28px 0 10px;color:var(--amber2)}
h2{font-size:24px;margin:32px 0 8px;color:var(--amber)}
.top{border-bottom:1px solid var(--line);background:rgba(15,21,36,.86);position:sticky;top:0;backdrop-filter:blur(6px);z-index:5}
.top .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px;padding:12px 16px}
.brand{font-size:21px;color:var(--ink);display:flex;align-items:center;gap:10px}
.gem{width:22px;height:22px;transform:rotate(45deg);border-radius:4px;background:linear-gradient(135deg,#9fd3ff,var(--blue) 50%,#1d4f9a);box-shadow:0 0 14px rgba(74,163,255,.5)}
nav{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:15px}nav a{color:var(--mute)}nav a:hover{color:var(--amber2)}
.hero{padding:30px 0 6px}.hero p{color:var(--mute);max-width:640px;font-size:19px}
.viewer{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:14px;padding:20px;margin:20px 0 10px;box-shadow:0 18px 40px -20px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.02) inset}
.viewer label{display:block;font-weight:700;margin-bottom:6px}
textarea{width:100%;background:#0b1020;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:12px;font:14px/1.5 ui-monospace,Consolas,monospace;resize:vertical}
button{margin-top:12px;background:linear-gradient(180deg,var(--amber2),var(--amber));color:#2b1a00;border:0;border-radius:10px;padding:11px 22px;font:700 16px "Nunito Sans",sans-serif;cursor:pointer;box-shadow:0 6px 18px -6px rgba(242,181,68,.6);transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
button:hover{transform:translateY(-2px)}button:active{transform:translateY(0)}
#deck-out:empty{display:none}#deck-out{margin-top:18px}
.deck-head h2{margin:0}.deck-head p{margin:2px 0 12px;color:var(--mute)}
.deck-body{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:20px;align-items:start}
@media (max-width:700px){.deck-body{grid-template-columns:1fr}}
.cards{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.cards li{display:grid;grid-template-columns:34px 1fr auto;align-items:center;background:#0b1020;border:1px solid var(--line);border-left:4px solid var(--common);border-radius:8px;overflow:hidden;min-height:36px}
.cards li.r-rare{border-left-color:var(--rare)}.cards li.r-epic{border-left-color:var(--epic)}.cards li.r-legendary{border-left-color:var(--legendary)}
.cost{text-align:center;font-weight:800;color:#bfe0ff;background:#123063;align-self:stretch;display:grid;place-items:center}
.name{padding:6px 10px;font-weight:600;font-size:15px;background:linear-gradient(90deg,#0b1020 45%,rgba(11,16,32,.35)),var(--art,none) right center/auto 100% no-repeat}
.count{padding:0 10px;color:var(--amber2);font-weight:800}
.curve{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;height:180px;align-items:end;background:#0b1020;border:1px solid var(--line);border-radius:10px;padding:12px 10px 6px}
.bar{display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end;gap:4px}
.bar i{display:block;width:100%;height:120px;background:linear-gradient(180deg,var(--amber2),var(--amber));border-radius:4px 4px 0 0;transform-origin:bottom}
.bar b{font-size:13px;color:var(--mute)}.bar-n{font-size:12px;color:var(--ink);min-height:16px}
.err{color:#ff8a8a}.muted{color:var(--mute)}
.sec{margin-top:40px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin:16px 0 50px}
.card{display:block;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:12px;padding:20px;color:var(--ink);box-shadow:0 12px 30px -16px rgba(0,0,0,.7);transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.card:hover{transform:translateY(-3px);color:var(--ink)}.card:active{transform:translateY(0)}
.card h3{margin:0 0 6px;color:var(--amber2);font-size:20px}.card p{margin:0 0 12px;color:var(--mute);font-size:15px}.card span{color:var(--blue);font-weight:700;font-size:14px}
article{max-width:720px;padding-bottom:50px}.lead{font-size:20px;color:var(--mute)}.crumb{font-size:14px;color:var(--mute);margin-top:24px}
ul{padding-left:22px}li{margin:6px 0}strong{color:#fff}code{background:#0b1020;padding:1px 6px;border-radius:4px}
table{border-collapse:collapse;margin:10px 0}th,td{border:1px solid var(--line);padding:6px 14px;text-align:left}th{background:var(--panel2)}
footer{border-top:1px solid var(--line);color:var(--mute);font-size:13px;padding:20px 0 30px}