/* Public pages only. The independent homepage and every admin route retain their styles.

   视觉与首页统一（设计依据 work/design-review-20260918/preview-a-home.html）：
     * 去掉玻璃拟态：不再有 background 渐变、backdrop-filter、多层内阴影。
     * 面板 = 纯白底 + 1px 描边 + 圆角，层级靠留白和字重，不靠光效。
     * 圆角 4 / 10 / 16 / 999 四档；阴影全站只有一处极轻的。
     * 字号 12 / 13 / 14 / 16 / 17 / 20 / 26；中文不用负字距。
   类名一律不变：内页还有大量组件样式引用它们，改名会静默改坏版面。

   颜色不在这里定义，全部来自 tokens.css。下面是把旧名字指过去的别名——
   这些名字散在本文件 179 行规则以及 site.css、community.css 里，逐个改名风险大、
   收益小，别名一层就够。
     --text    → --ink      正文
     --muted   → --ink-2    次要文字（不要指到 --ink-3，那个更浅，正文用会不够对比度）
     --muted-2 → --ink-3    更浅的小字
     --bg/--panel/--panel2 → --paper / --paper / --paper-2
     --radius  → --r-3      16px
     --orange  → --gold      --red → --danger

   ⚠ 不要在这里重定义 --ink。它在本文件里被当成"按钮上的字色"用过（值是白），
   但 --ink 在 tokens.css 里的本义是"正文色"。把它别名成白色之后，所有用
   var(--ink) 当正文色的规则（h1、.facts dt、.scores…）全都会变成白底白字——
   页面上就只剩用 --ink-3 的部分看得见。这个错误真的发生过，页面塌过一次。
   需要"深色底上的字色"时用 tokens.css 的 --on-accent / --on-light。*/
html.public-theme{
  color-scheme:light;
  --text:var(--ink);
  --muted:var(--ink-2);
  --muted-2:var(--ink-3);
  --bg:var(--paper);
  --panel:var(--paper);
  --panel2:var(--paper-2);
  --radius:var(--r-3);
  --orange:var(--gold);
  --red:var(--danger);
  --green:#1f5c34;
}
.public-theme body{background:var(--bg);min-height:100vh}
.public-theme .topbar,.public-theme main,.public-theme footer{width:min(1120px,calc(100% - 48px));max-width:none;margin-inline:auto}
.public-theme .topbar{padding:var(--s-3,24px) 0;gap:var(--s-3,24px);flex-wrap:wrap;
  border-bottom:1px solid var(--line)}
.public-theme .brand{color:var(--text);letter-spacing:.01em;font-size:20px;font-weight:700}
/* 不再 grayscale：logo 本身有电光蓝和金色，去色等于把品牌色扔掉。
   图用的是 96px 版本（5KB），不是 2MB 的原图。 */
.public-theme .brand-avatar{width:38px;height:38px;border-radius:999px;border:0}
.public-theme .brand small{color:var(--muted-2);font-size:12px;letter-spacing:.14em;font-weight:600}
.public-theme .topbar nav{padding:0;gap:var(--s-3,24px);flex:1;justify-content:flex-end;flex-wrap:wrap}
.public-theme .topbar nav a{font-size:14px;color:var(--muted)}
.public-theme .topbar nav a:hover{color:var(--accent)}
.public-theme .topbar a.active{color:var(--text);font-weight:650}
.public-theme .admin-link{color:var(--muted-2);font-size:13px;margin-left:0;white-space:nowrap}
.public-theme main{padding:var(--s-4,40px) 0 var(--s-5,64px);min-height:72vh}
.public-theme .page-head{margin-bottom:var(--s-3,24px)}
.public-theme h1{font-size:clamp(28px,3.2vw,40px);line-height:1.32;font-weight:700;letter-spacing:0}

