/* SHUTTLE OPS — 昼(DAY) / 夜(NIGHT) 2テーマ。色はすべてトークン経由 */
:root,
[data-theme="night"] {
  --bg: #05080c;
  --bg2: #0b1017;
  --bg3: #111823;
  --bg4: #18222f;
  --pax: #b18cff;
  --pax-ink: #12052b;
  --line: #1c2633;
  --line2: #2a3748;
  --tx: #e9eef4;
  --tx2: #a0acba;
  --tx3: #6a7788;
  --acc: #ffd23f;
  --acc-ink: #0b0d10;
  --acc-tx: #ffd23f;
  --acc-soft: rgba(255, 210, 63, 0.14);
  --wait: #3cc7ff;
  --wait-ink: #00131d;
  --wait-soft: rgba(60, 199, 255, 0.14);
  --out: #3ee08f;
  --out-ink: #00150b;
  --out-soft: rgba(62, 224, 143, 0.12);
  --warn: #ffa51f;
  --warn-soft: rgba(255, 165, 31, 0.16);
  --alert: #ff4d6d;
  --alert-soft: rgba(255, 77, 109, 0.17);
  --idle: #8391a2;
  --idle-soft: rgba(131, 145, 162, 0.14);
  --grid: rgba(120, 160, 200, 0.05);
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.6);
  --glow: 1;
  --hdr: rgba(8, 12, 18, 0.92);
  color-scheme: dark;
}
[data-theme="day"] {
  --bg: #e8ecf1;
  --bg2: #ffffff;
  --bg3: #f2f4f7;
  --bg4: #e4e8ee;
  --pax: #6d3fd9;
  --pax-ink: #ffffff;
  --line: #d2d8e0;
  --line2: #b3bcc8;
  --tx: #04070b;
  --tx2: #333e4c;
  --tx3: #5b6676;
  --acc: #ffcc00;
  --acc-ink: #000000;
  --acc-tx: #000000;
  --acc-soft: rgba(255, 204, 0, 0.3);
  --wait: #0068c9;
  --wait-ink: #ffffff;
  --wait-soft: rgba(0, 104, 201, 0.1);
  --out: #00804a;
  --out-ink: #ffffff;
  --out-soft: rgba(0, 128, 74, 0.1);
  --warn: #c25100;
  --warn-soft: rgba(194, 81, 0, 0.12);
  --alert: #cc0029;
  --alert-soft: rgba(204, 0, 41, 0.1);
  --idle: #5f6b7b;
  --idle-soft: rgba(95, 107, 123, 0.12);
  --grid: rgba(20, 40, 70, 0.045);
  --shadow: 0 16px 40px rgba(15, 25, 40, 0.2);
  --glow: 0;
  --hdr: rgba(255, 255, 255, 0.94);
  color-scheme: light;
}
:root {
  --f-ui: "BIZ UDPGothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Noto Sans CJK JP", "Yu Gothic UI", Meiryo, system-ui, sans-serif;
  --f-num: Bahnschrift, "DIN Alternate", "Roboto Condensed", "Arial Narrow", system-ui, sans-serif;
  --r: 14px;
  --hdr-h: 64px;
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  background-color: var(--bg);
  background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: 28px 28px;
  color: var(--tx);
  font: 15px/1.5 var(--f-ui);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior-y: none;
}
body.has-sheet { overflow: hidden; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; border: 0; background: none; padding: 0; touch-action: manipulation; }
button:disabled { opacity: 0.45; cursor: not-allowed; }
:focus-visible { outline: 3px solid var(--acc); outline-offset: 2px; }
[hidden] { display: none !important; }
svg { flex: none; }
.ico { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.num { font-family: var(--f-num); font-variant-numeric: tabular-nums; }
.muted { color: var(--tx2); }
.dim { color: var(--tx3); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ------------------------------------------------------------ 起動 */
.boot { min-height: 100vh; display: grid; place-content: center; justify-items: center; gap: 14px; color: var(--tx2); }
.boot-mark { width: 64px; height: 64px; border-radius: 16px; background: var(--acc) url(icon.svg) center / cover; animation: breathe 1.6s ease-in-out infinite; }
@keyframes breathe { 50% { transform: scale(0.92); opacity: 0.7; } }
.fatal { max-width: 520px; margin: 18vh auto; padding: 28px; text-align: center; background: var(--bg2); border: 1px solid var(--line2); border-radius: 20px; }
.fatal h1 { margin: 12px 0 6px; font-size: 22px; }

/* ------------------------------------------------------------ ヘッダー */
.top {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 14px;
  min-height: var(--hdr-h);
  padding: 8px 16px; padding-top: max(8px, env(safe-area-inset-top));
  background: var(--hdr);
  backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--line);
}
.top::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 132px; height: 3px; background: var(--acc); }
.brand { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 0 1 auto; overflow: hidden; }
.top-right { flex: none; }
.cands:empty { display: none; }
.brand-mark { width: 38px; height: 38px; border-radius: 10px; background: url(icon.svg) center / cover; box-shadow: 0 0 calc(var(--glow) * 18px) rgba(255, 210, 63, 0.35); }
.brand-tx { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.brand-tx b { font-family: var(--f-num); font-size: 19px; letter-spacing: 0.08em; font-weight: 700; white-space: nowrap; }
.brand-tx span { font-size: 12px; color: var(--tx2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.tabs { display: flex; gap: 4px; margin-left: 8px; }
.tab { display: flex; align-items: center; gap: 7px; height: 40px; padding: 0 14px; border-radius: 10px; color: var(--tx2); font-weight: 700; white-space: nowrap; }
.tab:hover { background: var(--bg3); color: var(--tx); }
.tab.on { background: var(--acc); color: var(--acc-ink); }
.top-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.hbtn { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line2); background: var(--bg2); font-weight: 700; font-size: 14px; white-space: nowrap; }
.hbtn:hover { border-color: var(--tx3); }
.hbtn .badge { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 99px; background: var(--out); color: var(--out-ink); font-size: 12px; display: inline-grid; place-items: center; font-family: var(--f-num); }
.net { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 99px; border: 1px solid var(--line2); font-size: 13px; font-weight: 700; white-space: nowrap; color: var(--tx2); }
.net i { width: 9px; height: 9px; border-radius: 50%; background: currentColor; box-shadow: 0 0 calc(var(--glow) * 10px) currentColor; }
.net.online { color: var(--out); }
.net.syncing, .net.boot { color: var(--warn); }
.net.offline, .net.unauth { color: var(--alert); border-color: var(--alert); background: var(--alert-soft); }
.net.offline i, .net.syncing i, .net.boot i { animation: blink 1s steps(2) infinite; }
@keyframes blink { 50% { opacity: 0.2; } }
.clock { display: grid; grid-template-columns: auto auto; align-items: baseline; column-gap: 3px; line-height: 1; font-family: var(--f-num); font-variant-numeric: tabular-nums; padding-left: 12px; border-left: 1px solid var(--line); }
.clock .hm { font-size: 34px; font-weight: 700; letter-spacing: 0.02em; }
.clock .s { font-size: 18px; color: var(--acc-tx); font-weight: 600; min-width: 22px; }
.clock .date { grid-column: 1 / -1; font-size: 11px; letter-spacing: 0.12em; color: var(--tx2); margin-top: 3px; font-family: var(--f-ui); }
[data-theme="night"] .clock .hm { text-shadow: 0 0 18px rgba(255, 255, 255, 0.12); }
.bnav { display: none; }
.banner { display: flex; align-items: center; gap: 10px; padding: 10px 16px; font-weight: 700; border-bottom: 1px solid var(--line); }
.banner.k-alert { background: var(--alert-soft); color: var(--alert); }
.banner.k-warn { background: var(--warn-soft); color: var(--warn); }
.banner .btn { margin-left: auto; min-height: 36px; }

main { padding: 14px 16px 40px; }

/* ------------------------------------------------------------ ボタン・チップ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 0 18px; border-radius: 12px;
  font-weight: 700; font-size: 16px; white-space: nowrap;
  border: 1px solid var(--line2); background: var(--bg3); color: var(--tx);
  transition: transform 0.08s, background 0.15s, border-color 0.15s;
}
.btn:hover { border-color: var(--tx3); }
.btn:active { transform: scale(0.97); }
.btn.arr { --c: var(--wait); --ci: var(--wait-ink); }
.btn.dep { --c: var(--out); --ci: var(--out-ink); }
.btn.acc { --c: var(--acc); --ci: var(--acc-ink); }
.btn.danger { --c: var(--alert); --ci: #fff; }
.btn.arr, .btn.dep, .btn.acc, .btn.danger { background: transparent; border: 2px solid var(--c); color: var(--c); }
[data-theme="day"] .btn.acc { color: var(--tx); }
.btn.fill, .btn.on { background: var(--c, var(--acc)); color: var(--ci, var(--acc-ink)); border-color: var(--c, var(--acc)); }
.btn.fill:hover { filter: brightness(1.06); }
.btn.ghost { background: transparent; border-color: transparent; color: var(--tx2); }
.btn.ghost:hover { color: var(--tx); background: var(--bg3); }
.btn.sm { min-height: 36px; padding: 0 12px; font-size: 14px; border-radius: 10px; }
.btn.lg { min-height: 60px; font-size: 19px; border-radius: 14px; padding: 0 22px; }
.btn.xl { min-height: 78px; font-size: 24px; border-radius: 16px; }
.btn .sub { font-family: var(--f-num); font-weight: 600; opacity: 0.85; }
.btn.block { width: 100%; }
.icon-btn { width: 42px; height: 42px; display: inline-grid; place-items: center; border-radius: 10px; color: var(--tx2); }
.icon-btn:hover { background: var(--bg3); color: var(--tx); }
.chip { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border-radius: 99px; border: 1px solid var(--line2); background: var(--bg2); color: var(--tx2); font-weight: 700; font-size: 14px; white-space: nowrap; }
.chip:hover { color: var(--tx); border-color: var(--tx3); }
.chip.on { background: var(--tx); color: var(--bg); border-color: var(--tx); }
.chip .n { font-family: var(--f-num); font-size: 19px; font-weight: 700; color: var(--tx); margin-left: 2px; }
.chip.on .n { color: inherit; }
.chip .dot { box-shadow: 0 0 calc(var(--glow) * 8px) var(--dc); }
.chip.chip-alert { border-color: var(--alert); color: var(--alert); }
.chip.chip-alert .n { color: var(--alert); }
.chip.chip-alert.on { background: var(--alert); color: #fff; }
.chip.chip-alert.on .n { color: #fff; }
.filters .chip { height: 40px; }
.chip .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--dc, var(--tx3)); }
.seg { display: inline-flex; padding: 3px; border-radius: 12px; background: var(--bg); border: 1px solid var(--line2); gap: 2px; }
.seg button { height: 36px; padding: 0 14px; border-radius: 9px; color: var(--tx2); font-weight: 700; font-size: 14px; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.seg button.on { background: var(--acc); color: var(--acc-ink); }

.pill { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px 0 8px; border-radius: 99px; font-size: 13px; font-weight: 700; white-space: nowrap; color: var(--pc); background: var(--pcs); }
.s-pre { --pc: var(--idle); --pcs: var(--idle-soft); --st: var(--line2); }
.s-wait { --pc: var(--wait); --pcs: var(--wait-soft); --st: var(--wait); }
.s-out { --pc: var(--out); --pcs: var(--out-soft); --st: var(--out); }
.led { width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 calc(var(--glow) * 9px) currentColor; }
.s-wait .led { animation: pulse 2s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: 0.35; } }
.elapsed { font-family: var(--f-num); font-variant-numeric: tabular-nums; font-size: 15px; font-weight: 600; color: var(--tx2); }
.al { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 8px; border-radius: 6px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.al.lv-warn { color: var(--warn); background: var(--warn-soft); }
.al.lv-alert { color: #fff; background: var(--alert); animation: pulse 1.4s ease-in-out infinite; }
.delta { font-family: var(--f-num); font-size: 12px; font-weight: 700; margin-left: 3px; vertical-align: 0.45em; }
.d-ok, .d-early { color: var(--tx3); }
.d-warn { color: var(--warn); }
.d-alert { color: var(--alert); }
.cxl-tag { display: inline-block; padding: 1px 6px; border-radius: 4px; background: var(--alert); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-decoration: none; }
.tag-unreg { color: var(--warn); font-size: 11px; font-weight: 700; }

/* ------------------------------------------------------------ 入力 */
.inp, .sel, textarea.inp { width: 100%; height: 46px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line2); background: var(--bg); color: var(--tx); font-size: 16px; }
textarea.inp { height: auto; min-height: 140px; padding: 10px 12px; line-height: 1.5; font-family: var(--f-num), var(--f-ui); resize: vertical; }
.inp:focus, .sel:focus { outline: none; border-color: var(--acc); box-shadow: 0 0 0 3px var(--acc-soft); }
.inp.bad { border-color: var(--alert); box-shadow: 0 0 0 3px var(--alert-soft); animation: shake 0.3s; }
@keyframes shake { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.field { display: grid; gap: 6px; }
.field > span, .lbl { font-size: 13px; font-weight: 700; color: var(--tx2); }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.grow { flex: 1; min-width: 0; }
.check { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; cursor: pointer; min-height: 40px; }
.check input { width: 22px; height: 22px; accent-color: var(--acc); }
.search { position: relative; display: flex; align-items: center; min-width: 180px; }
.search .ico { position: absolute; left: 12px; color: var(--tx3); pointer-events: none; }
.search input { padding-left: 40px; height: 42px; }

/* ------------------------------------------------------------ ツールバー */
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; }
.toolbar .search { flex: 0 1 240px; }
.filters { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.filters::-webkit-scrollbar { display: none; }
.tools { display: flex; gap: 8px; align-items: center; margin-left: auto; flex-wrap: wrap; }
.daynav { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border-radius: 12px; border: 1px solid var(--line2); background: var(--bg2); }
.daynav .icon-btn { width: 36px; height: 36px; }
.daynav b { font-family: var(--f-num); font-size: 18px; padding: 0 8px; white-space: nowrap; }
.daynav .today { font-size: 11px; font-weight: 800; padding: 2px 7px; border-radius: 99px; background: var(--acc); color: var(--acc-ink); margin-right: 4px; }
.past { display: flex; align-items: center; gap: 10px; padding: 10px 14px; margin-bottom: 12px; border-radius: 12px; background: var(--warn-soft); color: var(--warn); font-weight: 700; }
.past .btn { margin-left: auto; }

/* ------------------------------------------------------------ ボード(グリッド) */
.wb-wrap { overflow: auto; max-height: calc(100dvh - 150px); min-height: 280px; background: var(--bg2); border: 1px solid var(--line); border-radius: var(--r); }
table.wb { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; }
.wb th, .wb td { height: 48px; padding: 0 8px; border-bottom: 1px solid var(--line); text-align: center; white-space: nowrap; background: var(--bg2); }
.wb thead th { position: sticky; top: 0; z-index: 3; height: 30px; font-size: 12px; font-weight: 700; color: var(--tx2); background: var(--bg3); border-bottom: 1px solid var(--line2); }
.wb thead tr.h2 th { top: 30px; height: 26px; font-size: 11px; color: var(--tx3); letter-spacing: 0.04em; }
.wb thead th.rh { font-size: 15px; color: var(--tx); text-align: left; padding-left: 12px; }
.wb thead th.rh em { font-style: normal; font-family: var(--f-num); font-size: 20px; color: var(--acc-tx); margin-right: 6px; }
.wb thead th.rh small { color: var(--tx3); font-size: 11px; }
.wb .rs { border-left: 2px solid var(--line2); }
.wb .gs { border-left: 1px solid var(--line2); }
.wb thead tr.h2 th.hp { color: var(--tx3); }
.wb thead tr.h2 th.ha { color: var(--acc-tx); }
.wb .c-id, .wb .c-st, .wb .c-act { position: sticky; z-index: 2; }
.wb thead .c-id, .wb thead .c-st, .wb thead .c-act { z-index: 4; }
.wb .c-id { left: 0; min-width: 96px; text-align: left; padding-left: 16px; cursor: pointer; box-shadow: inset 5px 0 0 var(--st, transparent); }
.wb .c-st { left: 96px; min-width: 128px; text-align: left; }
.wb .c-act { left: 224px; min-width: 96px; border-right: 2px solid var(--line2); }
.wb tbody .c-id .id { font-family: var(--f-num); font-size: 24px; font-weight: 700; letter-spacing: 0.01em; display: block; line-height: 1.05; }
.wb tbody .c-id .sub { display: block; font-size: 11px; color: var(--tx3); max-width: 90px; overflow: hidden; text-overflow: ellipsis; }
.wb .c-st .stline { display: flex; align-items: center; gap: 6px; }
.wb .c-st .al { margin-top: 3px; }
.wb .c-st .stsub { display: block; font-size: 12px; color: var(--tx3); margin-top: 2px; }
.wb .cell { cursor: pointer; min-width: 58px; font-family: var(--f-num); font-variant-numeric: tabular-nums; position: relative; }
.wb .cell:hover { background: var(--bg3); box-shadow: inset 0 0 0 1px var(--line2); }
.wb .sc { color: var(--tx3); font-size: 17px; background: color-mix(in srgb, var(--bg2) 94%, var(--tx) 6%); }
.wb .ac { color: var(--tx); font-size: 21px; font-weight: 600; }
.wb .nm { color: var(--tx); font-size: 21px; font-weight: 700; min-width: 46px; }
.wb .nx::after { content: ""; position: absolute; inset: 6px; border: 1.5px solid var(--acc); border-radius: 8px; opacity: 0.45; pointer-events: none; }
.wb tr.lv-warn .nx::after, .wb tr.lv-alert .nx::after { border-width: 2px; opacity: 1; animation: pulse 1.6s ease-in-out infinite; }
.wb tr.lv-alert .nx::after { border-color: var(--alert); }
[data-theme="day"] .wb .nx::after { border-color: #000; background: rgba(255, 204, 0, 0.3); opacity: 0.7; }
[data-theme="day"] .wb tr.lv-alert .nx::after { border-color: var(--alert); opacity: 1; }
.wb .sc.lv-warn { color: var(--warn); background: var(--warn-soft); font-weight: 700; }
.wb .sc.lv-alert { color: var(--alert); background: var(--alert-soft); font-weight: 700; }
.wb .cx { color: var(--tx3); text-decoration: line-through; }
.wb .cx .cxl-tag { font-family: var(--f-ui); }
.sheet-wrap:not(.in) .sheet { pointer-events: none; }
.wb .c-area { min-width: 64px; font-family: var(--f-num); font-size: 18px; font-weight: 700; border-left: 2px solid var(--line2); }
.wb .c-note { min-width: 120px; max-width: 220px; text-align: left; font-size: 13px; color: var(--tx2); overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.wb tbody tr:hover > * { background: var(--bg3); }
.wb tbody tr.lv-alert > .c-id { box-shadow: inset 5px 0 0 var(--alert); }
.wb tbody tr.lv-alert > * { background: color-mix(in srgb, var(--bg2) 90%, var(--alert) 10%); }
.mini { width: 40px; height: 36px; border-radius: 9px; font-weight: 800; font-size: 15px; border: 2px solid var(--c); color: var(--c); }
.mini.arr { --c: var(--wait); --ci: var(--wait-ink); }
.mini.dep { --c: var(--out); --ci: var(--out-ink); }
.mini.on { background: var(--c); color: var(--ci); }
.mini + .mini { margin-left: 6px; }
.empty { padding: 48px 20px; text-align: center; color: var(--tx2); }
.empty h3 { color: var(--tx); font-size: 20px; margin: 0 0 6px; }
.empty .row { justify-content: center; margin-top: 16px; }

/* ------------------------------------------------------------ ボード(カード) */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.card { position: relative; overflow: hidden; background: var(--bg2); border: 1px solid var(--line); border-radius: var(--r); padding: 10px 12px 12px 18px; display: grid; gap: 8px; }
.card-foot { display: flex; align-items: center; gap: 10px; }
.card-foot .card-now { flex: 1; min-width: 0; }
.card-foot .card-acts { display: flex; gap: 8px; }
.card-foot .card-acts .btn { min-height: 48px; padding: 0 14px; font-size: 16px; }
.card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--st); }
.card.lv-alert { border-color: var(--alert); box-shadow: 0 0 0 1px var(--alert) inset; }
.card.lv-alert::before { background: var(--alert); }
.card.lv-warn { border-color: color-mix(in srgb, var(--warn) 60%, var(--line)); }
.card-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 4px 12px; cursor: pointer; }
.card-top .cid { font-family: var(--f-num); font-size: 36px; font-weight: 700; line-height: 1; letter-spacing: 0.01em; }
.card-top .cmeta { font-size: 12px; color: var(--tx3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; align-self: end; padding-bottom: 3px; }
.card-top .cst { display: grid; justify-items: end; gap: 3px; }
.rounds { display: flex; gap: 6px; flex-wrap: wrap; }
.rchip { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 9px; border-radius: 8px; background: var(--bg3); border: 1px solid var(--line); font-family: var(--f-num); font-size: 15px; font-variant-numeric: tabular-nums; color: var(--tx2); white-space: nowrap; }
.rchip b { color: var(--acc-tx); font-size: 16px; }
[data-theme="day"] .rchip b { color: var(--tx); }
.rchip .v { color: var(--tx); font-weight: 600; }
.rchip .pax { color: var(--tx2); font-size: 13px; }
.rchip.cur { border-color: var(--acc); box-shadow: 0 0 0 1px var(--acc) inset; }
.rchip.cx { text-decoration: line-through; opacity: 0.7; }
.card-now { font-size: 14px; color: var(--tx2); display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; }
.card-now .num { color: var(--tx); font-size: 17px; font-weight: 600; }
.card-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.card-acts .btn { min-height: 54px; font-size: 18px; }

/* ------------------------------------------------------------ 入力(テンキー) */
.pad-view { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); max-width: 1500px; margin: 0 auto; }
@media (min-width: 900px) { .pad-view { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; } }
.pad-main { display: grid; gap: 12px; align-content: start; }
.pad-disp { position: relative; display: flex; align-items: center; gap: 14px; min-height: 96px; padding: 12px 18px; border-radius: 18px; background: var(--bg2); border: 2px solid var(--line2); }
.pad-disp.has { border-color: var(--acc); box-shadow: 0 0 calc(var(--glow) * 26px) rgba(255, 210, 63, 0.15); }
.pad-disp .lbl { font-family: var(--f-num); font-size: 12px; letter-spacing: 0.16em; color: var(--tx3); writing-mode: vertical-rl; transform: rotate(180deg); }
.pad-disp .val { font-family: var(--f-num); font-size: 64px; font-weight: 700; letter-spacing: 0.04em; line-height: 1; min-width: 1ch; }
.pad-disp .val:empty::before { content: "バスID"; font-family: var(--f-ui); font-size: 22px; color: var(--tx3); letter-spacing: 0; font-weight: 700; }
.pad-disp .caret { width: 3px; height: 54px; background: var(--acc); animation: blink 1s steps(2) infinite; }
.pad-disp .inp { height: 56px; font-family: var(--f-num); font-size: 28px; }
.pad-mini { margin-left: auto; height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line2); background: var(--bg3); font-family: var(--f-num); font-size: 15px; font-weight: 700; letter-spacing: 0.06em; color: var(--tx2); }
.pad-mini.on { background: var(--acc); border-color: var(--acc); color: var(--acc-ink); }
.cands { display: flex; gap: 8px; flex-wrap: wrap; min-height: 44px; }
.cand { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border-radius: 12px; background: var(--bg2); border: 1px solid var(--line2); font-family: var(--f-num); font-size: 22px; font-weight: 700; }
.cand .led { color: var(--pc); }
.cand:hover { border-color: var(--acc); }
.bus-panel { background: var(--bg2); border: 1px solid var(--line2); border-radius: 18px; padding: 16px 18px 18px 22px; display: grid; gap: 12px; position: relative; overflow: hidden; }
.bus-panel::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--st); }
.bus-panel .bp-top { display: flex; align-items: center; gap: 10px; min-width: 0; }
.bus-panel .bp-meta { flex: 1; min-width: 0; font-size: 13px; color: var(--tx3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bus-panel .bp-edit { flex: none; width: 40px; height: 40px; border: 1px solid var(--line2); }
.bus-panel .bp-sub { display: flex; align-items: center; gap: 6px; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.bus-panel .bp-sub::-webkit-scrollbar { display: none; }
.bus-panel .bp-sub .rchip { flex: none; }
.bp-info { flex: none; padding: 0 4px; font-size: 13px; color: var(--tx2); }
.bp-info b { font-size: 16px; color: var(--tx); }
.bus-panel .bp-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
/* 未入力時の候補（発車待ち・まもなく到着）: タップでそのまま記録 */
.qp { display: grid; gap: 14px; }
.qp-sec.dep { --c: var(--out); }
.qp-sec.arr { --c: var(--wait); }
.qp-h { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 13px; font-weight: 800; letter-spacing: 0.06em; color: var(--tx2); }
.qp-h .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c); box-shadow: 0 0 calc(var(--glow) * 8px) var(--c); }
.qp-h .n { font-family: var(--f-num); font-size: 18px; font-weight: 700; color: var(--c); }
.qp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.qp-tile { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 4px 8px; min-height: 62px; padding: 9px 12px 9px 17px; border-radius: 14px; background: var(--bg2); border: 1px solid var(--line2); text-align: left; overflow: hidden; transition: transform 0.08s, border-color 0.15s; }
.qp-tile::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--c); box-shadow: 0 0 calc(var(--glow) * 12px) var(--c); }
.qp-tile:hover { border-color: var(--c); }
.qp-tile:active { transform: scale(0.97); background: var(--bg3); }
.qp-id { font-family: var(--f-num); font-size: 30px; font-weight: 700; line-height: 1; letter-spacing: 0.02em; white-space: nowrap; }
.qp-r { text-align: right; font-family: var(--f-num); font-size: 15px; font-weight: 700; color: var(--c); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.qp-r .elapsed { font-size: 15px; color: var(--c); }
.qp-s { grid-column: 1 / -1; font-size: 12px; color: var(--tx3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qp-s .num { font-family: var(--f-num); font-size: 14px; font-weight: 700; color: var(--tx2); }
.qp-area { display: inline-block; margin-right: 6px; padding: 0 6px; border-radius: 5px; background: var(--bg4); font-family: var(--f-num); font-size: 13px; font-weight: 700; line-height: 18px; color: var(--tx); vertical-align: 1px; }
.qp-tile.far::before { opacity: 0.35; box-shadow: none; }
.qp-tile.far .qp-r { color: var(--tx3); }
.qp-tile.lv-warn { border-color: var(--warn); }
.qp-tile.lv-warn .qp-r { color: var(--warn); }
.qp-tile.lv-alert { border-color: var(--alert); background: var(--alert-soft); }
.qp-tile.lv-alert .qp-r { color: var(--alert); animation: pulse 1.4s ease-in-out infinite; }
.qp-foot { margin: 0; text-align: center; font-size: 12px; color: var(--tx3); }
.qp-empty { padding: 14px 16px; border-radius: 14px; border: 1px dashed var(--line2); font-size: 13px; line-height: 1.7; color: var(--tx3); }
.pad-keys { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; align-content: start; }
.pad-key { height: 70px; border-radius: 16px; background: var(--bg2); border: 1px solid var(--line2); font-family: var(--f-num); font-size: 34px; font-weight: 700; box-shadow: 0 2px 0 var(--line); }
.pad-key:active { transform: translateY(2px); box-shadow: none; background: var(--bg3); border-color: var(--acc); }
.pad-key.fn { font-family: var(--f-ui); font-size: 17px; color: var(--tx2); }

/* ------------------------------------------------------------ パネル(設定) */
.panel { background: var(--bg2); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 18px; min-width: 0; }
.panel > h2, .panel > header h2 { margin: 0; font-size: 16px; letter-spacing: 0.02em; }
.panel > header { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.panel > header .grow + * { margin-left: auto; }
.panel > h2 { margin-bottom: 12px; }
.panel p { margin: 0 0 10px; color: var(--tx2); }
.panels { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); align-items: start; }
.span-all { grid-column: 1 / -1; }
.tbl-wrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th, .tbl td { padding: 9px 10px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; }
.tbl th { font-size: 12px; color: var(--tx2); font-weight: 700; background: var(--bg3); position: sticky; top: 0; }
.tbl td { font-family: var(--f-num); font-variant-numeric: tabular-nums; font-size: 16px; }
.tbl th:first-child, .tbl td:first-child { text-align: left; }
.tbl td.t { font-family: var(--f-ui); font-size: 14px; }
.tbl tr.click { cursor: pointer; }
.tbl tr.click:hover td { background: var(--bg3); }
.scroll-y { max-height: 480px; overflow: auto; }

/* ------------------------------------------------------------ 設定 */
.kv { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 10px 14px; align-items: center; }
.kv > * { min-width: 0; }
.kv .seg { flex-wrap: wrap; max-width: 100%; }
.kv .seg button { padding: 0 11px; }
.kv > span { font-size: 13px; font-weight: 700; color: var(--tx2); }
.stack { display: grid; gap: 12px; }
.help { margin: 0; padding-left: 20px; color: var(--tx2); display: grid; gap: 6px; }
.help b { color: var(--tx); }
.note-box { padding: 10px 12px; border-radius: 10px; background: var(--bg3); border: 1px solid var(--line); color: var(--tx2); font-size: 13px; }
.note-box.k-warn { background: var(--warn-soft); border-color: transparent; color: var(--warn); font-weight: 700; }
.note-box.k-alert { background: var(--alert-soft); border-color: transparent; color: var(--alert); font-weight: 700; }
.bus-table td, .bus-table th { text-align: left; }
.bus-table td.id { font-family: var(--f-num); font-size: 18px; font-weight: 700; }
.dev-list { display: grid; gap: 6px; }
.dev { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; background: var(--bg3); }
.dev i { width: 9px; height: 9px; border-radius: 50%; background: var(--out); box-shadow: 0 0 calc(var(--glow) * 8px) var(--out); }
.dev .ip { margin-left: auto; font-family: var(--f-num); color: var(--tx3); font-size: 13px; }

/* ------------------------------------------------------------ シート(モーダル) */
.sheet-wrap { position: fixed; inset: 0; z-index: 100; display: flex; align-items: flex-end; justify-content: center; }
.sheet-bg { position: absolute; inset: 0; background: rgba(2, 5, 10, 0.62); backdrop-filter: blur(3px); opacity: 0; transition: opacity 0.2s; }
.sheet { position: relative; width: 100%; max-width: 580px; max-height: 94dvh; display: flex; flex-direction: column; background: var(--bg2); border: 1px solid var(--line2); border-bottom: 0; border-radius: 22px 22px 0 0; box-shadow: var(--shadow); transform: translateY(40px); opacity: 0; transition: transform 0.22s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.2s; }
.sheet.wide { max-width: 900px; }
.sheet.narrow { max-width: 440px; }
.sheet-wrap.in .sheet-bg { opacity: 1; }
.sheet-wrap.in .sheet { transform: none; opacity: 1; }
@media (min-width: 760px) {
  .sheet-wrap { align-items: center; padding: 20px; }
  .sheet { border-radius: 20px; border-bottom: 1px solid var(--line2); max-height: 92dvh; }
}
.sh-head { position: relative; display: flex; align-items: center; gap: 12px; padding: 16px 12px 12px 20px; border-bottom: 1px solid var(--line); }
.sh-head::before { content: ""; position: absolute; left: 20px; top: 0; width: 64px; height: 4px; border-radius: 0 0 4px 4px; background: var(--hc, var(--acc)); }
.sh-head.t-arr { --hc: var(--wait); }
.sh-head.t-dep { --hc: var(--out); }
.sh-head.t-alert { --hc: var(--alert); }
.sh-title { display: grid; gap: 1px; min-width: 0; }
.sh-kick { font-family: var(--f-num); font-size: 12px; letter-spacing: 0.16em; color: var(--hc, var(--tx3)); font-weight: 700; }
.sh-title h2 { margin: 0; font-size: 20px; line-height: 1.25; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sh-title h2 .bid { font-family: var(--f-num); font-size: 34px; letter-spacing: 0.01em; }
.sh-head .x { margin-left: auto; }
.sh-body { padding: 16px 20px; overflow: auto; flex: 1; display: grid; gap: 16px; align-content: start; overscroll-behavior: contain; }
.sh-foot { display: flex; gap: 10px; padding: 12px 20px; padding-bottom: max(12px, env(safe-area-inset-bottom)); border-top: 1px solid var(--line); }
.sh-foot .btn.lg { flex: 1; }
.sh-foot .btn .bt { display: inline-flex; align-items: center; gap: 8px; }
.warns:empty { display: none; }
@media (max-width: 759px) {
  .sh-foot .btn.lg:has(.sub) { flex-direction: column; gap: 0; line-height: 1.2; min-height: 66px; }
  .sh-foot .btn .sub { font-size: 15px; }
}
.sec { display: grid; gap: 8px; }
.sec > .lbl { display: flex; align-items: center; gap: 8px; }
.warns { display: grid; gap: 6px; }
.rsel { display: flex; gap: 6px; flex-wrap: wrap; }
.rsel button { min-width: 56px; height: 48px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--line2); background: var(--bg3); display: grid; place-items: center; line-height: 1.05; }
.rsel button b { font-family: var(--f-num); font-size: 20px; }
.rsel button small { font-size: 10px; color: var(--tx3); font-weight: 700; }
.rsel button.on { background: var(--acc); color: var(--acc-ink); border-color: var(--acc); }
.rsel button.on small { color: var(--acc-ink); }
.rinfo { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; color: var(--tx2); }
.rinfo .num { color: var(--tx); font-size: 16px; font-weight: 600; }
.timebox { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; }
.timebox .tb-mid { display: grid; justify-items: center; gap: 2px; cursor: pointer; }
.time-big { font-family: var(--f-num); font-size: 58px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.time-big small { font-size: 26px; color: var(--tx3); margin-left: 2px; }
.live-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 800; letter-spacing: 0.1em; color: var(--alert); }
.live-badge i { width: 8px; height: 8px; border-radius: 50%; background: var(--alert); animation: pulse 1.2s infinite; }
.fixed-badge { font-size: 12px; font-weight: 700; color: var(--tx3); }
.tstep { width: 64px; height: 64px; border-radius: 16px; border: 1px solid var(--line2); background: var(--bg3); font-family: var(--f-num); font-size: 17px; font-weight: 700; }
.counter { display: grid; grid-template-columns: 84px 1fr 84px; gap: 12px; align-items: center; }
.cbtn { height: 84px; border-radius: 18px; border: 1px solid var(--line2); background: var(--bg3); font-size: 42px; font-weight: 400; line-height: 1; }
.cbtn:active { background: var(--bg4); border-color: var(--acc); }
.count-num { width: 100%; height: 84px; border-radius: 18px; border: 2px solid var(--line2); background: var(--bg); color: var(--tx); text-align: center; font-family: var(--f-num); font-size: 62px; font-weight: 700; font-variant-numeric: tabular-nums; }
.count-num::placeholder { color: var(--tx3); font-size: 40px; }
.count-num:focus { outline: none; border-color: var(--acc); }
.quick { display: flex; gap: 8px; flex-wrap: wrap; }
.quick .chip { height: 42px; padding: 0 16px; font-size: 16px; }
.rb { border: 1px solid var(--line2); border-radius: 14px; padding: 12px; display: grid; gap: 10px; background: var(--bg); }
.rb.cx { border-style: dashed; opacity: 0.85; }
.rb-head { display: flex; align-items: center; gap: 10px; }
.rb-head .rb-no { font-family: var(--f-num); font-size: 26px; font-weight: 700; color: var(--acc-tx); }
[data-theme="day"] .rb-head .rb-no { color: var(--tx); }
/* 1行目: 着予・着時・人数 / 2行目: 発予・発時・人数（予定の隣に実績） */
.rb-line { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr) minmax(0, 0.8fr) minmax(0, 0.9fr); gap: 8px; }
.rb-line .inp.kind { padding: 0 6px; font-family: inherit; font-size: 16px; font-weight: 700; }
.rb-line2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.35fr); gap: 8px; }
.rb-line label, .rb-line2 label { display: grid; gap: 3px; font-size: 12px; font-weight: 700; color: var(--tx2); min-width: 0; }
.rb-line .inp, .rb-line2 .inp { height: 44px; font-family: var(--f-num); font-size: 19px; min-width: 0; }
.rb-line .inp.plan { background: var(--bg3); color: var(--tx2); }
.rb-line .withnow { display: flex; gap: 6px; min-width: 0; }
.rb-line .withnow .btn { flex: none; min-height: 44px; padding: 0 10px; }
.rb-by { font-size: 12px; color: var(--tx3); }
.qr-grid { display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .qr-grid { grid-template-columns: 320px minmax(0, 1fr); } }
.qr-box { background: #fff; border-radius: 18px; padding: 14px; box-shadow: 0 0 0 1px var(--line2), 0 0 calc(var(--glow) * 40px) rgba(255, 210, 63, 0.12); }
.qr-box svg { display: block; width: 100%; height: auto; }
.url { font-family: var(--f-num); font-size: 15px; word-break: break-all; padding: 10px 12px; border-radius: 10px; background: var(--bg3); border: 1px solid var(--line); }
.steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; counter-reset: st; }
.steps li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; color: var(--tx2); }
.steps li::before { counter-increment: st; content: counter(st); width: 28px; height: 28px; border-radius: 50%; background: var(--acc); color: var(--acc-ink); display: grid; place-items: center; font-weight: 800; font-family: var(--f-num); }
.steps li b { color: var(--tx); }
.preview { max-height: 260px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.preview .tbl td { font-size: 14px; }

/* ポップオーバー(セル編集) */
.pop { position: fixed; z-index: 90; width: 250px; padding: 12px; border-radius: 14px; background: var(--bg2); border: 2px solid var(--acc); box-shadow: var(--shadow); display: grid; gap: 8px; }
.pop-h { font-size: 13px; font-weight: 800; color: var(--tx2); display: flex; gap: 6px; align-items: baseline; }
.pop-h b { font-family: var(--f-num); font-size: 18px; color: var(--tx); }
.pop .inp { height: 52px; font-family: var(--f-num); font-size: 28px; text-align: center; }
.pop-btns { display: flex; gap: 6px; }
.pop-btns .btn { flex: 1; min-height: 38px; padding: 0 8px; font-size: 14px; }
.pop-hint { font-size: 11px; color: var(--tx3); text-align: center; }

/* トースト */
#toasts { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 150; display: grid; gap: 8px; width: min(560px, calc(100vw - 24px)); pointer-events: none; }
.toast { pointer-events: auto; position: relative; overflow: hidden; display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 12px 10px 18px; border-radius: 14px; background: var(--bg4); border: 1px solid var(--line2); box-shadow: var(--shadow); font-weight: 700; animation: tin 0.22s ease-out; }
.toast::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--tc, var(--acc)); }
.toast.k-arr { --tc: var(--wait); }
.toast.k-dep, .toast.k-ok { --tc: var(--out); }
.toast.k-warn { --tc: var(--warn); }
.toast.k-alert { --tc: var(--alert); }
.toast .tmsg { flex: 1; font-size: 15px; }
.toast .tmsg .num { font-size: 17px; }
.toast .tundo { height: 40px; padding: 0 14px; border-radius: 10px; background: var(--tx); color: var(--bg); font-weight: 800; }
.toast .tbar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--tc, var(--acc)); transform-origin: left; animation: tbar linear forwards; opacity: 0.6; }
.toast.out { opacity: 0; transform: translateY(8px); transition: 0.2s; }
@keyframes tin { from { opacity: 0; transform: translateY(12px); } }
@keyframes tbar { to { transform: scaleX(0); } }

