:root{font-family:"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;color:#17242b;background:#f3f5f6;--accent:#1f6f8b;--accent-dark:#165366;--accent-soft:#edf4f6;--ink-2:#465861;--ink-3:#7a8a91;--line:#d3dadd;--paper:#fff;--danger:#b4432f;--danger-soft:#f6e3df}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--paper) linear-gradient(#f3f5f6,#f3f5f6)}
.topbar{height:72px;display:flex;align-items:center;gap:14px;padding:0 clamp(16px,5vw,64px);border-bottom:1px solid var(--line);background:#fff}
/* 页头左起第一件是主页入口，其后的品牌标题只是标题：这一行原先有两枚都指向 / 的可点区（品牌链接与右侧「← 学习主页」），
   同一行两个同目的地的按钮只会让人多犹豫一次，所以品牌退回纯文本，回主页只留这一枚。 */
.brand{display:flex;align-items:center;gap:12px;min-width:0;font-weight:800}.brand img{width:110px;display:block}
.brand>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 站级统一入口（《站级「主页」入口规范 v1》§1.4）：形状与尺寸各应用一字不差，颜色走本页蓝，
   免得一枚外来配色的芯片比页头本身还抢眼。44px 高、14px 字是最小可辨可点区，窄屏同样不缩，
   「主页」两个字任何视口都不隐藏——窄屏只留一个图标正是主理人反馈「很小、容易看不清」的成因。
   底色写死 #eef4f6（规范 §1.5 表登记值），不写 var(--accent-soft)(#edf4f6)：这枚芯片九处的配色
   由规范一张表管，令牌是本页自己的调色，两者只是碰巧接近，绑在一起会让调令牌顺手改掉登记值。
   hover 只换底色一件事（§1.4）：同一枚芯片在九个应用里对指针的反应不一致，比配色不同更像 bug，
   所以这里不再动 border-color 与 color。 */
.home-entry{display:inline-flex;align-items:center;justify-content:center;gap:5px;flex:none;min-height:44px;padding:6px 9px;border:1px solid var(--line);border-radius:10px;background:#eef4f6;color:var(--accent);font-size:14px;font-weight:650;white-space:nowrap;text-decoration:none}
.home-entry svg{flex:none}
.home-entry:hover{background:#e2eef2}
.home-entry:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
/* 孩子模式提示里的「去作业搭子解锁 →」仍用这一枚药丸：它去的是另一个应用、语义与主页入口不同。 */
.back-link{color:var(--accent);text-decoration:none;font-weight:700;padding:9px 14px;border:1px solid var(--line);border-radius:999px;background:#fff}
.shell{width:min(960px,calc(100% - 32px));margin:0 auto;padding:32px 0 64px;display:grid;gap:20px}
.eyebrow{margin:0;color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
h1{margin:6px 0 10px;font-size:clamp(24px,3.5vw,32px);line-height:1.25;text-wrap:balance}
h2{margin:0;font-size:18px}
.lead{margin:0;color:var(--ink-2);line-height:1.75;max-width:64ch}
.hero{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:flex-start}
.hero-actions{display:flex;flex-wrap:wrap;gap:8px}
.card{padding:22px 24px;border:1px solid var(--line);border-radius:12px;background:#fff}
.card.narrow{max-width:460px;margin:24px auto 0}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.muted{color:var(--ink-3);font-size:13.5px;line-height:1.7;margin:0 0 12px}
.note{color:var(--ink-3);font-size:13px;line-height:1.7;margin:16px 0 0}
.form-stack{display:grid;gap:14px}
label{display:grid;gap:6px;font-size:13.5px;font-weight:700}
input,select{width:100%;border:1px solid var(--line);border-radius:10px;padding:11px 12px;font:inherit;font-size:15px;background:#fff;color:inherit}
input:focus{outline:2px solid var(--accent);outline-offset:1px}
button{font:inherit;font-weight:700;border-radius:10px;padding:10px 14px;cursor:pointer;border:1px solid var(--line);background:#fff;color:inherit}
button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}button.primary:hover{background:var(--accent-dark)}
button.secondary{background:#fff}
button.small{padding:7px 12px;font-size:13px}
button.danger{background:var(--danger);color:#fff;border-color:var(--danger)}
button.link{border:0;background:none;color:var(--accent);padding:4px 6px}
button:disabled{opacity:.55;cursor:wait}
.form-error{min-height:20px;margin:0;color:var(--danger);font-weight:700;font-size:13.5px}
.form-error:empty{display:none}
.children{display:grid;gap:8px}
.child{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.child b{font-size:15px}.child small{display:block;color:var(--ink-3);font-size:12px}
.child .row{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13.5px;min-width:600px}
th,td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
th{font-size:12.5px;color:var(--ink-2);background:#f3f5f6}
td.num{font-variant-numeric:tabular-nums}
.danger-zone{border-color:#e3b9b0;background:#fffaf8}
dialog{border:0;border-radius:14px;padding:22px 24px;width:min(440px,calc(100% - 32px));box-shadow:0 24px 80px #10252655}
dialog::backdrop{background:#143033aa}
.dialog-actions{display:flex;gap:8px;justify-content:flex-end}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);opacity:0;padding:10px 16px;border-radius:999px;background:#17242b;color:#fff;font-size:13.5px;transition:.2s;pointer-events:none;z-index:50}
.toast.show{opacity:1;transform:translateX(-50%)}
.foot{width:min(960px,calc(100% - 32px));margin:0 auto 32px;color:var(--ink-3);font-size:12.5px;line-height:1.7}
.foot a{color:var(--accent)}
[hidden]{display:none!important}
@media(max-width:640px){.topbar{height:60px}.brand img{width:92px}.card{padding:16px}.child{grid-template-columns:1fr}.child .row{justify-content:flex-start}}


/* ══ 站级页头 v2（规范 §1.2/§1.4）══
   主页 · 双 Logo · 应用名 · 右侧动作，一行四件，任何视口都不折行。
   只有 .top-app 是 flex:1 1 auto 的伸缩件，压力全由它吸收——先省略号，绝不换行。
   `.brand` 随 v2 退役（它把 Logo 与名字捆在一起，两边尺寸各写各的）。 */
.topbar { flex-wrap: nowrap; gap: 8px; }
.top-brand { display: flex; align-items: center; gap: 5px; flex: none; }
.top-brand img { width: 18px; height: 18px; display: block; object-fit: contain; }
.top-app { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 14px; font-weight: 700; color: var(--ink, #123047); }