/* ==========================================================================
   内页版式语言
   --------------------------------------------------------------------------
   定稿依据 work/design-review-20260918/preview-status-v2.html（状态页）
   与 preview-inner-final.html（其他页）。

   第一版我给自己定了"不用卡片"，结果做成了散装文字堆：内容挤在左边 1/3、
   右边半屏空白、标签与值散开、整页 1600px 高而内容只到 450px。
   复盘：卡片本身不是问题，廉价卡片才是——千篇一律的圆角 + 多层阴影 +
   渐变 + 每块内容等重。所以规则改成：

     1. 用卡片，但只在"真的是一组信息"的地方用。1px 描边、无阴影、无渐变。
     2. 卡片内要有主次：关键数字放大，次要信息降级。不做等重内容。
     3. 卡片并排铺满可用宽度，别让内容挤在左边。
     4. 图标一律线性 SVG，不用 emoji（字重、色度、大小都控制不了）。
     5. 悬停只换极浅底色，不做对比强烈的色块。

   仍然刻意避开的四类"生成感"手法：
     一排等重的小胶囊 / 每个分组都画横线 / 表头加字母间距 / 01-02-03 编号。
   ========================================================================== */

/* 页面容器：状态这类数据页需要更宽，1120 而不是 920。 */
.public-theme .page-wide{width:min(1120px,calc(100% - 48px))}

/* 卡片栅格：并排铺满，同高。 */
.public-theme .grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  gap:var(--s-2);margin-top:var(--s-4)}
.public-theme .grid>.wide{grid-column:1/-1}
.public-theme .card{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-3);padding:var(--s-3)}
/* 表单类卡片收窄：表单为了可读性限了行宽，卡片再铺满整屏就会在右边留一大块空白。
   收窄卡片而不是让表单浮在宽卡片里——空白游离在内容外面，看起来像没做完。 */
.public-theme .card.narrow{max-width:46em}
.public-theme .card>h2{font-size:var(--t-md);font-weight:700;color:var(--ink-2);
  margin:0 0 var(--s-2);display:flex;align-items:center;justify-content:space-between;
  gap:var(--s-1);letter-spacing:0}
.public-theme .card>h2 .when{font-size:var(--t-xs);font-weight:500;color:var(--ink-3)}

/* 主指标：数字放大。在线人数用一个最大字号，其余用常规大号。 */
.public-theme .metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s-3) var(--s-4);margin:0}
.public-theme .metrics>div,.public-theme .metrics>dd{min-width:0}
.public-theme .metrics dt{font-size:var(--t-sm);color:var(--ink-3);margin-bottom:2px}
.public-theme .metrics dd{margin:0;font-size:var(--t-xl);font-weight:700;line-height:1.25;
  font-variant-numeric:tabular-nums}
.public-theme .metrics dd small{font-size:var(--t-md);font-weight:400;color:var(--ink-3)}
.public-theme .metrics .hero-num{grid-column:1/-1;font-size:clamp(34px,4vw,46px);
  letter-spacing:-.01em}
.public-theme .metrics .plain{font-size:var(--t-base);font-weight:500}

/* 可用率数字：好/一般/差用颜色区分，但只有数字上色，不整块染色。 */
.public-theme .metrics dd.good{color:var(--ok)}
.public-theme .metrics dd.wait{color:var(--warn)}
.public-theme .metrics dd.bad{color:var(--danger)}

/* 曲线图：手写内联 SVG，24 根细柱 / 一条折线。给一点上下留白，别贴边。 */
.public-theme .chart{display:block;margin:var(--s-2) 0 0;overflow:visible}
.public-theme .chart-empty{font-size:var(--t-md);color:var(--ink-3);margin:var(--s-2) 0 0;
  line-height:var(--lh-body)}

