/* 司库 · 松针绿 × 琥珀金。变量与用法见 rules.md 第 3 节：金色只给身份、钥匙、选中和 ✦；语义色来自其余图卡。 */
:root{
  --paper:#F2ECE1;--paper-2:#E9E1D2;--panel:rgba(255,252,246,.62);--panel-solid:#FBF8F2;
  --ink:#1C2621;--ink-2:#4A5650;--ink-3:#626C66;--line:rgba(54,91,76,.14);--line-2:rgba(54,91,76,.26);
  --primary:#365B4C;--primary-2:#2A4A3D;--on-primary:#FFFDF8;--primary-text:#365B4C;
  --gold:#D9A441;--gold-ink:#86600F;--gold-soft:rgba(217,164,65,.17);--focus:#B8862A;
  --shadow:0 26px 56px -30px rgba(34,48,40,.45);--shadow-sm:0 12px 28px -22px rgba(34,48,40,.5);
  --glow:rgba(255,230,186,.75);--leaf:#2F3E33;--leaf-op:.085;
  --ok:#1F7668;--ok-dot:#3FA796;--warn:#86660F;--warn-dot:#E0B94E;--crit:#A63D52;--crit-dot:#B5485D;--info:#4A5F8C;--info-dot:#4A5F8C;--idle-dot:#A3AAA5;
  --ok-soft:rgba(63,167,150,.13);--warn-soft:rgba(224,185,78,.18);--crit-soft:rgba(181,72,93,.1);--info-soft:rgba(74,95,140,.09);
  --field:#FFFDF9;--code-bg:#F6F1E6;
  --serif:"Noto Serif SC","Source Han Serif SC","Source Han Serif CN","Noto Serif CJK SC","Songti SC","STSong","SimSun",serif;
  --sans:"HarmonyOS Sans SC","MiSans","PingFang SC","Microsoft YaHei UI","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC",system-ui,sans-serif;
  --mono:"JetBrains Mono","Cascadia Mono","SF Mono",Consolas,"Liberation Mono","Noto Sans Mono CJK SC",monospace;
  --ease:cubic-bezier(.2,.7,.2,1);--r-lg:22px;
  color-scheme:light;
}
html[data-mode=night]{
  --paper:#101815;--paper-2:#0B110F;--panel:rgba(27,38,33,.62);--panel-solid:#17211D;
  --ink:#ECE4D2;--ink-2:#BFB8A6;--ink-3:#979181;--line:rgba(236,228,210,.1);--line-2:rgba(236,228,210,.2);
  --primary:#D9A441;--primary-2:#E6B95E;--on-primary:#1B1407;--primary-text:#E0B04F;
  --gold:#E0B04F;--gold-ink:#E3B65A;--gold-soft:rgba(224,176,79,.14);--focus:#E0B04F;
  --shadow:0 30px 70px -30px rgba(0,0,0,.72);--shadow-sm:0 14px 30px -22px rgba(0,0,0,.75);
  --glow:rgba(217,164,65,.1);--leaf:#EADFC4;--leaf-op:.04;
  --ok:#6CC7B5;--ok-dot:#57B8A6;--warn:#E9CB74;--warn-dot:#E7C86A;--crit:#EC8C9E;--crit-dot:#D86C84;--info:#A2B3E0;--info-dot:#8FA3D6;--idle-dot:#5E665F;
  --ok-soft:rgba(87,184,166,.13);--warn-soft:rgba(231,200,106,.13);--crit-soft:rgba(216,108,132,.13);--info-soft:rgba(143,163,214,.12);
  --field:#131C18;--code-bg:#0D1512;color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--paper)}
body{margin:0;min-height:100dvh;background:var(--paper);color:var(--ink);font:14.5px/1.62 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
button:disabled{cursor:not-allowed}
img,svg{display:block}
h1,h2,h3,p,dl,dd{margin:0}
h1,h2,h3{font-weight:600}
ul,ol{margin:0;padding:0;list-style:none}
code,.mono{font-family:var(--mono);font-size:.92em}
code{padding:.05em .4em;border-radius:6px;background:var(--code-bg);border:1px solid var(--line);word-break:break-all}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:8px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ic{width:18px;height:18px;flex:none}

.atmos{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.atmos .glow{position:absolute;right:-20vmax;top:-24vmax;width:72vmax;height:72vmax;border-radius:50%;background:radial-gradient(circle,var(--glow),transparent 62%)}
.atmos .leaves{position:absolute;left:-40px;top:-36px;width:min(760px,72vw);height:auto;color:var(--leaf);opacity:var(--leaf-op);filter:blur(7px)}
.atmos .grain{position:absolute;inset:0;opacity:.3;mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .1 0 0 0 0 .13 0 0 0 0 .11 0 0 0 .5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
html[data-mode=night] .atmos .grain{mix-blend-mode:screen;opacity:.1}

/* 外壳 */
.shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100dvh}
.side{position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;padding:22px 14px 16px;border-right:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--panel-solid) 55%,transparent),transparent 70%)}
.brand{display:flex;align-items:center;gap:10px;padding:2px 10px 24px}
.mark{width:34px;height:34px}
.mark-night,html[data-mode=night] .mark-day{display:none}
html[data-mode=night] .mark-night{display:block}
.brand-word{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:.16em}
.nav{display:flex;flex-direction:column;gap:3px}
.nav a{position:relative;display:flex;align-items:center;gap:12px;height:42px;padding:0 12px;border-radius:12px;color:var(--ink-2);font-size:15px;transition:background .18s,color .18s}
.nav a:hover{background:color-mix(in srgb,var(--panel-solid) 70%,transparent);color:var(--ink)}
.nav a[aria-current=page]{background:var(--panel-solid);color:var(--ink);font-weight:600;box-shadow:0 0 0 1px var(--line),var(--shadow-sm)}
.nav a[aria-current=page]::after{content:"✦";position:absolute;right:13px;color:var(--gold);font-size:11px}
.nav .ic{width:20px;height:20px}
.side-foot{margin-top:auto;display:flex;align-items:center;gap:4px;padding-top:14px;border-top:1px solid var(--line)}
.me{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:6px;border-radius:12px}
.me:hover{background:color-mix(in srgb,var(--panel-solid) 70%,transparent)}
.me b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me small{display:block;color:var(--ink-3);font-size:12px}
.avatar{flex:none;display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--primary);color:var(--on-primary);font-family:var(--serif);font-weight:600;font-size:15px}
.avatar.sm{width:28px;height:28px;font-size:12.5px}
.avatar.lg{width:54px;height:54px;font-size:23px}
.avatar.muted{background:var(--paper-2);color:var(--ink-3);box-shadow:inset 0 0 0 1px var(--line-2)}
.icon-btn{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;color:var(--ink-2);flex:none}
.icon-btn:hover{background:color-mix(in srgb,var(--panel-solid) 70%,transparent);color:var(--ink)}
.topbar,.tabbar{display:none}
.main{min-width:0;padding:34px clamp(20px,3.4vw,48px) 76px;outline:none}
.main>*{max-width:1180px;margin-left:auto;margin-right:auto}
@media (max-width:860px){
  .shell{grid-template-columns:1fr;grid-template-rows:auto 1fr;align-content:start}
  .side{display:none}
  .topbar{display:flex;position:sticky;top:0;z-index:30;align-items:center;justify-content:space-between;min-height:56px;padding:env(safe-area-inset-top) 14px 0;background:color-mix(in srgb,var(--paper) 86%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .topbar .brand{padding:0}.topbar .mark{width:28px;height:28px}.topbar .brand-word{font-size:18px}
  .tabbar{display:flex;position:fixed;inset:auto 0 0;z-index:30;padding:6px 6px calc(6px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--panel-solid) 93%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line)}
  .tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0 4px;border-radius:10px;font-size:11.5px;color:var(--ink-3)}
  .tabbar a[aria-current=page]{color:var(--primary-text);font-weight:600}
  .tabbar .ic{width:22px;height:22px}
  .main{padding:18px 16px 100px}
}