/* ------------------------------------------------------------ スマホ */
@media (max-width: 759px) {
  :root { --hdr-h: 56px; }
  .top { gap: 10px; padding: 6px 10px; padding-top: max(6px, env(safe-area-inset-top)); }
  .top::after { width: 90px; }
  .brand-mark { width: 32px; height: 32px; border-radius: 9px; }
  .brand-tx b { font-size: 16px; }
  .brand-tx span { max-width: 130px; }
  .tabs, .hide-sm { display: none !important; }
  .hbtn { height: 36px; padding: 0 9px; }
  .net { height: 30px; padding: 0 9px; }
  .net .t { display: none; }
  .clock { padding-left: 8px; }
  .clock .hm { font-size: 25px; }
  .clock .s { font-size: 14px; min-width: 17px; }
  .clock .date { display: none; }
  main { padding: 10px 10px calc(var(--bnav-real, 64px) + 10px); }
  .bnav { display: grid; grid-template-columns: repeat(3, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; background: var(--hdr); backdrop-filter: blur(10px); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
  .bnav button { position: relative; display: grid; justify-items: center; gap: 2px; padding: 9px 0 8px; font-size: 11px; font-weight: 700; color: var(--tx3); }
  .bnav button .ico { width: 24px; height: 24px; }
  .bnav button.on { color: var(--tx); }
  .bnav button.on::before { content: ""; position: absolute; top: -1px; left: 28%; right: 28%; height: 3px; border-radius: 0 0 3px 3px; background: var(--acc); }
  .toolbar { gap: 8px; }
  .toolbar .search { flex: 1 1 120px; min-width: 0; }
  .daynav .today { display: none; }
  .daynav b { font-size: 16px; padding: 0 4px; }
  .rchip { height: 28px; padding: 0 7px; gap: 3px; font-size: 14px; }
  .rchip b { font-size: 14px; }
  .rchip .pax { font-size: 12px; }
  .card-top .cid { font-size: 32px; }
  .tools { margin-left: 0; }
  .cards { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  /* 入力画面: 画面の高さぴったりに収め、テンキーは下に固定（打鍵中にキーが動かない・10個とも常に見える） */
  .pad-view {
    --vh: 100vh;
    --avail: calc(var(--vh) - var(--hdr-real, 56px) - var(--bnav-real, 64px) - 20px);
    display: flex; flex-direction: column; gap: 8px;
    height: var(--avail); min-height: 360px;
  }
  @supports (height: 100dvh) { .pad-view { --vh: 100dvh; } }
  .pad-main { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
  .pad-keys { flex: none; height: clamp(200px, calc(var(--avail) - 250px), 312px); grid-template-rows: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .pad-key { height: auto; min-height: 0; line-height: 1; font-size: 32px; border-radius: 14px; }
  .pad-disp { min-height: 62px; padding: 6px 8px 6px 12px; gap: 10px; border-radius: 16px; }
  .pad-disp .val { font-size: 44px; }
  .pad-disp .val:empty::before { font-size: 18px; }
  .pad-disp .caret { height: 38px; }
  .pad-disp .inp { height: 48px; font-size: 24px; }
  .cands { min-height: 0; gap: 6px; }
  .cand { height: 40px; padding: 0 12px; font-size: 20px; }
  .qp { gap: 10px; }
  .qp-h { margin-bottom: 6px; }
  .qp-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
  .qp-tile { min-height: 56px; padding: 7px 10px 7px 15px; border-radius: 12px; }
  .qp-id { font-size: 26px; }
  .bus-panel { padding: 8px 10px 10px 16px; gap: 6px; border-radius: 16px; }
  .bus-panel .bp-top { gap: 8px; }
  .bus-panel .bp-edit { width: 34px; height: 34px; }
  .bus-panel .bp-sub .rchip:not(.cur) { display: none; }
  .bus-panel .bp-acts { gap: 10px; }
  .bus-panel .bp-acts .btn.xl { min-height: 64px; font-size: 24px; }
  .kv { grid-template-columns: 1fr; gap: 4px; }
  .time-big { font-size: 50px; }
  .counter { grid-template-columns: 76px 1fr 76px; }
  .cbtn { height: 76px; }
  .count-num { height: 76px; font-size: 54px; }
  #toasts { bottom: calc(76px + env(safe-area-inset-bottom)); }
}

/* 小さいスマホ (iPhone SE 等): 便チップを省いて記録ボタンとテンキーを優先 */
@media (max-width: 759px) and (max-height: 620px) {
  .bus-panel .bp-sub { display: none; }
  .bus-panel .bp-acts .btn.xl { min-height: 56px; font-size: 22px; }
  .pad-disp { min-height: 56px; }
  .pad-disp .val { font-size: 38px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
/* ------------------------------------------------------------ 運行記録表（印刷・PDF）— Excel出力と同じ配色 */
#print { display: none; background: #fff; color: #111827; font-family: var(--f-ui); }
#print .pr-head h1 { margin: 0 0 1.5mm; font-size: 17pt; color: #0b1f33; letter-spacing: 0.04em; }
#print .pr-head dl { display: flex; flex-wrap: wrap; gap: 1mm 7mm; margin: 0 0 3mm; font-size: 9pt; color: #4b5563; }
#print .pr-head dl div { display: flex; gap: 2mm; }
#print .pr-head dt { font-weight: 700; }
#print .pr-head dd { margin: 0; color: #111827; }
#print .pr-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; border: 1.4pt solid #111827; }
#print .pr-table.r3 { zoom: 0.84; }
#print .pr-table.r4 { zoom: 0.7; }
#print .pr-table.r5 { zoom: 0.6; }
#print .pr-table th, #print .pr-table td { border: 0.5pt solid #d1d8e0; padding: 0.9mm 1.4mm; text-align: center; white-space: nowrap; font-size: 10pt; }
#print thead th { background: #111827; color: #fff; font-weight: 700; border-color: #374151; }
#print thead .p-round { font-size: 10.5pt; }
#print thead th.p-hplan { background: #e5e7eb; color: #374151; font-size: 8.5pt; border-color: #d1d8e0; }
#print thead th.p-hact { background: #ffd23f; color: #111827; font-size: 8.5pt; border-color: #d1d8e0; }
#print thead tr:last-child th { border-bottom: 1.4pt solid #111827; }
#print tbody tr:nth-child(even) > * { background: #f5f7fa; }
#print .pr-table .p-rs, #print .pr-table .p-area { border-left: 1.4pt solid #111827; }
#print .pr-table .p-gs { border-left: 1pt solid #6b7280; }
#print .pr-table tbody .p-id { text-align: left; font-size: 11.5pt; font-weight: 700; color: #0b1f33; padding-left: 2mm; }
/* 備考・メモは枠の中で折り返す（隣の列にはみ出さない） */
#print .pr-table td.p-bnote { width: 36mm; text-align: left; font-size: 7.5pt; line-height: 1.3; color: #4b5563; white-space: normal; overflow-wrap: anywhere; }
#print .pr-table td.p-note { width: 46mm; text-align: left; font-size: 8.5pt; line-height: 1.3; white-space: normal; overflow-wrap: anywhere; }
#print .pr-table thead th.p-bnote, #print .pr-table thead th.p-note { color: #fff; }
#print .pr-table td.p-unreg { color: #b45309; font-weight: 700; }
#print .pr-table tbody td.p-sc { background: #f1f3f6; color: #6b7280; font-size: 9pt; }
#print .pr-table tbody tr:nth-child(even) > td.p-sc { background: #e9edf2; }
#print .pr-table td.p-ac, #print .pr-table td.p-n { font-weight: 700; font-size: 10.5pt; }
#print .pr-table td.p-area { font-weight: 700; }
#print .pr-table tbody td.p-warn { background: #fef0c7; color: #b45309; }
#print .pr-table tbody td.p-alert { background: #fde0e3; color: #b91c1c; }
#print .pr-table td.p-cx { text-decoration: line-through; color: #9ca3af; }
#print .pr-table tbody td.p-cxl { background: #fde0e3; color: #b91c1c; font-weight: 800; letter-spacing: 0.2em; }
#print .pr-legend { display: flex; flex-wrap: wrap; gap: 2mm 3mm; align-items: center; margin-top: 3mm; font-size: 8pt; color: #4b5563; }
#print .pr-legend span { padding: 0.8mm 3mm; border: 0.5pt solid #d1d8e0; }
#print .pr-legend .lg-plan { background: #e5e7eb; color: #374151; }
#print .pr-legend .lg-warn { background: #fef0c7; color: #b45309; }
#print .pr-legend .lg-alert { background: #fde0e3; color: #b91c1c; }
@media print {
  @page { size: A4 landscape; margin: 8mm 8mm 10mm; }
  html, body { background: #fff !important; }
  body { background-image: none !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body.printing > :not(#print) { display: none !important; }
  body.printing #print { display: block !important; }
  #print thead { display: table-header-group; }
  #print tr { break-inside: avoid; }
}

/* 走行区分バッジ（実車＝人が乗る便は塗りつぶしで目立たせ、回送・待機は控えめ） */
.kd { display: inline-block; margin-left: 5px; padding: 0 5px; border-radius: 5px; border: 1px solid transparent; font-family: var(--f-ui, inherit); font-style: normal; font-size: 11px; font-weight: 800; line-height: 16px; letter-spacing: 0.04em; vertical-align: 1px; white-space: nowrap; }
.kd.k-pax { background: var(--pax); color: var(--pax-ink); box-shadow: 0 0 calc(var(--glow) * 8px) color-mix(in srgb, var(--pax) 55%, transparent); }
.kd.k-dh { border-color: var(--line2); color: var(--tx3); }
.kd.k-sb { background: var(--bg4); color: var(--tx2); }
.wb .sc .kd { display: block; width: fit-content; margin: 1px auto 0; }
.qp-s .kd { margin: 0 6px 0 0; }