/* Pixel RPG visual upgrade — non-destructive overlay */
:root{--bg:#0b1526;--panel:#14233b;--cream:#f6ead0;--gold:#f5ce79;--muted:#b1bdd0;--line:#e7b96946;--green:#7be3bc;font-family:Trebuchet MS,Segoe UI,sans-serif}
body{background:radial-gradient(ellipse at 50% -20%,#263b6b 0%,transparent 65%),linear-gradient(145deg,#081020,#101c33 65%,#1c1730)}
.app-header{background:linear-gradient(180deg,#121d36fa,#111d32ee);box-shadow:0 5px 26px #0308117a;border-bottom:1px solid #f1c16c66}
.brand-mark{filter:drop-shadow(0 0 12px #f4bd5c8a)}.brand small{color:#edc779}
button{border-radius:10px;background:linear-gradient(160deg,#2b3c58,#182840);border-color:#d8b5794a}
button:hover{background:linear-gradient(160deg,#3c5276,#213857)}
.primary{background:linear-gradient(180deg,#ffe4a0,#e6ad51);border:1px solid #ffecb8;color:#30233a;box-shadow:0 4px 0 #8a592c,0 8px 25px #edb55e35}
.primary:hover{background:linear-gradient(#fff0bb,#efbf6c)}
.home-hero{border:2px solid #e6b86e88;border-radius:20px;box-shadow:inset 0 0 0 5px #0916298a,0 20px 50px #03081799;background-position:center 45%}
.hero-shade{background:linear-gradient(90deg,#091326ed 0%,#101e3dc4 40%,#0b18282b 80%)}
.hero-copy h1{font-weight:700;letter-spacing:-1.5px;text-shadow:0 5px 0 #11152c,0 10px 25px #020914}
.hero-copy p{color:#e6e5e1}.eyebrow{color:#f9cf7e}.section-label h2{font-weight:700}
.mode-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.mode-card{height:102px;border-radius:13px;border:1px solid #e2b7776b;background:linear-gradient(125deg,#293653,#16233c);box-shadow:inset 0 1px #ffffff1b,0 8px 15px #0004}.mode-card:hover{transform:translateY(-3px);border-color:#f9d18e}.mode-card .mode-icon{color:#ffdc8d}.mode-card.featured{background:linear-gradient(120deg,#314765,#283652)}.mode-card.soon{opacity:.68}
.setup{background:radial-gradient(ellipse at center,#1c3150,#0c172b 70%)}.page-heading h1{font-weight:700;text-shadow:0 3px 0 #0a1124}
.lobby-options{padding:10px 12px;background:#0d1a30b5;border:1px solid #a58e6544;border-radius:12px;gap:14px}
.lobby-options select,.segmented{background:#0c1b31;border-color:#e0b86d60}.segmented button.selected{background:#38577b;color:#fff0cf}
.slots{max-height:420px;gap:clamp(5px,1vw,16px)}.slot{max-width:210px;border-radius:14px 14px 6px 6px;border:2px solid #e0bc786c;background:radial-gradient(ellipse at 50% 35%,#4c68985c,transparent 70%),linear-gradient(170deg,#253e62,#121c35 80%);box-shadow:inset 0 0 0 4px #08122577,0 14px 25px #0007;transition:transform .2s,border-color .2s}.slot:hover{transform:translateY(-5px);border-color:#ffdf9c}.slot:before{border-radius:10px 10px 3px 3px}.slot img{height:70%;filter:drop-shadow(0 14px 9px #000a)}.slot .seat-index{color:#f6d792}.slot .name{color:#fff0d0}.slot.team-1{background:radial-gradient(ellipse at 50% 35%,#aa516a66,transparent 70%),linear-gradient(170deg,#633047,#28192c 80%);border-color:#e998a377}.slot.ready{border-color:#77f1b7}.vs{width:clamp(26px,5vw,85px);font:bold italic clamp(22px,4vw,55px) Georgia;color:#ffdb82;text-shadow:0 0 20px #ff9d52,0 5px #743f41}
.lobby-footer{border-top:1px solid #c6a46c3b}.boardarea{background:radial-gradient(ellipse at center,#243a5c,#101a30 72%)}.center{background:#101e37cf;border:1px solid #e6bb7655;border-radius:16px;padding:14px;backdrop-filter:blur(4px)}
.modal{background:linear-gradient(155deg,#243957,#111e34);border:1px solid #e5bd79;box-shadow:0 25px 80px #000a}.shop-card,.hero-card,.stat{background:linear-gradient(145deg,#243954,#142238);border-color:#e0b87957}
@media(max-width:700px){.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mode-card,.mode-card.soon{grid-column:auto;height:80px;padding:10px}.mode-card.soon .mode-icon{position:static}.mode-card strong{font-size:10px}.mode-card small{white-space:normal;font-size:8px}.home-hero{min-height:200px}.slot{border-radius:9px 9px 3px 3px}.slot:before{border-radius:6px}.slot img{height:64%}.slots{max-height:330px}.vs{width:20px;font-size:20px}.center{padding:5px}}
@media(max-height:690px){.home-hero{min-height:155px}.mode-card{height:70px}.mode-card .mode-icon{margin-bottom:4px}.section-label{padding:8px 0}}

/* Premium violet sorceress */
.premium-hero-tag{display:block;font-size:10px;color:#e6c2ff;text-align:center;text-shadow:0 1px 4px #38204b;letter-spacing:.04em}
.shop-card:has(.premium-hero-tag){border-color:#9e70cc;box-shadow:inset 0 0 18px #7841b51c,0 0 12px #8c56c522}

/* Premium paper umbrella */
.premium-hero-tag-blue{color:#bfe6f7;text-shadow:0 1px 4px #1d3b52}
.shop-card:has(.premium-hero-tag-blue){border-color:#6fb4d6;box-shadow:inset 0 0 18px #4aa0cf1c,0 0 12px #5ab8dd22}