@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Barlow:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;font-family:'Barlow',Arial,sans-serif;color:#f4f0df;background:#0c100e}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 28%,#25362c55,transparent 60%),#0c100e}header,main,footer{max-width:1600px;margin:auto;padding-left:4vw;padding-right:4vw}header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #c3a86625}.brand{display:flex;align-items:center;gap:9px;color:#f4f0df;font-weight:700;letter-spacing:2px;text-decoration:none}.brand>span:last-child{color:#c6a766;font-weight:400}.brand-mark{border:1px solid #bd9b53;color:#e4c88b;transform:rotate(-8deg);padding:4px 10px;font-size:26px;font-family:Georgia,serif;margin-right:8px}.edition{font-size:12px;letter-spacing:2px;color:#baa97e}.edition i{display:inline-block;width:30px;height:1px;background:#706548;vertical-align:middle;margin:0 12px}.heading{display:flex;justify-content:space-between;align-items:center;padding:48px 0 34px}.eyebrow{font-size:12px;letter-spacing:3px;color:#c8ac73;font-weight:600;margin:0 0 12px}h1{font-family:'Barlow Condensed',Arial,sans-serif;font-size:clamp(36px,4vw,66px);font-weight:600;line-height:1;margin:0 0 16px}.intro{font-size:16px;color:#b4b9af;margin:0}.progress strong{font-family:'Barlow Condensed',Arial,sans-serif;font-size:40px;font-weight:500}.progress strong span{font-size:26px;color:#6f7d72}.progress p{font-size:13px;color:#a9b2a8;margin:4px 0 0}.toolbar{border-block:1px solid #c3a86625;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0;font-size:12px;letter-spacing:1px}.subtle{color:#7c8b80}.live-dot{display:inline-block;height:6px;width:6px;border-radius:50%;background:#ceb678;margin-right:9px}.toolbar label{display:flex;align-items:center;gap:14px;letter-spacing:0;color:#b9c1b6;font-size:14px}.toolbar output{color:#f4d58f;background:#bca26a16;border:1px solid #ba9f593b;padding:4px 10px;min-width:36px;text-align:center}input[type=range]{accent-color:#c4a263;width:130px}.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;padding:32px 0 42px}.card-open{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in;transition:transform .3s,filter .3s;border-radius:20px}.card-open:hover{transform:translateY(-9px) rotate(.6deg);filter:drop-shadow(0 15px 22px #0009)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #f5d594;outline-offset:5px}.card{position:relative;width:100%;aspect-ratio:5/7;container-type:inline-size;border-radius:5%;overflow:hidden;color:#fff7da;isolation:isolate;background:#131917;box-shadow:0 14px 24px #0008}.art,.frame{position:absolute;width:100%;height:100%;inset:0;object-fit:fill}.art{object-fit:cover}.frame{z-index:1;pointer-events:none}.card span,.description{position:absolute;z-index:2}.rarity{left:6.5%;top:3.4%;width:14%;height:9%;display:grid;place-items:center;font-family:'Barlow Condensed',Arial,sans-serif;font-size:11cqw;font-weight:900;line-height:1;color:#ffefae;text-shadow:0 2px 0 #050500,2px 0 0 #050500,-2px 0 #050500,0 0 12px #fc6b0088}.card[data-rarity=SSR] .rarity{font-size:9cqw}.action{left:80.6%;top:4%;width:12.5%;height:8.8%;display:grid;place-items:center}.action svg{width:100%;height:100%;filter:drop-shadow(0 1px 2px #000)}.level{left:9.8%;top:68%;width:12%;height:6.7%;display:grid;place-items:center;font-family:'Barlow Condensed',Arial,sans-serif;font-size:4.7cqw;font-weight:800;text-shadow:0 2px 3px #000;white-space:nowrap}.name{left:25%;top:69.1%;width:63%;height:5%;display:grid;place-items:center;font-family:'Barlow Condensed',Arial,sans-serif;font-size:6.1cqw;font-weight:700;line-height:1;white-space:nowrap;color:#fffced;text-shadow:0 2px 2px #000}.description{left:9%;top:77.4%;width:82%;height:8.4%;margin:0;color:#251a0b;font-size:3.65cqw;line-height:1.18;text-align:left;display:flex;align-items:center;font-weight:500}.power{left:11%;top:89.5%;font-family:'Barlow Condensed',Arial,sans-serif;font-size:10.3cqw;font-weight:900;line-height:1;letter-spacing:-.3cqw;text-shadow:0 2px 3px #000,2px 0 3px #000,-2px 0 3px #000}.power-label{left:53%;top:92%;font-size:2.8cqw;letter-spacing:.8cqw;color:#fff4d6;text-shadow:0 1px 2px #000}.card-caption{display:flex;justify-content:space-between;gap:5px;font-size:12px;color:#a3aea3;margin-top:17px}.card-caption b{color:#d9dfd2;font-weight:500;margin-left:7px}.card-caption>span:last-child{color:#c4ab75}.balance{display:grid;grid-template-columns:1fr 1fr;gap:60px;border-top:1px solid #c3a86625;padding:32px 0 38px}h2{font-family:'Barlow Condensed',Arial,sans-serif;font-size:30px;font-weight:500;line-height:1.15;margin:10px 0}.balance>p{color:#9ca99e;font-size:15px;line-height:1.65;margin:12px 0}.balance strong{color:#e0d3ae;font-weight:500}footer{border-top:1px solid #c3a86625;display:flex;justify-content:space-between;gap:20px;padding-top:22px;padding-bottom:26px;font-size:12px;color:#a1ac9f}dialog{padding:0;border:0;background:transparent;overflow:visible;width:min(540px,85vw,60vh);max-height:none}dialog::backdrop{background:#030805e8;backdrop-filter:blur(8px)}.close{position:absolute;z-index:5;right:-42px;top:0;border:1px solid #bca36666;background:#172019;color:#f4e5bd;border-radius:50%;width:34px;height:34px;font-size:25px;cursor:pointer}.dialog-hint{text-align:center;color:#acb5a8;font-size:12px;margin:16px -30px 0}#error{padding:30px;color:#ffba98}@media(min-width:1800px){.gallery{gap:30px}}@media(max-width:1000px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.heading{padding-top:32px}header,main,footer{padding-left:5vw;padding-right:5vw}.balance{gap:28px}.card-caption{font-size:13px}}@media(max-width:580px){header{height:76px}.edition{font-size:10px;letter-spacing:1px}.edition i{display:none}.heading{gap:12px}.progress strong{font-size:29px}.progress strong span{font-size:19px}.progress p{font-size:11px}.intro{max-width:220px;font-size:14px}.eyebrow{font-size:10px;letter-spacing:2px}.toolbar{flex-direction:column;align-items:flex-start;gap:14px}.toolbar label{width:100%;justify-content:space-between}.gallery{grid-template-columns:1fr;max-width:400px;margin:auto;gap:30px}.balance{grid-template-columns:1fr;gap:0}footer{flex-direction:column}.close{right:-18px;top:-32px}dialog{width:min(88vw,60vh)}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.rarity{font-size:9cqw}.card[data-rarity=SSR] .rarity{font-size:7.6cqw}