.office-home {container:office / inline-size}
.office-home .desk-head {padding-inline:clamp(0px,.5vw,9px)}
.office-home .desk-head .btn {font-size:clamp(14px,1.15vw,18px);padding:11px 18px}
.office-home .desk-head p {color:#e0e9ee}
.office-card {container:office-card / inline-size;overflow:hidden}
.office-card small {display:block;color:#bfd0dc;line-height:1.4;font-size:13px}
.office-more {white-space:nowrap}
.office-empty {display:flex;align-items:center;gap:12px;min-height:74px;line-height:1.5}
.office-empty>.icon {color:#94adbd;width:21px;height:21px}
.office-operations,.office-disposition,.office-reporting {grid-template-columns:minmax(0,1fr)}
@container office (min-width:870px){
  .office-operations {grid-template-columns:minmax(0,1.78fr) minmax(0,1fr)}
  .office-disposition:has(>section:nth-child(2)) {grid-template-columns:minmax(0,1.88fr) minmax(0,1fr)}
  .office-reporting:has(>section:nth-child(2)) {grid-template-columns:minmax(0,1fr) minmax(0,1.03fr)}
  .office-operations .office-empty {min-height:129px}
}
.office-trips,.office-tasks,.office-crew,.office-bookings,.office-plot ol {margin:0;padding:0;list-style:none}
.office-trips {padding:4px 7px 0}
.office-trip {display:grid;align-items:center;grid-template-columns:25px minmax(80px,.8fr) minmax(120px,1.5fr) minmax(84px,.95fr) auto 10px;gap:clamp(6px,.8vw,15px);width:100%;border:1px solid transparent;border-radius:6px;background:none;color:inherit;text-align:left;padding:13px 10px;min-height:64px;font:inherit;line-height:1.3}
.office-trips li+li {border-top:1px solid #354a57}
.office-trip.in-motion {background:#292d39;border-color:#cf8699}
.office-trip:hover {background:#283c4a}
.office-trip.in-motion:hover {background:#38323f}
.office-trip:focus-visible {outline-offset:-3px}
.office-trip>.icon {width:24px;height:24px}
.office-trip.in-motion>.icon {color:var(--accent)}
.office-trip-who,.office-trip-route,.office-progress {min-width:0}
.office-trip-who,.office-trip-route {display:grid;gap:4px}
.office-trip-who strong,.office-trip-route strong {font-size:clamp(14px,1.06vw,17px);line-height:1.25}
.office-trip small {font-size:12px}
.office-trip-who small {display:flex;align-items:center;gap:5px}
.office-trip-who i,.office-crew .office-dot {display:inline-block;width:8px;height:8px;border-radius:50%;background:#90a6b7;flex:none}
.office-trip.in-motion .office-trip-who i,.office-crew .office-dot.online {background:#83e4a1}
.office-trip.offered .office-trip-who i,.office-trip.paused .office-trip-who i {background:#dbb579}
.office-trip-route {border-left:1px solid #384b59;padding-left:clamp(7px,.95vw,16px)}
.office-trip-info,.office-follow-route strong,.office-follow-route small,.office-rig {display:flex;align-items:center;gap:8px}
.office-trip-info {font-size:12px;color:#d7e1e7}
.office-trip-info .icon,.office-follow-route .icon {width:15px;height:15px}
.office-state,.office-tag {width:max-content;max-width:100%;padding:3px 8px;border:1px solid #536d7f;border-radius:6px;font-size:12px;font-weight:620;white-space:nowrap;background:#253745;color:#e3ecf2}
.office-trip.offered .office-state,.office-trip.paused .office-state {background:#3a3528;border-color:#776845;color:#f2d997}
.office-trip.in-motion .office-state {background:#213a31;border-color:#457657;color:#a6e7b4}
.office-chevron {font-size:21px;line-height:1;color:#d6e0e7}
.office-progress strong {font-size:14px}
.office-progress progress {display:block;width:100%;height:8px;margin:3px 0 4px;border:0;border-radius:6px;overflow:hidden;background:#43515e;appearance:none;accent-color:#f68da6}
.office-progress progress::-webkit-progress-bar {background:#43515e;border-radius:6px}
.office-progress progress::-webkit-progress-value {background:#f68da6;border-radius:6px}
.office-progress progress::-moz-progress-bar {background:#f68da6;border-radius:6px}
.office-tasks,.office-crew,.office-bookings {padding:0 13px}
.office-tasks li,.office-crew>li,.office-bookings li {padding:12px 3px;border-bottom:1px solid #354a57}
.office-tasks li:last-child,.office-crew>li:last-child,.office-bookings li:last-child {border-bottom:0}
.office-tasks li,.office-bookings li,.office-crew-main {display:grid;align-items:center;gap:clamp(8px,.95vw,16px);grid-template-columns:24px minmax(0,1fr) auto;line-height:1.35}
.office-tasks li>div,.office-bookings li>div,.office-crew-main>div {display:grid;gap:3px}
.office-tasks li strong,.office-bookings li strong {font-size:clamp(14px,1.02vw,17px);letter-spacing:-.015em}
.office-tasks b {color:var(--accent);font-size:1.18em;padding-right:3px}
.office-task-action,.office-home .btn.office-task-action {display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:4px 12px;border:1px solid #cf8096;border-radius:6px;text-decoration:none;color:#ffadbe;background:#232f3c;font-size:13px;font-weight:620}
.office-task-action:hover,.office-home .btn.office-task-action:hover {background:#3b3542}
.office-follow-card .desk-card-head {justify-content:flex-start}
.office-tag {background:#443541;border-color:#926073;color:#ffcad7}
.office-follow {display:grid;align-items:center;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(120px,.75fr);gap:14px;padding:15px 18px}
.office-follow>div+div {border-left:1px solid #405460;padding-left:14px}
.office-follow>div:first-child strong {display:block;font-size:clamp(16px,1.3vw,21px);line-height:1.23}
.office-follow small {margin-top:5px}
.office-follow-route strong,.office-follow-route small {display:block;font-size:13px;font-weight:500}
.office-follow-route .icon {margin-right:6px}
.office-follow-actions {display:grid;gap:5px}
.office-follow-actions .btn {min-height:30px;padding:4px 8px;font-size:13px}
.office-crew-main strong {font-size:17px}
.office-crew-main small {display:flex;align-items:center;gap:6px}
.office-availability {text-align:right;color:var(--accent);text-decoration:none;font-size:12px;font-weight:600}
.office-availability:hover {text-decoration:underline}
.office-rig {margin-top:11px;font-size:13px;color:#dce6ed}
.office-rig .icon {width:20px;height:20px}
.office-booked {text-align:right;font-variant-numeric:tabular-nums}
.office-booked .credit {color:#a2edac}
.office-booked .debit {color:#ff9eb2}
.office-chart {margin:0;padding:10px 18px 13px}
.office-chart figcaption {font-size:13px;color:#dae5ec;margin-bottom:12px}
.office-plot {--plot-height:110px;display:grid;grid-template-columns:max-content minmax(0,1fr);gap:10px;font-size:12px;line-height:1;color:#cfdee8}
.office-axis {height:var(--plot-height);display:flex;flex-direction:column;justify-content:space-between;font-variant-numeric:tabular-nums}
.office-plot ol {display:flex;justify-content:space-around;gap:clamp(3px,1vw,18px);padding:0 8px;background:repeating-linear-gradient(to bottom,#405462 0 1px,transparent 1px 25%) top left / 100% var(--plot-height) no-repeat}
.office-plot li {display:grid;flex:1;min-width:0;grid-template-rows:var(--plot-height) auto;justify-items:center;gap:8px}
.office-bar-space {width:100%;max-width:52px;display:flex;align-items:flex-end;justify-content:center}
.office-bar-space i {display:block;width:100%;background:linear-gradient(#fb9ab1,#ed7592);border-radius:4px 4px 0 0}
.office-secondary {display:grid;gap:14px;min-width:0}
.office-secondary .scroll {max-width:100%}
.office-shortcuts {display:flex;flex-wrap:wrap;gap:7px;padding:13px 16px}
.office-shortcuts a,.office-shortcuts .btn {display:inline-flex;align-items:center;gap:6px;text-decoration:none;min-height:33px;padding:5px 10px;border:1px solid #405968;border-radius:6px;font-size:13px;font-weight:550}
.office-shortcuts a:hover {background:#263b49}
.office-shortcuts .icon {width:15px;height:15px;color:var(--accent)}
@container office-card (max-width:610px){
  .office-trip {grid-template-columns:20px minmax(72px,.7fr) minmax(97px,1.2fr) minmax(65px,.8fr) 8px;gap:7px;padding-inline:5px}
  .office-trip>.icon {width:19px;height:19px}
  .office-trip .office-state {display:none}
  .office-trip-route {padding-left:8px}
  .office-follow {grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .office-follow>div.office-follow-actions {grid-column:1/-1;display:flex;flex-wrap:wrap;padding-left:0;border:0}
}
@container office-card (max-width:420px){
  .office-trip {grid-template-columns:20px minmax(0,1fr) auto;row-gap:6px;padding-block:10px}
  .office-trip-who {grid-column:2;grid-row:1;display:flex;align-items:center;flex-wrap:wrap;gap:4px 9px}
  .office-trip-route {grid-column:2;grid-row:2;border:0;padding:0}
  .office-trip-info,.office-progress {grid-column:2;grid-row:3}
  .office-chevron {grid-row:1 / span 3;grid-column:3}
  .office-trips .office-progress {max-width:175px}
  .office-tasks,.office-bookings,.office-crew {padding-inline:9px}
  .office-tasks li,.office-bookings li,.office-crew-main {grid-template-columns:18px minmax(0,1fr) auto;gap:8px}
  .office-tasks li>.icon,.office-bookings li>.icon,.office-crew-main>.icon {width:17px;height:17px}
  .office-availability {max-width:82px}
  .office-follow {display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:13px}
  .office-follow>div+div {padding-left:0;border:0}
}