/* Hallmark · v2.0.0 · theme: Cobalt (2/3) · genre: modern-minimal · shape: app screen · signature: plan clock over the dispatch ledger */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R5 V4 · focused the first screen on the real schedule and its order ledger */
:root {
  --paper: oklch(98.6% 0.005 250);
  --panel: oklch(99.6% 0.002 250);
  --tray: oklch(96.2% 0.008 252);
  --ink: oklch(21% 0.028 262);
  --muted: oklch(46% 0.022 260);
  --rule: oklch(90% 0.009 252);
  --control-border: oklch(63% 0.016 252);
  --accent: oklch(49% 0.19 258);
  --accent-active: oklch(43% 0.19 258);
  --accent-wash: oklch(95% 0.028 256);
  --graphite: oklch(22% 0.032 262);
  --graphite-rule: oklch(41% 0.037 260);
  --graphite-ink: oklch(95% 0.012 250);
  --graphite-muted: oklch(80% 0.026 254);
  --success: oklch(41% 0.105 155);
  --attention: oklch(43% 0.104 65);
  --danger: oklch(44% 0.14 24);
  --danger-wash: oklch(96% 0.022 24);
  --font-body: system-ui, "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-machine: ui-monospace, "Cascadia Mono", "Microsoft YaHei", monospace;
  --radius: .5rem;
  --duration: 120ms;
}
* { box-sizing: border-box; }
html, body { overflow-x: clip; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 400 1rem/1.55 var(--font-body); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.shell { width: min(100% - 3rem, 72rem); margin-inline: auto; }
.topbar { background: var(--panel); border-bottom: 1px solid var(--rule); }
.bar-content { min-height: 4.5rem; display: flex; align-items: center; gap: 2.5rem; }
.brand { display: inline-flex; align-items: center; gap: .65rem; color: var(--ink); font-weight: 690; text-decoration: none; white-space: nowrap; }
.brand svg { color: var(--accent); }
nav { display: flex; align-self: stretch; gap: .25rem; }
nav a { display: flex; align-items: center; padding-inline: .85rem; color: var(--muted); text-decoration: none; font-size: .92rem; border-bottom: 2px solid transparent; }
nav a:hover { color: var(--accent); background: var(--paper); }
nav a[aria-current] { color: var(--accent); border-color: var(--accent); font-weight: 650; }
.logout { margin-left: auto; }
main.shell { padding-block: 2.5rem 3rem; min-height: 65vh; }
.footer { border-top: 1px solid var(--rule); padding-block: 1.1rem 1.5rem; color: var(--muted); font-size: .875rem; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 2rem; letter-spacing: -.035em; line-height: 1.2; overflow-wrap: break-word; min-width: 0; }
h1, h2 { text-wrap: balance; }
h2 { font-size: 1.18rem; letter-spacing: -.01em; }
.page-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.45rem; }
.page-head p { margin-top: .5rem; }
.muted, .hint, small { color: var(--muted); }
.hint, small { font-size: .85rem; }
.hint { margin-top: .65rem; }
small { display: block; margin-top: .15rem; }
a { color: var(--accent); text-decoration-color: var(--control-border); text-underline-offset: .22em; }
a:hover { text-decoration-color: var(--accent); }
a.back { display: inline-block; font-size: .9rem; margin-bottom: .65rem; }
button, .button { font: 600 .9rem/1.25 var(--font-body); color: var(--ink); border: 1px solid var(--control-border); border-bottom-width: 2px; background: var(--panel); border-radius: var(--radius); padding: .55rem .85rem; min-height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; cursor: pointer; transition: background var(--duration), color var(--duration); white-space: nowrap; }
button:hover, .button:hover { background: var(--tray); color: var(--accent); }
button:active, .button:active { border-bottom-width: 1px; padding-bottom: calc(.55rem + 1px); }
button.primary, .button.primary { background: var(--accent); border-color: var(--accent-active); color: var(--panel); }
button.primary:hover, .button.primary:hover { background: var(--accent-active); }
button.quiet { border-color: transparent; background: transparent; color: var(--muted); }
button.quiet:hover { background: var(--tray); color: var(--ink); }
button:disabled { color: var(--muted); background: var(--tray); cursor: default; }
.plan-board { display: grid; grid-template-columns: 1.35fr repeat(3, minmax(0, 1fr)); background: var(--graphite); color: var(--graphite-ink); border-radius: var(--radius); margin-bottom: 1.4rem; }
.plan-board > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 1.55rem 1.55rem; gap: .5rem; min-width: 0; }
.plan-board > div + div { border-left: 1px solid var(--graphite-rule); }
.plan-board span, .plan-board a { color: var(--graphite-muted); font-size: .88rem; }
.plan-board a:hover { color: var(--graphite-ink); }
.plan-board a:focus-visible { outline-color: var(--graphite-muted); }
.plan-clock strong { font-size: 2.75rem; line-height: 1.15; font-variant-numeric: tabular-nums; letter-spacing: -.035em; }
.plan-stat strong { font-size: 1.7rem; line-height: 1.22; font-variant-numeric: tabular-nums; }
.panel { background: var(--panel); border: 1px solid var(--rule); border-radius: var(--radius); margin-bottom: 1.35rem; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.05rem 1.25rem; }
.panel-head .muted { font-size: .9rem; margin-top: .2rem; }
.table-wrap { overflow-x: auto; max-width: 100%; }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: .925rem; text-align: left; }
th, td { border-top: 1px solid var(--rule); padding: .75rem 1.05rem; vertical-align: middle; }
th { background: var(--tray); color: var(--muted); font-size: .85rem; font-weight: 600; white-space: nowrap; }
td { overflow-wrap: anywhere; }
td.machine { white-space: nowrap; }
tr:hover td { background: var(--paper); }
.machine { font-family: var(--font-machine); font-variant-numeric: tabular-nums; font-size: .9rem; }
.status { color: var(--muted); font-weight: 620; white-space: nowrap; }
.status.completed, .status.shipped { color: var(--success); }
.status.attention, .status.waiting, .status.review { color: var(--attention); }
.status.error, .status.interrupted { color: var(--danger); }
.status.queued, .status.running, .status.preview { color: var(--accent); }
.empty { border-top: 1px solid var(--rule); padding: 2.25rem 1.25rem; }
.empty p { margin-block: .28rem .5rem; color: var(--muted); }
.actions { white-space: nowrap; }
.actions > form { display: inline-block; margin-left: .3rem; }
.config-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.config-panel { padding: 1.25rem; }
form.config-panel { max-width: 48rem; }
.side > * + * { margin-top: .65rem; }
.side hr { margin-block: 1.1rem; border: 0; border-top: 1px solid var(--rule); }
.stack { display: grid; gap: .95rem; }
fieldset { min-width: 0; margin: 0; border: 0; padding: 0 0 1.15rem; border-bottom: 1px solid var(--rule); }
legend { padding: 0; font-size: 1.05rem; font-weight: 650; margin-bottom: .75rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1rem; }
label { font-size: .9rem; font-weight: 610; display: grid; gap: .35rem; }
input:not([type=checkbox]):not([type=hidden]), select { width: 100%; min-width: 0; font: 400 .95rem/1.3 var(--font-body); color: var(--ink); background: var(--panel); border: 1px solid var(--control-border); border-radius: var(--radius); padding: .6rem .65rem; min-height: 2.75rem; }
input::placeholder { color: var(--muted); opacity: 1; }
input:hover, select:hover { border-color: var(--accent); }
input[type=checkbox] { accent-color: var(--accent); inline-size: 1rem; block-size: 1rem; margin: 0; flex: 0 0 1rem; }
label.check { display: flex; gap: .5rem; align-items: center; min-height: 2.75rem; }
.schedule-form { display: grid; grid-template-columns: 1fr 1.25fr 1fr auto; align-items: end; gap: 1rem; margin-top: .75rem; }
.notice { background: var(--accent-wash); color: var(--ink); border: 1px solid var(--rule); border-radius: var(--radius); padding: .8rem 1rem; margin-bottom: 1.1rem; }
.notice.error { background: var(--danger-wash); color: var(--danger); }
.auth-shell { display: grid; justify-items: start; align-content: start; }
.login-panel { width: min(100%, 28rem); padding: 1.65rem; margin-top: 2rem; }
.login-panel p { margin: .6rem 0 1.35rem; }
.login-panel button { justify-self: start; }
.summary { margin: 0; display: flex; flex-wrap: wrap; border-top: 1px solid var(--rule); }
.summary div { padding: .8rem 1.25rem; min-width: 8rem; }
.summary dt { font-size: .85rem; color: var(--muted); }
.summary dd { margin: .15rem 0 0; font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.pager { display: flex; gap: .75rem; align-items: center; border-top: 1px solid var(--rule); padding: .75rem 1rem; }
@media (max-width: 56rem) {
  .bar-content { gap: 1rem; }
  .config-layout { grid-template-columns: minmax(0, 1fr); }
  .schedule-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plan-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plan-board > div:nth-child(3) { border-left: 0; }
  .plan-board > div:nth-child(n+3) { border-top: 1px solid var(--graphite-rule); }
}
@media (max-width: 36rem) {
  .shell { width: calc(100% - 1.5rem); }
  .bar-content { flex-wrap: wrap; gap: 0; padding-top: .4rem; }
  nav { order: 3; flex: 0 0 100%; min-height: 2.8rem; }
  nav a { padding-inline: .55rem; }
  main.shell { padding-block: 1.4rem 2rem; }
  h1 { font-size: 1.6rem; }
  .page-head { align-items: flex-start; flex-wrap: wrap; }
  .plan-board > div { padding: .85rem; }
  .plan-clock strong { font-size: 2.2rem; }
  .plan-stat strong { font-size: 1.35rem; }
  .form-grid, .schedule-form { grid-template-columns: minmax(0, 1fr); }
  .schedule-form button { justify-self: start; }
  .summary div { min-width: 6.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0s !important; }
}