/* ==========================================================================
   表单与页签
   --------------------------------------------------------------------------
   这里原本写了一整套"新"表单样式（两栏行、下划线页签、动作条），用来配合工单页
   的改版。用户看过之后说旧版更好，工单页已回退到旧标记（panel + form-grid），
   所以这一整套都删掉了。

   留下的教训，写给以后改这些页面的人：
     * 表单是线性填写，不是数据展示。两栏会打断"从上往下"的顺序，还会引出
       "这个字段到底在哪一栏"的歧义——需要来回确认的布局就是坏布局。
     * 也别用"把卡片收窄到 46em"来解决右侧留白：那会让卡片和页头标题的比例失调。
       旧版的做法是卡片整宽、字段单列，右侧留白是正常的。
     * 判断"新版不如旧版"之前，先去 static.bak-* / 旧镜像里把旧标记 diff 出来，
       不要凭印象改。这个项目有改版前的备份，问题常常一眼就能看清。

   旧版表单和页签的样式由 site.css / community.css 提供，跟其余旧页面共用，
   本文件不再覆盖它们——覆盖了就会连带改到 sponsorship 等还在用 form-grid 的页面。
   ========================================================================== */

@media(max-width:860px){
  .public-theme .grid{grid-template-columns:1fr}
  .public-theme .page-wide{width:calc(100% - 32px)}
}

/* 一级分组：起一个区。只此一处用字母间距，不画线。 */
.public-theme .sec-1{font-size:var(--t-xs);letter-spacing:.16em;color:var(--ink-3);
  font-weight:600;margin:var(--s-4) 0 var(--s-2)}
/* 二级分组：加粗小字，靠字重和位置分层。 */
.public-theme .sec-2{font-size:var(--t-md);font-weight:700;color:var(--ink);
  margin:var(--s-3) 0 var(--s-1)}

/* 指标：标签固定宽度，值左对齐成一列。 */
.public-theme .facts{display:grid;grid-template-columns:6em minmax(0,1fr);
  gap:var(--s-0) var(--s-2);margin:0}
.public-theme .facts dt{font-size:var(--t-md);color:var(--ink-3)}
.public-theme .facts dd{margin:0;font-size:var(--t-lead);font-weight:600}
.public-theme .facts dd small{font-size:var(--t-md);font-weight:400;color:var(--ink-3)}

/* 比分：一行一项，阵营名在左、数字在右用等宽比较。 */
.public-theme .scores{margin:0;padding:0;list-style:none;max-width:22em}
.public-theme .scores li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:baseline;gap:var(--s-1);padding:var(--s-0) 0}
.public-theme .scores .n{font-weight:700;font-variant-numeric:tabular-nums}
.public-theme .faction-dot{display:inline-block;width:7px;height:7px;border-radius:50%;
  align-self:center;flex:none}

/* 状态清单：一行一项，状态文字放右，不用徽标块。 */
.public-theme .rows{margin:0;padding:0;list-style:none;max-width:34em}
.public-theme .rows li{display:flex;align-items:baseline;justify-content:space-between;
  gap:var(--s-2);padding:var(--s-0) 0;font-size:var(--t-base)}
.public-theme .rows li>span:last-child{font-size:var(--t-md);color:var(--ink-3);white-space:nowrap}
.public-theme .rows li>span:last-child.ok{color:var(--ok)}

/* 说明文字：贴在内容后面，不留死白。 */
.public-theme .stamp{font-size:var(--t-sm);color:var(--ink-3);margin:var(--s-3) 0 0;
  line-height:var(--lh-body)}

/* 表格：中文表头不加字母间距；只有要比较的数值列用等宽，不整体右对齐。 */
.public-theme .index{width:100%;border-collapse:collapse;margin-top:var(--s-2)}
.public-theme .index th{font-size:var(--t-xs);color:var(--ink-3);font-weight:600;
  text-align:left;padding:var(--s-1) var(--s-1) var(--s-1) 0;
  border-bottom:1px solid var(--line);background:none}
.public-theme .index td{padding:var(--s-1) var(--s-1) var(--s-1) 0;
  border-bottom:1px solid var(--line-2);font-size:var(--t-md)}
.public-theme .index tbody tr:hover{background:var(--paper-2)}
.public-theme .index .num{font-variant-numeric:tabular-nums;width:5em}
.public-theme .index .src{color:var(--ink-3);font-size:var(--t-sm);white-space:nowrap}

