/* 材创通 · 界面样式
   原则：不依赖任何外部资源，不依赖新语法（兼容旧浏览器），打印与投影都清楚。 */

:root{
  --ink:#1b1f24;
  --muted:#5b6672;
  --faint:#8a939d;
  --line:#dfe3e8;
  --line2:#eef1f4;
  --bg:#ffffff;
  --soft:#f5f7fa;
  --c1:#2f6fd0;
  --c2:#d0752a;
  --c3:#2f8f5b;
  --c4:#8a6ad0;
  --ok:#2f8f5b;
  --no:#c0563f;
  --wait:#8a7a2a;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Microsoft YaHei","PingFang SC","Hiragino Sans GB",system-ui,sans-serif;
  color:var(--ink);background:var(--bg);font-size:15px;line-height:1.62;
  -webkit-text-size-adjust:100%;
}
main{max-width:1180px;margin:0 auto;padding:0 22px}

/* ---------- 顶栏 ---------- */
.top{
  display:flex;justify-content:space-between;align-items:flex-end;gap:16px;
  max-width:1180px;margin:0 auto;padding:20px 22px 12px;
}
.brand{display:flex;align-items:center;gap:14px}
.logo{
  font-size:26px;font-weight:700;letter-spacing:3px;color:#fff;background:var(--ink);
  padding:6px 16px 6px 19px;border-radius:5px;white-space:nowrap;
}
.brand-line{font-size:14px;color:var(--ink)}
.brand-meta{font-size:12.5px;color:var(--faint)}

/* ---------- 导航 ---------- */
.tabs{
  display:flex;gap:4px;flex-wrap:wrap;max-width:1180px;margin:0 auto 20px;
  padding:0 22px;border-bottom:1px solid var(--line);
}
.tabs button{
  font:inherit;font-size:14.5px;color:var(--muted);background:none;border:0;
  border-bottom:2px solid transparent;padding:9px 16px;cursor:pointer;
}
.tabs button.on{color:var(--ink);font-weight:600;border-bottom-color:var(--ink)}
.tabs .pill{
  font-size:11px;color:var(--wait);border:1px solid var(--wait);border-radius:3px;
  padding:0 4px;margin-left:6px;vertical-align:1px;
}

/* ---------- 通用 ---------- */
.hidden{display:none !important}
h2{
  font-size:16px;font-weight:600;margin:0 0 12px;padding-left:9px;
  border-left:4px solid var(--ink);line-height:1.35;
}
.panel{border:1px solid var(--line);border-radius:6px;padding:16px 18px;background:#fff}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.notice{
  font-size:13px;color:var(--muted);background:var(--soft);border:1px solid var(--line);
  border-radius:6px;padding:10px 14px;margin:14px 0;
}
.notice.warn{background:#fdf8ec;border-color:#eddfba}
.notice b{color:var(--ink)}
.count{font-weight:400;color:var(--muted);font-size:14px}

button.primary,button.ghost{
  font:inherit;font-size:14px;border-radius:4px;cursor:pointer;padding:9px 20px;
}
button.primary{background:var(--ink);color:#fff;border:1px solid var(--ink);margin-top:14px}
button.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}

input[type=text],input[type=search],select,textarea{
  font:inherit;font-size:14px;width:100%;padding:8px 10px;border:1px solid var(--line);
  border-radius:4px;background:#fff;color:var(--ink);
}
textarea{min-height:62px;resize:vertical}
label{display:block;font-size:13px;color:var(--muted);margin:12px 0 4px}
#view-events input[type=search]{max-width:320px}

/* ---------- 总览 ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.kpi{border:1px solid var(--line);border-radius:6px;padding:14px 16px}
.kpi .num{font-size:26px;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums}
.kpi .cap{font-size:12.5px;color:var(--muted);margin-top:2px}
.kpi .ex{font-size:12.5px;color:var(--faint);margin-top:6px}
.kpi.b1 .num{color:var(--c1)} .kpi.b2 .num{color:var(--c2)}
.kpi.b3 .num{color:var(--c3)} .kpi.b4 .num{color:var(--c4)}

/* ---------- 时间线 ---------- */
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:14px 0}
.chip{
  font:inherit;font-size:13px;color:var(--muted);background:#fff;border:1px solid var(--line);
  border-radius:20px;padding:4px 13px;cursor:pointer;white-space:nowrap;
}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.chip[data-lv="院级"]::before,.chip[data-lv="校级"]::before,
.chip[data-lv="国家级"]::before,.chip[data-lv="政策"]::before{
  content:"";display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;
}
.chip[data-lv="院级"]::before{background:var(--c1)}
.chip[data-lv="校级"]::before{background:var(--c2)}
.chip[data-lv="国家级"]::before{background:var(--c3)}
.chip[data-lv="政策"]::before{background:var(--c4)}
.chip.on[data-lv]::before{background:#fff}
.legend{display:flex;gap:14px;font-size:12.5px;color:var(--muted);margin-left:6px;flex-wrap:wrap}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px}

