/* 子域名申请分配系统 — 样式 (深色精简) */
:root{
  --bg:#0f1320; --bg2:#141a2b; --card:#171c2e; --card2:#1d2742; --line:#2a3350;
  --txt:#eef2ff; --mut:#9aa6c8; --acc:#6c8cff; --acc2:#46e0c8;
  --ok:#46e0c8; --warn:#f5c26b; --bad:#ff7a90; --r:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Noto Sans Arabic','Segoe UI',system-ui,-apple-system,sans-serif;
  background:
    radial-gradient(1000px 500px at 85% -10%, rgba(108,140,255,.14), transparent 60%),
    radial-gradient(800px 420px at 0% 110%, rgba(70,224,200,.10), transparent 55%),
    var(--bg);
  color:var(--txt); min-height:100vh; line-height:1.7; font-size:15px;
}
a{color:var(--acc); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:960px; margin:0 auto; padding:20px}
.topbar{display:flex; align-items:center; gap:14px; padding:14px 20px;
  background:rgba(23,28,46,.7); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:17px}
.brand .dot{width:30px;height:30px;border-radius:9px;
  background:linear-gradient(135deg,var(--acc),var(--acc2)); display:grid; place-items:center; color:#0f1320; font-weight:800}
.topbar .spacer{flex:1}
.topbar nav{display:flex; gap:6px; flex-wrap:wrap}
.topbar nav a{padding:7px 12px; border-radius:9px; color:var(--mut); font-size:14px}
.topbar nav a:hover{background:var(--card2); color:var(--txt); text-decoration:none}
.topbar nav a.on{background:linear-gradient(135deg,var(--acc),var(--acc2)); color:#0f1320; font-weight:700}

.card{background:linear-gradient(180deg,var(--card),var(--bg2)); border:1px solid var(--line);
  border-radius:var(--r); padding:20px; margin:16px 0; box-shadow:0 12px 30px rgba(0,0,0,.25)}
h1{font-size:22px; margin:0 0 4px}
h2{font-size:17px; margin:0 0 14px}
.lead{color:var(--mut); margin:0 0 16px; font-size:14px}

label{display:block; font-size:13.5px; color:var(--mut); margin:12px 0 6px}
input[type=text],input[type=email],input[type=password],input[type=url],input[type=number],textarea,select{
  width:100%; padding:11px 13px; background:var(--card2); color:var(--txt);
  border:1px solid var(--line); border-radius:11px; font-size:15px; font-family:inherit; outline:none;
  transition:border-color .15s, box-shadow .15s;
}
input:focus,textarea:focus,select:focus{border-color:var(--acc); box-shadow:0 0 0 3px rgba(108,140,255,.16)}
textarea{min-height:90px; resize:vertical}
.btn{display:inline-flex; align-items:center; gap:7px; cursor:pointer; border:0; font-family:inherit;
  font-weight:700; font-size:15px; padding:11px 18px; border-radius:11px; color:#0f1320;
  background:linear-gradient(135deg,var(--acc),var(--acc2)); transition:transform .07s, filter .15s}
.btn:hover{filter:brightness(1.08)}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:var(--card2); color:var(--txt); border:1px solid var(--line)}
.btn.sm{padding:7px 12px; font-size:13px; font-radius:9px}
.btn.ok{background:linear-gradient(135deg,#46e0c8,#39c9a0)}
.btn.bad{background:linear-gradient(135deg,#ff7a90,#ff5d78)}
.btn.warn{background:linear-gradient(135deg,#f5c26b,#e9a94b)}
.row{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.grid{display:grid; gap:16px}
.grid.two{grid-template-columns:1fr 1fr}
@media(max-width:640px){ .grid.two{grid-template-columns:1fr} }

table{width:100%; border-collapse:collapse; font-size:14px}
th,td{padding:10px 12px; text-align:start; border-bottom:1px solid var(--line); vertical-align:middle}
th{color:var(--mut); font-weight:600; font-size:13px; white-space:nowrap}
tr:hover td{background:rgba(255,255,255,.015)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; direction:ltr; unicode-bidi:embed}

.badge{display:inline-block; padding:2px 10px; border-radius:99px; font-size:12.5px; font-weight:700; white-space:nowrap}
.badge.ok{background:rgba(70,224,200,.15); color:var(--ok); border:1px solid rgba(70,224,200,.3)}
.badge.warn{background:rgba(245,194,107,.15); color:var(--warn); border:1px solid rgba(245,194,107,.3)}
.badge.bad{background:rgba(255,122,144,.15); color:var(--bad); border:1px solid rgba(255,122,144,.3)}
.badge.muted{background:rgba(154,166,200,.12); color:var(--mut); border:1px solid var(--line)}

.flash{padding:11px 14px; border-radius:11px; margin:0 0 14px; font-size:14px; border:1px solid}
.flash.ok{background:rgba(70,224,200,.12); color:var(--ok); border-color:rgba(70,224,200,.3)}
.flash.err{background:rgba(255,122,144,.12); color:var(--bad); border-color:rgba(255,122,144,.3)}
.flash.info{background:rgba(108,140,255,.12); color:var(--acc); border-color:rgba(108,140,255,.3)}

.hint{color:var(--mut); font-size:13px}
.qr{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:8px}
.qr .box{background:var(--card2); border:1px dashed var(--line); border-radius:12px; padding:14px; text-align:center}
.qr .box img{max-width:100%; width:180px; height:180px; object-fit:contain; background:#fff; border-radius:10px}
.qr .box .t{font-weight:700; margin-bottom:8px}
@media(max-width:560px){ .qr{grid-template-columns:1fr} }

.stat{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; margin:4px 0 8px}
.stat .n{background:var(--card2); border:1px solid var(--line); border-radius:12px; padding:14px; text-align:center}
.stat .n b{display:block; font-size:24px}
.stat .n span{color:var(--mut); font-size:12.5px}
.foot{color:var(--mut); font-size:12px; text-align:center; padding:24px 0; opacity:.8}

/* 子域落地页 (居中) */
.center-stage{min-height:100vh; display:grid; place-items:center; padding:24px}
.stage-card{max-width:520px; width:100%; text-align:center}
.stage-card .icon{font-size:46px; margin-bottom:6px}
.stage-card h1{font-size:22px}
.stage-card p{color:var(--mut)}