/* 做法清单：用做法当小标题，不用 01/02/03。 */
.public-theme .hows{margin:0;padding:0;list-style:none}
.public-theme .hows li{padding:0 0 var(--s-2)}
.public-theme .hows b{font-size:var(--t-base)}
.public-theme .hows p{margin:var(--s-0) 0 0;font-size:var(--t-md);color:var(--ink-3);
  line-height:var(--lh-body)}

/* 名单：一行一人，动作是文字链接而不是按钮块。 */
.public-theme .roster{margin:0;padding:0;list-style:none}
.public-theme .roster li{display:flex;align-items:baseline;justify-content:space-between;
  gap:var(--s-1);padding:var(--s-1) 0;border-bottom:1px solid var(--line-2)}
.public-theme .roster li:last-child{border-bottom:0}
.public-theme .roster .who{font-size:var(--t-md)}
.public-theme .roster .who small{color:var(--ink-3);margin-left:var(--s-0)}
.public-theme .roster .pick{font-size:var(--t-sm);color:var(--accent);font-weight:600;
  background:none;border:0;cursor:pointer;padding:0;flex:none}
.public-theme .roster .pick:hover{text-decoration:underline}

/* 工作区选择：一行一个，细线分隔。悬停只换极浅底色。 */
.public-theme .areas{margin:0;padding:0;list-style:none}
.public-theme .area{border-bottom:1px solid var(--line)}
.public-theme .area button{display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:var(--s-2);align-items:baseline;width:100%;text-align:left;padding:var(--s-3) 0;
  background:none;border:0;color:inherit;font:inherit;cursor:pointer;transition:background .15s}
.public-theme .area button:hover{background:var(--paper-2)}
.public-theme .area button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.public-theme .area .title{font-size:var(--t-lg);font-weight:700;display:block}
.public-theme .area .desc{font-size:var(--t-md);color:var(--ink-3);
  line-height:var(--lh-body);margin:var(--s-0) 0 0;max-width:40em}
.public-theme .area .meta{font-size:var(--t-sm);color:var(--ink-2);margin:var(--s-1) 0 0}
.public-theme .area .meta b{font-weight:600;color:var(--ink)}
.public-theme .area .go{font-size:var(--t-md);font-weight:600;color:var(--accent);
  white-space:nowrap}

/* .form-rows（标签在左、字段在右的横排表单）随状态页早期版本一起废弃了：
   没有任何页面再用这个类名，样式留着只会让人以为它还有用。 */

@media(max-width:760px){
  .public-theme .facts{grid-template-columns:5em minmax(0,1fr)}
  .public-theme .area button{grid-template-columns:1fr}
}
.public-theme h2{font-weight:700}
.public-theme .lead{color:var(--muted);font-size:17px;line-height:1.8}
.public-theme .eyebrow{color:var(--muted-2);letter-spacing:.16em;font-size:12px}

/* 面板：原来是 linear-gradient + backdrop-filter:blur(16px) + 四层阴影。
   现在是一块纯白 + 一条描边。 */
