/* tofo-shell v1 · 2026-10-15 */
/* ===== 规范令牌：第 9 节「落地」里的代码块与此一致 ===== */
:root{
  --tofo-red:#aa1d21;--tofo-red-dark:#7f1116;--tofo-red-soft:#fad9cf;--tofo-yellow:#ffd85a;
  --tofo-paper:#fff5dd;--tofo-card:#fffdf6;--tofo-line:#e7d8b5;--tofo-line-strong:#9a8152;
  --tofo-ink:#173c66;--tofo-muted:#5c6880;
  --tofo-blue:#2652b0;--tofo-sky:#e7efff;--tofo-green:#3d7346;--tofo-green-dark:#2c5533;--tofo-green-soft:#e4efe0;
  --tofo-orange:#ec8b1e;--tofo-warn-text:#704300;--tofo-warn-soft:#fff0c4;--tofo-off:#f1e7cc;
  --tofo-radius-card:8px 20px 8px 8px;--tofo-radius-btn:12px;
  --tofo-shadow-card:0 10px 28px rgba(38,82,176,.06);
  --tofo-font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --tofo-mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:light;
}
*{box-sizing:border-box}
html{background:var(--tofo-paper)}
body{margin:0;background:var(--tofo-paper);color:var(--tofo-ink);font:15px/1.6 var(--tofo-font);-webkit-text-size-adjust:100%}
h1,h2,h3,p{margin:0}
code{font-family:var(--tofo-mono);font-size:12px}
img{display:block}