/* 页面头 */
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-bottom:22px}
.title{font-family:var(--serif);font-size:clamp(26px,2.5vw,33px);line-height:1.25;letter-spacing:.04em;outline:none}
.title .sub{font-family:var(--mono);font-size:14px;font-weight:400;color:var(--ink-3);letter-spacing:0;margin-left:10px}
.lede{margin-top:8px;max-width:50em;color:var(--ink-2)}
.head-actions{display:flex;gap:10px;flex-wrap:wrap}
.back{display:inline-flex;align-items:center;gap:2px;margin-bottom:12px;color:var(--ink-3);font-size:13.5px}
.back:hover{color:var(--ink)}
.back .ic{width:16px;height:16px}
.app-title{display:flex;align-items:center;gap:14px}
.app-title .swatch-lg{width:40px;height:50px;border-radius:10px;background:linear-gradient(158deg,color-mix(in oklab,var(--c) 84%,white),var(--c) 56%,color-mix(in oklab,var(--c) 86%,black));box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 12px 22px -16px var(--c)}

/* 按钮 */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:12px;font-size:14.5px;font-weight:500;white-space:nowrap;border:1px solid transparent;transition:background .18s,border-color .18s,color .18s,transform .12s}
.btn:active:not(:disabled){transform:translateY(1px)}
.btn.primary{background:var(--primary);color:var(--on-primary)}
.btn.primary:hover:not(:disabled){background:var(--primary-2)}
.btn.ghost{background:var(--panel-solid);border-color:var(--line-2)}
.btn.ghost:hover:not(:disabled){border-color:color-mix(in srgb,var(--primary) 50%,var(--line-2))}
.btn.quiet{color:var(--primary-text);padding:0 10px}
.btn.quiet:hover:not(:disabled){background:var(--gold-soft)}
.btn.danger{background:var(--crit-dot);color:#FFFDF8}
.btn.danger-ghost{border-color:color-mix(in srgb,var(--crit-dot) 45%,transparent);color:var(--crit)}
.btn.danger-ghost:hover:not(:disabled){background:var(--crit-soft)}
.btn.sm{height:34px;padding:0 12px;font-size:13.5px;border-radius:10px}
.btn.block{width:100%}
.btn:disabled{opacity:.48}
.btn[aria-busy=true]{color:transparent!important}
.btn[aria-busy=true]::after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;border:2px solid var(--ink-3);border-top-color:transparent;animation:spin .8s linear infinite}
.btn.primary[aria-busy=true]::after{border-color:var(--on-primary);border-top-color:transparent}
.link-btn{color:var(--primary-text);text-decoration:underline;text-underline-offset:3px}
.btn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}

