:root { --ink:#202a34; --muted:#6e7b89; --line:#dce3e8; --accent:#25836d; --accent-soft:#e8f5f1; color-scheme:light; font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; background:#f4f6f7; color:var(--ink); }
button,select { font:inherit; }
.skip-link { position:absolute; left:-999px; }
.skip-link:focus { left:12px; top:12px; z-index:10; padding:8px; background:#fff; }
.app-shell { width:min(1180px,calc(100% - 32px)); margin:auto; min-height:100vh; }
.topbar,.page-heading,.panel-heading,.topbar-actions { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.topbar { padding:24px 0 16px; }
.brand-home { display:flex; align-items:center; gap:12px; }
.brand-home strong { display:block; font-size:20px; }
.brand-mark { display:grid; place-items:center; width:48px; height:48px; border-radius:14px; background:#202a34; color:white; font-size:24px; font-weight:900; }
.eyebrow { margin:0 0 6px; color:var(--muted); font-size:11px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.eyebrow.accent { color:var(--accent); }
.local-badge,.status-chip { display:inline-flex; align-items:center; gap:7px; padding:7px 10px; border-radius:999px; background:var(--accent-soft); color:#236452; font-size:12px; font-weight:800; }
.pulse { width:8px; height:8px; border-radius:50%; background:var(--accent); }
.page-heading { padding:38px 0 26px; }
h1 { margin:0 0 12px; font-size:clamp(34px,7vw,64px); line-height:1; }
h2 { margin:0; font-size:22px; }
p { line-height:1.65; }
.hub-panel { border:1px solid var(--line); border-radius:16px; background:white; box-shadow:0 12px 30px rgba(31,45,56,.05); }
.panel-heading { margin-bottom:18px; }
.primary-button,.secondary-button { min-height:42px; padding:9px 15px; border-radius:9px; border:1px solid #bdcbd2; background:white; color:var(--ink); font-weight:800; cursor:pointer; }
.primary-button { border-color:var(--accent); background:var(--accent); color:white; }
button:disabled { cursor:not-allowed; opacity:.55; }
footer { padding:34px 0; color:var(--muted); font-size:12px; text-align:center; }
.auth-panel { width:min(520px,100%); margin:50px auto; padding:28px; }
.auth-panel h1 { font-size:38px; }
.auth-panel form { display:grid; grid-template-columns:1fr auto; gap:12px; margin-top:20px; }
.auth-panel label { grid-column:1/-1; font-size:13px; font-weight:800; }
.auth-panel input { min-width:0; padding:12px 14px; border:1px solid var(--line); border-radius:9px; font:700 24px/1 ui-monospace,monospace; letter-spacing:.25em; }
.auth-status { min-height:24px; color:#9b352e; font-weight:700; }
[hidden] { display:none !important; }
@media (max-width:700px) { .app-shell { width:min(100% - 20px,1180px); } .topbar,.page-heading { align-items:flex-start; flex-direction:column; } .local-badge { align-self:flex-end; margin-top:-54px; } }