:root {
  --bg: #000;
  --paper: #f6f3ec;
  --white: #fff;
  --text: #fff;
  --muted: rgba(255,255,255,.72);
  --line: rgba(255,255,255,.16);
  --panel: rgba(255,255,255,.06);
  --panel-strong: rgba(255,255,255,.09);
  --orange: #e8a050;
  --green: #7fdc91;
  --yellow: #f1c66d;
}

.theme-ivory {
  --bg: #f6f3ec;
  --paper: #0d0d0d;
  --white: #111;
  --text: #111;
  --muted: rgba(17,17,17,.62);
  --line: rgba(17,17,17,.12);
  --panel: rgba(255,255,255,.48);
  --panel-strong: rgba(255,255,255,.75);
  --orange: #a46a22;
  --green: #1c8a47;
  --yellow: #9a6d10;
}
* { box-sizing: border-box; }
html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
body { overflow-x: hidden; transition: background .45s ease, color .45s ease; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
button, a { font: inherit; }

.header,
.hero-bg,
.hero-bg-image,
.hero-vignette-outer,
.hero-vignette-center,
.hero-overlay,
.hero-kicker,
.hero-title,
.hero-desc,
.metric-card,
.metric-label,
.metric-sub,
.apply-btn,
.panel,
.panel-tag,
.section-head h2,
.data-table th,
.data-table td,
.key-value,
.panel-note,
.log-item,
.alert-list,
.header-btn,
.mini-btn,
.glitch-canvas {
  transition:
    background .45s ease,
    color .45s ease,
    border-color .45s ease,
    opacity .45s ease,
    filter .45s ease,
    box-shadow .45s ease;
}

.glitch-canvas {
  opacity: 1;
}

body.theme-switching .glitch-canvas {
  opacity: .12;
}

body.theme-switching .hero-bg-image {
  opacity: .02;
}

body.theme-switching .hero-content,
body.theme-switching .dashboard-section {
  opacity: .86;
  transition: opacity .35s ease;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  opacity: 0;
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  transition: opacity .32s ease;
}

body.theme-switching::after {
  opacity: .14;
}

.header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 60px;
  padding: 0 30px;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  color: var(--text);
  background: color-mix(in srgb, var(--bg) 78%, transparent);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--line);
}
.header-left,.header-right{display:flex;align-items:center}.header-left{gap:16px}.header-right{gap:15px}
.logo{font-size:14px;letter-spacing:.03em}.header-status{display:flex;gap:10px;align-items:center;font-size:11px;letter-spacing:2.2px}.dot{width:6px;height:6px;background:#fff;border-radius:50%;animation:pulse 2.2s ease-in-out infinite}@keyframes pulse{0%,50%{opacity:1}50.01%,100%{opacity:.25}}
.theme-ivory .dot{background:#111}
.header-time{font-size:11px;letter-spacing:1.98px}.header-btn,.mini-btn{display:inline-flex;align-items:center;justify-content:center;height:30px;padding:0 16px;color:var(--text);background:transparent;border:1px solid color-mix(in srgb, var(--text) 35%, transparent);cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease;line-height:1;white-space:nowrap;vertical-align:middle}.header-btn.strong{border-color:color-mix(in srgb, var(--text) 60%, transparent)}

.cursor-ring{position:fixed;top:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;width:40px;height:40px;pointer-events:none;background:#000;border-radius:50%;mix-blend-mode:normal;opacity:0;transition:width .2s cubic-bezier(.22,1,.36,1),height .2s cubic-bezier(.22,1,.36,1),background-color .18s cubic-bezier(.22,1,.36,1),opacity .15s cubic-bezier(.22,1,.36,1),transform .06s linear;transform:translate(-50%,-50%)}
.cursor-text{font-size:9px;font-weight:600;color:#f6f3ec;letter-spacing:.08em;user-select:none;opacity:1;transition:opacity .15s cubic-bezier(.22,1,.36,1)}
.cursor-invert{width:56px;height:56px;background:#f6f3ec;mix-blend-mode:difference;opacity:.96}.cursor-invert .cursor-text{opacity:0}
.cursor-hero{width:100px;height:100px;background:#f6f3ec;mix-blend-mode:difference;opacity:.98}.cursor-hero .cursor-text{opacity:0}
.cursor-hidden{width:12px;height:12px;opacity:0}.cursor-hidden .cursor-text{opacity:0}

.root{display:flex;flex-direction:column;width:100%;background:var(--bg)}
.hero{position:relative;display:flex;align-items:center;justify-content:center;min-height:100vh;overflow:hidden}
.hero-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;background:color-mix(in srgb, var(--bg) 94%, #111)}.glitch-canvas{position:absolute;inset:0;width:100%;height:100%}
.hero-bg-image{position:absolute;inset:0;opacity:.04;mix-blend-mode:screen;filter:grayscale(1)}
.hero-vignette-outer{position:absolute;inset:0;background:radial-gradient(circle,rgba(0,0,0,0) 66%,var(--bg) 100%)}
.hero-vignette-center{position:absolute;inset:0;background:radial-gradient(circle at center,rgba(0,0,0,.22),rgba(0,0,0,0) 68%)}
.hero-overlay{position:absolute;inset:0;background:rgba(0,0,0,.50)}
.theme-ivory .hero-bg-image{opacity:.02;mix-blend-mode:multiply;filter:grayscale(1) contrast(.9)}
.theme-ivory .hero-vignette-center{background:radial-gradient(circle at center,rgba(255,255,255,.06),rgba(255,255,255,0) 68%)}
.theme-ivory .hero-overlay{background:rgba(246,243,236,.74)}
.hero-content{position:relative;z-index:2;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;width:min(1120px,calc(100vw - 40px));padding:108px 20px 68px;text-align:center}
.hero-kicker{margin:0;font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:10px;letter-spacing:4.6px;color:var(--muted);text-transform:uppercase}
.hero-title{margin:0;font-size:68px;font-weight:700;line-height:1.02;background:linear-gradient(90deg,#c8ced7,#f4f6f8 45%,#9fadb9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.theme-ivory .hero-title{background:linear-gradient(90deg,#2d2d2d,#111 45%,#5c5c5c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-desc{max-width:760px;margin:0;color:var(--muted);font-size:14px;line-height:1.85}
.hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%;margin-top:18px}.metric-card{padding:18px 18px 16px;border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(6px);text-align:left}.metric-label{display:block;margin-bottom:9px;font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:10px;letter-spacing:2.6px;color:var(--muted);text-transform:uppercase}.metric-value{display:block;font-size:38px;line-height:1;font-weight:600}.metric-sub{display:block;margin-top:10px;color:var(--muted);font-size:12px;font-style:normal}
.hero-actions{display:flex;gap:12px;margin-top:10px}.apply-btn{display:flex;align-items:center;justify-content:space-between;min-width:260px;height:42px;padding:0 16px;color:color-mix(in srgb, var(--text) 82%, transparent);background:color-mix(in srgb, var(--text) 6%, transparent);border:1px solid color-mix(in srgb, var(--text) 14%, transparent);box-shadow:inset 0 1px 0 color-mix(in srgb, var(--text) 3%, transparent)}.apply-btn.ghost{background:color-mix(in srgb, var(--text) 2.5%, transparent)}.apply-arrow{font-size:16px}

.hero-search{width:100%;max-width:500px;margin-top:14px;position:relative}
.hero-search-input{width:100%;height:46px;padding:0 14px 0 42px;color:var(--text);background:color-mix(in srgb, var(--text) 4%, transparent);border:1px solid color-mix(in srgb, var(--text) 14%, transparent);outline:none;font-size:14px;font-family:inherit}
.hero-search-input:focus{border-color:color-mix(in srgb, var(--text) 34%, transparent);box-shadow:0 0 0 3px color-mix(in srgb, var(--text) 8%, transparent)}
.hero-search-input::placeholder{color:var(--muted);opacity:.5}
.hero-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted)}

.dashboard-section{padding:42px 30px 24px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 auto 18px;width:min(1180px,100%)}.section-head h2{margin:0;font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:16px;letter-spacing:3px;text-transform:uppercase;color:color-mix(in srgb, var(--text) 70%, transparent)}
.panel-grid{display:grid;gap:18px;width:min(1180px,100%);margin:0 auto}.panel-grid.two-col{grid-template-columns:1.45fr .8fr}.panel-grid.three-col{grid-template-columns:repeat(3,1fr)}.panel{border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(8px);padding:22px}.panel.wide{min-width:0}.panel-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.panel-title-row h3{margin:0;font-size:18px;font-weight:600}.panel-tag{font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:11px;letter-spacing:2px;color:var(--muted);text-transform:uppercase}
.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:13px 10px;border-bottom:1px solid color-mix(in srgb, var(--text) 10%, transparent);text-align:left;font-size:14px}.data-table th{color:var(--muted);font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-weight:400;letter-spacing:1px}.status{display:inline-block;padding:4px 8px;border:1px solid color-mix(in srgb, var(--text) 20%, transparent);font-size:11px;letter-spacing:1px}.status.online{color:var(--green);border-color:color-mix(in srgb, var(--green) 32%, transparent)}.status.warn{color:var(--yellow);border-color:color-mix(in srgb, var(--yellow) 32%, transparent)}.status.offline{color:#ff8a8a;border-color:color-mix(in srgb, #ff8a8a 32%, transparent)}
.quota-list{display:grid;gap:10px}.quota-list>div{display:flex;align-items:center;justify-content:space-between}.bar{height:10px;border:1px solid color-mix(in srgb, var(--text) 10%, transparent);background:color-mix(in srgb, var(--text) 3%, transparent)}.bar i{display:block;height:100%;background:linear-gradient(90deg,color-mix(in srgb, var(--text) 100%, transparent),color-mix(in srgb, var(--text) 45%, transparent))}
.key-value{margin:0 0 12px;font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:15px;line-height:1.8;color:var(--text);word-break:break-all}.panel-note{margin:0;color:var(--muted);line-height:1.8}
.log-list{display:grid;gap:10px}.log-item{display:grid;grid-template-columns:90px 1fr 60px;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid color-mix(in srgb, var(--text) 8%, transparent)}.log-item span,.log-item code,.log-item strong{font-size:14px}.log-item code{color:color-mix(in srgb, var(--text) 82%, transparent)}.ok{color:var(--green)}.warn-text{color:var(--yellow)}.alert-list{margin:0;padding-left:18px;color:var(--muted);line-height:1.9}

@media (hover:hover) and (pointer:fine){.header-btn:hover,.mini-btn:hover,.apply-btn:hover,.metric-card:hover,.panel:hover{color:var(--bg);background:var(--text)}}
@media (max-width:980px){.hero-metrics,.panel-grid.three-col,.panel-grid.two-col{grid-template-columns:1fr}.hero-title{font-size:54px}.hero-actions{flex-direction:column;width:100%}.apply-btn{width:100%}}
.auth-shell{position:relative;display:flex;align-items:center;justify-content:center;min-height:100vh;overflow:hidden;padding:96px 20px 40px}.auth-card{position:relative;z-index:2;width:min(460px,100%);padding:28px 28px 24px;border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(10px)}.auth-kicker{margin:0 0 8px;font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:10px;letter-spacing:4px;color:var(--muted);text-transform:uppercase}.auth-title{margin:0 0 10px;font-size:42px;line-height:1.05}.auth-desc{margin:0 0 20px;color:var(--muted);line-height:1.8;font-size:14px}.auth-form{display:grid;gap:14px}.auth-label{display:grid;gap:8px}.auth-label span{font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:11px;letter-spacing:2px;color:var(--muted);text-transform:uppercase}.auth-input{height:46px;padding:0 14px;color:var(--text);background:color-mix(in srgb, var(--text) 4%, transparent);border:1px solid color-mix(in srgb, var(--text) 14%, transparent);outline:none;font-family:inherit;font-size:14px}.auth-input:focus{border-color:color-mix(in srgb, var(--text) 34%, transparent);box-shadow:0 0 0 3px color-mix(in srgb, var(--text) 8%, transparent)}.auth-input::placeholder{color:var(--muted);opacity:.5}.auth-submit{height:44px;margin-top:4px;color:color-mix(in srgb, var(--text) 88%, transparent);background:color-mix(in srgb, var(--text) 6%, transparent);border:1px solid color-mix(in srgb, var(--text) 14%, transparent);cursor:pointer;font-size:14px;font-weight:600;font-family:inherit}.auth-submit:hover{color:var(--bg);background:var(--text)}.auth-submit:disabled{opacity:.4;cursor:not-allowed}.auth-links{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px}.auth-link{font-size:13px;color:var(--muted);text-decoration:none;border-bottom:1px solid transparent}.auth-link:hover{color:var(--text);border-bottom-color:color-mix(in srgb, var(--text) 40%, transparent)}.auth-back{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:13px;color:var(--muted)}.auth-back:hover{color:var(--text)}

.auth-error{padding:12px 14px;margin-bottom:16px;font-size:13px;border:1px solid color-mix(in srgb, #ff8a8a 30%, transparent);background:color-mix(in srgb, #ff8a8a 8%, transparent);color:#ff8a8a}
.auth-success{padding:12px 14px;margin-bottom:16px;font-size:13px;border:1px solid color-mix(in srgb, var(--green) 30%, transparent);background:color-mix(in srgb, var(--green) 8%, transparent);color:var(--green)}

.auth-input-group{display:flex}.auth-input-group .auth-input{flex:1;border-right:none}.auth-send-code{height:46px;padding:0 14px;white-space:nowrap;border:1px solid color-mix(in srgb, var(--text) 14%, transparent);background:var(--panel);color:var(--muted);font-size:12px;cursor:pointer;transition:all .2s ease;font-family:Menlo,Monaco,Consolas,"Courier New",monospace}.auth-send-code:hover{background:var(--text);color:var(--bg)}.auth-send-code:disabled{opacity:.4;cursor:not-allowed}

@media (max-width:768px){.header{height:52px;padding:0 16px}.header-status,.header-time,.cursor-ring,.hide-mobile{display:none!important}.header-right{gap:6px;flex-wrap:nowrap}.header-btn,.mini-btn{height:28px;padding:0 10px;font-size:10px}.hero-content{padding:80px 12px 40px}.hero-title{font-size:36px}.hero-desc{font-size:13px}.metric-value{font-size:28px}.metric-card{padding:16px}.dashboard-section{padding:20px 14px 14px}.data-table th,.data-table td,.log-item span,.log-item code,.log-item strong{font-size:12px}.log-item{grid-template-columns:72px 1fr 44px}.auth-shell{padding:82px 14px 24px}.auth-card{padding:22px 18px 18px}.auth-title{font-size:34px}.auth-links{flex-direction:column;align-items:flex-start}.announce-section{padding:0 14px 20px}.announce-banner{padding:14px 16px}.announce-item-home{flex-direction:column;gap:6px}}
@media (max-width:480px){.header{height:48px;padding:0 12px}.header-left .logo{font-size:12px}.header-right{gap:4px}.header-btn,.mini-btn{height:24px;padding:0 7px;font-size:9px;letter-spacing:0}.hero-content{padding:70px 10px 30px}.hero-title{font-size:28px}.hero-kicker{font-size:9px;letter-spacing:2px}.hero-desc{font-size:12px}.metric-card{padding:14px}.metric-value{font-size:22px}.metric-label{font-size:9px}.metric-sub{font-size:11px}.panel{padding:14px}.auth-title{font-size:28px}.dashboard-section{padding:16px 10px 10px}}

/* ---- 公告区域 ---- */
.announce-section { padding: 0 30px 24px; }
.announce-banner {
  width: min(1180px, 100%);
  margin: 0 auto;
  border: 1px solid var(--line);
  background: var(--panel);
  backdrop-filter: blur(6px);
  padding: 20px 24px;
}
.announce-banner-title {
  margin: 0 0 12px;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  font-size: 12px;
  letter-spacing: 2.6px;
  color: var(--muted);
  text-transform: uppercase;
}
.announce-item-home {
  padding: 10px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--text) 8%, transparent);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.announce-item-home:last-child { border-bottom: none; }
.announce-item-home .announce-text {
  flex: 1;
  font-size: 14px;
  line-height: 1.7;
  color: var(--text);
}
.announce-item-home .announce-date {
  flex-shrink: 0;
  font-size: 11px;
  color: var(--muted);
  font-family: Menlo, Monaco, monospace;
  white-space: nowrap;
}

/* ---- 公告弹窗 ---- */
.announce-modal {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: announceIn .25s ease;
}
@keyframes announceIn { from { opacity: 0; } to { opacity: 1; } }
.announce-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
}
.theme-ivory .announce-modal-overlay { background: rgba(0,0,0,.25); }
.announce-modal-content {
  position: relative;
  z-index: 2;
  width: min(560px, calc(100vw - 40px));
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  background: var(--bg);
  border: 1px solid var(--line);
  padding: 24px;
}
.announce-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.announce-modal-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}
.announce-modal-close {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.announce-modal-close:hover { background: var(--text); color: var(--bg); }
.announce-modal-list { display: grid; gap: 12px; }
.announce-modal-item {
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--text) 10%, transparent);
  background: color-mix(in srgb, var(--text) 3%, transparent);
}
.announce-modal-item .announce-text {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text);
  margin: 0 0 6px;
}
.announce-modal-item .announce-date {
  font-size: 11px;
  color: var(--muted);
  font-family: Menlo, Monaco, monospace;
}
.announce-modal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.announce-dismiss-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}
.announce-dismiss-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--text);
  cursor: pointer;
}
.announce-modal-confirm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 24px;
  border: 1px solid color-mix(in srgb, var(--text) 42%, transparent);
  background: color-mix(in srgb, var(--text) 8%, transparent);
  color: var(--text);
  cursor: pointer;
  font-size: 14px;
  letter-spacing: .5px;
  transition: background .2s, color .2s;
}
.announce-modal-confirm:hover {
  background: var(--text);
  color: var(--bg);
}