/* 面板、表格、状态 */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 22px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow-sm)}
.panel.flush{padding:0;overflow:hidden}
.stack>*+*{margin-top:18px}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.panel-head h2,.block-head h2{font-family:var(--serif);font-size:18.5px;letter-spacing:.03em}
.panel.flush .panel-head{padding:18px 20px 0}
.count{color:var(--ink-3);font-size:13px}
.block-head{display:flex;align-items:baseline;gap:10px;margin:30px 0 14px}
.grid-2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:1080px){.grid-2{grid-template-columns:1fr}}
.hint{margin-top:8px;color:var(--ink-3);font-size:13px}
.muted{color:var(--ink-3)}
.small{font-size:12.5px}
.r{text-align:right}
.empty{padding:26px 20px;color:var(--ink-3);text-align:center}
.notice{padding:10px 14px;border-radius:12px;background:var(--info-soft);color:var(--ink-2);font-size:13.5px;margin-bottom:14px}
.notice.warn{background:var(--warn-soft)}
.notice.crit{background:var(--crit-soft);color:var(--crit)}
.state{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;white-space:nowrap;color:var(--ink-2)}
.state::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--dot,var(--idle-dot));flex:none}
.state.ok{--dot:var(--ok-dot);color:var(--ok)}
.state.warn{--dot:var(--warn-dot);color:var(--warn)}
.state.crit{--dot:var(--crit-dot);color:var(--crit)}
.state.info{--dot:var(--info-dot);color:var(--info)}
.state.idle{color:var(--ink-3)}
.state.off{color:var(--ink-3)}
.state.off::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--idle-dot)}
.tag{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:7px;font-size:12px;color:var(--ink-2);border:1px solid var(--line-2);white-space:nowrap}
.tag.gold{color:var(--gold-ink);border-color:color-mix(in srgb,var(--gold) 55%,transparent);background:var(--gold-soft)}
.chip{display:inline-block;flex:none;width:12px;height:16px;border-radius:4px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.07)}
html[data-mode=night] .chip,html[data-mode=night] .tile,html[data-mode=night] .swatch,html[data-mode=night] .swatch-lg{filter:brightness(.9) saturate(.94)}
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th{padding:13px 16px;text-align:left;font-weight:500;font-size:12.5px;color:var(--ink-3);border-bottom:1px solid var(--line);white-space:nowrap}
.table td{padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
.table tr:last-child td{border-bottom:0}
.table tr.link{cursor:pointer}
.table tr.link:hover td{background:color-mix(in srgb,var(--panel-solid) 65%,transparent)}
.app-cell{display:flex;align-items:center;gap:12px;min-width:180px}
.app-cell b{display:block;font-weight:600}
.app-cell small{display:block;color:var(--ink-3);font-size:12px;font-family:var(--mono)}
@media (max-width:860px){
  .apps-table thead{display:none}
  .apps-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:14px 16px;border-bottom:1px solid var(--line)}
  .apps-table tr:last-child{border-bottom:0}
  .apps-table td{padding:0;border:0;font-size:13px}
  .apps-table td:nth-child(1){grid-column:1/-1;margin-bottom:4px}
  .apps-table td:nth-child(2),.apps-table td:nth-child(3){grid-column:1;color:var(--ink-2)}
  .apps-table td:nth-child(4){grid-column:2;grid-row:2;text-align:right}
  .apps-table td:nth-child(5){grid-column:2;grid-row:3}
}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.pill{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:99px;border:1px solid var(--line-2);color:var(--ink-2);font-size:13.5px;background:color-mix(in srgb,var(--panel-solid) 55%,transparent)}
.pill span{color:var(--ink-3);font-size:12px}
.pill.on{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.pill.on span{color:inherit;opacity:.78}
.tabs{display:flex;gap:4px;padding:4px;border-radius:14px;background:color-mix(in srgb,var(--paper-2) 72%,transparent);border:1px solid var(--line);width:max-content;max-width:100%;overflow-x:auto;margin-bottom:18px}
.tabs a{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 15px;border-radius:10px;color:var(--ink-2);font-size:14px;white-space:nowrap}
.tabs a[aria-current=page]{background:var(--panel-solid);color:var(--ink);font-weight:600;box-shadow:var(--shadow-sm)}
.tabs .badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--crit-dot);color:#FFFDF8;font-size:11px;font-weight:600}

