:root { --ink:#173f35; --muted:#6d7d76; --paper:#f4f7f5; --card:#fff; --line:#dce5e1; --mint:#dff2e7; --green:#167b5b; --danger:#c4473d; --danger-bg:#fff0ed; --amber:#a66a12; --shadow:0 14px 36px rgba(23,63,53,.08); }
* { box-sizing:border-box; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif; }
body.modal-open { overflow:hidden; }
button,select { font:inherit; }
button { cursor:pointer; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:24px clamp(20px,4vw,64px) 18px; background:var(--card); border-bottom:1px solid var(--line); }
h1,h2,h3,h4,p { margin-top:0; }
h1 { margin-bottom:0; font-size:clamp(24px,3vw,36px); letter-spacing:-.03em; }
.eyebrow { margin-bottom:6px; font-size:11px; font-weight:800; letter-spacing:.16em; color:var(--green); }
.system-state { text-align:right; }
.system-state p { margin:5px 0 0; font-size:11px; color:var(--muted); }
.network { border:0; border-radius:999px; padding:8px 12px; color:var(--ink); background:var(--mint); font-weight:700; }
.network.offline { background:#fff0d9; color:#7d4d08; }
.dot { display:inline-block; width:8px; height:8px; border-radius:50%; background:#28a777; margin-right:6px; }
.offline .dot { background:#e19628; }
.nav { display:flex; gap:6px; overflow:auto; padding:12px clamp(20px,4vw,64px); background:var(--card); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; }
.nav-button { border:0; background:transparent; color:var(--muted); padding:10px 17px; border-radius:10px; font-weight:700; white-space:nowrap; }
.nav-button[hidden] { display:none !important; }
.nav-button.active { background:var(--ink); color:#fff; }
main { width:min(1180px,calc(100% - 40px)); margin:32px auto 80px; }
.hero { display:flex; justify-content:space-between; align-items:center; gap:24px; background:linear-gradient(120deg,#173f35,#216d58); color:white; border-radius:24px; padding:32px 36px; box-shadow:var(--shadow); }
.hero h2 { margin-bottom:8px; font-size:clamp(26px,4vw,42px); }
.hero p:last-child { margin:0; color:#d6ebe4; }
.hero .eyebrow { color:#9edabc; }
.hero-count { min-width:120px; text-align:center; padding:18px; border:1px solid rgba(255,255,255,.22); border-radius:18px; background:rgba(255,255,255,.08); }
.hero-count strong { display:block; font-size:48px; line-height:1; }
.hero-count span { font-size:12px; color:#d6ebe4; }
.metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:18px 0 36px; }
.metrics article { background:var(--card); padding:20px; border:1px solid var(--line); border-radius:16px; }
.metrics span,.metrics small { display:block; color:var(--muted); }
.metrics strong { display:block; margin:8px 0 2px; font-size:30px; }
.section-head { display:flex; justify-content:space-between; align-items:end; margin:36px 0 14px; }
.section-head h2 { margin:0; font-size:24px; }
.section-head.compact { margin-top:0; }
.danger-text { color:var(--danger); }
.text-button { border:0; background:transparent; color:var(--green); font-weight:800; }
.attention-list { display:grid; gap:12px; }
.attention-overflow { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; align-items:center; gap:12px; width:100%; box-sizing:border-box; padding:14px 18px; border:1px solid #d7b66e; border-radius:14px; background:var(--amber-bg); color:#67450c; }
.attention-overflow span { min-width:0; font-size:13px; }
.attention-overflow strong,.attention-overflow span { min-width:0; writing-mode:horizontal-tb; }
.attention-overflow .secondary { flex:0 0 auto; margin:0; border-color:currentColor; }
.attention-card { display:grid; grid-template-columns:54px 1fr 150px; gap:18px; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px; }
.attention-card.unassigned { border-left:5px solid var(--danger); }
.number { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:var(--danger-bg); color:var(--danger); font-weight:900; }
.card-title { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.card-title h3 { margin:0; }
.attention-main p { margin:6px 0; font-weight:750; }
.attention-main small,.student-row small,.table-row small,.route-card p,.trip-panel header p { color:var(--muted); }
.owner span,.owner strong { display:block; }
.owner span { font-size:11px; color:var(--muted); }
.owner button,.secondary,.icon-action,.row-actions button { border:1px solid var(--line); background:white; color:var(--ink); border-radius:9px; padding:8px 10px; margin-top:7px; font-weight:700; }
.pill { display:inline-block; padding:5px 9px; border-radius:999px; font-size:11px; font-weight:800; white-space:nowrap; }
.pill.danger { background:var(--danger-bg); color:var(--danger); }
.pill.warning { background:var(--amber-bg); color:#67450c; }
.pill.safe { background:var(--mint); color:var(--green); }
.pill.neutral { background:#edf1ef; color:#52615b; }
.route-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.route-card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:20px; }
.route-top,.route-count { display:flex; justify-content:space-between; }
.route-top span { color:var(--green); font-weight:800; }
.route-card h3 { margin:15px 0 5px; font-size:23px; }
.progress { display:block; width:100%; height:8px; border:0; border-radius:9px; overflow:hidden; margin:20px 0 10px; background:#e8eeeb; appearance:none; }
.progress::-webkit-progress-bar { background:#e8eeeb; border-radius:9px; }
.progress::-webkit-progress-value { background:var(--green); border-radius:9px; }
.progress::-moz-progress-bar { background:var(--green); border-radius:9px; }
.progress.has-attention::-webkit-progress-value { background:#c58b2d; }
.progress.has-attention::-moz-progress-bar { background:#c58b2d; }
.page-title { margin-bottom:24px; }
.page-title h2 { font-size:clamp(28px,4vw,42px); margin-bottom:8px; }
.page-title > p:last-child { color:var(--muted); max-width:720px; }
.split { display:flex; justify-content:space-between; align-items:end; gap:24px; }
.primary { border:0; border-radius:11px; padding:12px 16px; background:var(--green); color:white; font-weight:800; }
.wide { width:100%; margin-top:20px; }
.trip-stack { display:grid; gap:22px; }
.trip-live-status { position:sticky; top:63px; z-index:8; display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:48px; margin:-10px 0 16px; padding:10px 15px; border:1px solid; border-radius:12px; box-shadow:0 8px 22px rgba(23,63,53,.12); }
.trip-live-status.is-safe { border-color:#78af98; background:#e8f6ee; color:#125d46; }
.trip-live-status.is-warning { border-color:#d29a32; background:#fff4d8; color:#67450c; }
.trip-live-status.is-danger { border-color:#c9564d; background:#fff0ed; color:#7c211b; }
.trip-live-status span { font-size:13px; font-weight:700; }
.trip-panel { background:var(--card); border:1px solid var(--line); border-radius:20px; overflow:hidden; }
.trip-panel > header { display:flex; justify-content:space-between; align-items:center; padding:22px; border-bottom:1px solid var(--line); }
.trip-panel h3 { margin:7px 0 4px; font-size:24px; }
.vehicle,.reception { color:var(--green); font-weight:900; }
.student-list { padding:4px 22px; }
.student-row { display:grid; grid-template-columns:42px 1fr 170px 90px 70px; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--line); }
.student-avatar { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:var(--mint); font-weight:900; }
.student-row small,.table-row small { display:block; margin-top:3px; }
.icon-action { margin:0; }
.icon-action.warn { color:var(--danger); }
.trip-panel footer { padding:18px 22px; background:#fafcfa; }
.trip-panel footer small { display:block; margin-top:5px; color:var(--muted); }
.table-card { background:var(--card); border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.table-head,.table-row { display:grid; grid-template-columns:1.2fr 1fr 1.2fr 1fr; align-items:center; gap:12px; padding:14px 20px; }
.table-head { background:#eaf0ed; color:var(--muted); font-size:11px; font-weight:800; }
.table-row { border-top:1px solid var(--line); }
.row-actions { display:flex; gap:6px; }
.row-actions button { margin:0; }
.pickup-layout { display:grid; grid-template-columns:360px 1fr; gap:24px; align-items:start; }
.request-box,.pickup-list article,.empty,.incident-card { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:22px; }
.request-box label { display:grid; gap:8px; color:var(--muted); font-size:13px; font-weight:700; }
select { width:100%; padding:12px; border:1px solid var(--line); border-radius:10px; background:white; color:var(--ink); }
.hint { margin:12px 0 0; color:var(--muted); font-size:12px; }
.eligibility-empty { margin-top:14px; padding:15px; border:1px solid var(--line); border-radius:12px; background:#f3f6f4; }
.eligibility-empty strong { display:block; }
.eligibility-empty p { margin:5px 0 0; color:var(--muted); font-size:12px; }
.device-line { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-bottom:16px; margin-bottom:18px; border-bottom:1px solid var(--line); }
.device-line span,.device-line strong { display:block; }
.device-line span { color:var(--muted); font-size:11px; }
.device-ok { color:var(--green); }.device-error { color:var(--danger); }
.warning-box { background:var(--danger-bg); color:var(--danger); padding:13px; border-radius:11px; margin-bottom:18px; }
.warning-box p { margin:5px 0 0; font-size:12px; }
.pickup-list { display:grid; gap:12px; }
.pickup-list article { display:flex; justify-content:space-between; align-items:center; gap:18px; }
.pickup-list h3 { margin:5px 0; }
.pickup-list p,.empty { color:var(--muted); }
.pickup-card-main { flex:1; min-width:0; }
.pickup-card-head { display:flex; align-items:center; gap:8px; }
.pickup-step { padding:4px 8px; border-radius:999px; background:var(--info-bg); color:#174f78; font-size:12px; font-weight:850; }
.pickup-card p { margin:5px 0; }
.pickup-card small { color:var(--muted); }
.pickup-card details { margin-top:10px; color:var(--muted); font-size:13px; }
.pickup-card details summary { min-height:44px; display:flex; align-items:center; cursor:pointer; font-weight:750; color:var(--green); }
.pickup-card details ol { margin:4px 0 0; padding-left:20px; }
.pickup-next { flex:0 0 auto; min-width:190px; min-height:52px; }
.pickup-done { border-color:#78af98 !important; background:#fbfffc !important; }
.handover-summary { display:flex; flex-direction:column; padding:16px; margin:16px 0; border:1px solid #78af98; border-radius:12px; background:var(--mint); }
.handover-summary strong { font-size:20px; }
.handover-summary span { color:var(--muted); font-size:13px; }
.incident-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.incident-card { position:relative; }
.incident-status { position:absolute; right:18px; top:18px; color:var(--muted); font-size:11px; font-weight:900; }
.incident-card h4 { margin:18px 0 8px; font-size:18px; }
.incident-card > p { color:var(--muted); min-height:48px; }
dl { display:grid; gap:7px; padding:14px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
dl div { display:flex; justify-content:space-between; }
dt { color:var(--muted); } dd { margin:0; font-weight:700; }
.incident-actions { display:flex; gap:8px; margin-top:15px; }
.resolved { color:var(--green); font-weight:800; }
.timeline { max-width:800px; }
.timeline article { display:grid; grid-template-columns:55px 18px 1fr; gap:10px; }
.timeline-time { padding-top:17px; font-weight:800; }
.timeline-marker { position:relative; }
.timeline-marker::before { content:""; position:absolute; left:8px; top:0; bottom:0; width:2px; background:var(--line); }
.timeline-marker::after { content:""; position:absolute; top:21px; left:3px; width:10px; height:10px; border-radius:50%; background:var(--green); border:2px solid var(--paper); }
.timeline-body { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:15px; margin-bottom:12px; }
.timeline-body p { margin:6px 0; }.timeline-body small { display:block;color:var(--muted); }.timeline-body code { display:block; margin-top:9px; font-size:10px; color:#84928c; }
.audit-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.audit-foot .text-button { font-size:11px; white-space:nowrap; }
.import-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.source-context { display:grid; grid-template-columns:1fr 1.15fr 1.35fr; gap:1px; margin-bottom:14px; overflow:hidden; border:1px solid var(--line); border-radius:15px; background:var(--line); }
.source-context div { min-width:0; padding:13px 16px; background:var(--card); }
.source-context span,.source-context strong { display:block; }
.source-context span { color:var(--muted); font-size:11px; font-weight:700; }
.source-context strong { margin-top:4px; font-size:13px; line-height:1.45; }
.import-summary article { background:var(--card); border:1px solid var(--line); border-radius:15px; padding:18px; }
.import-summary span { display:block; color:var(--muted); font-size:12px; }
.import-summary strong { display:block; margin-top:7px; font-size:28px; }
.import-summary .review { border-color:#efb0aa; background:var(--danger-bg); }
.import-warning { margin-bottom:16px; }
.import-table { background:var(--card); border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.import-head,.import-table article { display:grid; grid-template-columns:60px 1fr 1.5fr 2fr; gap:14px; align-items:start; padding:14px 18px; }
.import-head { background:#eaf0ed; color:var(--muted); font-size:11px; font-weight:800; }
.import-table article { border-top:1px solid var(--line); }
.import-table small,.import-table em { display:block; margin-top:4px; color:var(--muted); font-size:11px; font-style:normal; }
.import-table em { color:var(--amber); font-weight:700; }
.import-table ul { margin:8px 0 0; padding-left:18px; color:var(--muted); font-size:11px; }
.sync { margin-left:auto; border-radius:99px; padding:4px 8px; font-size:10px; font-weight:800; }.sync.synced { background:var(--mint); color:var(--green); }.sync.pending { background:#fff0d9;color:var(--amber); }
.toast { position:fixed; left:50%; bottom:28px; transform:translate(-50%,24px); opacity:0; pointer-events:none; background:var(--ink); color:white; padding:13px 18px; border-radius:12px; box-shadow:var(--shadow); transition:.2s; z-index:50; max-width:calc(100% - 32px); }
.toast.show { opacity:1; transform:translate(-50%,0); }.toast.warn { background:#7d4d08; }.toast.error { background:#a82f28; }
@media (max-width:800px) { .metrics,.import-summary { grid-template-columns:repeat(2,1fr); }.source-context { grid-template-columns:1fr; }.route-grid,.incident-grid,.pickup-layout { grid-template-columns:1fr; }.attention-card { grid-template-columns:44px 1fr; }.owner { grid-column:2; }.student-row { grid-template-columns:38px 1fr auto; }.student-row .pill { grid-column:3; }.student-row .icon-action { grid-column:auto; }.student-row { padding:16px 0; }.table-head { display:none; }.table-row { grid-template-columns:1fr auto; }.row-actions { grid-column:1/-1; }.topbar { align-items:flex-start; }.system-state { min-width:138px; }.hero { align-items:flex-start; }.hero-count { min-width:86px; }.split { align-items:flex-start; }.import-head { display:none; }.import-table article { grid-template-columns:34px 1fr; }.import-table article > div:nth-of-type(2),.import-table article > div:nth-of-type(3) { grid-column:2; } }
@media (max-width:520px) { main { width:min(100% - 24px,1180px); margin-top:18px; }.topbar { padding:18px 14px 12px; }.nav { padding:9px 12px; }.network { font-size:11px; }.hero { padding:24px 20px; border-radius:18px; }.hero-count { padding:14px 8px; }.hero-count strong { font-size:36px; }.metrics { gap:8px; }.metrics article { padding:14px; }.attention-card { padding:14px; gap:10px; }.trip-panel > header,.split { align-items:stretch; flex-direction:column; }.student-list { padding:4px 14px; }.student-row { grid-template-columns:34px 1fr; }.student-row .pill { grid-column:2; }.student-row .icon-action { grid-column:auto; }.pickup-list article { align-items:flex-start; gap:12px; } }

@media (max-width:520px) {
  .nav { gap:2px; padding:8px 10px; overflow:visible; }
  .nav-button,.more-nav summary { padding:10px; font-size:14px; }
  .section-head { flex-wrap:wrap; gap:10px; }
  .section-head > .primary { width:100%; }
  .attention-overflow { grid-template-columns:1fr; align-items:stretch; }
  .attention-overflow .secondary { width:100%; }
}

/* Safety-first visual pass: legibility, unambiguous status, and touch operation. */
:root { --muted:#52655d; --line:#c8d5cf; --danger:#a82f28; --danger-bg:#fff1ef; --amber:#805510; --amber-bg:#fff6df; --info:#245f91; --info-bg:#edf6ff; --focus:#ffdd00; }
body { line-height:1.5; }
button,select,textarea,input,.more-nav summary { min-height:44px; }
button:focus-visible,select:focus-visible,textarea:focus-visible,input:focus-visible,summary:focus-visible,.ai-external-link:focus-visible,.ai-candidate-card h3[tabindex="-1"]:focus { outline:3px solid var(--focus); outline-offset:2px; box-shadow:0 0 0 5px var(--ink); }
button:disabled { cursor:not-allowed; opacity:.48; }
.eyebrow { font-size:12px; letter-spacing:.11em; }
.system-state p,.owner span,.device-line span,.incident-status,.table-head,.import-head { font-size:12px; }
.network { min-height:44px; padding:10px 14px; }
.network.error { background:var(--danger-bg); color:var(--danger); }
.network.error .dot { background:var(--danger); }
.nav { overflow:visible; }
.nav-button,.more-nav summary { min-height:44px; display:flex; align-items:center; padding:10px 16px; border-radius:10px; font-weight:750; white-space:nowrap; }
.more-nav { position:relative; color:var(--muted); }
.more-nav summary { cursor:pointer; list-style:none; }
.more-nav summary::-webkit-details-marker { display:none; }
.more-nav summary::after { content:"⌄"; margin-left:7px; }
.more-nav.active summary { background:var(--ink); color:white; }
.more-nav > div { position:absolute; top:calc(100% + 7px); right:0; z-index:20; min-width:190px; padding:7px; background:white; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); }
.more-nav > div .nav-button { width:100%; }
.system-alert { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; width:100%; min-height:108px; box-sizing:border-box; gap:18px; margin:0 0 18px; padding:20px 24px; border:2px solid; border-radius:14px; }
.system-alert > div:first-child { min-width:0; width:100%; }
.system-alert > p { min-width:0; flex:1 1 auto; writing-mode:horizontal-tb; }
.system-alert h2,.system-alert p { overflow-wrap:anywhere; word-break:normal; }
.system-alert p { margin:4px 0 0; font-size:13px; }
.system-alert.warning { background:var(--amber-bg); border-color:#d1a653; color:#67450c; }
.system-alert.error { background:var(--danger-bg); border-color:#d87870; color:#7c211b; }
.system-alert .secondary { flex:0 0 auto; margin:0; border-color:currentColor; background:rgba(255,255,255,.75); }
.hero { padding:27px 32px; }
.hero-count strong { font-size:42px; }
.metrics { margin-top:18px; }
.owner button,.secondary,.icon-action,.row-actions button { min-height:44px; padding:10px 13px; margin-top:6px; }
.unassigned .owner button { background:var(--danger); color:white; border-color:var(--danger); }
.pill { font-size:12px; padding:6px 10px; }
.student-row { grid-template-columns:42px minmax(130px,1fr) 190px minmax(220px,auto); }
.bus-row-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.bus-row-actions .icon-action { margin:0; }
.icon-action.report { border-color:#c58b2d; background:var(--amber-bg); color:#67450c; }
.icon-action.exit-action { border-color:#4681ab; background:var(--info-bg); color:#174f78; }
.done-mark { color:var(--green); font-weight:800; }
.trip-counts { display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; }
.trip-counts span { color:var(--muted); }
.manifest-line { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-top:5px; color:var(--muted); font-size:13px; }
.manifest-line strong { padding:3px 8px; border-radius:999px; background:var(--amber-bg); color:#67450c; font-size:12px; }
.manifest-stale { border-color:#d87870; }
.manifest-alert { display:flex; align-items:center; gap:12px; padding:11px 18px; background:var(--danger-bg); color:#7c211b; border-bottom:1px solid #d87870; }
.manifest-alert span { font-size:13px; }
.manifest-alert .secondary { margin:0 0 0 auto; border-color:currentColor; }
.trip-safety { display:grid; grid-template-columns:minmax(170px,1fr) minmax(280px,1.4fr) auto; gap:14px; align-items:center; }
.visual-check { display:flex; align-items:center; gap:10px; min-height:52px; padding:9px 12px; background:white; border:1px solid var(--line); border-radius:11px; font-weight:750; cursor:pointer; }
.visual-check input { width:24px; height:24px; min-height:auto; flex:0 0 auto; accent-color:var(--green); }
.complete-trip { min-height:48px; padding:11px 15px; border:0; border-radius:11px; background:var(--ink); color:white; font-weight:850; }
.trip-completed { border-color:#78af98; box-shadow:0 0 0 2px #dff2e7 inset; }
.trip-completion-pending { border-color:#d29a32; box-shadow:0 0 0 2px #fff0c7 inset; }
.trip-completion-review { border-color:#c9564d; box-shadow:0 0 0 2px #fbe2df inset; }
.completion-pending-alert,.completion-review-alert { display:flex; align-items:center; gap:12px; padding:11px 18px; border-bottom:1px solid; }
.completion-pending-alert { border-color:#d29a32; background:var(--amber-bg); color:#67450c; }
.completion-review-alert { border-color:#c9564d; background:var(--danger-bg); color:#7c211b; }
.completion-pending-alert span,.completion-review-alert span { font-size:13px; }
.warning-box { background:var(--amber-bg); color:#67450c; }
.import-summary .review { border-color:#d7b66e; background:var(--amber-bg); }
.import-warning { border-left:5px solid var(--info); background:var(--info-bg); color:#174f78; }
.import-table .pill.danger { background:var(--amber-bg); color:#67450c; }
.timeline-body code { font-size:12px; color:#5e7068; overflow-wrap:anywhere; }
.sync { font-size:12px; }
.sync.conflict,.sync.rejected { background:var(--danger-bg); color:var(--danger); }
.toast { top:104px; right:20px; bottom:auto; left:auto; transform:translateY(-14px); max-width:min(430px,calc(100% - 40px)); }
.toast.show { transform:translateY(0); }
.modal-backdrop { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px; background:rgba(10,31,26,.58); }
.modal { position:relative; width:min(560px,100%); max-height:calc(100vh - 40px); overflow:auto; padding:26px; border-radius:20px; background:white; box-shadow:0 24px 70px rgba(0,0,0,.24); }
.modal-close { position:absolute; top:12px; right:12px; width:44px; border:0; border-radius:50%; background:#edf1ef; color:var(--ink); font-size:25px; }
.modal-form { display:grid; gap:15px; margin-top:20px; }
.modal-form label { display:grid; gap:7px; font-weight:800; }
.modal-form textarea { width:100%; resize:vertical; padding:12px; border:1px solid var(--line); border-radius:10px; font:inherit; }
.modal-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:6px; }
.nfc-match-card,.nfc-read-result { display:grid; gap:4px; margin:16px 0; padding:16px; border:1px solid var(--line); border-radius:13px; background:#f7faf8; }
.nfc-match-card span,.nfc-match-card small,.nfc-read-result small { color:var(--muted); }
.nfc-match-card strong,.nfc-read-result strong { font-size:20px; }
.nfc-read-result { border-width:2px; border-color:#78af98; background:var(--mint); }
.nfc-read-result .pill { width:max-content; }
.nfc-read-result[hidden],.visual-person-check[hidden] { display:none !important; }
.compact-alert { margin:14px 0 0; }
.registration-notice { display:flex; gap:14px; align-items:flex-start; margin:18px 0; padding:16px 18px; border-left:5px solid var(--info); border-radius:12px; background:var(--info-bg); color:#174f78; }
.registration-notice p { margin:0; }
.registration-layout { display:grid; grid-template-columns:minmax(230px,.72fr) minmax(0,2fr); gap:20px; align-items:start; }
.parent-selector,.registration-main { border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:var(--shadow); }
.parent-selector { display:grid; gap:8px; padding:16px; }
.parent-selector h3 { margin:2px 4px 8px; }
.parent-option { display:grid; gap:3px; width:100%; padding:13px 14px; text-align:left; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); }
.parent-option span { color:var(--muted); font-size:12px; }
.parent-option.active { border-color:var(--green); background:var(--mint); box-shadow:inset 4px 0 0 var(--green); }
.registration-main { min-height:300px; overflow:hidden; }
.registration-parent-head { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:20px 22px; border-bottom:1px solid var(--line); background:#f9fbfa; }
.registration-parent-head span,.registration-parent-head p { color:var(--muted); font-size:12px; }
.registration-parent-head h3 { margin:2px 0; font-size:22px; }
.registration-history { padding:6px 22px 18px; }
.registration-code-row { display:grid; grid-template-columns:minmax(180px,1fr) minmax(210px,.9fr) auto; gap:18px; align-items:center; padding:17px 0; border-top:1px solid var(--line); }
.registration-code-row:first-of-type { border-top:0; }
.registration-code-row > div:first-child { display:grid; grid-template-columns:auto 1fr; gap:5px 9px; align-items:center; }
.registration-code-row small { grid-column:1/-1; color:var(--muted); }
.registration-code-row dl { display:flex; gap:18px; margin:0; }
.registration-code-row dl div { display:grid; gap:2px; }
.registration-code-row dt { color:var(--muted); font-size:11px; }
.registration-code-row dd { margin:0; font-size:13px; font-weight:750; }
.code-status { width:max-content; padding:4px 8px; border-radius:999px; font-size:11px; font-weight:850; }
.code-status.active { background:var(--mint); color:var(--green); }
.code-status.delivery_pending { background:var(--amber-bg); color:var(--amber); }
.code-status.consumed { background:var(--info-bg); color:var(--info); }
.code-status.revoked,.code-status.expired { background:#eef1ef; color:var(--muted); }
.danger-action,.danger-button { border:1px solid var(--danger); color:var(--danger); background:#fff; }
.danger-button { padding:10px 14px; border-radius:10px; font-weight:800; }
.history-only { color:var(--muted); font-size:12px; font-weight:750; }
.target-confirm { margin:14px 0; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:#f6f9f7; }
.target-confirm p { margin:4px 0 0; }
.confirm-check { display:flex !important; grid-template-columns:none !important; align-items:flex-start; gap:10px !important; padding:12px; border:1px solid var(--line); border-radius:11px; background:#fffdf5; }
.confirm-check input { width:22px; height:22px; min-height:auto; flex:0 0 auto; accent-color:var(--green); }
.one-time-secret { display:grid; gap:10px; margin:18px 0; padding:18px; border:2px solid var(--amber); border-radius:14px; background:var(--amber-bg); }
.one-time-secret span { color:var(--amber); font-weight:850; }
.one-time-secret code { overflow-wrap:anywhere; font-size:clamp(22px,5vw,34px); font-weight:900; letter-spacing:.05em; color:var(--ink); }
.one-time-secret .secondary { justify-self:start; }
.secret-warning { color:#6c3e08; font-weight:750; }

@media (max-width:800px) {
  .student-row { grid-template-columns:38px 1fr auto; }
  .bus-row-actions { grid-column:2/-1; justify-content:flex-start; }
  .trip-safety { grid-template-columns:1fr; }
  .complete-trip { width:100%; }
  .registration-layout { grid-template-columns:1fr; }
  .parent-selector { grid-template-columns:repeat(3,1fr); }
  .parent-selector h3 { grid-column:1/-1; }
  .registration-code-row { grid-template-columns:1fr auto; }
  .registration-code-row dl { grid-column:1; }
}
@media (max-width:520px) {
  main { margin-bottom:160px; padding-bottom:24px; }
  .attention-card,.student-row,.pickup-card,.incident-card { scroll-margin-bottom:130px; }
  .topbar { gap:10px; }
  .topbar h1 { font-size:22px; }
  .system-state { min-width:126px; }
  .system-state p { font-size:11px; }
  .nav { position:fixed; top:auto; bottom:0; left:0; right:0; z-index:40; display:grid; grid-template-columns:repeat(6,1fr); gap:3px; padding:7px max(6px,env(safe-area-inset-left)) calc(7px + env(safe-area-inset-bottom)); box-shadow:0 -8px 24px rgba(23,63,53,.11); }
  .nav-button,.more-nav summary { justify-content:center; min-width:0; padding:9px 3px; font-size:11px; }
  .more-nav > div { top:auto; right:0; bottom:calc(100% + 8px); min-width:180px; }
  .more-nav > div .nav-button { justify-content:flex-start; padding:10px 12px; font-size:13px; }
  .hero { padding:20px; }
  .hero h2 { font-size:28px; }
  .hero-count { display:none; }
  .section-head { margin-top:26px; }
  .system-alert { grid-template-columns:1fr; align-items:stretch; min-height:150px; padding:20px; }
  .system-alert .secondary { width:100%; }
  .system-alert .secondary { width:100%; }
  .student-row { grid-template-columns:38px 1fr; }
  .student-row .pill { grid-column:2; justify-self:start; }
  .bus-row-actions { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .bus-row-actions > :only-child { grid-column:1/-1; }
  .toast { top:auto; right:12px; bottom:calc(82px + env(safe-area-inset-bottom)); max-width:calc(100% - 24px); }
  .modal { padding:22px 18px; }
  .modal-actions { flex-direction:column-reverse; }
  .modal-actions button { width:100%; }
  .pickup-list article { flex-direction:column; }
  .pickup-next { width:100%; min-width:0; }
  .manifest-alert { align-items:flex-start; flex-wrap:wrap; }
  .manifest-alert .secondary { width:100%; margin-left:0; }
  .parent-selector { grid-template-columns:1fr; }
  .parent-selector h3 { grid-column:auto; }
  .registration-parent-head { align-items:stretch; flex-direction:column; }
  .registration-parent-head .primary { width:100%; }
  .registration-code-row { grid-template-columns:1fr; }
  .registration-code-row dl { grid-column:auto; }
  .registration-code-row button { width:100%; }
}

/* Visual system v8: calm operations workspace with explicit safety hierarchy. */
:root {
  --ink:#173c34;
  --ink-2:#28574b;
  --paper:#f3f6f3;
  --card:#ffffff;
  --line:#d5dfda;
  --muted:#53665f;
  --mint:#e4f2eb;
  --green:#176f55;
  --danger:#a63a32;
  --danger-bg:#fff0ed;
  --amber:#76500f;
  --amber-bg:#fff5d9;
  --info:#245f91;
  --info-bg:#edf6ff;
  --shadow:0 10px 30px rgba(21,55,46,.07);
  --shadow-strong:0 18px 48px rgba(21,55,46,.12);
}
body {
  background:
    radial-gradient(circle at 8% 3%, rgba(57,137,102,.06), transparent 28rem),
    var(--paper);
  font-feature-settings:"palt" 1;
  -webkit-font-smoothing:antialiased;
}
.topbar {
  min-height:86px;
  padding-top:18px;
  padding-bottom:18px;
  box-shadow:0 1px 0 rgba(21,55,46,.03);
}
.brand { display:flex; align-items:center; gap:14px; min-width:0; }
.brand-mark {
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  flex:0 0 auto;
  border-radius:13px;
  background:linear-gradient(145deg,var(--ink),#27725d);
  box-shadow:0 7px 18px rgba(23,60,52,.2);
}
.brand-mark span { width:5px; height:24px; border-radius:9px; background:#fff; opacity:.92; }
.brand-mark span:nth-child(2) { height:14px; background:#b8e2ca; }
.brand-mark span:nth-child(3) { height:20px; }
.brand h1 { font-size:clamp(22px,2.4vw,31px); }
.brand .eyebrow { margin-bottom:3px; font-size:10px; letter-spacing:.15em; }
.system-state { display:grid; justify-items:end; }
.network { border:1px solid rgba(23,111,85,.12); box-shadow:inset 0 0 0 1px rgba(255,255,255,.55); }
.system-state p { line-height:1.35; }
.nav { gap:4px; padding-top:9px; padding-bottom:9px; }
.nav-button,.more-nav summary { transition:background .15s ease,color .15s ease,transform .15s ease; }
.nav-button:hover,.more-nav summary:hover { background:#edf2ef; color:var(--ink); }
.nav-button.active:hover { background:var(--ink); color:#fff; }
main { margin-top:28px; }
main:focus { outline:none; }
.hero {
  position:relative;
  overflow:hidden;
  min-height:178px;
  background:linear-gradient(125deg,#173c34 0%,#245f50 62%,#2b725d 100%);
  box-shadow:var(--shadow-strong);
}
.hero::after {
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  right:-75px;
  top:-120px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  box-shadow:0 0 0 36px rgba(255,255,255,.035),0 0 0 74px rgba(255,255,255,.025);
}
.hero > * { position:relative; z-index:1; }
.hero.has-alerts { border-left:6px solid #e3a14d; }
.hero h2 { max-width:660px; margin-bottom:10px; }
.hero-count { min-width:112px; background:rgba(255,255,255,.11); backdrop-filter:blur(8px); }
.hero-count strong { font-variant-numeric:tabular-nums; }
.metrics article,.route-card,.attention-card,.trip-panel,.table-card,.request-box,.pickup-list article,.incident-card {
  box-shadow:0 2px 0 rgba(23,60,52,.025);
}
.metrics article { position:relative; overflow:hidden; padding-top:17px; }
.metrics article::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:#a9cbbb; }
.metrics strong { font-variant-numeric:tabular-nums; }
.section-head { border-bottom:1px solid var(--line); padding-bottom:10px; }
.attention-card { grid-template-columns:62px minmax(0,1fr) 170px; padding:20px; transition:transform .15s ease,box-shadow .15s ease; }
.attention-card:hover { transform:translateY(-1px); box-shadow:var(--shadow); }
.number {
  width:54px;
  height:54px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  border-radius:15px;
  line-height:1;
}
.number span { font-size:9px; letter-spacing:.08em; }
.number strong { margin-top:4px; font-size:16px; }
.attention-card:not(.unassigned) .number { background:var(--amber-bg); color:var(--amber); }
.route-card { padding:22px; border-top:4px solid #8fbaa7; }
.route-card .secondary { margin-top:14px; }
.route-count { align-items:center; gap:12px; }
.progress { height:7px; }
.page-title { padding:3px 0 4px; }
.page-title h2 { letter-spacing:-.035em; }
.page-title.bus-title,.page-title.incident-title { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.safety-legend { display:flex; align-items:center; gap:9px; flex:0 0 auto; padding:10px 13px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--muted); font-size:12px; font-weight:800; box-shadow:0 2px 8px rgba(21,55,46,.04); }
.safety-legend i { width:17px; height:1px; background:#9db0a7; }
.trip-stack { gap:26px; }
.trip-panel { border-radius:22px; box-shadow:var(--shadow); }
.trip-panel > header {
  display:grid;
  grid-template-columns:minmax(190px,.8fr) minmax(300px,1.3fr) auto;
  gap:22px;
  align-items:center;
  padding:22px 24px;
  background:linear-gradient(180deg,#fff,#fbfdfc);
}
.trip-identity h3 { margin:6px 0 4px; font-size:24px; }
.trip-identity h3 time { font-variant-numeric:tabular-nums; }
.trip-command { display:grid; gap:10px; }
.stop-progress { display:grid; grid-template-columns:1fr auto 1fr; gap:10px; align-items:center; padding:9px 12px; border-radius:12px; background:#f0f5f2; }
.stop-progress div { display:grid; }
.stop-progress div:last-child { text-align:right; }
.stop-progress span { color:var(--muted); font-size:10px; font-weight:750; }
.stop-progress strong { font-size:14px; }
.stop-progress b { color:#779087; }
.scan-next { display:flex; align-items:center; justify-content:center; gap:10px; min-height:54px; padding:9px 16px; text-align:left; }
.scan-next > span:first-child { width:30px; height:30px; display:grid; place-items:center; flex:0 0 auto; border:2px solid rgba(255,255,255,.8); border-radius:50%; }
.scan-next > span:last-child { display:grid; line-height:1.25; }
.scan-next small { color:rgba(255,255,255,.72); font-size:10px; font-weight:700; }
.board-status { min-height:54px; display:flex; flex-direction:column; justify-content:center; padding:8px 13px; border:1px solid #b7d4c7; border-radius:11px; background:var(--mint); color:var(--ink); }
.board-status strong { font-size:13px; }
.board-status span { color:var(--muted); font-size:11px; }
.trip-counts { display:grid; grid-template-columns:repeat(2,minmax(62px,1fr)); gap:7px; margin:0; }
.trip-counts > span { min-width:68px; padding:8px 10px; border:1px solid var(--line); border-radius:11px; background:#fff; }
.trip-counts small,.trip-counts strong { display:block; }
.trip-counts small { color:var(--muted); font-size:10px; }
.trip-counts strong { margin-top:2px; color:var(--ink); font-size:20px; font-variant-numeric:tabular-nums; }
.trip-counts .count-alert { border-color:#e3b56c; background:var(--amber-bg); }
.trip-counts .count-alert strong { color:var(--amber); }
.student-list { padding:5px 24px; }
.student-row { min-height:76px; }
.student-avatar { border-radius:50%; }
.student-row { position:relative; padding-left:12px; padding-right:10px; }
.student-row::before { content:""; position:absolute; left:0; top:12px; bottom:12px; width:4px; border-radius:999px; background:transparent; }
.student-row-aboard { background:linear-gradient(90deg,var(--info-bg),transparent 42%); }
.student-row-aboard::before { background:var(--info); }
.student-row-attention { background:linear-gradient(90deg,var(--danger-bg),transparent 48%); }
.student-row-attention::before { background:var(--danger); }
.student-row-accounted { background:linear-gradient(90deg,var(--mint),transparent 38%); }
.student-row-accounted::before { background:var(--green); }
.student-row-attention .student-avatar { background:var(--danger-bg); color:var(--danger); }
.student-row-aboard .student-avatar { background:var(--info-bg); color:var(--info); }
.bus-row-actions button { min-width:108px; }
.trip-panel footer { border-top:1px solid var(--line); }
.incident-summary { display:flex; gap:8px; flex:0 0 auto; }
.incident-summary span { min-width:112px; padding:10px 14px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--muted); font-size:12px; }
.incident-summary strong { margin-right:3px; color:var(--ink); font-size:21px; }
.incident-summary .urgent { border-color:#e2aaa5; background:var(--danger-bg); color:var(--danger); }
.incident-summary .urgent strong { color:var(--danger); }
.incident-card { overflow:hidden; padding-top:26px; }
.incident-card.unassigned { border-top:5px solid var(--danger); }
.incident-card.is-resolved { opacity:.72; }
.incident-status { padding:5px 9px; border-radius:999px; background:#edf1ef; }
.incident-status.urgent { background:var(--danger-bg); color:var(--danger); }
.incident-actions .primary { min-height:48px; }

.security-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:18px 0 34px; }
.security-summary > div { padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.security-summary span,.device-card dt { display:block; color:var(--muted); font-size:12px; font-weight:700; }
.security-summary strong { display:block; margin-top:5px; color:var(--ink); }
.device-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.device-card { padding:22px; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:var(--shadow-soft); }
.device-card.pending { border-left:5px solid var(--amber); }
.device-card.revoked { background:#f4f6f5; box-shadow:none; opacity:.82; }
.device-card.current { border-color:#9bc5b2; background:linear-gradient(180deg,#fff,#f5fbf8); }
.device-card h3 { margin:12px 0 4px; font-size:22px; }
.device-card p { margin:0 0 16px; color:var(--muted); }
.device-card dl { display:grid; gap:9px; margin:0 0 18px; }
.device-card dl div { display:grid; grid-template-columns:130px minmax(0,1fr); gap:10px; }
.device-card dd { margin:0; font-weight:700; overflow-wrap:anywhere; }
.key-fingerprint { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.04em; }
.device-card button { min-height:48px; }
.auth-context { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:58px; margin-bottom:16px; padding:10px 14px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.auth-context > div { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
.auth-context > div > span:last-child { color:var(--muted); font-size:12px; }
.auth-actions { display:flex; flex-wrap:wrap; gap:8px; }
.auth-gate { max-width:680px; margin:64px auto; padding:32px; border:1px solid #e2aaa5; border-radius:20px; background:#fff; box-shadow:var(--shadow); }
.auth-gate h2 { margin:7px 0 10px; font-size:30px; }
.auth-gate p { color:var(--muted); }
.auth-gate button { min-height:48px; margin-top:14px; }
.auth-demo { margin:22px 0; padding:16px; border:1px dashed var(--line); border-radius:14px; background:#fff; }
.auth-demo summary { cursor:pointer; font-weight:800; }
.auth-demo button { min-height:44px; margin:8px 8px 0 0; }
.enrollment-grid { display:grid; gap:12px; }
.enrollment-card { padding:20px 22px; border:1px solid var(--line); border-left:5px solid var(--amber); border-radius:18px; background:#fff; box-shadow:var(--shadow-soft); }
.enrollment-card.enrollment-proved { border-left-color:var(--danger); }
.enrollment-card.enrollment-approved { border-left-color:var(--info); }
.enrollment-card.enrollment-completed { border-left-color:var(--green); }
.enrollment-card.enrollment-rejected,.enrollment-card.enrollment-cancelled { border-left-color:var(--muted); background:#f5f7f6; }
.enrollment-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.enrollment-card-head > span:last-child { color:var(--muted); font-size:12px; }
.enrollment-card h3 { margin:14px 0 3px; font-size:22px; }
.enrollment-card > p { margin-bottom:14px; color:var(--muted); }
.enrollment-card dl { margin:0 0 15px; }
.comparison-code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:18px; letter-spacing:.08em; }
.comparison-panel { display:grid; gap:4px; margin:15px 0; padding:17px; border:2px solid var(--info); border-radius:14px; background:var(--info-bg); }
.comparison-panel span,.comparison-panel small { color:var(--muted); }
.comparison-panel strong { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:30px; letter-spacing:.09em; }
.enrollment-actions { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.enrollment-actions .text-button { margin-left:auto; }
.modal-actions.vertical { flex-direction:column-reverse; }
.modal-actions.vertical button { width:100%; }

@media (max-width:980px) {
  .trip-panel > header { grid-template-columns:minmax(180px,.8fr) 1.2fr; }
  .trip-counts { grid-column:1/-1; grid-template-columns:repeat(4,1fr); }
}

@media (max-width:800px) {
  .page-title.bus-title,.page-title.incident-title { align-items:flex-start; flex-direction:column; }
  .safety-legend { align-self:flex-start; }
  .trip-panel > header { grid-template-columns:1fr; gap:16px; }
  .trip-counts { grid-column:auto; }
  .attention-card { grid-template-columns:54px minmax(0,1fr); }
  .owner { grid-column:2; }
  .security-summary,.device-grid { grid-template-columns:1fr; }
  .auth-context { align-items:flex-start; flex-direction:column; }
}

@media (max-width:520px) {
  body { background:var(--paper); }
  .topbar { min-height:104px; padding:14px 12px 11px; }
  .brand { align-items:flex-start; gap:9px; }
  .brand-mark { width:34px; height:34px; border-radius:10px; }
  .brand-mark span { width:4px; height:19px; }
  .brand-mark span:nth-child(2) { height:11px; }
  .brand-mark span:nth-child(3) { height:16px; }
  .brand .eyebrow { display:none; }
  .brand h1 { margin-top:4px; font-size:19px; white-space:nowrap; }
  .system-state { min-width:118px; }
  .network { min-height:44px; padding:7px 10px; }
  .system-state p { margin-top:3px; font-size:12px; line-height:1.35; }
  main { width:calc(100% - 20px); margin-top:15px; }
  .hero { min-height:0; padding:19px 18px; border-radius:17px; }
  .hero h2 { margin-bottom:7px; font-size:25px; }
  .hero p:last-child { font-size:13px; }
  .hero::after { width:170px; height:170px; right:-85px; top:-85px; }
  .section-head { margin-top:24px; }
  .section-head h2 { font-size:21px; }
  .attention-card { grid-template-columns:45px minmax(0,1fr); padding:14px 13px; border-radius:15px; }
  .number { width:42px; height:48px; border-radius:12px; }
  .attention-main p { font-size:14px; }
  .attention-main small { display:block; font-size:11px; }
  .owner { padding-top:2px; }
  .owner button { width:100%; min-height:48px; }
  .metrics article { min-height:96px; }
  .route-card { padding:17px; }
  .page-title { margin-bottom:17px; }
  .page-title h2 { font-size:28px; }
  .page-title > p:last-child,.page-title > div > p:last-child { margin-bottom:0; font-size:13px; }
  .safety-legend { width:100%; justify-content:center; padding:8px; border-radius:11px; }
  .trip-stack { gap:18px; }
  .trip-live-status { align-items:flex-start; flex-direction:column; gap:2px; margin-top:-5px; }
  .trip-panel { border-radius:17px; }
  .trip-panel > header { padding:17px 15px; }
  .trip-identity h3 { font-size:22px; }
  .manifest-line { font-size:11px; }
  .stop-progress { padding:8px 10px; }
  .scan-next { min-height:58px; }
  .board-status { min-height:50px; }
  .trip-counts { grid-template-columns:repeat(4,1fr); gap:5px; }
  .trip-counts > span { min-width:0; padding:7px 6px; text-align:center; }
  .trip-counts strong { font-size:18px; }
  .student-list { padding:3px 14px; }
  .student-row { min-height:0; padding:15px 0; }
  .student-row .pill { margin-top:1px; }
  .bus-row-actions button { min-height:48px; min-width:0; }
  .trip-panel footer { padding:15px; }
  .trip-safety > div:first-child { padding:3px 1px; }
  .visual-check { min-height:58px; }
  .incident-summary { width:100%; }
  .incident-summary span { flex:1; min-width:0; }
  .incident-card { padding:20px 17px; }
  .incident-status { position:static; display:inline-block; margin-bottom:13px; }
  .incident-card h4 { margin-top:13px; }
  .incident-card > p { min-height:0; }
  .incident-actions { flex-direction:column; }
  .incident-actions button { width:100%; min-height:48px; }
  .enrollment-card { padding:17px 15px; }
  .enrollment-card-head { align-items:flex-start; flex-direction:column; }
  .enrollment-actions { align-items:stretch; flex-direction:column; }
  .enrollment-actions button { width:100%; min-height:48px; }
  .enrollment-actions .text-button { margin-left:0; }
  .comparison-panel strong { font-size:26px; }
}

/* Additional admin-device enrollment: separate, information-minimized surface. */
.enrollment-page { min-height:100vh; background:linear-gradient(180deg,#f4f8f5 0,#eef4f0 100%); }
.enrollment-topbar { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:86px; padding:16px max(20px,calc((100vw - 900px)/2)); border-bottom:1px solid var(--line); background:rgba(255,255,255,.94); }
.enrollment-brand { color:var(--ink); text-decoration:none; }
.enrollment-brand small,.enrollment-brand strong { display:block; }
.enrollment-brand small { color:var(--muted); font-size:10px; font-weight:850; letter-spacing:.13em; }
.enrollment-brand strong { margin-top:3px; font-size:18px; }
.enrollment-shell { width:min(calc(100% - 32px),900px); margin:42px auto 70px; }
.enrollment-intro { max-width:700px; }
.enrollment-intro h1 { margin:7px 0 14px; font-size:clamp(30px,5vw,48px); line-height:1.2; letter-spacing:-.03em; }
.enrollment-intro > p:last-child { max-width:650px; color:var(--muted); font-size:16px; }
.enrollment-progress { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:32px 0 20px; padding:0; list-style:none; }
.enrollment-progress li { display:flex; align-items:center; gap:9px; min-width:0; padding:12px 13px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,255,.7); color:var(--muted); }
.enrollment-progress li span { display:grid; place-items:center; width:28px; height:28px; flex:0 0 auto; border-radius:50%; background:#e8eeeb; font-weight:900; }
.enrollment-progress li strong { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.enrollment-progress li.current { border-color:var(--info); background:var(--info-bg); color:#174f78; box-shadow:0 0 0 1px var(--info); }
.enrollment-progress li.current span { background:var(--info); color:white; }
.enrollment-progress li.done { color:var(--green); }
.enrollment-progress li.done span { background:var(--green); color:white; }
.enrollment-workspace { padding:clamp(22px,5vw,42px); border:1px solid var(--line); border-radius:24px; background:white; box-shadow:0 18px 60px rgba(18,53,43,.09); }
.enrollment-panel-head { display:flex; align-items:center; gap:14px; }
.enrollment-panel-head h2 { margin:3px 0 0; font-size:clamp(25px,4vw,34px); }
.enrollment-panel-head + p { max-width:650px; margin:18px 0; color:var(--muted); }
.state-icon { display:grid; place-items:center; width:48px; height:48px; flex:0 0 auto; border-radius:15px; background:var(--info-bg); color:var(--info); font-size:21px; font-weight:950; }
.state-icon.waiting { background:var(--amber-bg); color:var(--amber); }
.state-icon.approved { background:var(--mint); color:var(--green); }
.state-icon.rejected { background:var(--danger-bg); color:var(--danger); }
.enrollment-form { display:grid; gap:10px; margin-top:24px; }
.enrollment-form > label { font-weight:850; }
.secret-input-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.secret-input-row input { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:11px; font:600 16px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.04em; }
.field-help { margin:0 0 8px; color:var(--muted); font-size:13px; }
.inline-error { margin:14px 0; padding:13px 15px; border:2px solid #d87870; border-radius:12px; background:var(--danger-bg); color:var(--danger); font-weight:800; }
.enrollment-primary { min-height:52px; margin-top:8px; font-size:16px; }
.enrollment-secondary { width:100%; min-height:48px; }
.enrollment-summary { margin:20px 0; }
.persistent-status { display:grid; gap:3px; margin:18px 0; padding:15px 16px; border-left:5px solid var(--info); border-radius:12px; background:var(--info-bg); color:#174f78; }
.persistent-status span { font-size:13px; }
.persistent-status.safe { border-left-color:var(--green); background:var(--mint); color:var(--green); }
.persistent-status.rejected { border-left-color:var(--danger); background:var(--danger-bg); color:var(--danger); }
.review-controls { margin-top:24px; padding:13px 15px; border:1px dashed var(--line); border-radius:12px; color:var(--muted); }
.review-controls summary { min-height:44px; display:flex; align-items:center; cursor:pointer; color:var(--ink); font-weight:800; }
.review-controls p { margin:2px 0 10px; font-size:13px; }
.review-controls > div { display:flex; flex-wrap:wrap; gap:8px; }
.enrollment-link { display:flex; align-items:center; justify-content:center; min-height:52px; margin-top:18px; text-decoration:none; }
.privacy-note { margin-top:18px; padding:16px 18px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.72); }
.privacy-note p { margin:4px 0 0; color:var(--muted); font-size:13px; }
.registration-notice .secondary { flex:0 0 auto; align-self:center; margin:0; text-decoration:none; }

/* Local synthetic AI-review demo. This surface is visually and structurally
   separate from incidents, transport and pickup operations. */
.ai-review-page,.ai-review-page * { min-width:0; }
.ai-demo-banner { display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:10px 14px; margin-bottom:22px; padding:18px 20px; border:2px solid #7465a8; border-radius:16px; background:#f2effb; color:#41366c; }
.ai-demo-banner strong { font-size:18px; }
.ai-demo-banner span { padding:5px 9px; border-radius:999px; background:#ded7f4; font-size:12px; font-weight:850; }
.ai-demo-banner p { margin:0; }
.ai-review-grid { display:grid; gap:20px; }
.ai-candidate-card { overflow-wrap:anywhere; padding:24px; border:1px solid var(--line); border-radius:18px; background:var(--card); box-shadow:var(--shadow); }
.ai-candidate-card h3 { margin:16px 0 8px; font-size:clamp(21px,3vw,27px); }
.ai-candidate-card h4 { margin:20px 0 8px; }
.ai-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.ai-candidate-id { margin:7px 0 0; color:var(--muted); font:600 12px ui-monospace,SFMono-Regular,Menlo,monospace; }
.ai-candidate-meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:18px 0; }
.ai-candidate-meta div,.ai-evaluations article { padding:13px; border:1px solid var(--line); border-radius:12px; background:#f8faf9; }
.ai-candidate-meta dt,.ai-evaluations span,.ai-evaluations small { display:block; color:var(--muted); font-size:12px; }
.ai-candidate-meta dd { margin:5px 0 0; font-weight:800; }
.ai-decision-record { margin:18px 0; padding:14px 16px; border-left:5px solid #7465a8; border-radius:12px; background:#f7f5fc; }
.ai-decision-record h4,.ai-decision-record p { margin:0; }
.ai-decision-record p + p { margin-top:6px; }
.ai-decision-record small { display:block; margin-top:7px; color:var(--muted); }
.ai-candidate-card section > ul { display:grid; gap:7px; padding-left:22px; }
.ai-candidate-card section > ul span { display:block; margin-top:3px; color:var(--muted); }
.ai-evaluations > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.ai-evaluations strong { display:block; margin:5px 0; }
.ai-claims { margin-top:18px; border:1px solid var(--line); border-radius:14px; }
.ai-claims > summary { display:flex; align-items:center; min-height:48px; padding:10px 14px; cursor:pointer; color:var(--green); font-weight:850; }
.ai-claims[open] > summary { border-bottom:1px solid var(--line); }
.ai-claim { padding:16px; border-bottom:1px solid var(--line); }
.ai-claim:last-child { border-bottom:0; }
.ai-claim > div { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.ai-claim p { margin:10px 0; }
.ai-source-list { display:grid; gap:10px; padding:0; list-style:none; }
.ai-source { display:grid; gap:4px; }
.ai-source small { color:var(--muted); }
.ai-external-link { display:inline-flex; align-items:center; min-height:44px; width:fit-content; color:var(--green); font-weight:800; }
.ai-source-missing { padding:10px 12px; border-radius:10px; background:var(--danger-bg); color:var(--danger); font-weight:800; }
.ai-rollback { margin-top:16px; padding:14px 16px; border-left:5px solid #7465a8; border-radius:12px; background:#f7f5fc; }
.ai-rollback h4,.ai-rollback p { margin:0; }
.ai-rollback p { margin-top:5px; }
.ai-blockers,.ai-ready,.ai-load-state { margin-top:16px; padding:15px 17px; border-radius:13px; }
.ai-blockers { border:2px solid #d87870; background:var(--danger-bg); color:var(--danger); }
.ai-blockers ul { margin:7px 0 0; padding-left:21px; }
.ai-ready { border:1px solid #78af98; background:var(--mint); color:var(--green); }
.ai-ready p { margin:5px 0 0; }
.ai-load-state { border:1px solid var(--line); background:var(--card); }
.ai-load-state.error { border:2px solid #d87870; color:var(--danger); }
.ai-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:18px; }
.ai-actions button { min-height:48px; margin:0; }
.ai-actions button:disabled { cursor:not-allowed; opacity:.55; }

@media (max-width:680px) {
  .enrollment-topbar { align-items:flex-start; padding:13px 12px; }
  .enrollment-topbar > .pill { margin-top:4px; }
  .enrollment-brand .brand-mark { width:36px; height:36px; }
  .enrollment-brand small { display:none; }
  .enrollment-brand strong { max-width:200px; font-size:16px; }
  .enrollment-shell { width:calc(100% - 20px); margin:25px auto 50px; }
  .enrollment-intro h1 { font-size:29px; }
  .enrollment-progress { gap:5px; margin-top:24px; }
  .enrollment-progress li { justify-content:center; padding:9px 5px; }
  .enrollment-progress li strong { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .enrollment-workspace { padding:22px 17px; border-radius:18px; }
  .secret-input-row { grid-template-columns:1fr; }
  .secret-input-row .secondary { width:100%; }
  .enrollment-summary div { align-items:flex-start; flex-direction:column; gap:2px; }
  .review-controls > div { flex-direction:column; }
  .review-controls button { width:100%; }
  .registration-notice { align-items:stretch; flex-direction:column; }
  .registration-notice .secondary { align-self:stretch; text-align:center; }
}

@media (max-width:520px) {
  .ai-demo-banner { grid-template-columns:1fr; align-items:start; padding:16px; }
  .ai-demo-banner span { width:fit-content; }
  .ai-candidate-card { padding:17px 15px; }
  .ai-card-head,.ai-actions { align-items:stretch; flex-direction:column; }
  .ai-candidate-meta,.ai-evaluations > div { grid-template-columns:1fr; }
  .ai-actions button,.ai-external-link { width:100%; }
  .ai-actions button { min-height:52px; }
}
.import-preview-card{margin:1rem 0;padding:1.1rem;background:#fff;border:1px solid #d8e0ea;border-radius:14px}.import-preview-card>p{color:#5b6878;font-size:.9rem}.import-compare-grid{overflow:auto}.import-compare-head,.import-compare-row{display:grid;grid-template-columns:1.3fr .9fr .9fr .8fr 1.5fr;gap:.6rem;align-items:center;min-width:680px;padding:.65rem;border-bottom:1px solid #e6ebf1}.import-compare-head{background:#f5f7fb;color:#64748b;font-size:.75rem;font-weight:700}.import-compare-row{font-size:.86rem}.import-compare-row select{padding:.45rem;border:1px solid #cbd5e1;border-radius:7px;background:#fff}.import-preview-card>.primary{margin-top:1rem}
.system-alert p { max-width:none; }
.week-preview{margin:1rem 0 2rem;padding:1rem;background:#fff;border:1px solid var(--line);border-radius:16px}.week-preview-grid{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:10px}.week-preview-grid article{display:grid;gap:5px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fbfcfd}.week-preview-grid span,.week-preview-grid small{color:var(--muted);font-size:12px}.week-preview-grid b{font-size:13px}.week-preview-grid em{font-style:normal;color:var(--green);font-weight:800}.week-preview-grid article:not(:first-child) em{color:#9a6a16}@media(max-width:800px){.week-preview-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.week-preview-grid{grid-template-columns:1fr}}
.import-compare-row select:disabled{opacity:.45;background:#f1f4f7}
.import-compare-row input[type=date]{min-height:40px;padding:.35rem;border:1px solid #cbd5e1;border-radius:7px}
.bulk-change-card{margin:1rem 0;padding:1.1rem;background:#f1f7f4;border:1px solid #b7d6c8;border-radius:16px}.bulk-change-card h2{margin:.2rem 0}.bulk-change-card p{color:var(--muted);font-size:.9rem}.bulk-change-fields{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:10px}.bulk-change-fields label{display:grid;gap:4px;font-size:.8rem;font-weight:700}.bulk-change-fields select,.bulk-change-fields input{min-height:42px;padding:.45rem;border:1px solid #bfd0c7;border-radius:8px;background:#fff}.bulk-change-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}.bulk-change-actions span{font-weight:700;color:#245d4b}@media(max-width:700px){.bulk-change-fields{grid-template-columns:1fr 1fr}.bulk-change-actions{align-items:stretch;flex-direction:column}.bulk-change-actions .primary{width:100%}}