/* 标签：按含义配色，统一用浅底深字 */
.tag{
  display:inline-block;font-size:11.5px;line-height:1.6;padding:0 7px;border-radius:3px;
  margin-left:7px;white-space:nowrap;font-weight:400;vertical-align:1px;
}
.tag.nomg{margin-left:0}
.tag.ok{background:#e4f4ea;color:#1c7546}       /* 大一可报 */
.tag.no{background:#fceae7;color:#b03a26}       /* 大二起 */
.tag.wait{background:#fdf4e0;color:#8a6a12}     /* 待确认 */
.tag.final{background:#e9f1fc;color:#2a5fae}    /* 决赛 */
.tag.policy{background:#f1edfc;color:#5d45a6}   /* 政策 */

.tl{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#fff}
.tl-band,.tl-months,.tl-row{display:grid;grid-template-columns:268px minmax(0,1fr)}
.bandcells,.monthcells,.tl-track{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
.band{
  font-size:11.5px;color:var(--muted);text-align:center;padding:3px 0;
  border-left:1px solid var(--line2);
}
.band:first-child{border-left:0}
.tl-months{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mo{
  font-size:12px;color:var(--muted);text-align:center;padding:4px 0;
  border-left:1px solid var(--line2);font-variant-numeric:tabular-nums;
}
.mo:first-child{border-left:0}
.lanehead{
  background:var(--soft);border-top:1px solid var(--line);padding:6px 14px;
  font-size:13.5px;font-weight:600;
}
.lanehead span{font-weight:400;color:var(--faint);font-size:12.5px;margin-left:8px}
.tl-row{border-top:1px solid var(--line2);min-height:44px;align-items:center;cursor:pointer}
.tl-row:hover{background:#fafbfc}
.tl-lbl{padding:6px 14px}
.tl-name{font-size:14px;font-weight:600;line-height:1.4}
.tl-brief{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-full{
  display:none;font-size:12.5px;color:var(--muted);margin-top:5px;padding-top:5px;
  border-top:1px dashed var(--line);
}
.tl-row.open .tl-full{display:block}
.tl-row.open .tl-brief{white-space:normal;overflow:visible}
.tl-track{
  position:relative;align-self:stretch;
  background-image:linear-gradient(to right,var(--line2) 0 1px,transparent 1px);
  background-size:calc(100% / 12) 100%;
}
.bar{align-self:center;height:18px;border-radius:9px;margin:0 3px}
.bar.b1{border:1px solid var(--c1);background:#e9f1fc}
.bar.b2{border:1px solid var(--c2);background:#fdf1e5}
.bar.b3{border:1px solid var(--c3);background:#e8f6ee}
.bar.b4{border:1px solid var(--c4);background:#f1edfc}
.pin{align-self:center;justify-self:center;width:11px;height:11px;border-radius:50%}
.pin.p1{background:var(--c1)} .pin.p2{background:var(--c2)}
.pin.p3{background:var(--c3)} .pin.p4{background:var(--c4)}

/* ---------- 赛事库 ---------- */
table.lib{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff}
table.lib th,table.lib td{
  text-align:left;padding:9px 11px;border-bottom:1px solid var(--line2);vertical-align:top;
}
table.lib th{
  background:var(--soft);font-size:13px;border-bottom:1px solid var(--line);white-space:nowrap;
}
table.lib tbody tr:hover{background:#fafbfc}
.cat{font-weight:700;font-variant-numeric:tabular-nums}
.cat.A1{color:#a82020} .cat.A2{color:#c0563f} .cat.A3{color:#d0752a}
.cat.B{color:#2f6fd0} .cat.C{color:#5b6672} .cat.none{color:var(--faint)}
.table-foot{font-size:12.5px;color:var(--faint);margin-top:10px}

/* ---------- 加分规则 ---------- */
.formula{
  font-size:16px;font-weight:600;background:var(--soft);border:1px solid var(--line);
  border-radius:6px;padding:14px 16px;text-align:center;letter-spacing:.3px;
}
.formula small{display:block;font-size:12.5px;font-weight:400;color:var(--muted);margin-top:6px;letter-spacing:0}
.mod-h{font-size:15px;font-weight:600;margin:0 0 10px}
.tablewrap{overflow-x:auto}
table.ladder{width:100%;border-collapse:collapse;font-size:13.5px;min-width:300px}
table.ladder th,table.ladder td{
  padding:7px 10px;border-bottom:1px solid var(--line2);text-align:right;
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
table.ladder thead th{background:var(--soft);border-bottom:1px solid var(--line);font-size:12.5px;color:var(--muted);white-space:nowrap}
table.ladder th:first-child,table.ladder td:first-child{text-align:left;font-weight:600;white-space:normal}
table.ladder tbody tr:hover{background:#fafbfc}
ul.notes{margin:12px 0 0;padding-left:18px;font-size:12.5px;color:var(--muted)}
ul.notes li{margin-bottom:5px}

/* ---------- 组队大厅 ---------- */
/* 列表卡片：通知栏与组队大厅共用 */
.card-item{border:1px solid var(--line);border-radius:6px;padding:11px 13px;margin-bottom:10px;background:#fff}
.card-item h4{margin:2px 0 3px;font-size:14.5px;font-weight:600;line-height:1.45}
.card-item p{margin:2px 0;font-size:13px;color:var(--muted)}
.card-item .del{
  float:right;font:inherit;font-size:12px;color:var(--no);background:none;border:0;cursor:pointer;
}
.nc-head{display:flex;align-items:center;gap:8px}
.nc-date{font-size:12px;color:var(--faint);font-variant-numeric:tabular-nums}
.nc-img{display:block;max-width:100%;max-height:260px;border:1px solid var(--line);border-radius:4px;margin-top:8px}
.nc-src{font-size:11.5px;color:var(--faint);margin-top:6px}
.empty{border:1px dashed var(--line);border-radius:6px;padding:28px;text-align:center;color:var(--muted);font-size:13.5px}
pre.copy{
  white-space:pre-wrap;font-size:12.5px;background:var(--soft);border:1px solid var(--line);
  border-radius:6px;padding:11px;max-height:240px;overflow:auto;margin-top:12px;
  font-family:Consolas,Menlo,monospace;
}
.tagdemo{font-size:11px;color:var(--faint);border:1px solid var(--line);border-radius:3px;padding:0 4px;margin-left:6px}

/* ---------- 页脚 ---------- */
.foot{
  max-width:1180px;margin:34px auto 0;padding:14px 22px 40px;
  border-top:1px solid var(--line);font-size:12.5px;color:var(--faint);
}
.foot div{margin-top:3px}

/* ---------- 平板与小屏（≤860px） ---------- */
@media (max-width:860px){
  .two-col{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .tl-band,.tl-months,.tl-row{grid-template-columns:210px minmax(0,1fr)}
  .brand{flex-direction:column;align-items:flex-start;gap:8px}
  .top{flex-direction:column;align-items:flex-start}
  .tl-brief{font-size:11.5px}
}

/* ---------- 手机端（≤700px） ----------
   时间线从「左标签 + 右时间轴」改成上下排列：每个赛事自带一条月份刻度，
   月份表头吸顶，滚动时始终能看到是几月。赛事库表格改成卡片。 */
@media (max-width:700px){
  .tl{overflow:visible}
  .tl-band,.tl-months{grid-template-columns:1fr}
  .tl-band > div:first-child,.tl-months > div:first-child{display:none}
  .tl-months{
    position:sticky;top:0;z-index:3;background:#fff;
    box-shadow:0 1px 0 var(--line);
  }
  .tl-row{grid-template-columns:1fr;padding-bottom:7px}
  .tl-lbl{padding:9px 12px 3px}
  .tl-name{font-size:14.5px;line-height:1.5}
  .tl-brief{white-space:normal;overflow:visible;text-overflow:clip;font-size:12.5px}
  .tl-track{min-height:24px;border-top:1px solid var(--line2)}
  .bar{height:16px}
  .lanehead{padding:8px 12px;font-size:14px}

  table.lib,table.lib tbody,table.lib tr,table.lib td{display:block}
  table.lib thead{display:none}
  table.lib tr{border:1px solid var(--line);border-radius:6px;padding:11px 13px;margin-bottom:10px}
  table.lib tr:hover{background:#fff}
  table.lib td{border:0;padding:2px 0;white-space:normal}
  table.lib td::before{
    content:attr(data-label);display:inline-block;min-width:66px;
    color:var(--faint);font-size:12.5px;
  }
  table.lib td:first-child{padding-bottom:5px}
  table.lib td:first-child::before{content:none}
  table.lib td:first-child b{font-size:15px}

  .tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.ladder{min-width:360px}
}

/* ---------- 手机端（≤640px） ---------- */
@media (max-width:640px){
  .top{padding:calc(14px + env(safe-area-inset-top)) 14px 10px}
  main{padding:0 14px}
  .tabs{padding:0 14px;gap:2px;margin-bottom:16px}
  .tabs button{font-size:13.5px;padding:9px 11px}
  .panel{padding:14px}
  .kpis{grid-template-columns:repeat(2,1fr);gap:10px}
  .kpi{padding:12px}
  .kpi .num{font-size:22px}
  .kpi .ex{font-size:12px}
  .chip{font-size:13.5px;padding:7px 13px}
  .filters{gap:7px}
  /* 16px 可避免 iOS 聚焦输入框时自动放大页面 */
  input[type=text],input[type=search],select,textarea{font-size:16px}
  button.primary,button.ghost{padding:11px 18px;font-size:14.5px}
  .card-item{padding:12px 13px}
  .card-item h4{font-size:15.5px}
  .card-item p{font-size:14px;line-height:1.65}
  .nc-img{max-height:none}
  .formula{font-size:14.5px;padding:12px 13px}
  .foot{padding:12px 14px calc(34px + env(safe-area-inset-bottom))}
  h1{font-size:20px}
  h2{font-size:15.5px}
}

/* ---------- 打印（A3 横向单页海报） ---------- */
@media print{
  @page{size:A3 landscape;margin:10mm}
  body{font-size:10.5pt;background:#fff}
  .tabs,.filters,.foot,.notice{display:none !important}
  main{max-width:none;padding:0}
  .top{border-bottom:2px solid var(--ink);padding:0 0 8px;margin-bottom:10px}
  .tl,.panel,.kpi{break-inside:avoid}
  .tl-row{min-height:0}
  .tl-name{font-size:11pt}
  .tl-brief{font-size:9pt}
}
