:root{
  --bg:#05060b;--bg2:#090b14;--panel:#0d101a;--panel2:#111522;--line:#262c3e;
  --text:#f7f8fc;--muted:#9299ae;--purple:#8b5cf6;--purple2:#6d28d9;
  --green:#36d989;--danger:#f06b7b;--cyan:#22d3ee
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;min-height:100%}
button,input,select,textarea{font:inherit}
button{color:inherit}
a{color:inherit}
[hidden]{display:none!important}
.muted{color:var(--muted)}
.full{width:100%}.topGap{margin-top:12px}

.btn{
  border:1px solid #30364a;background:#151927;color:#fff;padding:11px 15px;border-radius:10px;
  font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center
}
.btn.primary{background:linear-gradient(90deg,#7130d5,#9142e8);border-color:#a56df5}
.btn.danger{background:#34151d;border-color:#70313b;color:#ffc1c8}
.btn.compact{padding:8px 10px;font-size:10px}

input,select,textarea{
  width:100%;border:1px solid #2a3044;background:#090c15;color:#fff;border-radius:10px;
  padding:12px 13px;outline:none;margin:7px 0 14px
}
input:focus,select:focus,textarea:focus{border-color:#9f67f2;box-shadow:0 0 0 3px #8b5cf633}
label{display:block;font-size:11px;font-weight:800;color:#c5cad7}
textarea{resize:vertical}
pre{white-space:pre-wrap;background:#070910;border:1px solid #252b3c;border-radius:10px;padding:14px;color:#c6acd8}

.loginBody{min-height:100vh;overflow:hidden;background:radial-gradient(circle at 50% 0,#21113a 0,#090b14 45%,#05060b 100%)}
.loginGlow{position:fixed;inset:0;background:radial-gradient(circle at 50% 25%,#8b5cf620,transparent 40%);pointer-events:none}
.loginWrap{min-height:100vh;display:grid;place-items:center;padding:20px;position:relative}
.loginCard{width:min(440px,94vw);padding:26px;border:1px solid #342a4f;border-radius:22px;background:#0b0e18ee;box-shadow:0 30px 80px #000b}
.loginBrand{display:flex;align-items:center;gap:13px;margin-bottom:24px}
.brandPad{width:56px;height:50px;border-radius:15px;border:2px solid #a76df1;background:#191126;display:grid;place-items:center;font-size:27px}
.brandPad.small{width:45px;height:40px;font-size:21px}
.logoText{font-size:22px;font-weight:900;font-style:italic;letter-spacing:-1px}.logoText span{color:#a45cff}.logoText.mini{font-size:17px}
.logoSub{font-size:8px;color:#9299ae;letter-spacing:.8px;margin-top:4px}
.loginCard h1{font-size:23px;margin:0 0 8px}
.loginFoot{text-align:center;color:#737b91;font-size:10px;margin-top:20px}.loginFoot b{color:#b579ff}
.formMsg{min-height:20px;color:#d0b4ff;font-size:11px}

.appShell{display:grid;grid-template-columns:230px 1fr;min-height:100vh;background:radial-gradient(circle at 62% 0,#17162d 0,#080a12 43%,#05060b 100%)}
.sidebarPremium{position:sticky;top:0;height:100vh;background:#070910;border-right:1px solid #202538;padding:18px 13px;display:flex;flex-direction:column}
.sideLogo{height:60px;display:flex;align-items:center;gap:10px;padding:0 6px;margin-bottom:17px}
.sideNav{display:flex;flex-direction:column;gap:6px}
.navBtn{height:46px;border:1px solid transparent;border-radius:10px;background:transparent;text-align:left;padding:0 12px;font-weight:700;cursor:pointer}
.navBtn span{margin-left:10px}
.navBtn.active{background:linear-gradient(90deg,#6e27d2,#8b39ec);border-color:#9b5cf5}
.navBtn:hover{background:#151222;border-color:#4b396c}
.dangerSoft{color:#ffbbc4}
.sideBottom{margin-top:auto}
.creator{font-size:9px;color:#7f879c;padding:11px}.creator b{display:block;color:#b76cff;font-size:14px;margin-top:3px}

.premiumMain{padding:20px 28px 50px;min-width:0}
.premiumTop{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
.premiumTitle{font-size:20px;font-weight:900}.premiumSub{font-size:10px;color:#858da3;margin-top:4px}
.topStatus{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.statusChip{height:35px;padding:0 11px;border:1px solid #252b3d;border-radius:999px;background:#0d1019;display:flex;align-items:center;gap:7px;font-size:10px;color:#a6adc0}
.dot{width:7px;height:7px;border-radius:50%;background:#677087;display:inline-block}.dot.online{background:var(--green);box-shadow:0 0 9px #36d98988}

.page{display:none}.page.active{display:block;animation:fade .16s ease}
@keyframes fade{from{opacity:.5;transform:translateY(3px)}to{opacity:1;transform:none}}

.heroServer{height:310px;border:1px solid #282e42;border-radius:20px;background:radial-gradient(circle at 76% 35%,#472768 0,#171328 24%,#0a0d16 63%);position:relative;overflow:hidden}
.heroServerShade{position:absolute;inset:0;background:linear-gradient(90deg,#080a12 0,#080a12d8 45%,transparent 75%)}
.heroServerContent{position:relative;z-index:2;padding:41px 36px;max-width:650px}
.eyebrow{font-size:9px;letter-spacing:1.2px;color:#bd8bff;font-weight:900}
.heroServer h1{font-size:35px;line-height:1.04;margin:12px 0 12px;letter-spacing:-1px}
.heroServer p{font-size:12px;color:#acb2c3;line-height:1.55;max-width:520px}
.heroButtons{display:flex;gap:9px;margin-top:18px}
.heroServerArt{position:absolute;right:90px;top:65px;font-size:120px;filter:drop-shadow(0 20px 30px #0009);opacity:.9}

.metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;margin:17px 0 24px}
.metric{border:1px solid #282e42;border-radius:14px;background:#0e111b;padding:15px}
.metric span{font-size:9px;color:#8b93a7}.metric b{display:block;font-size:23px;margin-top:7px}

.sectionHead{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:0 0 13px}
.sectionHead h2{font-size:17px;margin:0}.sectionHead p{font-size:10px;color:#858da2;margin:5px 0 0}

.toolbar{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.searchInput{max-width:320px;margin:0}
.filterBtn{height:40px;border:1px solid #293045;border-radius:10px;background:#0d1019;color:#aab0c2;padding:0 14px;font-size:10px;font-weight:800;cursor:pointer}
.filterBtn.active{background:#21143a;border-color:#8851df;color:#caa8ff}

.gameGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.gameCard{border:1px solid #292f42;border-radius:15px;background:#0e111b;overflow:hidden;min-width:0}
.cover{height:225px;background:#151a29 center/cover no-repeat}.cover.fallback{display:grid;place-items:center;font-size:48px}
.gameBody{padding:12px}.gameBody h3{margin:8px 0 5px;font-size:14px}.gameMeta{font-size:9px;color:#8f96aa;min-height:24px}
.tag{display:inline-block;padding:4px 7px;border-radius:999px;background:#21143a;color:#c9abff;border:1px solid #563886;font-size:8px;font-weight:900}
.cardActions{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}

.panel{border:1px solid #282e42;border-radius:15px;background:#0e111b;padding:18px}
.panel h3{margin-top:0}
.twoCols{display:grid;grid-template-columns:1.2fr .8fr;gap:15px}
.fieldGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.helper{font-size:9px;color:#9da5b8;margin:-7px 0 12px}
.formatList{display:flex;flex-direction:column;gap:8px}.formatList div{border:1px solid #272d40;border-radius:10px;padding:11px;display:flex;justify-content:space-between}.formatList span{font-size:10px;color:#979eb0}
.callout{margin-top:15px;padding:13px;border-radius:11px;background:#1c1430;border:1px solid #563b81;color:#cdb9e9;font-size:11px;line-height:1.5}

.settingRow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #22283a;margin-bottom:12px}
.settingRow b{display:block;font-size:12px}.settingRow span{display:block;font-size:9px;color:#8d94a8;margin-top:4px}
.pill{padding:6px 9px;border-radius:999px;background:#2d151a;border:1px solid #78343e;color:#ff9aa7;font-size:9px;font-weight:900}.pill.ok{background:#12261d;border-color:#286840;color:#73e5a5}
.checkLine{padding:10px 0;border-bottom:1px solid #22283a;color:#aeb4c4;font-size:11px}.checkLine:last-child{border-bottom:0}

.systemGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.bigStatus{font-size:18px;font-weight:900;color:#ff9aa7}.bigStatus.ok{color:#73e5a5}

.modal{position:fixed;inset:0;background:#000c;display:none;align-items:center;justify-content:center;padding:18px;z-index:999}
.modal.show{display:flex}.modalCard{width:min(580px,96vw);background:#0c0f19;border:1px solid #4b386d;border-radius:17px;padding:18px;box-shadow:0 30px 80px #000}
.modalHead{display:flex;align-items:center;justify-content:space-between}.modalHead h3{margin:0 0 12px}
.xBtn{width:36px;height:36px;border-radius:9px;border:1px solid #343a50;background:#161a27;font-size:21px;cursor:pointer}

.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);display:none;background:#141827;border:1px solid #343b52;border-radius:999px;padding:10px 16px;font-size:11px;z-index:1000}.toast.show{display:block}

/* PLAYER */
.playerPage{margin:0;background:#000;overflow:hidden}
.playerStage{position:fixed;inset:0;background:#000}
.playerStage iframe{width:100%;height:100%;border:0;background:#000}
.qrOverlay{position:fixed;inset:0;z-index:100;background:#05060bf3;display:none;align-items:center;justify-content:center;padding:18px}
.qrOverlay.show{display:flex}
.qrCard{width:min(900px,96vw);border:1px solid #674695;border-radius:19px;background:#0b0e18;padding:20px;text-align:center}
.qrGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.qrPlayer{border:1px solid #7045aa;border-radius:15px;padding:13px}.qrPlayer:nth-child(2){border-color:#276b77}
.qrPlayer img{width:min(260px,78%);background:#fff;padding:8px;border-radius:10px}
.qrStatus{font-size:10px;color:#8f96aa;margin:5px}.qrStatus.online{color:#66df9b}
.playerNotice{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:90;background:#10131dde;border:1px solid #30364a;border-radius:999px;padding:8px 12px;font-size:10px}

/* CONTROLLER */
.pad{height:100vh;background:#070812;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:25px;gap:30px;touch-action:none;user-select:none}.dpad{display:grid;grid-template-columns:90px 90px 90px;grid-template-rows:90px 90px 90px;justify-content:center}.padbtn{background:#171b2d;border:2px solid #373d5d;color:#fff;border-radius:20px;font-size:24px;font-weight:900;display:flex;align-items:center;justify-content:center;touch-action:none}.padbtn:active,.padbtn.active{background:#7041ef}.actions{display:grid;grid-template-columns:110px 110px;gap:20px;justify-content:center}.small-actions{display:flex;gap:12px;justify-content:center;grid-column:1/-1}.small-actions .padbtn{width:110px;height:55px;font-size:14px}
.emu-shell{width:100vw;height:100vh;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}.emu-box{width:100%;height:100%;background:#000;position:relative}.boot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:5;background:#050505}.boot .panel{max-width:520px;text-align:center}.boot.hide{display:none}

@media(max-width:900px){
  .appShell{grid-template-columns:78px 1fr}.sidebarPremium{padding:15px 9px}.sideLogo>div:last-child,.navBtn span,.creator{display:none}
  .sideLogo{justify-content:center}.navBtn{text-align:center;padding:0}
  .metrics{grid-template-columns:repeat(2,1fr)}.twoCols,.systemGrid{grid-template-columns:1fr}
  .heroServerArt{right:25px;opacity:.3}.premiumMain{padding:18px}.topStatus{display:none}
}
@media(max-width:650px){.qrGrid,.fieldGrid{grid-template-columns:1fr}.gameGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.cover{height:180px}}

/* PACK IMPORT */
.progressBox{margin-top:15px;border:1px solid #2b3145;border-radius:12px;background:#090c15;padding:12px}
.progressTop{display:flex;align-items:center;justify-content:space-between;font-size:10px;margin-bottom:8px}
.progressTrack{height:10px;border-radius:999px;background:#202638;overflow:hidden}
.progressTrack i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7130d5,#a95cf3);transition:width .18s ease}
.packResults{display:flex;flex-direction:column;gap:7px}
.packSummary{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:8px}
.packSummary>*{border:1px solid #30364a;border-radius:999px;padding:6px 9px;font-size:9px}
.packResultItem{display:grid;grid-template-columns:auto 1fr 1.4fr;align-items:center;gap:9px;padding:9px 10px;border:1px solid #252b3d;border-radius:9px;background:#090c15;font-size:10px}
.packErrors{margin-top:10px;padding:10px;border:1px solid #66333b;border-radius:10px;background:#241218;color:#ffbac4;font-size:10px}
.packError{margin-top:4px}
@media(max-width:650px){.packResultItem{grid-template-columns:auto 1fr}.packResultItem .muted{grid-column:1/-1}}