/* 启动台 */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.tile{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:150px;padding:18px 18px 14px;border-radius:var(--r-lg);text-align:left;color:var(--fg);background:linear-gradient(158deg,color-mix(in oklab,var(--c) 84%,white) 0%,var(--c) 56%,color-mix(in oklab,var(--c) 86%,black) 100%);box-shadow:0 22px 40px -28px color-mix(in srgb,var(--c) 75%,black),inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.14);transition:transform .22s var(--ease),box-shadow .22s var(--ease)}
.tile::before{content:"";position:absolute;right:-24%;top:-46%;width:74%;height:96%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.28),transparent);z-index:-1}
.tile:hover{transform:translateY(-3px)}
.tile-name{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:.06em;line-height:1.3}
.tile-desc{font-size:13px;opacity:.88;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tile-foot{margin-top:auto;width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;font:12px var(--mono);opacity:.8}
.tile-foot .ic{width:15px;height:15px}
.tile-flag{position:absolute;top:12px;right:12px;padding:1px 8px;border-radius:7px;font-size:11.5px;background:rgba(255,253,248,.86);color:#4A5650}
.tile-group{margin:22px 0 10px;color:var(--ink-3);font-size:13px;letter-spacing:.08em}
.tile-group:first-child{margin-top:0}
.todo-list{display:flex;flex-direction:column}
.todo-item{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line)}
.todo-item:first-child{border-top:0}
.todo-item .dot,.alert-row .dot{width:9px;height:9px;border-radius:50%;background:var(--d)}
.tone-crit{--d:var(--crit-dot)}.tone-warn{--d:var(--warn-dot)}.tone-info{--d:var(--info-dot)}
.todo-text b{display:block;font-weight:600}
.todo-text small{display:block;color:var(--ink-3);font-size:12.5px;margin-top:1px}
.more summary{cursor:pointer;padding:10px 0 2px;color:var(--primary-text);font-size:13.5px;list-style:none}
.more summary::-webkit-details-marker{display:none}
.calm{display:flex;align-items:center;gap:10px;color:var(--ink-2)}
.star{color:var(--gold)}

/* 上线清单 */
.steps{display:flex;flex-direction:column}
.step{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;padding-bottom:24px}
.step:last-child{padding-bottom:0}
.step::before{content:"";position:absolute;left:16.5px;top:38px;bottom:4px;width:1px;background:var(--line-2)}
.step:last-child::before{display:none}
.step-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-weight:600;font-size:14px;border:1.5px solid var(--line-2);color:var(--ink-3);background:var(--panel-solid)}
.step.done .step-mark{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.step.current .step-mark{border-color:var(--gold);color:var(--gold-ink);box-shadow:0 0 0 4px var(--gold-soft)}
.step.fail .step-mark{border-color:var(--crit-dot);color:var(--crit);background:var(--crit-soft)}
.step.skip .step-mark{border-style:dashed}
.step-title{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-height:34px}
.step-title h3{font-family:var(--serif);font-size:17.5px}
.step-body{margin-top:6px;color:var(--ink-2)}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 16px;margin:10px 0;font-size:13.5px}
.kv dt{color:var(--ink-3);white-space:nowrap}
.kv dd{word-break:break-all}
.checks{display:flex;flex-direction:column;gap:9px;margin:10px 0}
.checks li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:9px;align-items:start}
.checks .mk{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px;font-weight:700}
.checks .ok .mk{background:var(--ok-soft);color:var(--ok)}
.checks .warn .mk{background:var(--warn-soft);color:var(--warn)}
.checks .fail .mk{background:var(--crit-soft);color:var(--crit)}
.checks b{font-weight:600;font-size:14px;color:var(--ink)}
.checks small{display:block;color:var(--ink-3);font-size:12.5px}
.seg{display:inline-flex;gap:4px;padding:4px;border-radius:13px;background:color-mix(in srgb,var(--paper-2) 72%,transparent);border:1px solid var(--line);flex-wrap:wrap}
.seg button{height:34px;padding:0 14px;border-radius:9px;color:var(--ink-2);font-size:14px}
.seg button[aria-checked=true]{background:var(--panel-solid);color:var(--ink);font-weight:600;box-shadow:var(--shadow-sm),inset 0 0 0 1px color-mix(in srgb,var(--gold) 60%,transparent)}
.seg button:disabled{opacity:.42}
.who{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;align-items:center}
.person-chip{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px 0 3px;border-radius:99px;background:var(--panel-solid);border:1px solid var(--line);font-size:13.5px}
.danger-zone{display:flex;flex-direction:column;gap:14px}
.danger-zone p{color:var(--ink-3);font-size:13px;margin-top:4px}