/* ===== 组件（t-）：就是规范本身 ===== */
.ico{width:24px;height:24px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ico--s{width:18px;height:18px}
.t-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:0;border-radius:var(--tofo-radius-btn);font:800 16px/1.2 var(--tofo-font);cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent;white-space:nowrap}
.t-btn:focus-visible{outline:3px solid var(--tofo-blue);outline-offset:2px}
.t-btn--primary{background:var(--tofo-red);color:#fff;box-shadow:inset 0 -3px 0 var(--tofo-red-dark)}
.t-btn--primary:active,.t-btn--primary.is-pressed{background:var(--tofo-red-dark);box-shadow:none;transform:translateY(1px)}
.t-btn--confirm{background:var(--tofo-green);color:#fff;box-shadow:inset 0 -3px 0 var(--tofo-green-dark)}
.t-btn--secondary{background:var(--tofo-card);color:var(--tofo-ink);box-shadow:inset 0 0 0 1.5px var(--tofo-line-strong)}
.t-btn--text{background:transparent;color:var(--tofo-blue);padding:0 4px;font-weight:700}
.t-btn--danger{background:var(--tofo-red-soft);color:var(--tofo-red)}
.t-btn--lg{min-height:56px;width:100%;font-size:17px}
.t-btn--sm{min-height:36px;padding:0 12px;font-size:14px;border-radius:10px}
.t-btn[disabled]{opacity:.45;cursor:not-allowed}
.t-spin{width:16px;height:16px;border-radius:50%;border:2.5px solid rgba(255,255,255,.45);border-top-color:#fff;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.t-spin{animation:none}}

.t-card{background:var(--tofo-card);border:1px solid var(--tofo-line);border-radius:var(--tofo-radius-card);box-shadow:var(--tofo-shadow-card);padding:16px}
.t-card__head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.t-card__title{font-size:16px;font-weight:700;line-height:1.35}
.t-meta{font-size:13px;color:var(--tofo-muted);font-variant-numeric:tabular-nums}
.t-label{font-size:12px;font-weight:600;color:var(--tofo-muted)}
.t-chip{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.t-chip--ok{background:var(--tofo-green-soft);color:var(--tofo-green)}
.t-chip--todo{background:var(--tofo-yellow);color:var(--tofo-ink)}
.t-chip--bad{background:var(--tofo-red-soft);color:var(--tofo-red)}
.t-chip--info{background:var(--tofo-sky);color:var(--tofo-blue)}
.t-chip--off{background:var(--tofo-off);color:var(--tofo-muted)}
.t-dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.t-stat{border-top:4px solid var(--tofo-blue);border-radius:6px 20px 8px 8px}
.t-stat__num{font-size:28px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums;margin:6px 0 4px}
.t-stat__num small{font-size:14px;font-weight:700;margin-left:3px}
.t-stat--warn{border-top-color:var(--tofo-orange)}
.t-stat--off{border-top-color:var(--tofo-line-strong);background:#fbf6ea}
.t-stat--off .t-stat__num{font-size:20px;color:var(--tofo-muted);margin:10px 0 8px}
.t-notice{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;font-size:14px;line-height:1.5}
.t-notice .ico{width:20px;height:20px;margin-top:1px}
.t-notice--info{background:var(--tofo-sky);color:var(--tofo-blue)}
.t-notice--warn{background:var(--tofo-warn-soft);color:var(--tofo-warn-text)}
.t-notice--bad{background:var(--tofo-red-soft);color:var(--tofo-red)}
.t-notice--ok{background:var(--tofo-green-soft);color:var(--tofo-green)}
.t-input{display:block;width:100%;height:48px;margin-top:6px;padding:0 14px;border:0;border-radius:10px;background:#fff;color:var(--tofo-ink);font:400 16px var(--tofo-font);box-shadow:inset 0 0 0 1.5px var(--tofo-line-strong)}
.t-input.is-focus{box-shadow:inset 0 0 0 2px var(--tofo-blue),0 0 0 4px rgba(38,82,176,.16)}

/* 共用顶栏 */
.t-top{display:flex;align-items:center;gap:12px;height:60px;padding:0 24px;background:rgba(255,253,246,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--tofo-line)}
.t-top__brand{display:block;line-height:0}
.t-logo{display:block;height:40px;aspect-ratio:1.5925/1;object-fit:contain;flex-shrink:0}
.t-top__sep{width:1px;height:22px;background:var(--tofo-line)}
.t-top__module{font-size:17px;font-weight:800;letter-spacing:.01em;white-space:nowrap}
.t-top__right{margin-left:auto;display:flex;align-items:center;gap:6px}
.t-top__me{display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:999px;color:var(--tofo-ink);font-size:14px;font-weight:700;text-decoration:none}
.t-avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--tofo-ink);color:#fff;font-size:14px;font-weight:800;flex:0 0 auto}
.t-top__out{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 8px;border:0;background:transparent;color:var(--tofo-muted);font:700 14px var(--tofo-font);cursor:pointer}
.t-top__bar{width:1px;height:18px;background:var(--tofo-line)}
.t-top--m{height:52px;padding:0 16px;gap:10px}
.t-top--m .t-logo{height:32px}

/* 手机底部导航 */
.t-tabbar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--tofo-card);border-top:1px solid var(--tofo-line)}
.t-tab{position:relative;display:grid;justify-items:center;align-content:start;gap:2px;min-height:58px;padding-top:8px;color:var(--tofo-muted);font-size:12px;line-height:16px;font-weight:600;text-decoration:none}
.t-tab[aria-current="page"]{color:var(--tofo-ink);font-weight:800}
.t-tab[aria-current="page"]::before{content:"";position:absolute;top:0;left:32%;right:32%;height:3px;border-radius:0 0 3px 3px;background:var(--tofo-red)}
.t-tab__ico{position:relative;display:grid;place-items:center;height:28px}
.t-tab--main,.t-tab--main[aria-current="page"]{color:var(--tofo-red);font-weight:800}
.t-tab--main .t-tab__ico{width:46px;background:var(--tofo-red);color:#fff;border-radius:8px 14px 8px 8px}
.t-tab--main .ico{width:22px;height:22px}
.t-badge{position:absolute;top:-3px;left:calc(100% - 6px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--tofo-red);color:#fff;font-size:12px;font-weight:800;line-height:18px;text-align:center;font-variant-numeric:tabular-nums}


/* Complete interactive states and shared responsive shell. */
[hidden]{display:none!important}
.t-btn{max-width:100%}
.t-btn--confirm:active,.t-btn--confirm.is-pressed{background:var(--tofo-green-dark);box-shadow:none;transform:translateY(1px)}
.t-btn--secondary:active,.t-btn--secondary.is-pressed{background:var(--tofo-off);transform:translateY(1px)}
.t-btn--text:active,.t-btn--text.is-pressed{background:var(--tofo-sky);transform:translateY(1px)}
.t-btn--danger:active,.t-btn--danger.is-pressed{background:var(--tofo-red);color:#fff;transform:translateY(1px)}
.t-btn[aria-busy="true"]{cursor:wait;pointer-events:none}
.t-btn[aria-busy="true"]::before{content:"";width:16px;height:16px;flex-shrink:0;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .8s linear infinite}
.t-input:focus{outline:0;box-shadow:inset 0 0 0 2px var(--tofo-blue),0 0 0 4px rgba(38,82,176,.16)}
.t-top{position:sticky;top:0;z-index:30;flex-shrink:0}
.t-top__me{border:0;background:transparent;font-family:var(--tofo-font);cursor:pointer}
.t-tabbar{display:none}
.t-tab{border:0;background:transparent;font-family:var(--tofo-font);cursor:pointer}
.t-tab:focus-visible,.t-top__me:focus-visible{outline:3px solid var(--tofo-blue);outline-offset:-3px}
.t-me-panel{color:var(--tofo-ink);background:var(--tofo-card);font:15px/1.6 var(--tofo-font);border:1px solid var(--tofo-line);border-radius:20px;padding:20px;max-width:calc(100vw - 24px)}
.t-me-panel::backdrop{background:rgba(16,24,40,.42)}
.t-me-panel__note{font-size:13px;line-height:1.6;color:var(--tofo-muted)}
@media(max-width:767px){
 .t-top{height:52px;padding:0 16px;gap:10px}
 .t-logo{height:32px;width:auto}
 .t-top__right{display:none}
 .t-tabbar{display:grid;position:fixed;bottom:0;left:0;right:0;z-index:40;padding-bottom:env(safe-area-inset-bottom,0px)}
 .t-tab{padding-left:0;padding-right:0}
}
@media(prefers-reduced-motion:reduce){.t-btn[aria-busy="true"]::before{animation:none}}

/* The busy pseudo-element supplies one spinner, including legacy t-spin markup. */
.t-btn[aria-busy="true"] .t-spin{display:none}

/* All-sites shared shell, 2026-10-15. */
.t-me-panel{width:360px;margin:0;position:fixed;inset:70px 20px auto auto;z-index:100;max-height:calc(100dvh - 90px);overflow:auto;border-radius:var(--tofo-radius-card)}
.t-me-panel__head{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.t-me-panel__person{flex:1;min-width:0}.t-me-panel__person strong{font-size:16px;overflow-wrap:anywhere}
.t-me-panel__meta{font-size:13px;color:var(--tofo-muted)}
.t-me-panel__scope{margin:0 0 16px;font-size:13px;color:var(--tofo-muted);overflow-wrap:anywhere}
.t-me-panel__links{display:grid;gap:12px;margin:0 0 14px}.t-me-panel__links .t-btn{width:100%;white-space:normal;min-height:44px}
.t-me-panel__note{margin:0;font-size:13px;line-height:1.6;color:var(--tofo-muted)}
.t-top__module{min-width:0;overflow:hidden;text-overflow:ellipsis}.t-top__me{max-width:240px}.t-top__me>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.t-tab__ico{width:28px}.t-btn .ico{width:18px;height:18px}
@media(max-width:767px){.t-me-panel{inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:calc(100dvh - 64px);border-radius:20px 20px 0 0;padding:20px 20px calc(20px + env(safe-area-inset-bottom,0px))}.t-top__module{font-size:16px}.t-top__sep{flex-shrink:0}}

.t-me-panel p{margin-top:0;margin-bottom:0}.t-me-panel__head>.t-btn{margin-left:auto}.t-top__out .ico{width:18px;height:18px}

.t-top{justify-content:flex-start}

.t-top{flex-direction:row;flex-wrap:nowrap;margin:0}

.t-top{color:var(--tofo-ink)}

.t-me-panel{box-shadow:var(--tofo-shadow-card)}
.t-top{font:15px/1.6 var(--tofo-font)}

.tofo-icons{position:absolute;width:0;height:0;overflow:hidden}