@font-face{font-family:Borda;src:url(/assets/fonts/borda-extrabold.woff2) format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:Borda;src:url(/assets/fonts/borda-bold.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Borda;src:url(/assets/fonts/borda-medium.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Borda;src:url(/assets/fonts/borda-regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Europa;src:url(/assets/fonts/europa.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:UbisoftSans;src:url(/assets/fonts/ubisoft-sans.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:UbisoftSans;src:url(/assets/fonts/ubisoft-sans-bold.woff2) format('woff2');font-weight:700;font-display:swap}
:root{--bg:#0a0a0b;--panel:#111114;--card:#141418;--fg:#e9e7e3;--mut:#9a978f;--line:#2a2a30;
  --accent:#ff6a13;--accent-2:#db287f;--accent-ink:#0a0a0b;--bone:#e5e3e0;
  --warn:#fca531;--bad:#ff5b60;--ok:#28aa5f;--violet:#a98bff;
  --ff-display:Borda,"Microsoft YaHei",system-ui,sans-serif;
  --ff-europa:Europa,Borda,"Microsoft YaHei",sans-serif;
  --ff-body:UbisoftSans,"Microsoft YaHei",-apple-system,"Segoe UI",sans-serif;}
[data-theme=light]{--bg:#e7e3da;--panel:#f3efe8;--card:#fbf9f5;--fg:#1a1a1c;--mut:#6b675f;--line:#d8d2c6;
  --accent:#d9560a;--accent-2:#c02470;--accent-ink:#fff;--bone:#3a3a3e;--warn:#b8760a;--bad:#d63a3f;--ok:#1f9a63;--violet:#7c4fd0}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);
  font:14px/1.5 var(--ff-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.bar{display:flex;align-items:center;gap:8px;height:54px;padding:0 14px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.bar::before{content:"";position:absolute;left:0;top:0;height:2px;width:220px;background:linear-gradient(90deg,var(--accent),var(--accent-2) 60%,transparent);z-index:1}
.brand{font-family:var(--ff-display);font-weight:800;margin-right:8px;letter-spacing:0;font-size:15px;text-transform:uppercase;white-space:nowrap}
.brand small{font-family:var(--ff-europa);color:var(--mut);font-weight:400;margin-left:6px;font-size:11px;text-transform:uppercase;letter-spacing:0}
.brand{display:inline-flex;align-items:center;gap:10px}
.brand .blogo{height:26px;width:auto;display:block;filter:drop-shadow(0 1px 2px rgba(0,0,0,.55))}
.primary-nav{display:flex;align-self:stretch;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.primary-nav::-webkit-scrollbar{display:none}
.tab{appearance:none;border:1px solid transparent;background:transparent;color:var(--mut);
  padding:8px 14px;font-family:var(--ff-europa);text-transform:uppercase;letter-spacing:0;font-size:12px;font-weight:700;cursor:pointer;height:54px;white-space:nowrap}
.tab:hover{color:#0a0a0b;background:var(--bone);border-color:var(--bone)}
.tab.on{color:#0a0a0b;background:var(--bone);border-color:var(--bone);font-weight:800}
.tab.on .n,.tab:hover .n{color:#0a0a0b}
.tab .n{display:inline-block;min-width:16px;text-align:center;font-size:11px;color:var(--accent);margin-left:6px;font-weight:700;font-family:var(--ff-europa)}
.tab .nb{display:inline-block;margin-left:6px;padding:1px 5px;border-radius:4px;background:var(--accent);color:#0a0a0b;
  font-size:11px;font-weight:800;letter-spacing:.06em;font-family:var(--ff-europa);vertical-align:1px}
.tab .nb[hidden]{display:none}
.tab.on .nb,.tab:hover .nb{background:#0a0a0b;color:var(--bone)}
.sp{flex:1}
/* 右侧这一簇（语言/主题 · 健康点 · 服务器徽章）必须**宽度恒定、拒绝压缩**：
   .sp 吃掉全部余量 ⇒ 它们的绝对位置只由自身宽度决定。谁变宽谁才动，别人不动。
   （原来分平台小胶囊在这里，>1040px 显示、≤1040px 整组隐藏，一进一出就把「原文/深色」
     推着横跳 —— 那批胶囊已从顶栏移除，明细在悬停弹层里。）*/
.shell-actions{display:flex;align-items:center;gap:2px;flex:0 0 auto}
.shell-control{appearance:none;border:1px solid transparent;background:transparent;color:var(--mut);height:34px;padding:0 9px;border-radius:5px;font:700 11.5px var(--ff-europa);letter-spacing:0;cursor:pointer;white-space:nowrap}
.shell-control:hover{color:var(--fg);background:var(--card);border-color:var(--line)}
#hbadge{flex:0 0 auto}
#hbadge[hidden]{display:none}
.ubistatus{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mut);position:relative;flex:0 0 auto}
.ubi-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel);cursor:pointer;font-weight:700;color:var(--fg);white-space:nowrap}
.ubi-badge:hover{border-color:var(--accent)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--mut);flex:0 0 auto}
.dot.online{background:#2aa76b}.dot.maintenance{background:#5b7bff}.dot.degradation{background:#e8890c}
.dot.interrupted,.dot.offline{background:#e5484d}.dot.unknown{background:#8a94a6}
.dot.pulse{animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(42,167,107,.5)}70%{box-shadow:0 0 0 6px rgba(42,167,107,0)}100%{box-shadow:0 0 0 0 rgba(42,167,107,0)}}
.ubi-plat{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border:1px solid var(--line);border-radius:999px;background:var(--panel);font-size:11.5px;color:var(--fg);white-space:nowrap}
.ubi-plat i{font-style:normal;color:var(--mut)}
.s-online{color:#2aa76b}.s-maintenance{color:#5b7bff}.s-degradation{color:#e8890c}.s-interrupted,.s-offline{color:#e5484d}
.ubi-pop{position:absolute;right:0;top:40px;z-index:30;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 44px rgba(0,0,0,.4);padding:12px 14px;min-width:300px;display:none}
.ubi-pop.on{display:block}
.ubi-pop h4{margin:0 0 6px;font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.05em}
.ubi-row{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-top:1px solid var(--line);font-size:13px}
.ubi-row:first-of-type{border-top:0}
.ubi-imp{color:var(--warn);font-size:11px;margin-top:2px;width:100%}
.ubi-upd{margin-top:9px;font-size:11.5px;color:var(--mut)}
@media(max-width:1040px){.brand small,.ubi-plat{display:none}.tab{padding-inline:11px}}
@media(max-width:760px){
  .bar{height:94px;padding:0 10px;gap:4px;display:grid;grid-template-columns:auto 1fr auto auto;grid-template-rows:48px 46px;overflow:visible}
  .brand{grid-column:1;grid-row:1;margin:0}.brand .blogo{height:24px}.sp{display:none}
  .shell-actions{grid-column:3;grid-row:1}.bar>#hbadge{grid-column:4;grid-row:1}.ubistatus{display:none}
  .primary-nav{grid-column:1/-1;grid-row:2;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;border-top:1px solid var(--line)}
  .primary-nav::-webkit-scrollbar{display:none}.tab{height:45px;padding:8px 13px;flex:0 0 auto}
  .tab:first-child{padding-left:6px}.tab.on{box-shadow:inset 0 -2px 0 var(--accent)}
}
iframe{position:absolute;left:0;right:0;top:54px;bottom:0;width:100%;height:calc(100% - 54px);border:0;background:var(--bg)}
@media(max-width:760px){iframe{top:94px;height:calc(100% - 94px)}}