.public-theme .panel,.public-theme .guide-tile,.public-theme .guide-intro,
.public-theme .wiki-card,.public-theme .announcement-panel{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:none;
}
.public-theme .panel{padding:var(--s-3,24px)}
.public-theme .badge{background:var(--panel2);border:1px solid var(--line);color:var(--muted)}
.public-theme .badge.good{background:#eaf5ee;border-color:#c2ddcb;color:#1f5c34}
.public-theme .badge.wait{background:#fdf4e3;border-color:#e8d5aa;color:#6b4c12}
.public-theme .button{
  background:var(--btn-bg);border:1px solid var(--btn-bg);color:var(--btn-fg);
  border-radius:10px;box-shadow:none;
}
.public-theme .button:hover{background:var(--btn-bg-hover);border-color:var(--btn-bg-hover);color:#fff}
.public-theme .button.secondary{background:var(--panel);color:var(--btn-ghost-fg);border-color:var(--btn-ghost-line)}
.public-theme .button.secondary:hover{background:var(--btn-ghost-bg-hover);color:var(--text)}
.public-theme input,.public-theme select,.public-theme textarea{
  background:var(--paper);border:1px solid var(--line);color:var(--ink);border-radius:var(--r-2)}
.public-theme input::placeholder,.public-theme textarea::placeholder{color:var(--muted-2)}
.public-theme :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.public-theme input[type=checkbox]{accent-color:var(--accent)}
.public-theme .field small,.public-theme .optional{color:var(--muted-2)}
.public-theme .notice,.public-theme .receipt,.public-theme .ticket-message,
.public-theme .wiki-evidence-notice{background:var(--panel2);border-color:var(--line);color:var(--text)}
.public-theme .receipt{overflow-wrap:anywhere}
.public-theme .error-box{background:#fdf0ef;color:#8c2b26;border-color:#e7b8b4}
.public-theme .empty-symbol{color:var(--muted-2)}
.public-theme .report-switch{border-color:var(--line)}
.public-theme .report-switch a.active{color:var(--text);border-color:var(--text);background:var(--panel2)}
.public-theme .report-callout{background:var(--panel2);border-color:var(--line);color:var(--text)}
.public-theme .report-callout p,.public-theme .report-callout .eyebrow{color:var(--muted)}
.public-theme .report-callout .button{background:var(--btn-bg);color:var(--btn-fg)}
.public-theme th,.public-theme .wiki-catalog-table thead
  {background:var(--panel2);color:var(--muted)}
/* 后台左侧导航的选中项：旧主题是深褐底配金色字（site.css #2b3623 / community.css
   #382e1e，加 var(--accent) 文字），在浅色界面里像另一套主题。
   改成"极浅蓝底 + 蓝字 + 一条左侧指示条"，跟全站选中态一致，也不靠高饱和底色。 */
.public-theme .side-nav button.active{background:var(--paper-2);color:var(--accent);
  font-weight:650;box-shadow:inset 3px 0 0 var(--accent)}
.public-theme .side-nav button:hover{background:var(--paper-2)}
.public-theme .side-label{color:var(--ink-3)}
.public-theme .notice{color:var(--ink)}

/* ==========================================================================
   旧深色主题的最后一批遗留色
   --------------------------------------------------------------------------
   下面这些类在旧样式表里写死了深色底（或浅色字），浅色主题下要么是一块突兀的
   深色，要么是看不见的浅字。之前是发现一处补一处，补不干净；这里一次收口。
   只列"确实还会渲染出来"的类，僵尸类（旧首页的 home-hero / hero-art 等）不动。
   ========================================================================== */

/* 后台：跳转到服务器管理台的那一条，以及机器人卡片。 */
.public-theme .side-nav .server-admin-entry{background:var(--paper-2);color:var(--accent);
  font-weight:650}
.public-theme .bot-card:hover,.public-theme .bot-card.active{background:var(--paper-2);
  border-color:var(--accent)}

/* 工单内部留言与已处理标记：旧版是深褐底配浅字。 */
.public-theme .internal-message{border-color:var(--warn-line);background:var(--warn-bg);
  color:var(--ink)}
.public-theme .chip-done{background:var(--ok-bg);color:var(--ok);
  border-color:var(--ok-line)}

/* 小徽标：旧版是暗红底配浅红字。 */
.public-theme .badge-mini.danger{border-color:var(--danger-line);color:var(--danger)}

/* 身份组卡片与不可用状态。 */
.public-theme .roles-card{border-color:var(--line);background:var(--paper)}
.public-theme .role-edit{background:var(--paper-2)}
.public-theme .role-unavailable{background:var(--paper-2)}
.public-theme .role-unavailable strong{color:var(--ink-2)}
.public-theme .roles-error{color:var(--danger)!important}

/* wiki 与攻略：只改文字与表头，图例色块（g-fill-*）和节点视觉是刻意的，
   保持原样。 */
.public-theme .wiki-table thead{background:var(--paper-2);color:var(--ink-2)}
.public-theme .wiki-status,.public-theme .wiki-source-note{color:var(--ink-3)}
.public-theme .wiki-catalog-controls label{color:var(--ink-2)}
.public-theme .wiki-branch-number{color:var(--ink-3)}
.public-theme .wiki-node-visual{color:var(--ink-2);background:none}
/* 聚焦光环原来用旧调色板的金色（#edc17533），改成强调色。 */
.public-theme .wiki-tree-node:focus-within{border-color:var(--accent);
  box-shadow:0 0 0 2px var(--accent-bg-weak)}
.public-theme td{border-color:var(--line)}
.public-theme .wiki-tree-board{background:var(--panel2)}
.public-theme .wiki-tree-node{background:#fff;border-color:var(--line);color:var(--text)}
.public-theme .wiki-node-bottom{background:var(--panel2);color:var(--muted)}
.public-theme .wiki-tree-placeholder{background:var(--panel2);border-color:var(--line);color:var(--muted-2)}
.public-theme .wiki-catalog-controls select{background:var(--paper);color:var(--ink)}
.public-theme .wiki-evidence-badge,.public-theme .wiki-param-evidence summary{color:var(--orange)}
.public-theme .wiki-atlas-tabs button.active{background:var(--panel2);color:var(--text)}
.public-theme .wiki-tree-node:hover,.public-theme .guide-tile:hover{background:#fff;border-color:var(--muted-2)}
.public-theme .guide-map-scroll{background:var(--panel2)}
.public-theme .guide-open{color:var(--text)}
.public-theme .guide-home-link{background:var(--panel2);border-color:var(--line)}
.public-theme dialog{background:#fff;border-color:var(--line);color:var(--text);border-radius:var(--radius)}
.public-theme dialog::backdrop{background:#28283b77}
.public-theme #toast{background:var(--btn-bg);color:var(--btn-fg)}
.public-theme #toast.error{background:#fdeceb;color:#8c2b26}
/* 页脚：小字不能用最浅的那档灰。
   --ink-3（#6b6f78）在白底上是 4.83:1，数字上过关，但 12px 的字配这个对比度在真实
   屏幕上看就是一片灰糊——小字要比大字号更高的对比度才好读，所以用 --ink-2（10.4:1）。
   分隔点原本用 var(--line)（描边色，约 1.3:1）几乎看不见，一并改掉。 */
.public-theme footer{padding:var(--s-3,24px) 0 var(--s-4,40px);border-color:var(--line);
  color:var(--ink-2);font-size:13px}
.public-theme .footer-dot{color:var(--ink-3)}
/* 管理登录页没有 public-theme 类（它不属于公开页），那里命中的是 site.css /
   community.css 的裸 footer 规则，值同样是旧深色主题留下的（#4e6147 / #a29b8d）。
   site.css、community.css 里的那几处已经改成令牌，这里不再重复覆盖。 */

/* 状态页 */
.public-theme .status-live{padding:var(--s-3,24px)}
.public-theme .status-live-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2,16px)}
.public-theme .status-live h2{font-size:26px;margin:var(--s-half,12px) 0 0}
.public-theme .status-metrics{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:var(--s-2,16px);margin:var(--s-3,24px) 0}
.public-theme .status-metrics>div{padding:var(--s-3,24px);background:var(--panel2);
  border:1px solid var(--line);border-radius:10px;min-width:0}
.public-theme .status-metrics span{display:block;color:var(--muted-2);font-size:13px;margin-bottom:var(--s-half,12px)}
.public-theme .status-metrics strong{display:block;font-size:clamp(24px,2.3vw,34px);line-height:1.2;
  font-weight:700;overflow-wrap:anywhere}
.public-theme .status-metrics small{font-size:18px;color:var(--muted-2);font-weight:400}
.public-theme .status-scores{border-top:1px solid var(--line);padding-top:var(--s-3,24px)}
.public-theme .status-section-title{display:flex;justify-content:space-between;gap:var(--s-half,12px);
  align-items:center;margin-bottom:var(--s-2,16px)}
.public-theme .status-section-title h3{margin:0;font-size:16px}
.public-theme .status-section-title>span{font-size:12px;color:var(--muted-2)}
.public-theme .status-score-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-2,16px)}
.public-theme .status-score{display:flex;justify-content:space-between;align-items:center;
  gap:var(--s-half,12px);padding:var(--s-2,16px) var(--s-3,24px);border:1px solid var(--line);
  border-radius:10px;background:#fff;min-width:0}
.public-theme .status-score>span{font-size:14px;overflow-wrap:anywhere}
.public-theme .status-score strong{font-size:26px;font-weight:700}
.public-theme .faction-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:10px}
.public-theme .faction-0{background:#2d85b0}
.public-theme .faction-1{background:#c65346}
.public-theme .faction-2{background:#2c905d}
.public-theme .status-timestamp{font-size:12px;color:var(--muted-2);margin:var(--s-3,24px) 0 0}
.public-theme .status-services{display:grid;grid-template-columns:1.25fr 1fr;gap:var(--s-3,24px);margin-top:var(--s-3,24px)}
.public-theme .status-services h2{font-size:20px;margin:var(--s-half,12px) 0}
.public-theme .status-services .status-row{padding:var(--s-2,16px) 0}
.public-theme .status-row:last-child{border-bottom:0}
.public-theme .status-about p{font-size:14px;color:var(--muted)}
.public-theme .status-about .button{margin-top:var(--s-half,12px)}

@media(max-width:1100px){
  .public-theme .topbar nav{order:3;flex-basis:100%;justify-content:flex-start;gap:12px 22px}
  .public-theme .admin-link{margin-left:auto}
  .public-theme .status-metrics{gap:12px}
  .public-theme .status-score{padding:16px 12px}
  .public-theme .status-services{grid-template-columns:1fr}
}
@media(max-width:640px){
  .public-theme .topbar,.public-theme main,.public-theme footer{width:calc(100% - 32px)}
  .public-theme .topbar{padding:16px 0;gap:12px}
  .public-theme .topbar nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px 8px;border:0;padding:0}
  .public-theme .topbar nav a{font-size:12px;padding:8px 0;min-height:40px;line-height:1.6}
  .public-theme .brand{font-size:19px}
  .public-theme .brand-avatar{width:32px;height:32px}
  .public-theme main{padding:24px 0 40px}
  .public-theme .page-head{margin-bottom:20px}
  .public-theme .lead{font-size:15px}
  .public-theme .panel,.public-theme .status-live{padding:20px 16px;border-radius:10px}
  .public-theme .status-live h2{font-size:22px}
  .public-theme .status-live-head{gap:10px}
  .public-theme .status-metrics{grid-template-columns:1fr;margin:20px 0;gap:10px}
  .public-theme .status-metrics>div{padding:16px;display:flex;justify-content:space-between;
    align-items:center;gap:14px}
  .public-theme .status-metrics span{margin:0;flex-shrink:0}
  .public-theme .status-metrics strong{font-size:24px;text-align:right}
  .public-theme .status-metrics small{font-size:14px}
  .public-theme .status-score-grid{grid-template-columns:1fr;gap:9px}
  .public-theme .status-score{padding:12px 14px}
  .public-theme .status-section-title{flex-wrap:wrap;gap:4px}
  .public-theme .status-section-title>span{font-size:11px}
  .public-theme .status-timestamp{line-height:1.8}
  .public-theme .status-services{gap:16px;margin-top:16px}
  .public-theme .guide-tabs input{min-width:0;width:100%}
  .public-theme footer{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  .public-theme *{transition:none!important}
}