/* 表单 */
.form{display:flex;flex-direction:column;gap:15px}
.field{display:flex;flex-direction:column;gap:6px;border:0;padding:0;margin:0;min-width:0}
.field>span,.field>legend{font-size:13.5px;font-weight:600;color:var(--ink-2);padding:0}
.field small{color:var(--ink-3);font-size:12.5px}
.field input,.field select,.field textarea{width:100%;height:42px;padding:0 13px;border-radius:12px;border:1px solid var(--line-2);background:var(--field);transition:border-color .15s,box-shadow .15s}
.field textarea{height:auto;min-height:86px;padding:10px 13px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px var(--gold-soft)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.field-row{grid-template-columns:1fr}}
.form-error{padding:10px 12px;border-radius:11px;background:var(--crit-soft);color:var(--crit);font-size:13.5px}
.choice-cards{display:grid;gap:8px}
.choice{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;padding:12px 14px;border-radius:14px;border:1px solid var(--line-2);background:var(--field);cursor:pointer}
.choice:has(input:checked){border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft)}
.choice input{margin:4px 0 0;accent-color:var(--primary)}
.choice b{display:block;font-size:14.5px}
.choice small{display:block;color:var(--ink-3);font-size:12.5px;margin-top:2px}
.choice.off{opacity:.5;cursor:not-allowed}
.swatches{display:flex;flex-wrap:wrap;gap:10px}
.swatch{position:relative;width:38px;height:46px;border-radius:9px;background:linear-gradient(158deg,color-mix(in oklab,var(--c) 84%,white),var(--c) 56%,color-mix(in oklab,var(--c) 86%,black));cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.swatch input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0}
.swatch:has(input:checked){box-shadow:0 0 0 2px var(--paper),0 0 0 4px var(--gold)}
.swatch:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:5px}
.check-line{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}
.check-line input{width:18px;height:18px;accent-color:var(--primary);flex:none}
.check-list{display:flex;flex-direction:column;gap:2px}
.check-list label{display:grid;grid-template-columns:18px auto minmax(0,1fr);gap:10px;align-items:center;padding:8px 4px;border-radius:10px;cursor:pointer}
.check-list label:hover{background:color-mix(in srgb,var(--panel-solid) 60%,transparent)}
.check-list input{width:17px;height:17px;accent-color:var(--primary)}
.check-list small{display:block;color:var(--ink-3);font-size:12px}
details.adv{border:1px dashed var(--line-2);border-radius:12px;padding:10px 14px}
details.adv summary{cursor:pointer;color:var(--ink-2);font-size:13.5px}
details.adv[open] summary{margin-bottom:12px}
details.adv .field+.field{margin-top:10px}

