@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;700;900&display=swap');
:root{--ink:#14202b;--muted:#7c8791;--line:#e7ecef;--brand:#1f9d8b;--brand2:#e7f8f4;--bg:#f4f7f8}*{box-sizing:border-box}body{margin:0;font-family:'DM Sans','Noto Sans SC',sans-serif;color:var(--ink);background:var(--bg);min-height:100vh}.bg{position:fixed;inset:0;background:radial-gradient(circle at 80% 0,#d9f4ed 0,transparent 35%),radial-gradient(circle at 0 50%,#fff 0,transparent 32%);pointer-events:none}header,main,footer{position:relative;max-width:1120px;margin:auto}header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.brand{display:flex;align-items:center;gap:12px}.logo{width:38px;height:38px;display:grid;place-items:center;border-radius:13px;background:var(--ink);color:#fff;font-size:22px}.brand b{display:block;font-size:17px}.brand small{color:var(--muted);font-size:11px}.admin-link{color:var(--muted);text-decoration:none;font-size:13px}.hero{padding:75px 24px 55px;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:11px;letter-spacing:3px;color:var(--brand);font-weight:700;margin:0 0 14px}.hero h1{font-size:58px;line-height:1.08;margin:0;font-weight:900;letter-spacing:-3px}.hero h1 em{color:var(--brand);font-style:normal}.lead{color:var(--muted);font-size:16px;line-height:1.8;max-width:390px}.orb{width:180px;height:180px;border-radius:55px 80px 55px 80px;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:82px;box-shadow:20px 25px 0 #caece4;transform:rotate(12deg);margin-right:70px}.grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;padding:0 24px}.card{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 15px 50px #23343d08}.panel{padding:30px}.tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin-bottom:28px}.tab{border:0;background:none;padding:0 0 14px;font:inherit;color:var(--muted);cursor:pointer}.tab.active{color:var(--ink);font-weight:700;border-bottom:2px solid var(--brand)}label{display:block;font-size:13px;font-weight:700;margin-bottom:10px}input,textarea{width:100%;border:1px solid var(--line);background:#fbfcfc;border-radius:12px;padding:14px 15px;font:inherit;outline:0;margin-bottom:13px}input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand2)}button{font:inherit;cursor:pointer}.primary{width:100%;border:0;background:var(--ink);color:#fff;border-radius:12px;padding:14px 18px;font-weight:700}.primary:hover{background:var(--brand)}.primary span{float:right}.result{margin-top:18px;min-height:20px}.success{background:var(--brand2);border:1px solid #c4eee5;border-radius:13px;padding:16px}.code{font-size:20px;font-weight:800;letter-spacing:1px;margin:8px 0;word-break:break-all}.error,.msg{color:#d95d5d;font-size:13px}.tips{padding:35px;color:var(--muted)}.tip-icon{color:var(--brand);font-size:28px}.tips h3{color:var(--ink);margin:15px 0}.tips p{font-size:13px;line-height:1.8}.secure{border-top:1px solid var(--line);margin-top:24px;padding-top:18px;color:var(--brand);font-size:12px}.hidden{display:none!important}footer{text-align:center;padding:50px 24px 30px;color:#a0aab0;font-size:12px}.modal{position:fixed;inset:0;background:#14202b80;backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px;z-index:5}.modal-box{background:#fff;border-radius:22px;padding:30px;max-width:780px;width:100%;max-height:90vh;overflow:auto;position:relative}.close{position:absolute;right:20px;top:15px;border:0;background:none;font-size:27px;color:var(--muted)}.modal h2{margin:0 0 22px}.dash-head,.list-head{display:flex;justify-content:space-between;align-items:center}.ghost{border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 12px;color:var(--muted)}.dash-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.mini{background:var(--bg);padding:17px;border-radius:14px}.mini>b{display:block;margin-bottom:14px}.mini small{display:block;color:var(--muted);font-size:11px;margin:-7px 0 9px}.mini input{padding:10px;margin-bottom:9px;background:#fff}.mini .primary{padding:10px;font-size:12px}.mini textarea{height:90px;margin-top:10px;font-size:11px}.row{display:flex;gap:8px}.row button{flex:1}.danger{color:#d95d5d}.list-head{border-top:1px solid var(--line);padding-top:20px;margin-top:8px}.table-wrap{overflow:auto;margin-top:12px}table{border-collapse:collapse;width:100%;font-size:12px}td,th{padding:10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{color:var(--muted);font-weight:500}@media(max-width:720px){.hero{padding-top:38px}.hero h1{font-size:43px}.orb{width:100px;height:100px;margin:0;font-size:43px;border-radius:30px}.grid{grid-template-columns:1fr}.dash-grid{grid-template-columns:1fr}.panel{padding:22px}}
/* dashboard refinement */
select{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 11px;font:inherit;color:var(--ink);margin-bottom:9px;outline:0}
select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand2)}
.modal-box{max-width:1120px;padding:34px}
.dash-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start}
.mini{min-width:0}
.mini-title{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:14px}
.mini-title span{font-size:11px;color:var(--muted)}
.mini label{font-size:11px;color:var(--muted);font-weight:500;margin:2px 0 5px}
.mini input,.mini select{min-height:42px}
#xyStatus{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;line-height:1.55;min-height:62px;margin-bottom:10px;word-break:break-word}
#xyMsg{margin-top:8px;line-height:1.5}
#xyRefreshBtn,#xySyncBtn,.mini a.ghost{margin-bottom:8px}
.mini a.ghost{display:inline-block;text-decoration:none;text-align:center}
.game-manager{grid-column:span 2}
.api-info{background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px;margin-top:10px;font-size:11px;line-height:1.55}.api-info>div{margin:5px 0}.api-title{font-weight:700;color:var(--brand);margin-bottom:7px!important}.api-info small{display:block;color:var(--muted)}.api-info code{display:block;white-space:normal;word-break:break-all;background:#f5f8f8;padding:6px 7px;border-radius:6px;color:var(--ink);font-size:10px}.api-rule{color:var(--muted);border-top:1px solid var(--line);padding-top:7px;margin-top:8px!important}
.api-info .butler-config{white-space:pre-wrap;overflow-wrap:anywhere;max-height:260px;overflow:auto;background:#f5f8f8;border-radius:7px;padding:9px;font-size:10px;line-height:1.5;color:var(--ink)}
.bulk-renew{background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px;margin-top:10px}.bulk-renew .ghost{width:100%;margin-top:2px}.bulk-renew .msg{margin-top:8px;line-height:1.5}
@media(max-width:900px){.dash-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.game-manager{grid-column:span 2}}
@media(max-width:560px){.dash-grid{grid-template-columns:1fr}.game-manager{grid-column:span 1}.modal-box{padding:24px 18px}}
.xy-listings{margin:12px 0 18px;padding:16px;background:rgba(255,255,255,.34);border:1px solid rgba(255,255,255,.58);border-radius:14px;backdrop-filter:blur(14px)}.xy-listings .mini-title{margin-bottom:10px}.xy-listings .mini-title b{font-size:14px}.xy-listings .ghost{padding:6px 10px;font-size:11px}.xy-list-table{overflow:auto;background:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.65);border-radius:10px}.xy-list-table table{min-width:560px}.listing-badge{display:inline-block;padding:4px 9px;border-radius:999px;font-size:10px;font-weight:700}.listing-badge.listed{color:#14795f;background:rgba(83,219,170,.2);border:1px solid rgba(65,190,143,.35)}.listing-badge.unlisted{color:#b05061;background:rgba(255,125,147,.15);border:1px solid rgba(220,100,123,.28)}.listing-badge.pending{color:#8b6a22;background:rgba(255,203,92,.2);border:1px solid rgba(218,169,55,.3)}.listing-badge.listing-error,.listing-error-text{color:#bd4560}

/* frosted glass UI */
:root{--ink:#132238;--muted:#66758a;--line:rgba(255,255,255,.58);--brand:#3c8dff;--brand2:rgba(93,174,255,.16);--bg:#edf4ff}
body{background:linear-gradient(135deg,#d9e9ff 0%,#f7f5ff 48%,#dff8f0 100%);overflow-x:hidden}
.bg{background:radial-gradient(circle at 12% 12%,rgba(90,160,255,.38),transparent 30%),radial-gradient(circle at 88% 4%,rgba(182,132,255,.3),transparent 28%),radial-gradient(circle at 70% 85%,rgba(55,219,188,.28),transparent 34%);filter:saturate(115%)}
.bg:before,.bg:after{content:"";position:absolute;border-radius:50%;filter:blur(3px);pointer-events:none}.bg:before{width:260px;height:260px;left:38%;top:22%;background:rgba(255,255,255,.24)}.bg:after{width:190px;height:190px;right:8%;bottom:12%;background:rgba(255,255,255,.2)}
header{height:92px}
.brand,.admin-link{background:rgba(255,255,255,.3);border:1px solid rgba(255,255,255,.48);box-shadow:0 10px 30px rgba(69,95,128,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand{padding:8px 14px 8px 8px;border-radius:18px}.admin-link{padding:10px 14px;border-radius:14px;color:#46617c}
.logo{background:linear-gradient(145deg,#173a68,#4b9eff);box-shadow:0 8px 18px rgba(48,111,207,.3)}
.hero{padding-top:66px}.hero h1{color:#152840;text-shadow:0 3px 20px rgba(255,255,255,.55)}.hero h1 em{color:#327ee7}.lead{color:#5e7088}
.orb{background:linear-gradient(145deg,rgba(56,137,255,.92),rgba(112,93,235,.82));box-shadow:18px 24px 0 rgba(255,255,255,.35),0 24px 55px rgba(61,112,198,.25);border:1px solid rgba(255,255,255,.55);backdrop-filter:blur(12px)}
.card,.modal-box{background:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.7);box-shadow:0 20px 55px rgba(46,77,120,.14),inset 0 1px 0 rgba(255,255,255,.78);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.panel,.tips{background:rgba(255,255,255,.48)}
.tabs{border-color:rgba(142,165,196,.25)}.tab.active{border-color:#3c8dff;color:#1d4f8f}
input,textarea,select{background:rgba(255,255,255,.62);border-color:rgba(255,255,255,.8);box-shadow:inset 0 1px 2px rgba(47,77,118,.04)}input:focus,select:focus{border-color:#71adff;box-shadow:0 0 0 4px rgba(91,158,255,.16)}
.primary{background:linear-gradient(135deg,#256ed3,#5c72ed);box-shadow:0 10px 22px rgba(48,105,211,.24);border:1px solid rgba(255,255,255,.3)}.primary:hover{background:linear-gradient(135deg,#1e61bf,#4f61db);transform:translateY(-1px)}
.ghost{background:rgba(255,255,255,.42);border-color:rgba(255,255,255,.75);color:#46617c;backdrop-filter:blur(12px)}.ghost:hover{background:rgba(255,255,255,.72)}
.success{background:rgba(220,255,246,.58);border-color:rgba(119,221,194,.55)}.error,.msg{color:#c34e69}
.mini{background:rgba(255,255,255,.33);border:1px solid rgba(255,255,255,.52);box-shadow:inset 0 1px 0 rgba(255,255,255,.42);backdrop-filter:blur(14px)}
#xyStatus,.api-info,.bulk-renew{background:rgba(255,255,255,.52);border-color:rgba(255,255,255,.72)}
.api-info code{background:rgba(228,239,255,.65)}
.list-head{border-color:rgba(142,165,196,.3)}td,th{border-color:rgba(142,165,196,.24)}
.modal{background:rgba(20,38,67,.38);backdrop-filter:blur(12px)}
footer{color:#7890a9}
@media(max-width:720px){.hero{padding-top:42px}.brand{padding-right:10px}.admin-link{padding:9px 11px}.orb{box-shadow:10px 14px 0 rgba(255,255,255,.35),0 14px 30px rgba(61,112,198,.2)}}

#xyLogoutBtn{width:100%;margin:2px 0 8px;color:#ad5262;border-color:rgba(219,112,132,.35);background:rgba(255,239,243,.56)}#xyLogoutBtn:hover{background:rgba(255,225,232,.8)}#xyLogoutBtn:disabled{opacity:.55;cursor:wait}

