:root{
  --bg:#f7f1f2;--panel:rgba(255,255,255,.92);--ink:#2b191c;--muted:#806b6e;
  --line:rgba(139,37,51,.14);--red:#b5273a;--red2:#e04c5c;--deep:#7b1927;
  --orange:#e37d36;--grey:#797477;--green:#2f9a68;--green2:#73c49c;
  --shadow:0 16px 46px rgba(90,24,34,.12)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;color:var(--ink);
  font-family:"Microsoft YaHei","PingFang SC","Segoe UI",sans-serif;
  background:
    linear-gradient(180deg,rgba(255,252,252,.94),rgba(247,241,242,.98)),
    radial-gradient(circle at 10% 0,rgba(181,39,58,.16),transparent 32%),var(--bg)
}
button,input,select{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
.ambient{
  position:fixed;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(181,39,58,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(181,39,58,.035) 1px,transparent 1px);
  background-size:40px 40px;mask-image:linear-gradient(#000,transparent 78%)
}
.shell{position:relative;width:min(1640px,calc(100% - 34px));margin:auto;padding:18px 0 36px}
.topbar{
  min-height:74px;display:grid;grid-template-columns:1fr minmax(420px,1.2fr) 1fr;
  align-items:center;gap:22px
}
.brand{display:inline-flex;align-items:center;gap:11px;width:max-content;color:inherit;text-decoration:none}
.brand-mark{
  display:grid;place-items:center;width:46px;height:46px;border-radius:12px;
  background:linear-gradient(145deg,var(--deep),var(--red2));color:#fff;font-size:26px;font-weight:950;
  box-shadow:0 12px 28px rgba(181,39,58,.25)
}
.brand>span:last-child{display:grid;gap:2px}
.brand small,.title-block p{margin:0;color:var(--red);font-size:10px;font-weight:900;letter-spacing:.16em}
.brand b{font-size:14px}
.title-block{text-align:center}
.title-block h1{margin:4px 0 0;font-size:clamp(27px,2.8vw,43px);letter-spacing:-.045em}
.title-block h1 span{color:var(--red);font-weight:540}
.header-actions{display:flex;justify-content:flex-end;align-items:center;gap:9px}
.sync{
  display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 12px;
  border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.75);
  color:var(--muted);font-size:11px;font-weight:800;white-space:nowrap
}
.sync i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(47,154,104,.1)}
.header-actions button,.reset{
  height:38px;padding:0 14px;border:1px solid var(--line);border-radius:9px;
  background:#fff;color:var(--deep);font-weight:900;cursor:pointer
}
.header-actions button:hover,.reset:hover{border-color:rgba(181,39,58,.35);background:#fff8f9}

.page-nav{
  display:grid;grid-template-columns:repeat(10,minmax(102px,1fr));gap:7px;margin:8px 0 12px;
  padding:7px;border:1px solid rgba(255,255,255,.9);border-radius:14px;
  background:rgba(255,255,255,.7);box-shadow:0 12px 36px rgba(90,24,34,.08);backdrop-filter:blur(14px)
}
.page-tab{
  position:relative;min-width:0;padding:10px 8px;border:0;border-radius:9px;background:transparent;
  color:#6d595d;text-align:left;cursor:pointer;transition:.2s ease
}
.page-tab span{display:block;margin-bottom:3px;color:#a38389;font-size:9px;font-weight:950;letter-spacing:.08em}
.page-tab b{display:block;overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.page-tab:hover{background:rgba(181,39,58,.06)}
.page-tab.active{background:linear-gradient(145deg,var(--deep),var(--red));color:#fff;box-shadow:0 8px 20px rgba(123,25,39,.24)}
.page-tab.active span{color:rgba(255,255,255,.7)}

.page-hero{
  display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:12px;padding:17px 20px;
  border:1px solid rgba(255,255,255,.95);border-radius:14px;background:linear-gradient(120deg,rgba(255,255,255,.95),rgba(252,243,245,.88));
  box-shadow:var(--shadow)
}
.eyebrow{margin:0 0 5px;color:var(--red);font-size:10px;font-weight:950;letter-spacing:.15em}
.page-hero h2{margin:0;font-size:23px;letter-spacing:-.02em}
.page-hero>div>p:last-child{margin:6px 0 0;color:var(--muted);font-size:12px}
.hero-stats{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.hero-stat{min-width:92px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.hero-stat strong,.hero-stat span{display:block}
.hero-stat strong{font-size:18px}
.hero-stat span{margin-top:2px;color:var(--muted);font-size:9px;font-weight:850;letter-spacing:.04em}
.hero-stat.good strong{color:var(--green)}
.hero-stat.bad strong{color:var(--red)}
.hero-stat.warn strong{color:var(--orange)}

.panel{
  overflow:hidden;border:1px solid rgba(255,255,255,.95);border-radius:13px;
  background:var(--panel);box-shadow:var(--shadow);backdrop-filter:blur(16px)
}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 18px;border-bottom:1px solid var(--line)}
.panel-head h3,.table-title h3{margin:0;font-size:17px}
.panel-head>span{color:var(--muted);font-size:10px;font-weight:850}
.loading-panel{padding:80px;border-radius:14px;background:#fff;color:var(--muted);text-align:center}

/* Schedule */
.schedule-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.schedule-card{min-width:0}
.schedule-head{display:flex;align-items:center;justify-content:space-between;padding:16px 17px;border-bottom:1px solid var(--line)}
.schedule-head>div{display:flex;align-items:center;gap:10px}
.area-code{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#f6eaec;color:var(--red);font-size:11px;font-weight:950}
.schedule-head h3{margin:0;font-size:17px}
.schedule-head small{display:block;margin-top:2px;color:var(--muted);font-size:9px}
.schedule-count{padding:6px 8px;border-radius:999px;background:#f7edef;color:var(--muted);font-size:9px;font-weight:900}
.schedule-list{max-height:720px;overflow:auto;padding:9px 11px 13px}
.schedule-date{margin-bottom:7px;border:1px solid rgba(139,37,51,.1);border-radius:10px;background:rgba(255,255,255,.76);overflow:hidden}
.schedule-date>summary,.schedule-stage>summary{list-style:none;cursor:pointer}
.schedule-date>summary::-webkit-details-marker,.schedule-stage>summary::-webkit-details-marker{display:none}
.schedule-date>summary{display:grid;grid-template-columns:15px auto 1fr auto;align-items:center;gap:7px;min-height:42px;padding:7px 8px}
.schedule-date[open]>summary{background:linear-gradient(90deg,rgba(181,39,58,.07),transparent)}
.schedule-toggle{position:relative;width:13px;height:13px;border:1px solid #b9acae;border-radius:3px;background:#fff}
.schedule-toggle:before,.schedule-toggle:after{content:"";position:absolute;inset:50% auto auto 50%;width:7px;height:1px;background:#75686a;transform:translate(-50%,-50%)}
.schedule-toggle:after{transform:translate(-50%,-50%) rotate(90deg)}
.schedule-date[open]>summary .schedule-toggle:after{display:none}
.schedule-date time{font-size:10px;font-weight:950;white-space:nowrap}
.schedule-volume{overflow:hidden;color:var(--muted);font-size:8px;font-weight:800;text-align:right;text-overflow:ellipsis;white-space:nowrap}
.schedule-date>summary>b,.schedule-stage>summary>b,.schedule-vehicles li>b{padding:4px 6px;border-radius:999px;background:rgba(47,154,104,.1);color:var(--green);font-size:8px;font-style:normal}
.schedule-date.ng>summary>b,.schedule-stage.ng>summary>b,.schedule-vehicles li.ng>b{background:rgba(181,39,58,.1);color:var(--red)}
.schedule-stages{padding:0 7px 8px}
.schedule-stage{margin-top:6px;border-left:2px solid rgba(47,154,104,.36);border-radius:0 7px 7px 0;background:#faf7f7}
.schedule-stage.ng{border-left-color:rgba(181,39,58,.5)}
.schedule-stage>summary{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:7px;padding:8px}
.schedule-stage>summary span{min-width:0}
.schedule-stage>summary strong,.schedule-stage>summary small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.schedule-stage>summary strong{font-size:10px}
.schedule-stage>summary small{margin-top:2px;color:#8c777b;font-size:7px;font-weight:800;letter-spacing:.03em}
.schedule-stage>summary em{color:var(--muted);font-size:8px;font-style:normal;font-weight:850}
.schedule-vehicles{margin:0;padding:0 8px 7px;list-style:none}
.schedule-vehicles li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:7px;padding:7px 0;border-top:1px solid rgba(139,37,51,.08)}
.vehicle-sequence{display:grid;place-items:center;min-height:22px;border-radius:6px;background:#efe8e9;color:#493b3e;font-size:9px;font-weight:950}
.schedule-vehicles code{overflow:hidden;color:#4d3e41;font-family:"SFMono-Regular",Consolas,monospace;font-size:8px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}
.schedule-note{margin-top:12px;padding:13px 15px;border:1px dashed rgba(181,39,58,.22);border-radius:11px;color:var(--muted);font-size:10px}

/* Actions */
.filter-bar{
  display:flex;align-items:flex-end;gap:11px;margin-bottom:12px;padding:12px 14px;
  border:1px solid rgba(255,255,255,.95);border-radius:13px;background:rgba(255,255,255,.75);
  box-shadow:0 12px 36px rgba(90,24,34,.08)
}
.filter-intro{align-self:center;margin-right:auto}
.filter-intro strong{font-size:13px}
.filter-bar label>span{display:block;margin:0 0 5px;color:var(--muted);font-size:10px;font-weight:800}
.filter-bar select,.search-box{
  width:180px;height:37px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);outline:0
}
.filter-bar select{padding:0 28px 0 10px}
.search-box{display:flex;align-items:center;width:290px}
.search-box i{padding:0 8px;color:var(--red);font-size:17px;font-style:normal}
.search-box input{min-width:0;width:100%;height:100%;border:0;outline:0;background:transparent}
.action-overview{display:grid;grid-template-columns:.82fr 1.2fr 1.2fr;gap:12px;margin-bottom:12px}
.donut-area{display:flex;align-items:center;justify-content:center;gap:27px;min-height:260px;padding:20px}
.donut{display:grid;place-items:center;flex:0 0 154px;width:154px;height:154px;border-radius:50%}
.donut:before{content:"";grid-area:1/1;width:100px;height:100px;border-radius:50%;background:#fff;box-shadow:0 0 26px rgba(90,24,34,.07)}
.donut>div{position:relative;grid-area:1/1;text-align:center}
.donut strong,.donut span{display:block}
.donut strong{font-size:25px}
.donut span{margin-top:2px;color:var(--muted);font-size:9px}
.status-legend{min-width:164px}
.legend-row{display:flex;align-items:center;gap:8px;margin:11px 0;font-size:11px}
.legend-row i{width:8px;height:8px;border-radius:50%}
.legend-row span{flex:1;color:var(--muted)}
.legend-row b{font-size:12px}
.stack-chart{
  display:flex;align-items:flex-end;justify-content:flex-start;gap:14px;min-height:260px;
  padding:30px 15px 17px;overflow-x:auto;
  background:repeating-linear-gradient(to top,transparent 0,transparent 55px,rgba(139,37,51,.07) 56px)
}
.stack-col{display:grid;grid-template-rows:170px auto;gap:8px;min-width:60px;text-align:center}
.stack-slot{position:relative;display:flex;align-items:flex-end;justify-content:center}
.stack-bar{width:32px;display:flex;flex-direction:column-reverse;border-radius:6px 6px 2px 2px;overflow:hidden;box-shadow:0 7px 18px rgba(90,24,34,.12)}
.stack-seg{display:grid;place-items:center;min-height:2px;color:#fff;font-size:8px;font-weight:950}
.stack-total{position:absolute;bottom:calc(var(--height) + 6px);left:50%;transform:translateX(-50%);font-size:10px;font-weight:950}
.stack-label{max-width:75px;color:#57464a;font-size:9px;font-weight:850;line-height:1.2}

.table-title{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 18px;border-bottom:1px solid var(--line)}
.table-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.download-list{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:34px;padding:0 13px;
  border:1px solid rgba(143,31,45,.25);border-radius:9px;color:#fff;background:linear-gradient(135deg,#a52739,#7f1726);
  box-shadow:0 6px 16px rgba(123,25,39,.16);font-size:10px;font-weight:950;cursor:pointer;white-space:nowrap
}
.download-list span{font-size:15px;line-height:1}
.download-list:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(123,25,39,.22)}
.download-list:focus-visible{outline:3px solid rgba(181,39,58,.2);outline-offset:2px}
.download-list.is-done{border-color:rgba(47,154,104,.3);background:linear-gradient(135deg,#349d70,#237c56)}
.table-summary{display:flex;align-items:center;gap:8px}
.table-summary span{padding:7px 10px;border-radius:999px;background:#f8edef;color:var(--muted);font-size:9px;font-weight:850}
.table-summary span:first-child{background:rgba(181,39,58,.09);color:var(--red)}
.table-scroll{max-height:620px;overflow:auto}
table{width:100%;min-width:1450px;border-collapse:separate;border-spacing:0}
th{
  position:sticky;top:0;z-index:3;padding:12px 11px;border-bottom:1px solid rgba(123,25,39,.25);
  background:#fbf4f5;color:#6d565a;font-size:10px;font-weight:950;text-align:left;letter-spacing:.03em
}
td{padding:11px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.52);font-size:11px;line-height:1.5;vertical-align:top}
tbody tr:nth-child(even) td{background:rgba(248,242,243,.68)}
tbody tr:hover td{background:rgba(181,39,58,.055)}
th:nth-child(1),td:nth-child(1){width:58px;text-align:center}
th:nth-child(2),td:nth-child(2){width:62px;text-align:center}
th:nth-child(3),td:nth-child(3){width:92px}
th:nth-child(4),td:nth-child(4){width:92px}
th:nth-child(5),td:nth-child(5){width:110px}
th:nth-child(6),td:nth-child(6){width:310px}
th:nth-child(7),td:nth-child(7){width:125px}
th:nth-child(8),td:nth-child(8){width:390px}
th:nth-child(9),td:nth-child(9){width:110px}
.rpn{display:inline-grid;place-items:center;min-width:40px;height:27px;border-radius:7px;background:rgba(181,39,58,.09);color:var(--deep);font-weight:950}
.tag{display:inline-flex;min-height:25px;align-items:center;padding:0 8px;border-radius:999px;background:#f2eaec;color:#653940;font-weight:850;white-space:nowrap}
.defect{font-weight:760;white-space:pre-line}
.action{color:#5f4d50;white-space:pre-line}
.no-action{color:var(--red);font-weight:900}
.status{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:0 9px;border-radius:999px;font-weight:950;white-space:nowrap}
.status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.s-done{background:rgba(47,154,104,.11);color:var(--green)}
.s-late{background:rgba(181,39,58,.1);color:var(--red)}
.s-active{background:rgba(227,125,54,.12);color:#b65a1e}
.empty{padding:42px;text-align:center;color:var(--muted)}

/* Metric pages */
.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.metric-card{min-width:0}
.metric-card.wide{grid-column:1/-1}
.metric-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:14px 16px;border-bottom:1px solid var(--line)}
.metric-head h3{margin:0;font-size:15px}
.metric-head h3 span,.metric-head h3 small{display:block}
.metric-head h3 small{margin-top:3px;color:#8d777b;font-size:9px;font-weight:850;letter-spacing:.035em}
.metric-target{margin-top:5px;color:var(--muted);font-size:9px;font-weight:800}
.metric-target b{color:#4e3d40}
.metric-state{padding:6px 8px;border-radius:999px;font-size:9px;font-weight:950;white-space:nowrap}
.metric-state.good{background:rgba(47,154,104,.1);color:var(--green)}
.metric-state.bad{background:rgba(181,39,58,.1);color:var(--red)}
.metric-state.na{background:rgba(121,116,119,.1);color:var(--grey)}
.metric-visual{padding:12px 14px 14px}
.metric-chart-key{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-bottom:7px;color:#7e696d;font-size:8px;font-weight:850}
.metric-chart-key span{display:inline-flex;align-items:center;gap:5px}
.metric-chart-key i{display:inline-block}
.key-target{width:17px;height:2px;background:#332528}
.key-actual{width:8px;height:10px;border-radius:2px;background:var(--green)}
.metric-scroll{overflow-x:auto;padding:2px 0 3px}
.metric-chart-inner{position:relative;min-width:max(100%,calc(var(--point-count) * 82px))}
.target-layer{position:absolute;z-index:3;top:0;left:0;width:100%;height:100px;overflow:visible;pointer-events:none}
.target-layer .zero-axis{stroke:rgba(139,37,51,.15);stroke-width:1;vector-effect:non-scaling-stroke}
.target-layer .target{fill:none;stroke:#332528;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.target-layer .limit{fill:none;stroke:#8d7e81;stroke-width:1.2;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.target-layer .target-dot{stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}
.target-layer .target-dot.pass{fill:var(--green)}
.target-layer .target-dot.fail{fill:var(--red)}
.target-layer .target-dot.na{fill:var(--grey)}
.metric-points{display:grid;grid-template-columns:repeat(var(--point-count),minmax(74px,1fr));gap:7px;min-height:130px;padding:0 2px 2px}
.metric-point{
  position:relative;display:grid;grid-template-rows:100px auto;min-width:74px;min-height:130px;
  padding:0 6px 7px;border-radius:9px;background:linear-gradient(180deg,rgba(248,242,243,.62),rgba(255,255,255,.75));text-align:center
}
.point-bar-zone{position:relative;height:100px}
.point-bar{position:absolute;z-index:2;top:calc(var(--bar-top) * 1%);left:50%;width:26px;height:max(3px,calc(var(--bar-height) * 1%));border-radius:5px 5px 2px 2px;background:var(--green);color:#fff;transform:translateX(-50%)}
.point-bar i{position:absolute;top:3px;left:50%;font-size:8px;font-style:normal;font-weight:950;line-height:1;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.18);transform:translateX(-50%)}
.metric-point.fail .point-bar{background:var(--red)}
.metric-point.na .point-bar{background:#9d9698}
.point-meta strong,.point-meta span,.point-meta time{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.point-meta strong{margin-top:4px;font-size:9px}
.point-meta span{margin-top:2px;color:#6e5b5e;font-size:8px}
.point-meta time{margin-top:2px;color:#9a8589;font-size:7px}
.breakdown{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.breakdown span{padding:7px 9px;border-radius:8px;background:#f7edef;color:#654d51;font-size:9px;font-weight:850}
.metric-note{padding:14px;color:var(--muted);font-size:11px;text-align:center}

footer{display:flex;justify-content:space-between;gap:20px;padding:15px 2px 0;color:var(--muted);font-size:9px}
footer a{color:var(--red);font-weight:850;text-decoration:none}

@media(max-width:1280px){
  .topbar{grid-template-columns:1fr 1.35fr 1fr}
  .page-nav{display:flex;overflow-x:auto}.page-tab{flex:0 0 118px}
  .action-overview{grid-template-columns:1fr 1fr}.status-card{grid-column:1/-1}
}
@media(max-width:960px){
  .shell{width:min(100% - 20px,1640px)}
  .topbar{grid-template-columns:1fr 1fr}.title-block{grid-column:1/-1;grid-row:1}
  .brand{grid-row:2}.header-actions{grid-row:2}
  .schedule-grid,.metric-grid{grid-template-columns:1fr 1fr}
  .filter-bar{flex-wrap:wrap}.filter-intro{width:100%}.filter-bar .search-box{width:250px}
}
@media(max-width:700px){
  .shell{width:min(100% - 14px,1640px);padding-top:8px}
  .topbar{display:flex;align-items:flex-start;flex-direction:column;gap:10px}
  .title-block{text-align:left}.brand{display:none}.header-actions{width:100%;justify-content:space-between}
  .sync{font-size:9px}.page-hero{display:block}.hero-stats{justify-content:flex-start;margin-top:13px}
  .schedule-grid,.metric-grid,.action-overview{grid-template-columns:1fr}.status-card{grid-column:auto}
  .filter-bar{display:grid;grid-template-columns:1fr 1fr}.filter-intro{grid-column:1/-1}
  .filter-bar label,.filter-bar select,.filter-bar .search-box{width:100%}.search-label{grid-column:1/-1}.reset{width:100%}
  .donut-area{flex-direction:column}.table-title{align-items:flex-start;flex-direction:column}.table-tools{width:100%;align-items:flex-start;justify-content:flex-start}.download-list{width:100%}.table-summary{flex-wrap:wrap}
  .metric-card.wide{grid-column:auto}footer{flex-direction:column}
}
@media print{
  body{background:#fff}.ambient,.header-actions,.page-nav,.filter-bar,footer{display:none!important}
  .shell{width:100%;padding:0}.panel,.page-hero{box-shadow:none}.table-scroll{max-height:none;overflow:visible}
}