/* 抽屉、代码、提示 */
.sheet-layer{position:fixed;inset:0;z-index:100;display:flex;justify-content:flex-end}
.sheet-backdrop{position:absolute;inset:0;background:rgba(16,24,21,.34);opacity:0;transition:opacity .22s}
.sheet{position:relative;width:min(540px,100%);height:100%;display:flex;flex-direction:column;background:var(--paper);border-left:1px solid var(--line);box-shadow:var(--shadow);transform:translateX(26px);opacity:0;transition:transform .26s var(--ease),opacity .22s}
.sheet.wide{width:min(720px,100%)}
.sheet-layer.on .sheet-backdrop{opacity:1}
.sheet-layer.on .sheet{transform:none;opacity:1}
.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 14px 24px;border-bottom:1px solid var(--line)}
.sheet-head h2{font-family:var(--serif);font-size:20px;letter-spacing:.03em}
.sheet-body{flex:1;overflow-y:auto;padding:20px 24px 30px}
.sheet-lede{color:var(--ink-2);margin-bottom:16px}
.sheet-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.sheet.shake{animation:shake .3s}
.s-block{padding:16px 0;border-top:1px solid var(--line)}
.s-block h3{margin-bottom:10px;font-family:var(--serif);font-size:16px}
.plain{display:flex;flex-direction:column;gap:6px;margin:8px 0 14px;padding-left:1.3em;color:var(--ink-2)}
ul.plain{list-style:disc}
ol.plain{list-style:decimal}
@media (max-width:860px){
  .sheet-layer{align-items:flex-end}
  .sheet,.sheet.wide{width:100%;height:auto;max-height:92dvh;border-left:0;border-radius:22px 22px 0 0;transform:translateY(30px)}
  .sheet-body{padding-bottom:calc(30px + env(safe-area-inset-bottom))}
}
.code{position:relative;margin:12px 0;border-radius:14px;border:1px solid var(--line-2);background:var(--code-bg);overflow:hidden}
.code pre{margin:0;padding:14px 16px;padding-right:56px;overflow-x:auto;font:12.5px/1.7 var(--mono);white-space:pre}
.code .icon-btn{position:absolute;top:6px;right:6px;background:var(--panel-solid);box-shadow:0 0 0 1px var(--line)}
.next-steps{margin:14px 0;padding:14px 16px;border-radius:14px;background:var(--info-soft)}
.next-steps h3{font-size:14.5px;margin-bottom:6px}
.toasts{position:fixed;left:50%;bottom:28px;z-index:300;display:flex;flex-direction:column;align-items:center;gap:8px;transform:translateX(-50%);pointer-events:none}
.toast{display:flex;align-items:center;gap:10px;max-width:min(560px,92vw);padding:11px 18px;border-radius:14px;background:var(--ink);color:var(--paper);box-shadow:var(--shadow);font-size:14px;animation:toast-in .24s var(--ease)}
.toast i{font-style:normal;color:var(--gold)}
.toast.crit i{color:#F29AAB}
@media (max-width:860px){.toasts{bottom:calc(86px + env(safe-area-inset-bottom))}}

/* 成员 */
.people li+li{border-top:1px solid var(--line)}
.person{width:100%;display:grid;grid-template-columns:auto minmax(0,1.5fr) minmax(0,.9fr) minmax(0,.7fr) minmax(0,.9fr) 18px;align-items:center;gap:14px;padding:13px 20px;text-align:left}
.person:hover{background:color-mix(in srgb,var(--panel-solid) 65%,transparent)}
.p-main b{display:block;font-weight:600}
.p-main small{display:block;color:var(--ink-3);font-size:12.5px;overflow:hidden;text-overflow:ellipsis}
.p-apps,.p-when{font-size:13px;color:var(--ink-2)}
.person>.ic{color:var(--ink-3)}
@media (max-width:860px){.person{grid-template-columns:auto minmax(0,1fr) auto;padding:12px 16px}.p-apps,.p-when,.person>.ic{display:none}}
.foot-note{margin-top:10px;color:var(--ink-3);font-size:12.5px}
.id-card{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.id-card>div>b{display:block;font-family:var(--serif);font-size:19px}
.id-card>div>span{display:block;color:var(--ink-3);font-size:13px}
.role-list li{display:grid;grid-template-columns:auto minmax(0,1fr) 132px;gap:10px;align-items:center;padding:7px 0}
.role-list select{height:34px;padding:0 8px;border-radius:9px;border:1px solid var(--line-2);background:var(--field);font-size:13.5px}
.r-name small{display:block;color:var(--ink-3);font-size:12px}
.sessions li{padding:5px 0;font-size:13.5px;color:var(--ink-2)}
.matrix-wrap{overflow:auto;max-height:70vh}
.matrix{border-collapse:separate;border-spacing:0;font-size:13.5px;min-width:100%}
.matrix th,.matrix td{padding:0;border-bottom:1px solid var(--line)}
.matrix thead th{position:sticky;top:0;z-index:1;background:var(--panel-solid);vertical-align:bottom;padding:14px 6px 10px;min-width:86px;font-weight:500}
.matrix tbody th{position:sticky;left:0;z-index:1;background:var(--panel-solid);text-align:left;padding:9px 16px;min-width:156px;font-weight:500}
.matrix thead th.corner{left:0;z-index:2;text-align:left;padding-left:16px;color:var(--ink-3);font-size:12px}
.m-app{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.m-app span{font-weight:600;font-size:13px}
.m-app small{color:var(--ink-3);font-size:11.5px}
.m-person{display:flex;align-items:center;gap:9px}
.m-person small{display:block;color:var(--ink-3);font-size:11.5px}
.matrix td{text-align:center;height:50px}
.c{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;font-size:15px}
button.c:hover:not(:disabled){background:var(--gold-soft)}
button.c:disabled{opacity:.4}
.c-none{color:var(--ink-3)}.c-user{color:var(--primary-text)}.c-inherit{color:color-mix(in srgb,var(--primary-text) 42%,transparent)}.c-admin{color:var(--gold-ink)}.c-owner{color:var(--ink-3);opacity:.55}
.matrix tr.disabled>*{opacity:.5}
.legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:12px;color:var(--ink-3);font-size:12.5px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend .c{width:20px;height:20px;font-size:12px}
.big-code{display:flex;align-items:center;justify-content:center;gap:14px;margin:14px 0 6px;font:600 44px/1.1 var(--mono);letter-spacing:.14em}
.qr{display:grid;place-items:center;padding:12px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);width:max-content;margin:12px auto}
.qr svg{width:188px;height:188px}
.qr.sm svg{width:128px;height:128px}
.invite-list li{display:grid;gap:4px;padding:13px 0;border-top:1px solid var(--line)}
.invite-list li:first-child{border-top:0}
.inv-main{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.inv-main b{font-weight:600}
.inv-code{padding:1px 8px;border-radius:7px;background:var(--code-bg);border:1px solid var(--line);font:13px var(--mono);letter-spacing:.1em}
.inv-meta{color:var(--ink-3);font-size:12.5px}
.inv-actions{display:flex;gap:2px;flex-wrap:wrap;margin-left:-10px}
.invite-list .inactive{opacity:.62}
.rows li{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line);font-size:13.5px}
.rows li:first-child{border-top:0}
@media (max-width:640px){.rows li{grid-template-columns:minmax(0,1fr) auto}}

/* 服务器 */
.server-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px}
@media (max-width:420px){.server-grid{grid-template-columns:1fr}}
.server-card{display:flex;flex-direction:column;gap:14px;transition:transform .2s var(--ease),box-shadow .2s}
.server-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.sc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.sc-head h2{font-family:var(--serif);font-size:23px;letter-spacing:.05em}
.gauges{display:flex;flex-direction:column;gap:9px}
.gauge{display:grid;grid-template-columns:38px minmax(0,1fr) 44px;align-items:center;gap:10px;font-size:13px}
.g-label{color:var(--ink-3)}
.g-bar{position:relative;height:8px;border-radius:99px;background:color-mix(in srgb,var(--ink) 9%,transparent);overflow:hidden}
.g-bar b{position:absolute;left:0;top:0;bottom:0;border-radius:inherit;background:var(--gc,var(--ok-dot))}
.g-bar i{position:absolute;top:0;bottom:0;width:2px;background:color-mix(in srgb,var(--paper) 80%,transparent)}
.gauge.tone-warn{--gc:var(--warn-dot)}.gauge.tone-crit{--gc:var(--crit-dot)}
.g-val{text-align:right;font-variant-numeric:tabular-nums}
.spark{color:var(--primary-text)}
.ridge{width:100%;height:auto;overflow:visible}
.ridge .r-back{fill:currentColor;opacity:.1}.ridge .r-mid{fill:currentColor;opacity:.16}.ridge .r-front{fill:currentColor;opacity:.26}
.ridge .r-line{fill:none;stroke:currentColor;stroke-width:1.6;vector-effect:non-scaling-stroke}
.sc-foot{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12.5px;color:var(--ink-2);border-top:1px solid var(--line);padding-top:12px}
.crit-text{color:var(--crit)}
.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:760px){.metric-grid{grid-template-columns:1fr}}
.m-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:8px}
.m-val{font-family:var(--serif);font-size:26px;font-variant-numeric:tabular-nums}
.m-val small{font-size:14px;color:var(--ink-3);margin-left:2px}
.ridge-box .ridge{height:104px}
.axis{display:flex;justify-content:space-between;color:var(--ink-3);font-size:11.5px;margin-top:4px}
.alert-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 20px;border-top:1px solid var(--line)}
.alert-row:first-child{border-top:0}
.alert-row b{display:block;font-weight:600}
.alert-row small{display:block;color:var(--ink-3);font-size:12.5px}
.alert-row.quiet{opacity:.66}
.alert-row .acts{display:flex;gap:2px;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:640px){.alert-row{grid-template-columns:10px minmax(0,1fr)}.alert-row .acts{grid-column:2;justify-content:flex-start;margin-left:-10px}}

/* 登录、加入、扫码 */
.bare{min-height:100dvh;display:grid;place-items:center;padding:28px 16px}
.auth-card{width:min(420px,100%);padding:34px 32px 24px;border-radius:26px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow)}
.auth-brand{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:16px;text-align:center}
.auth-brand .mark{width:66px;height:66px}
.auth-title{font-family:var(--serif);font-size:30px;letter-spacing:.16em}
.auth-sub{color:var(--ink-3);font:12.5px var(--mono)}
.auth-lede{color:var(--ink-2);text-align:center;margin-bottom:18px}
.auth-card .btn+.btn{margin-top:10px}
.auth-links{display:flex;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px}
.auth-links a{color:var(--primary-text)}
.demo-note{margin-top:14px;padding:9px 12px;border-radius:11px;background:var(--gold-soft);color:var(--gold-ink);font-size:12.5px;text-align:center}
.demo-note a{text-decoration:underline;text-underline-offset:3px}
.device{margin-top:12px;text-align:center}
.device p{color:var(--ink-2);font-size:13.5px;margin-top:6px}
.auth-card .done{text-align:center}
.auth-card .done .star{font-size:30px}
.auth-card .done h2{font-family:var(--serif);font-size:20px;margin:6px 0 10px}
.plain-steps{text-align:left;margin:14px 0}
.plain-steps li{counter-increment:s;display:flex;gap:10px;padding:5px 0;color:var(--ink-2)}
.plain-steps li::before{content:counter(s);display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--gold-soft);color:var(--gold-ink);font-size:12px;font-weight:600}
@media (pointer:coarse){.desk-only{display:none!important}}
@media (pointer:fine){.touch-only{display:none!important}}
.scan{width:min(460px,100%);display:flex;flex-direction:column;gap:14px}
.scan-head{display:flex;align-items:center;gap:6px}
.scan-head h1{font-family:var(--serif);font-size:22px}
.scan-view{position:relative;aspect-ratio:1;border-radius:24px;overflow:hidden;background:#0B110F}
.scan-view video{width:100%;height:100%;object-fit:cover}
.scan-frame{position:absolute;inset:16%;border-radius:18px;box-shadow:0 0 0 999px rgba(11,17,15,.45);outline:2px solid var(--gold)}
.scan-tip{text-align:center;color:var(--ink-2)}

/* 设置与规则 */
.link-list li{border-top:1px solid var(--line)}
.link-list li:first-child{border-top:0}
.link-list a{display:grid;grid-template-columns:20px minmax(0,1fr) 16px;gap:12px;align-items:center;padding:12px 2px}
.link-list a small{display:block;color:var(--ink-3);font-size:12.5px}
.link-list a:hover b{color:var(--primary-text)}
.activity li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px;color:var(--ink-2)}
.activity li:first-child{border-top:0}
.md{max-width:840px}
.md h2{font-family:var(--serif);font-size:23px;margin:30px 0 10px}
.md h3{font-family:var(--serif);font-size:18.5px;margin:24px 0 8px}
.md h4{font-size:15.5px;margin:18px 0 6px}
.md p,.md li{color:var(--ink-2);line-height:1.85}
.md p{margin:8px 0}
.md ul{list-style:disc;padding-left:1.4em;margin:8px 0}
.md ol{list-style:decimal;padding-left:1.4em;margin:8px 0}
.md blockquote{margin:12px 0;padding:8px 14px;border-left:3px solid var(--gold);background:var(--gold-soft);border-radius:0 10px 10px 0}
.md table{border-collapse:collapse;margin:12px 0;font-size:13.5px;display:block;overflow-x:auto}
.md th,.md td{border:1px solid var(--line-2);padding:7px 10px;text-align:left;vertical-align:top}
.md hr{border:0;border-top:1px solid var(--line);margin:24px 0}
.md a{color:var(--primary-text);text-decoration:underline}

.loading{display:flex;justify-content:center;gap:7px;padding:90px 0}
.loading span{width:7px;height:7px;border-radius:50%;background:var(--gold);animation:pulse 1s infinite ease-in-out}
.loading span:nth-child(2){animation-delay:.15s}.loading span:nth-child(3){animation-delay:.3s}
@keyframes pulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes toast-in{from{opacity:0;transform:translateY(8px)}}
@keyframes shake{25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.plain-list li{border-top:1px solid var(--line)}
.plain-list li:first-child{border-top:0}
.plain-list .app-cell{width:100%;padding:10px 2px;text-align:left;border-radius:10px}
.plain-list .app-cell:hover b{color:var(--primary-text)}
.bare>.view-root{width:100%;display:grid;place-items:center}
.ports-edit{display:flex;flex-direction:column;gap:8px}
.port-row{display:grid;grid-template-columns:120px minmax(0,1fr) 150px 86px 38px;gap:8px;align-items:center}
.port-row input,.port-row select{height:38px;padding:0 10px;border-radius:10px;border:1px solid var(--line-2);background:var(--field);min-width:0}
.port-row input:focus,.port-row select:focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px var(--gold-soft)}
@media (max-width:640px){.port-row{grid-template-columns:1fr 1fr 38px}.port-row select{grid-column:span 1}}
@media (max-width:560px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tile{min-height:124px;padding:14px 14px 12px;border-radius:18px}.tile-name{font-size:18px}.tile-desc{font-size:12px}.tile-foot span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
