:root {
  --black: #0b0c0e;
  --panel: #14171b;
  --panel2: #1b1f24;
  --gold: #f1b600;
  --gold2: #ffd34b;
  --white: #f8f9fb;
  --muted: #aeb5bf;
  --line: #343a43;
  --danger: #b93b3b;
  --success: #2a8d61;
  --shadow: 0 16px 50px rgba(0,0,0,.35);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #0c0e11; color: var(--white); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { min-width: 320px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
#app { min-height: 100vh; }
.topbar { display:grid; grid-template-columns:minmax(230px,auto) minmax(0,1fr); grid-template-areas:"brand actions" "tabs tabs"; align-items:center; gap:7px 14px; padding:9px 16px 8px; background:linear-gradient(180deg,#08090a,#111317); border-bottom:2px solid var(--gold); position:sticky; top:0; z-index:10000; isolation:isolate; }
.brand { display:flex; align-items:center; gap:14px; min-width:0; }
.topbar .brand { grid-area:brand; }
.logo { width:48px; height:48px; object-fit:contain; }
.brand h1 { margin:1px 0 0; font-size:clamp(1.15rem,1.55vw,1.48rem); line-height:1; letter-spacing:.02em; }
.eyebrow { color:var(--gold2); font-size:.62rem; font-weight:800; letter-spacing:.11em; }
.top-actions { grid-area:actions; display:flex; align-items:center; justify-content:flex-end; gap:6px; flex-wrap:wrap; }
.top-actions .btn { min-height:34px; padding:7px 10px; border-radius:8px; font-size:.75rem; white-space:nowrap; }
.sync-badge { border:1px solid var(--line); border-radius:999px; padding:7px 10px; font-size:.73rem; font-weight:800; color:var(--muted); white-space:nowrap; }
.sync-badge.live { color:#c8ffe7; border-color:#2c7355; background:#153929; }
.sync-badge.saving { color:#fff1b5; border-color:#806600; background:#342a00; }
.btn { appearance:none; border:1px solid var(--line); border-radius:9px; padding:9px 12px; font-weight:750; color:var(--white); background:#1d2127; transition:.15s ease; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.btn:hover { transform: translateY(-1px); border-color:#626b78; }
.btn-primary { background:var(--gold); border-color:var(--gold); color:#111; }
.btn-ghost { background:#171a1f; }
.btn-danger { background:#381a1a; border-color:#6e2b2b; color:#ffc6c6; }
.btn-full { width:100%; }
.icon-btn { width:40px; height:40px; border-radius:9px; border:1px solid var(--line); background:#16191d; color:white; font-size:1.5rem; }
.summary-strip { display:grid; grid-template-columns:repeat(5,minmax(105px,1fr)) minmax(220px,1.8fr); gap:1px; background:#242931; border-bottom:1px solid #2d333c; }
.metric { min-height:48px; padding:7px 12px; background:#111419; display:flex; justify-content:space-between; gap:10px; align-items:center; }
.metric-label { color:var(--muted); font-size:.67rem; text-transform:uppercase; letter-spacing:.055em; font-weight:700; }
.metric strong { font-size:1.02rem; }
.metric-wide strong { font-size:.78rem; font-weight:650; text-align:right; }
.metric-filter { appearance:none; border:0; color:var(--white); font:inherit; cursor:pointer; text-align:left; transition:background .15s ease,box-shadow .15s ease; }
.metric-filter small { color:#7fa9c7; font-size:.56rem; font-weight:850; letter-spacing:.04em; text-transform:uppercase; }
.metric-filter:hover { background:#191f26; }
.metric-filter:focus-visible { outline:2px solid var(--gold); outline-offset:-2px; }
.metric-filter.active { background:#172534; box-shadow:inset 0 -3px 0 var(--gold); }
.metric-filter.active small { color:var(--gold2); }
.workspace { display:grid; grid-template-columns: minmax(0, 1fr) 380px; min-height:calc(100vh - 150px); }
.board-column { min-width:0; padding:14px; }
.board-toolbar { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:10px; }
.toolbar-group { display:flex; flex-wrap:wrap; gap:8px; }
.toolbar-help { color:var(--muted); font-size:.82rem; text-align:right; }
.file-btn { display:inline-flex; align-items:center; }
.file-btn input { display:none; }
.board-wrap { position:relative; z-index:0; isolation:isolate; background:#08090b; border:1px solid #323740; border-radius:12px; overflow:hidden; box-shadow:var(--shadow); }
.fleet-board { position:relative; z-index:0; isolation:isolate; width:100%; aspect-ratio:1332 / 1098; overflow:hidden; user-select:none; touch-action:none; background:#101317; }
.board-background { position:absolute; inset:0; width:100%; height:100%; object-fit:fill; pointer-events:none; }
.barge-layer { position:absolute; inset:0; z-index:2; overflow:hidden; }
.empty-board-message { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(360px,80%); background:rgba(0,0,0,.78); border:1px solid rgba(241,182,0,.7); border-radius:12px; padding:18px; text-align:center; pointer-events:none; backdrop-filter: blur(3px); }
.empty-board-message span { display:block; color:#d2d5da; font-size:.86rem; margin-top:5px; }
.notes-row { margin-top:10px; }
.notes-row label, .filter-grid label, .detail-grid label, .login-card label { display:block; color:#d7dbe1; font-size:.78rem; font-weight:750; }
input, select, textarea { width:100%; margin-top:6px; border:1px solid #3b424c; border-radius:8px; background:#0f1216; color:white; padding:9px 10px; outline:none; }
input:focus, select:focus, textarea:focus { border-color:var(--gold); box-shadow:0 0 0 2px rgba(241,182,0,.12); }
textarea { resize:vertical; }
.sidebar { border-left:1px solid #2b3037; background:#111419; padding:14px; min-width:0; }
.sidebar-header { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.sidebar h2 { margin:0; font-size:1.1rem; }
.sidebar p { margin:3px 0 0; color:var(--muted); font-size:.78rem; }
.filter-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:13px 0; }
.barge-list { display:flex; flex-direction:column; gap:7px; max-height:calc(100vh - 340px); overflow:auto; padding-right:3px; }
.barge-card { border:1px solid #303640; border-radius:10px; background:#171b20; padding:10px; cursor:pointer; }
.barge-card:hover { border-color:#6a717c; }
.barge-card-top { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.barge-card-name { font-weight:850; letter-spacing:.02em; }
.status-pill { border-radius:999px; padding:3px 7px; font-size:.66rem; font-weight:850; background:#292f37; color:#d6dbe2; white-space:nowrap; }
.status-pill.loaded { background:#2f2810; color:#ffe47d; }
.status-pill.empty { background:#173426; color:#b8f1d0; }
.barge-card-meta { display:flex; flex-wrap:wrap; gap:6px 10px; margin-top:7px; color:#aeb5bf; font-size:.71rem; }
.card-onboard { border-left:3px solid var(--gold); }

/* V59 — keep label fill for load status, use outer border/pills for fleet/map status */
.barge-card.card-in-fleet { border-left:4px solid #3a9df6; }
.barge-card.card-out-fleet { border-left:4px solid #7b8693; }
.barge-card.card-off-map { border-right:4px dashed #d6a348; }
.map-presence-pill { display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-size:.65rem; font-weight:850; letter-spacing:.02em; }
.map-presence-pill.on { background:#17242e; color:#9fd0ff; border:1px solid #355a7c; }
.map-presence-pill.off { background:#231b10; color:#f0cd7e; border:1px solid #8c6a2f; }
.tools-panel { margin-top:12px; border-top:1px solid #2f343c; padding-top:10px; }
.tools-panel summary { cursor:pointer; color:#d8dce2; font-size:.82rem; font-weight:750; }
.tools-content { display:flex; flex-direction:column; gap:7px; padding-top:8px; }
.barge { position:absolute; transform-origin:center center; cursor:grab; backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.barge.locked { cursor:pointer; }
.barge.dragging { cursor:grabbing; z-index:100 !important; }
.barge-shell { position:absolute; inset:0; background:#f4f4f1; border:2px solid #101214; color:#0b0c0d; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.barge.tank30 .barge-shell, .barge.tank10 .barge-shell { clip-path:polygon(7% 0,100% 0,100% 100%,7% 100%,0 76%,0 24%); }
.barge.tank30 .barge-shell::before, .barge.tank10 .barge-shell::before { content:""; position:absolute; inset:13% 10%; border-top:1px solid #727272; border-bottom:1px solid #727272; background:repeating-linear-gradient(90deg, transparent 0 15%, rgba(70,70,70,.35) 15% 16%, transparent 16% 32%); }
.barge.hopper .barge-shell { background:#d9d6cb; clip-path:polygon(5% 0,100% 0,100% 100%,5% 100%,0 73%,0 27%); }
.barge.hopper .barge-shell::before { content:""; position:absolute; inset:16% 10%; background:#5c5548; border:2px solid #171717; box-shadow:inset 0 0 0 3px #918879; }
.barge.deck .barge-shell { background:repeating-linear-gradient(90deg,#d4d0c2 0 8%,#b7b2a4 8% 9%); clip-path:polygon(5% 0,100% 0,100% 100%,5% 100%,0 72%,0 28%); }
.barge-label { position:relative; z-index:8; background:#0b0d10; color:#fff; border:2px solid #f4ba00; border-radius:4px; padding:3px 8px; font-weight:950; letter-spacing:.03em; font-size:clamp(10px, 1.05vw, 16px); line-height:1; white-space:nowrap; max-width:94%; overflow:hidden; text-overflow:ellipsis; box-shadow:0 1px 3px rgba(0,0,0,.8); text-shadow:0 1px 0 rgba(0,0,0,.55); pointer-events:none; }
/* The barge number stays dominant; the label color itself shows Empty / Loaded / Partial. */
.barge.activity-loading .barge-shell { box-shadow:inset 0 -4px 0 #2b8aef; }
.barge.activity-discharging .barge-shell { box-shadow:inset 0 -4px 0 #d86f24; }
.barge.activity-underway .barge-shell { box-shadow:inset 0 -4px 0 #7c65d1; }
.barge.activity-at-fleet .barge-shell { box-shadow:inset 0 -4px 0 #4caa70; }
.barge.activity-at-customer-dock .barge-shell { box-shadow:inset 0 -4px 0 #38a3a5; }
.barge.activity-shipyard-repair .barge-shell { box-shadow:inset 0 -4px 0 #b85d62; }
.barge.activity-cleaning .barge-shell { box-shadow:inset 0 -4px 0 #8f9aa7; }
.barge.load-empty .barge-label { background:#16713b; border-color:#e9f6ec; color:#fff; }
.barge.load-loaded .barge-label { background:#b72222; border-color:#ffe5e5; color:#fff; }
.barge.load-partially-loaded .barge-label { background:#d97a15; border-color:#fff1dd; color:#111; text-shadow:none; }
.barge.load-unknown .barge-label, .barge.load- .barge-label { background:#0b0d10; border-color:#f4ba00; color:#fff; }
.overlay { position:fixed; inset:0; z-index:20000; width:100vw; height:100vh; height:100dvh; max-width:100vw; max-height:100vh; max-height:100dvh; background:rgba(0,0,0,.82); display:flex; align-items:flex-start; justify-content:center; padding:8px 12px; overflow:auto; overscroll-behavior:contain; backdrop-filter:blur(5px); }
.overlay-hidden { display:none; }
#detailOverlay { padding-top:8px; }
#detailOverlay .detail-panel { width:min(800px, calc(100vw - 24px)); max-height:calc(100vh - 16px); max-height:calc(100dvh - 16px); }
.floating-dialog-close { position:fixed; top:max(8px, env(safe-area-inset-top)); right:max(10px, env(safe-area-inset-right)); z-index:10050; width:44px; height:44px; border-radius:50%; border:2px solid #f4ba00; background:#111419; color:#fff; font-size:30px; line-height:36px; font-weight:900; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.55); }
.floating-dialog-close:hover { background:#252b33; }
.floating-dialog-close:focus-visible { outline:3px solid #fff; outline-offset:2px; }
.login-card { width:min(430px,100%); background:#15191e; border:1px solid #3d434c; border-top:3px solid var(--gold); border-radius:14px; padding:22px; box-shadow:var(--shadow); }
.login-card h2 { margin:4px 0 4px; }
.login-card p { color:#b8bec7; }
.login-card label { margin-top:12px; }
.login-logo { width:72px; height:72px; object-fit:contain; }
.login-note { font-size:.72rem; line-height:1.4; }
.message { min-height:20px; margin:9px 0; color:#ffd39d; font-size:.78rem; }
.detail-panel { width:min(800px, calc(100vw - 24px)); max-width:calc(100vw - 24px); max-height:calc(100vh - 16px); max-height:calc(100dvh - 16px); overflow-y:auto; overflow-x:hidden; margin:0 auto; background:#14181d; border:1px solid #404650; border-radius:14px; box-shadow:var(--shadow); }
.detail-header { position:sticky; top:0; z-index:3; display:flex; justify-content:space-between; align-items:center; padding:16px 18px; background:#111419; border-bottom:1px solid #2d333b; }
.detail-header h2 { margin:2px 0 0; }
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; padding:18px; }
.span-2 { grid-column:span 2; }
.rotation-controls { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; margin-top:6px; }
.rotation-controls span { min-width:54px; text-align:center; font-weight:850; }
.rotation-quick-controls { display:grid; grid-template-columns:auto 1fr 1fr; align-items:center; gap:8px; margin-top:8px; }
.rotation-quick-controls span { color:#aeb6c1; font-size:.7rem; font-weight:800; white-space:nowrap; }
.rotation-quick-controls .btn { min-height:38px; padding:8px 12px; }
.detail-footer { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:14px 18px; border-top:1px solid #2d333b; position:sticky; bottom:0; background:#111419; }
.footer-right { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.toast { position:fixed; right:18px; bottom:18px; z-index:30000; opacity:0; pointer-events:none; transform:translateY(10px); background:#111419; border:1px solid #454c56; border-left:3px solid var(--gold); color:white; border-radius:9px; padding:10px 13px; box-shadow:var(--shadow); transition:.2s ease; max-width:360px; font-size:.82rem; }
.toast.show { opacity:1; transform:translateY(0); }
@media (max-width: 1180px) {
  .workspace { grid-template-columns:1fr; }
  .sidebar { border-left:0; border-top:1px solid #2b3037; }
  .barge-list { max-height:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); }
  .summary-strip { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 700px) {
  .topbar { position:relative; align-items:flex-start; flex-direction:column; }
  .top-actions { justify-content:flex-start; }
  .summary-strip { grid-template-columns:repeat(2,1fr); }
  .metric-wide { grid-column:span 2; }
  .workspace { display:block; }
  .board-column { padding:8px; }
  .board-toolbar { align-items:flex-start; flex-direction:column; }
  .toolbar-help { text-align:left; }
  .detail-grid { grid-template-columns:1fr; }
  .span-2 { grid-column:auto; }
  .detail-footer { align-items:stretch; flex-direction:column-reverse; }
  .footer-right { justify-content:stretch; }
  .footer-right .btn, .detail-footer > .btn { flex:1; }
}
@media print {
  .top-actions, .board-toolbar, .sidebar, .notes-row, .summary-strip { display:none !important; }
  .topbar { position:static; border-bottom:2px solid #000; color:#000; background:#fff; }
  .brand .eyebrow { color:#000; }
  .logo { width:46px; height:46px; }
  .workspace, .board-column { display:block; padding:0; }
  .board-wrap { border:0; box-shadow:none; border-radius:0; }
  body { background:#fff; }
}

/* Version 2 operational improvements */
.operator-badge { border:1px solid #3b424c; border-radius:999px; padding:6px 10px; color:#dfe3e8; background:#171a1f; font-size:.72rem; font-weight:800; white-space:nowrap; }
.sync-badge.unsaved { border-color:#d9792c; color:#ffd1ab; background:#2a1d13; }
.fleet-counts { margin-top:7px; color:#aeb5bf; font-size:.72rem; }
.tow-panel { margin:12px 0 4px; border:1px solid #303640; border-radius:10px; background:#15191e; overflow:hidden; }
.tow-panel summary { cursor:pointer; padding:10px; font-size:.8rem; font-weight:800; color:#e3e7ec; background:#171b20; }
.tow-assignments { padding:8px; display:flex; flex-direction:column; gap:7px; }
.tow-row { border:1px solid #2d333b; border-radius:8px; padding:8px; background:#101318; }
.tow-row-head { display:flex; justify-content:space-between; gap:8px; font-size:.75rem; font-weight:850; }
.tow-row-count { color:#f1b600; }
.tow-chips { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.tow-chip { border:1px solid #424955; border-radius:999px; background:#1b2026; color:#e5e8ec; padding:4px 7px; font-size:.68rem; cursor:pointer; }
.tow-chip:hover { border-color:#f1b600; }
.barge-card-location { width:100%; color:#d1d6dd; }
.app-footer { padding:10px 14px 16px; text-align:center; color:#747c87; font-size:.7rem; background:#0d0f12; }
.board-background { object-fit:contain; }
@media (max-width:700px) {
  .operator-badge { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
}
@media print { .app-footer, #logoutBtn, .operator-badge { display:none !important; } }

.other-boat-label { display:none !important; }
.other-boat-label.show { display:block !important; }


/* Version 4 — Morning Traffic / seven towboat status board */
.morning-traffic-panel { margin-top:12px; }
.morning-traffic-panel summary { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.traffic-progress { color:#ffcb2e; font-size:.68rem; font-weight:900; white-space:nowrap; }
.traffic-progress.complete { color:#9be0ba; }
.tow-assignments { gap:6px; max-height:520px; overflow:auto; }
.morning-boat-card { border:1px solid #333a44; border-left:4px solid #9a6b00; border-radius:9px; padding:8px 9px; background:#101318; cursor:pointer; transition:.14s ease; }
.morning-boat-card:hover { border-color:#69727e; border-left-color:#f1b600; background:#14191f; }
.morning-boat-card.updated-today { border-left-color:#2a8d61; }
.morning-boat-card.needs-update { border-left-color:#a84a42; }
.morning-boat-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.morning-boat-name { font-size:.78rem; font-weight:900; color:#f6f7f9; }
.morning-status-pill { max-width:48%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; border:1px solid #3e4651; border-radius:999px; padding:2px 6px; color:#f4d97f; background:#211d10; font-size:.62rem; font-weight:850; }
.morning-position { margin-top:4px; color:#d5dae0; font-size:.68rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.morning-tow, .morning-destination, .morning-job { margin-top:3px; color:#aeb5bf; font-size:.65rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.morning-tow strong { color:#e9edf2; }
.morning-updated { margin-top:4px; font-size:.61rem; font-weight:750; }
.morning-updated.current { color:#8bd5ae; }
.morning-updated.stale { color:#e49b93; }
.boat-detail-panel { width:min(820px,100%); }
.boat-assigned-summary { padding:13px 18px 0; }
.boat-log-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:14px 18px 2px; color:#ced6e0; font-size:.75rem; line-height:1.4; }
.boat-log-actions .btn { min-height:42px; border-color:#b78b35; color:#ffe4a3; }
.boat-log-comparison { margin:12px 18px 4px; padding:12px 14px; border:1px solid #a07719; border-radius:9px; background:#28200e; color:#f8f2df; line-height:1.45; font-size:.8rem; overflow-wrap:anywhere; }
.boat-log-comparison[hidden] { display:none !important; }
.boat-log-comparison strong { color:#ffdf85; }
.boat-log-comparison p { margin:5px 0; }
.boat-log-comparison ul { margin:8px 0 0; padding-left:20px; }
.boat-log-comparison li { margin:3px 0; }
.boat-log-comparison .btn { margin-top:10px; border-color:#e0b654; color:#141313; background:#ffce58; }
.boat-log-comparison .btn:disabled { opacity:.65; cursor:not-allowed; }
.boat-assigned-label { display:block; color:#aeb5bf; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; margin-bottom:7px; }
.boat-assigned-barges { display:flex; flex-wrap:wrap; gap:6px; min-height:28px; }
.boat-assigned-heading { display:flex; justify-content:space-between; gap:12px; align-items:flex-end; margin-bottom:7px; }
.boat-assigned-heading .boat-assigned-label { margin-bottom:0; }
.boat-assigned-help { color:#8f99a5; font-size:.68rem; line-height:1.3; text-align:right; max-width:520px; }
.boat-assigned-editor { padding:8px; border:1px solid #38424d; border-radius:9px; background:#0f1318; display:block; min-height:0; }
.morning-barge-picker-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; align-items:center; }
.morning-barge-picker-row input { width:100%; min-height:38px; padding:7px 10px; border:1px solid #46515d; border-radius:7px; background:#11161c; color:#f4f6f8; font-size:.78rem; font-weight:750; }
.morning-barge-picker-row input:focus { outline:2px solid rgba(242,197,0,.22); border-color:#d4a900; }
.morning-barge-add { min-height:38px; padding:7px 12px; white-space:nowrap; }
.morning-barge-picker-meta { display:flex; justify-content:space-between; gap:10px; margin-top:5px; color:#7f8995; font-size:.6rem; font-weight:750; }
.morning-barge-chips { display:flex; flex-wrap:wrap; gap:5px; margin-top:7px; }
.morning-barge-chip { display:inline-flex; align-items:center; gap:5px; max-width:100%; border:1px solid #735d09; background:#25200c; color:#ffe079; border-radius:999px; padding:3px 4px 3px 8px; font-size:.68rem; font-weight:850; }
.morning-barge-chip strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.morning-barge-remove { width:24px; height:24px; border:0; border-radius:999px; background:#3b3210; color:#ffeaa7; font-size:1rem; line-height:1; font-weight:900; cursor:pointer; }
.morning-barge-remove:hover { background:#594a12; color:#fff; }
.morning-barge-empty { color:#89919c; font-size:.7rem; padding:3px 1px; }
@media (max-width:760px) {
  .boat-assigned-heading { align-items:flex-start; flex-direction:column; gap:3px; }
  .boat-assigned-help { text-align:left; }
}
@media (max-width:480px) {
  .morning-barge-picker-row { grid-template-columns:1fr; }
  .morning-barge-add { width:100%; }
}
.assigned-barge-chip { display:inline-block; border:1px solid #735d09; background:#25200c; color:#ffe079; border-radius:999px; padding:4px 8px; font-size:.7rem; font-weight:850; }
.muted-text { color:#89919c; font-size:.74rem; }
.boat-last-updated { color:#aeb5bf; font-size:.72rem; }
@media (max-width:1050px) {
  .tow-assignments { max-height:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); }
}
@media (max-width:700px) {
  .morning-traffic-panel summary { align-items:flex-start; flex-direction:column; }
  .tow-assignments { display:flex; }
}


/* Version 5 — live NOAA/NWS Mississippi Sound GMZ532 marine weather */
.weather-strip { border-bottom:1px solid #2b3037; background:#111419; padding:10px 14px 11px; }
.weather-strip-bottom { margin-top:18px; border-top:2px solid #2b3037; }
.weather-heading { display:flex; justify-content:space-between; align-items:center; gap:14px; }
.weather-heading strong { display:block; margin-top:1px; font-size:.93rem; color:#f3f5f7; }
.weather-heading-actions { display:flex; align-items:center; gap:8px; }
.weather-live-badge { display:inline-flex; align-items:center; border:1px solid #4a515b; border-radius:999px; padding:5px 8px; color:#c6ccd4; background:#171b20; font-size:.62rem; font-weight:900; white-space:nowrap; }
.weather-live-badge.weather-ok { border-color:#277a57; color:#a9e4c3; background:#10261d; }
.weather-refresh-btn { padding:6px 9px; font-size:.68rem; }
.weather-alerts { margin-top:7px; }
.weather-alert-item { display:flex; gap:8px; align-items:flex-start; padding:7px 9px; margin-top:5px; border:1px solid #8b4d29; border-left:4px solid #e08138; border-radius:7px; background:#251811; color:#ffd7b8; font-size:.7rem; }
.weather-alert-item strong { flex:0 0 auto; color:#ffbd80; }
.weather-no-alerts { color:#86c9a6; font-size:.66rem; font-weight:750; }
.weather-quick { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; }
.weather-quick-card { min-width:0; display:grid; grid-template-columns:auto 1fr; align-items:start; gap:8px; padding:8px 10px; border:1px solid #303640; border-radius:8px; background:#0f1216; }
.weather-quick-card strong { color:#f4c928; font-size:.69rem; text-transform:uppercase; letter-spacing:.04em; }
.weather-quick-card span { color:#d7dce2; font-size:.7rem; line-height:1.35; }
.weather-loading { color:#aeb5bf; font-size:.72rem; }
.weather-meta-row { display:flex; justify-content:space-between; gap:10px; margin-top:6px; color:#808995; font-size:.61rem; }
.weather-full { margin-top:7px; border-top:1px solid #262c33; padding-top:6px; }
.weather-full > summary { cursor:pointer; color:#e1e5ea; font-size:.69rem; font-weight:850; }
.weather-periods { display:grid; grid-template-columns:1fr 1fr; gap:6px 10px; padding:8px 0 3px; }
.weather-period-row { display:grid; grid-template-columns:105px 1fr; gap:8px; border-bottom:1px solid #252a31; padding:5px 0; }
.weather-period-row strong { color:#f4c928; font-size:.64rem; text-transform:uppercase; }
.weather-period-row span { color:#c7cdd5; font-size:.65rem; line-height:1.35; }
.weather-source-line { color:#777f89; font-size:.6rem; padding-top:5px; }
.weather-source-line a { color:#d8bf58; }
@media (max-width:800px) {
  .weather-quick, .weather-periods { grid-template-columns:1fr; }
  .weather-heading { align-items:flex-start; flex-direction:column; }
  .weather-heading-actions { width:100%; justify-content:space-between; }
  .weather-meta-row { flex-direction:column; gap:2px; }
}
@media (max-width:520px) {
  .weather-quick-card { grid-template-columns:1fr; gap:3px; }
  .weather-period-row { grid-template-columns:1fr; gap:2px; }
}
@media print { .weather-strip { display:none !important; } }

/* Version 6 — visiting equipment + history / billing archive */
.btn-small { padding:6px 8px; font-size:.68rem; }
.traffic-actions { padding:7px 8px 0; display:flex; justify-content:flex-end; }
.visitor-company { margin-top:3px; color:#d5b56c; font-size:.62rem; font-weight:750; }
.visitor-heading { margin:9px 2px 2px; padding-top:8px; border-top:1px solid #343a43; color:#e1c57e; font-size:.67rem; font-weight:900; text-transform:uppercase; letter-spacing:.05em; }
.boat-footer-left { display:flex; flex-direction:column; align-items:flex-start; gap:7px; }
.temporary-field, .boat-temporary-field { display:none !important; }
.temporary-field.show, .boat-temporary-field.show { display:block !important; }

.history-panel { width:min(1180px, calc(100vw - 24px)); max-width:calc(100vw - 24px); max-height:calc(100vh - 16px); max-height:calc(100dvh - 16px); overflow:auto; }
.history-body { width:100%; min-width:0; padding:16px; display:flex; flex-direction:column; gap:16px; }
.history-section { min-width:0; max-width:100%; border:1px solid #303640; border-radius:11px; background:#101318; padding:14px; overflow:hidden; }
.history-section-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.history-section h3 { margin:0; font-size:.96rem; }
.history-section p { margin:4px 0 0; color:#929aa5; font-size:.7rem; }
.history-date-controls { display:flex; gap:7px; align-items:center; min-width:290px; }
.history-date-controls input { margin-top:0; }
.history-availability { margin-top:9px; color:#b8c0ca; font-size:.7rem; }
.snapshot-view { width:100%; min-width:0; max-width:100%; margin-top:10px; overflow:hidden; }
.snapshot-meta { min-width:0; max-width:100%; display:flex; flex-wrap:wrap; gap:8px 14px; padding:8px 10px; border:1px solid #3a424d; border-radius:8px; background:#161b21; font-size:.7rem; overflow-wrap:anywhere; }
.snapshot-meta strong { color:#f4c928; }
.snapshot-meta span { color:#b9c0c8; }
.snapshot-boat-list { min-width:0; max-width:100%; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:7px; margin-top:9px; }
.snapshot-boat-row { min-width:0; max-width:100%; border:1px solid #303640; border-radius:8px; padding:8px; background:#0d1014; display:grid; gap:3px; overflow:hidden; }
.snapshot-boat-row strong { color:#f2f4f6; font-size:.73rem; }
.snapshot-boat-row span { min-width:0; color:#aeb5bf; font-size:.65rem; overflow-wrap:anywhere; word-break:break-word; }
.snapshot-visitors { margin-top:9px; padding:9px; border:1px solid #674c1d; border-radius:8px; background:#1b150a; }
.snapshot-visitors > strong { color:#f0c86b; font-size:.7rem; }
.snapshot-visitors > div { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.snapshot-visitors span { border:1px solid #5f4b25; border-radius:999px; padding:3px 7px; color:#e6d4a9; font-size:.64rem; }
.history-filter-grid { display:grid; grid-template-columns:140px 140px minmax(220px,1fr) auto; gap:8px; align-items:end; margin-top:12px; }
.history-filter-grid label { color:#d7dbe1; font-size:.69rem; font-weight:750; }
.history-quick-buttons { display:flex; gap:5px; align-items:center; }
.visit-summary { margin:9px 0 7px; color:#c5ccd4; font-size:.68rem; }
.history-table-wrap { overflow:auto; border:1px solid #303640; border-radius:9px; }
.history-table { width:100%; border-collapse:collapse; min-width:980px; }
.history-table th, .history-table td { padding:7px 8px; border-bottom:1px solid #292f36; text-align:left; vertical-align:top; font-size:.64rem; }
.history-table th { position:sticky; top:0; background:#1a1f25; color:#e8ebef; font-weight:850; white-space:nowrap; }
.history-table td { color:#c5cbd2; }
.history-table td strong { display:block; color:#f1f3f5; font-size:.67rem; }
.history-table td small { display:block; margin-top:2px; color:#8e97a2; }

/* Data-safe history layout: actions stay inside the table instead of floating over billing columns. */
.history-table th.history-action-head,
.history-table td.history-action-cell { position:static; white-space:nowrap; min-width:92px; }
.history-table td.history-action-cell .btn { white-space:nowrap; }
.history-barge-edit { appearance:none; border:0; padding:0; margin:0; background:transparent; color:#f1f3f5; font:inherit; cursor:pointer; text-align:left; }
.history-barge-edit strong { text-decoration:underline; text-decoration-color:rgba(255,255,255,.22); text-underline-offset:2px; }
.history-barge-edit:focus-visible { outline:2px solid var(--gold); outline-offset:3px; border-radius:3px; }
@media (hover:hover) and (pointer:fine) { .history-barge-edit:hover strong { text-decoration-color:var(--gold); } }
.history-loading, .history-empty { padding:12px; border:1px dashed #3a424c; border-radius:8px; color:#9da6b1; font-size:.72rem; text-align:center; }
.history-empty-cell { text-align:center !important; color:#8e97a2 !important; padding:18px !important; }
@media (max-width:800px) {
  .history-section-head { flex-direction:column; }
  .history-date-controls { min-width:0; width:100%; }
  .snapshot-boat-list { grid-template-columns:1fr; }
  .history-filter-grid { grid-template-columns:1fr 1fr; }
  .history-filter-grid label:nth-child(3) { grid-column:span 2; }
  .history-quick-buttons { grid-column:span 2; flex-wrap:wrap; }
}
@media (max-width:520px) {
  .history-date-controls { flex-direction:column; align-items:stretch; }
  .history-filter-grid { grid-template-columns:1fr; }
  .history-filter-grid label:nth-child(3), .history-quick-buttons { grid-column:auto; }
}
@media print { #historyOverlay { display:none !important; } }

/* V7 fleet in/out billing */
.btn-success { background:#173b28; border-color:#2f7f54; color:#c7f4d8; }
.btn-success:hover { border-color:#55a978; }
.field-help { display:block; margin-top:4px; color:#8f98a3; font-size:.64rem; font-weight:500; line-height:1.25; }
.fleet-presence-box { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:13px 14px; border:1px solid #545c66; border-radius:10px; background:#181d22; }
.fleet-presence-box.in-fleet { border-color:#3d8e61; background:#13251b; }
.fleet-presence-box > div:first-child { display:flex; flex-direction:column; gap:2px; }
.fleet-presence-kicker { color:#98a2ad; font-size:.62rem; font-weight:850; letter-spacing:.08em; }
#fleetPresenceStatus { color:#e5e9ed; font-size:1rem; letter-spacing:.04em; }
.fleet-presence-box.in-fleet #fleetPresenceStatus { color:#baf0cf; }
#fleetPresenceSub { color:#aab2bc; font-size:.68rem; }
.fleet-presence-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.fleet-presence-pill { display:inline-block; border-radius:999px; padding:2px 6px; font-size:.62rem; font-weight:900; letter-spacing:.03em; }
.fleet-presence-pill.in { background:#173426; color:#b8f1d0; border:1px solid #2c7750; }
.fleet-presence-pill.out { background:#272d34; color:#c0c7cf; border:1px solid #454d56; }
.open-visit-row td { background:#12261a; }
.open-visit-row td:first-child { box-shadow:inset 3px 0 0 #3f9b67; }
@media (max-width:700px) {
  .fleet-presence-box { flex-direction:column; align-items:stretch; }
  .fleet-presence-actions { justify-content:stretch; }
  .fleet-presence-actions .btn { flex:1 1 100%; }
}

.billing-pill { display:inline-block; border-radius:999px; padding:2px 6px; font-size:.62rem; font-weight:900; }
.billing-pill.billable { background:#30260d; color:#ffe08a; border:1px solid #7f651b; }
.billing-pill.no-charge { background:#242a30; color:#adb5be; border:1px solid #414952; }


/* V8 — simple MM/DD/YYYY + 24-hour fleet clock */
.fleet-clock-overlay { z-index:22000; }
.fleet-clock-panel { width:min(620px, 96vw); background:#14181d; border:1px solid #4a525d; border-radius:14px; box-shadow:var(--shadow); padding:18px; }
.fleet-clock-heading h2 { margin:4px 0 5px; color:#f4f6f8; font-size:1.15rem; }
.fleet-clock-heading p { margin:0; color:#9da6b1; font-size:.72rem; }
.fleet-clock-controls { display:grid; grid-template-columns:1.5fr .7fr .7fr; gap:10px; margin-top:16px; }
.fleet-clock-controls label { color:#dbe0e5; font-size:.72rem; font-weight:800; }
.fleet-clock-controls input, .fleet-clock-controls select { width:100%; margin-top:5px; min-height:44px; border:1px solid #48515c; border-radius:8px; background:#0e1115; color:#f4f6f8; padding:8px 10px; font-size:1rem; }

.fleet-service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:12px; padding-top:12px; border-top:1px solid #343b44; }
.fleet-service-grid label { color:#dbe0e5; font-size:.72rem; font-weight:800; }
.fleet-service-grid input, .fleet-service-grid select { width:100%; margin-top:5px; min-height:42px; border:1px solid #48515c; border-radius:8px; background:#0e1115; color:#f4f6f8; padding:8px 10px; }
.fleet-clock-other-label, .fleet-assist-field { display:none; }
.fleet-clock-other-label.show, .fleet-assist-field.show { display:block; }
@media (max-width:640px) { .fleet-service-grid { grid-template-columns:1fr; } }
.fleet-clock-preview-wrap { margin-top:14px; padding:13px 14px; border:1px solid #715e1d; border-radius:9px; background:#1c180b; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.fleet-clock-preview-wrap span { color:#b6aa77; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.fleet-clock-preview-wrap strong { color:#ffd85e; font-size:1.08rem; letter-spacing:.04em; }
.fleet-clock-actions { display:flex; justify-content:space-between; gap:10px; margin-top:16px; }
.fleet-clock-actions-right { display:flex; gap:8px; }
@media (max-width:560px) {
  .fleet-clock-controls { grid-template-columns:1fr 1fr; }
  .fleet-clock-controls label:first-child { grid-column:1 / -1; }
  .fleet-clock-preview-wrap { align-items:flex-start; flex-direction:column; }
  .fleet-clock-actions { flex-direction:column; }
  .fleet-clock-actions-right { display:grid; grid-template-columns:1fr 1fr; }
  .fleet-clock-actions .btn { width:100%; }
}
@media print { #fleetClockOverlay { display:none !important; } }


/* Saved Equipment Directory */
.equipment-directory-panel { width:min(900px,96vw); max-height:90vh; overflow:auto; }
.equipment-directory-controls { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,260px); gap:12px; margin:10px 0 8px; }
.equipment-directory-controls label { display:grid; gap:5px; font-weight:800; font-size:.88rem; }
.equipment-directory-summary { color:#c8cdd5; margin:4px 0 10px; font-size:.9rem; }
.equipment-directory-list { display:grid; gap:8px; }
.equipment-directory-row { display:grid; grid-template-columns:minmax(150px,1.2fr) minmax(130px,1fr) minmax(150px,1.2fr) auto; gap:10px; align-items:center; padding:10px 12px; border:1px solid #353b43; border-radius:10px; background:#11151a; }
.equipment-directory-name { display:flex; flex-direction:column; gap:2px; min-width:0; }
.equipment-directory-name strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.equipment-directory-name span, .equipment-directory-meta { color:#aeb5bf; font-size:.84rem; }
.equipment-directory-company { font-weight:850; }
.equipment-directory-active { color:#89c99f; font-weight:850; font-size:.84rem; text-align:right; }
.equipment-directory-empty { padding:20px; text-align:center; color:#aeb5bf; border:1px dashed #3b424b; border-radius:10px; }
@media (max-width:700px) {
  .equipment-directory-controls { grid-template-columns:1fr; }
  .equipment-directory-row { grid-template-columns:1fr auto; }
  .equipment-directory-company, .equipment-directory-meta { grid-column:1 / -1; }
}

.other-company-label { display:none !important; }
.other-company-label.show { display:block !important; }


/* V19 — semi-monthly billing cycles and per-company print statements */
.billing-head-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.billing-cycle-controls { display:grid; grid-template-columns:minmax(160px,220px) minmax(180px,260px) auto; gap:10px; align-items:end; margin:10px 0 12px; padding:10px; border:1px solid #363d46; border-radius:9px; background:#14181d; }
.billing-cycle-controls label { display:flex; flex-direction:column; gap:5px; color:#b8c0c9; font-size:.7rem; font-weight:800; }
.billing-cycle-controls input, .billing-cycle-controls select { width:100%; min-width:0; }
.quickbooks-export-settings { display:grid; grid-template-columns:minmax(220px,1fr) minmax(150px,190px) minmax(150px,190px); gap:10px; align-items:end; margin:0 0 12px; padding:10px; border:1px solid #2f5972; border-radius:9px; background:#101a21; }
.quickbooks-export-copy { display:flex; flex-direction:column; gap:3px; min-width:0; color:#dce6ee; }
.quickbooks-export-copy strong { font-size:.78rem; }
.quickbooks-export-copy span { color:#9eb0bd; font-size:.68rem; line-height:1.35; }
.quickbooks-export-settings label { display:flex; flex-direction:column; gap:5px; color:#b8c0c9; font-size:.7rem; font-weight:800; }
.quickbooks-export-settings input { width:100%; min-width:0; }
.billing-print-area { display:none; }
@media (max-width:700px) {
  .billing-head-actions { width:100%; justify-content:stretch; }
  .billing-head-actions .btn { flex:1; }
  .billing-cycle-controls { grid-template-columns:1fr; }
  .quickbooks-export-settings { grid-template-columns:1fr; }
}
@media print {
  body.billing-print-mode > *:not(#billingPrintArea) { display:none !important; }
  body.billing-print-mode #billingPrintArea { display:block !important; color:#111; background:#fff; }
  body.billing-print-mode { background:#fff !important; }
  .billing-company-page { box-sizing:border-box; width:100%; min-height:9.3in; padding:.2in .15in .1in; page-break-after:always; break-after:page; color:#111; background:#fff; }
  .billing-company-page:last-child { page-break-after:auto; break-after:auto; }
  .billing-print-header { display:flex; align-items:center; gap:12px; padding-bottom:10px; border-bottom:3px solid #111; }
  .billing-print-header img { width:58px; height:58px; object-fit:contain; }
  .billing-print-header h1 { margin:2px 0 0; font-size:20pt; }
  .billing-print-company-brand { font-size:9pt; font-weight:800; letter-spacing:.08em; }
  .billing-print-meta { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:16px 0; }
  .billing-print-meta div { border:1px solid #777; padding:9px 10px; }
  .billing-print-meta span { display:block; font-size:8pt; text-transform:uppercase; letter-spacing:.08em; color:#555; }
  .billing-print-meta strong { display:block; margin-top:3px; font-size:12pt; }
  .billing-print-table { width:100%; border-collapse:collapse; font-size:9pt; }
  .billing-print-table th, .billing-print-table td { border:1px solid #666; padding:6px 7px; text-align:left; vertical-align:top; }
  .billing-print-table th { background:#ededed !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; font-weight:800; }
  .billing-print-table .num { text-align:right; white-space:nowrap; }
  .billing-total-box { margin:14px 0 0 auto; width:250px; border:2px solid #111; padding:10px 12px; display:flex; justify-content:space-between; align-items:center; }
  .billing-total-box span { font-size:10pt; font-weight:800; }
  .billing-total-box strong { font-size:16pt; }
  .billing-print-foot { margin-top:12px; font-size:7.5pt; color:#555; }
}

@supports not (height: 100dvh) { .overlay { height:100vh; max-height:100vh; } .detail-panel, #detailOverlay .detail-panel, .history-panel { max-height:calc(100vh - 16px); } }

@media (max-height: 760px) {
  .overlay { padding-top:6px; padding-bottom:6px; }
  #detailOverlay { padding-top:54px; }
  #detailOverlay .detail-panel, .detail-panel, .history-panel { max-height:calc(100vh - 12px); max-height:calc(100dvh - 12px); }
  .detail-header { padding:10px 14px; }
  .detail-grid { padding:12px 14px; gap:9px; }
  .detail-footer { padding:10px 14px; }
}


/* V28 — modal viewport + Fleet Snapshot clipping fix */
#detailOverlay, #historyOverlay, #boatDetailOverlay, #equipmentDirectoryOverlay { z-index:20000; }
#fleetClockOverlay { z-index:22000; }
#detailOverlay .floating-dialog-close { z-index:22050; }
#historyOverlay .detail-header, #detailOverlay .detail-header { top:0; }
#historyOverlay .history-panel { min-width:0; }
#historyOverlay .history-table-wrap { max-width:100%; }
@media (max-width:700px) {
  .overlay { padding:6px; }
  .detail-panel, #detailOverlay .detail-panel, .history-panel { width:calc(100vw - 12px); max-width:calc(100vw - 12px); max-height:calc(100vh - 12px); max-height:calc(100dvh - 12px); border-radius:10px; }
  .history-body { padding:10px; }
  .history-section { padding:10px; }
}


/* V29 — editable history / billing records */
.history-action-buttons { display:flex; flex-direction:column; gap:5px; min-width:92px; }
.edit-history-panel { width:min(900px, calc(100vw - 24px)); max-width:calc(100vw - 24px); max-height:calc(100vh - 16px); max-height:calc(100dvh - 16px); overflow:auto; }
.edit-history-body { padding:16px 18px; display:flex; flex-direction:column; gap:14px; }
.edit-history-grid { display:grid; grid-template-columns:1fr 1fr; gap:11px 13px; }
.edit-history-grid label, .edit-history-section label { display:block; color:#d7dbe1; font-size:.74rem; font-weight:750; }
.edit-history-section { border:1px solid #303640; border-radius:10px; background:#101318; padding:12px; }
.edit-history-section h3 { margin:0; color:#f2f4f6; font-size:.9rem; }
.edit-history-section-head { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:9px; }
.edit-history-section-head > label { width:min(220px,45%); }
.history-edit-time-row { display:grid; grid-template-columns:minmax(180px,1.8fr) minmax(90px,.6fr) minmax(90px,.6fr); gap:9px; }
.edit-history-conditional { display:none !important; }
.edit-history-conditional.show { display:block !important; }
.edit-history-conditional-block.hidden-block, .history-edit-time-row.hidden-block { display:none !important; }
.edit-history-audit { padding:9px 11px; border:1px solid #3b434d; border-radius:8px; color:#aeb6c0; background:#12161b; font-size:.68rem; }
@media (max-width:700px){.edit-history-grid{grid-template-columns:1fr}.edit-history-grid .span-2{grid-column:auto}.history-edit-time-row{grid-template-columns:1fr 1fr}.history-edit-time-row label:first-child{grid-column:1/-1}.edit-history-section-head{align-items:stretch;flex-direction:column}.edit-history-section-head>label{width:100%}}
@media (max-width:430px){.history-edit-time-row{grid-template-columns:1fr}.history-edit-time-row label:first-child{grid-column:auto}}
\n\n/* Version 39 — one Morning Traffic panel, moved for phones instead of duplicated */
.mobile-quick-nav, .mobile-traffic-mount { display:none; }
.morning-mobile-notes { display:none; }

@media (max-width:700px) {
  html { scroll-behavior:smooth; }
  body { overflow-x:hidden; }
  .topbar { padding:8px 10px; gap:8px; }
  .brand { gap:9px; }
  .logo { width:46px; height:46px; }
  .brand .eyebrow { font-size:.58rem; letter-spacing:.08em; }
  .brand h1 { font-size:1.18rem; }
  .top-actions { width:100%; flex-wrap:nowrap; overflow-x:auto; justify-content:flex-start; padding:1px 0 4px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .top-actions::-webkit-scrollbar { display:none; }
  .top-actions > * { flex:0 0 auto; }
  .top-actions .btn, .operator-badge, .sync-badge { padding:7px 9px; font-size:.68rem; }
  #printBtn { display:none; }

  .mobile-quick-nav { position:sticky; top:0; z-index:9500; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:#303640; border-bottom:1px solid #3b424c; }
  .mobile-nav-btn { min-width:0; appearance:none; border:0; border-radius:0; background:#14181d; color:#dfe4ea; padding:9px 4px; font-size:.67rem; font-weight:850; line-height:1.1; }
  .mobile-nav-primary { background:#f1b600; color:#111; }

  .summary-strip { grid-template-columns:repeat(3,1fr); }
  .metric { padding:8px 7px; flex-direction:column; gap:2px; align-items:flex-start; }
  .metric-label { font-size:.58rem; }
  .metric strong { font-size:.95rem; }
  .metric-wide { grid-column:span 3; flex-direction:row; align-items:center; }

  .mobile-traffic-mount { display:block; background:#0e1115; border-bottom:2px solid #3b424c; padding:10px; scroll-margin-top:40px; }
  .mobile-traffic-mount .morning-traffic-panel { display:block; margin:0; border-radius:10px; overflow:hidden; }
  .mobile-traffic-mount .morning-traffic-panel > summary { padding:11px 10px; font-size:.85rem; align-items:flex-start; gap:8px; }
  .mobile-traffic-mount .traffic-progress { white-space:nowrap; font-size:.66rem; }
  .mobile-traffic-mount .traffic-actions { padding:7px 9px 0; }
  .mobile-traffic-mount .tow-assignments { display:flex; flex-direction:column; gap:8px; padding:8px; }
  .mobile-traffic-mount .morning-boat-card { padding:11px 10px; border-radius:10px; }
  .mobile-traffic-mount .morning-boat-head { align-items:flex-start; }
  .mobile-traffic-mount .morning-boat-name { font-size:.94rem; line-height:1.2; }
  .mobile-traffic-mount .morning-status-pill { max-width:52%; white-space:normal; text-align:right; font-size:.7rem; line-height:1.2; padding:4px 7px; }
  .mobile-traffic-mount .visitor-company { font-size:.7rem; margin-top:5px; }
  .mobile-traffic-mount .morning-position,
  .mobile-traffic-mount .morning-tow,
  .mobile-traffic-mount .morning-destination,
  .mobile-traffic-mount .morning-job,
  .mobile-traffic-mount .morning-mobile-notes { margin-top:6px; white-space:normal; overflow:visible; text-overflow:clip; font-size:.78rem; line-height:1.35; color:#d1d6dc; }
  .mobile-traffic-mount .morning-position { color:#f0f2f5; font-weight:700; }
  .mobile-traffic-mount .morning-tow strong, .mobile-traffic-mount .morning-mobile-notes strong { color:#f4c928; }
  .mobile-traffic-mount .morning-mobile-notes { display:block; }
  .mobile-traffic-mount .morning-updated { margin-top:7px; font-size:.7rem; }
  .mobile-traffic-mount .visitor-heading { font-size:.72rem; }

  .weather-strip { padding:9px 10px 10px; }
  .weather-full:not([open]) .weather-periods { display:none; }
  .board-column { padding:10px 8px; }
  .board-wrap { scroll-margin-top:40px; }
  .fleet-board { touch-action:pan-y; }
  .board-toolbar .toolbar-group { width:100%; display:grid; grid-template-columns:1fr 1fr; }
  .board-toolbar .btn { min-width:0; font-size:.7rem; padding:8px 6px; }
  .sidebar { padding:10px; }
  .sidebar-header { align-items:center; }
  .filter-grid { grid-template-columns:1fr; }
  .barge-list { display:flex; max-height:none; scroll-margin-top:40px; }
  .barge-card { padding:11px; }
  .barge-card-name { font-size:.9rem; }
  .barge-card-meta { font-size:.75rem; line-height:1.3; }
  .boat-detail-panel { width:calc(100vw - 12px); max-width:calc(100vw - 12px); max-height:calc(100dvh - 12px); }
  #boatDetailOverlay { padding:6px; }
  #boatDetailOverlay .detail-header { padding:11px 12px; }
  #boatDetailOverlay .detail-grid { padding:11px 12px; gap:10px; }
  #boatDetailOverlay .detail-footer { padding:10px 12px; }
  #boatDetailOverlay input, #boatDetailOverlay select, #boatDetailOverlay textarea { font-size:16px; }
}

@media (max-width:430px) {
  .mobile-nav-btn { font-size:.61rem; padding:9px 2px; }
  .summary-strip { grid-template-columns:repeat(2,1fr); }
  .metric-wide { grid-column:span 2; }
  .mobile-traffic-mount .morning-traffic-panel > summary { flex-direction:column; }
  .mobile-traffic-mount .morning-boat-head { flex-direction:column; gap:5px; }
  .mobile-traffic-mount .morning-status-pill { max-width:100%; text-align:left; }
}

@media print {
  .mobile-quick-nav, .mobile-traffic-mount { display:none !important; }
}


/* SBM Operations role: Operations is editable, but all billing/payment information stays hidden. */
.operations-view #historyBtn,
.operations-view #mobileHistoryBtn,
.operations-view #historyOverlay,
.operations-view #editHistoryOverlay,
.operations-view .billing-sensitive,
.operations-view .fuel-surcharge-settings,
.operations-view #fleetClockAssistInFuelPctLabel,
.operations-view #fleetClockAssistInChargeLabel,
.operations-view #fleetClockAssistInCalc,
.operations-view #fleetClockAssistOutFuelPctLabel,
.operations-view #fleetClockAssistOutChargeLabel,
.operations-view #fleetClockAssistOutCalc { display:none !important; }
.operations-view .barge { cursor:pointer; }
.operations-view .operator-badge::after { content:" • OPERATIONS • BILLING HIDDEN"; color:#ffd66b; }

/* V42 assist billing calculator */
.assist-calc { padding:8px 10px; border:1px solid #3d4650; border-radius:8px; background:#101419; color:#d9e0e7; font-size:.78rem; line-height:1.35; }
.fuel-surcharge-settings { display:grid; grid-template-columns:minmax(220px,1fr) minmax(150px,190px) minmax(140px,180px) auto; gap:10px; align-items:end; margin:10px 0 12px; padding:12px; border:1px solid #4b535d; border-radius:9px; background:#101419; }
.fuel-surcharge-settings > div:first-child { align-self:center; }
.fuel-surcharge-settings strong { color:#fff; }
.fuel-surcharge-current { margin-top:4px; color:#b8c0c9; font-size:.75rem; }
.fuel-surcharge-settings label { display:flex; flex-direction:column; gap:5px; color:#b8c0c9; font-size:.7rem; font-weight:800; }
.fuel-surcharge-settings input { width:100%; min-width:0; }
@media (max-width:760px) {
  .fuel-surcharge-settings { grid-template-columns:1fr; }
}

/* V44 quick fleet-rate choices */
.rate-custom-label { display:none !important; }
.rate-custom-label.show { display:block !important; }

/* V45 operational quality-of-life improvements */
.attention-panel { margin:8px 12px 0; border:1px solid #49515b; border-radius:9px; background:#11161b; overflow:hidden; }
.attention-panel > summary { cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 12px; font-weight:900; color:#f3f5f7; }
.attention-count { display:inline-flex; min-width:28px; justify-content:center; padding:3px 8px; border-radius:999px; background:#303943; color:#fff; }
.attention-panel.has-issues { border-color:#b47a22; }
.attention-panel.has-issues .attention-count { background:#b47a22; }
.attention-list { display:grid; gap:7px; padding:0 12px 12px; }
.attention-item { display:flex; gap:8px; align-items:flex-start; padding:8px 9px; border:1px solid #303943; border-radius:7px; background:#0d1115; font-size:.78rem; line-height:1.35; }
.attention-item strong { white-space:nowrap; color:#f3c34c; }
.attention-ok { color:#91c79d; font-size:.78rem; padding:5px 0; }
.quick-ops-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:2px; padding:8px 10px; border-radius:8px; background:#171d23; border:1px solid #36404a; }
.quick-ops-heading strong { color:#fff; }
.quick-ops-heading span { color:#97a0aa; font-size:.7rem; }
.billing-precheck { margin:10px 0; padding:10px 12px; border:1px solid #3d4650; border-radius:8px; background:#101419; font-size:.76rem; line-height:1.4; }
.billing-precheck strong { display:block; color:#fff; margin-bottom:4px; }
.billing-precheck.ready { border-color:#356a44; }
.billing-precheck.ready #billingPrecheckText { color:#9fd6af; }
.billing-precheck.blocked { border-color:#a5672a; }
.billing-precheck.blocked #billingPrecheckText { color:#efc27b; }
.billing-precheck ul { margin:6px 0 0 0; padding:0; list-style:none; display:grid; gap:5px; }
.billing-precheck-note { margin-top:6px; color:#8e99a5; font-size:.7rem; }
.billing-precheck-fix { width:100%; border:1px solid #414a54; border-radius:7px; background:#171c22; color:inherit; padding:7px 9px; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:10px; cursor:pointer; font:inherit; }
.billing-precheck-fix:hover, .billing-precheck-fix:focus-visible { border-color:#c8953f; outline:none; }
.billing-precheck-arrow { white-space:nowrap; font-weight:700; color:#e4b463; }
.billing-precheck-target { outline:3px solid #d6a348 !important; outline-offset:2px; }
.billing-precheck-panel > summary { cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 12px; font-weight:900; color:#f3f5f7; }
.billing-precheck-panel .billing-precheck-body { padding:0 12px 12px; }
.billing-precheck-panel.has-issues .attention-count { background:#b47a22; }
.billing-precheck-panel.ready .attention-count { background:#356a44; }
.billing-precheck-panel[open] > summary { border-bottom:1px solid #2d333c; margin-bottom:8px; }
.batch-tow-panel { width:min(960px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); }
.batch-tow-body { padding:14px 16px; overflow:auto; }
.batch-tow-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; }
.batch-tow-grid label { display:flex; flex-direction:column; gap:5px; }
.batch-tow-instructions { margin:15px 0 8px; padding:9px 11px; border:1px solid #4b5662; border-left:4px solid var(--gold); border-radius:8px; background:#101419; color:#d9dee5; font-size:.78rem; line-height:1.35; }
.batch-tow-selection-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin:12px 0 8px; }
.batch-tow-selection-head > div:first-child { display:flex; align-items:baseline; gap:10px; }
.batch-tow-selection-head span { color:#9ca5af; font-size:.75rem; }
.batch-tow-selection-actions { display:flex; flex-wrap:wrap; gap:7px; }
.batch-tow-search-label { display:block; color:#d7dbe1; font-size:.78rem; font-weight:750; margin-bottom:8px; }
.batch-tow-search-label input { margin-top:5px; }
.batch-tow-barge-list { display:grid; grid-template-columns:1fr; gap:6px; max-height:350px; overflow:auto; padding:2px; }
.batch-tow-barge-item { display:grid; grid-template-columns:22px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:58px; padding:9px 11px; border:1px solid #343d47; border-radius:8px; background:#0d1115; cursor:pointer; }
.batch-tow-barge-item:hover { border-color:#66717d; background:#12171c; }
.batch-tow-barge-item.selected { border-color:var(--gold); background:#1c1809; box-shadow:inset 3px 0 0 var(--gold); }
.batch-tow-barge-item[hidden] { display:none !important; }
.batch-tow-barge-item input[type="checkbox"] { width:18px; height:18px; min-width:18px; margin:0; padding:0; flex:0 0 18px; accent-color:var(--gold); }
.batch-tow-barge-copy { min-width:0; display:block; margin:0; }
.batch-tow-barge-name { display:block; color:#fff; font-size:.86rem; line-height:1.2; }
.batch-tow-barge-meta { display:block; color:#98a2ad; font-size:.7rem; margin-top:4px; white-space:normal; overflow-wrap:anywhere; }
.batch-tow-fleet-state { display:inline-flex; align-items:center; justify-content:center; margin:0; border:1px solid #46505b; border-radius:999px; padding:4px 7px; color:#cbd2da; background:#181e24; font-size:.62rem; font-weight:850; white-space:nowrap; }
.batch-tow-note { margin-top:10px; }
.snapshot-summary { margin:10px 0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.snapshot-summary-card { padding:9px 10px; border:1px solid #343d47; border-radius:8px; background:#101419; }
.snapshot-summary-card span { display:block; color:#9da7b1; font-size:.67rem; text-transform:uppercase; font-weight:800; letter-spacing:.04em; }
.snapshot-summary-card strong { display:block; margin-top:3px; color:#fff; font-size:1rem; }
.snapshot-movements { margin-top:10px; padding:10px; border:1px solid #343d47; border-radius:8px; background:#101419; }
.snapshot-movements strong { color:#fff; }
.snapshot-movements-list { display:grid; gap:5px; margin-top:7px; }
.snapshot-movement { font-size:.75rem; color:#cbd2d9; }
.audit-log { display:grid; gap:7px; margin-top:8px; }
.audit-entry { padding:8px 10px; border:1px solid #343d47; border-radius:7px; background:#0d1115; }
.audit-entry strong { color:#fff; }
.audit-entry small { display:block; color:#9099a3; margin-top:2px; }
.audit-entry div { color:#c9d0d7; font-size:.74rem; margin-top:4px; }
@media (max-width:760px) {
  .attention-panel { margin:7px 8px 0; }
  .batch-tow-grid, .batch-tow-barge-list { grid-template-columns:1fr; }
  .batch-tow-selection-head { align-items:stretch; flex-direction:column; }
  .batch-tow-selection-actions { width:100%; }
  .batch-tow-selection-actions .btn { flex:1; }
  .batch-tow-barge-item { grid-template-columns:22px minmax(0,1fr); }
  .batch-tow-fleet-state { grid-column:2; justify-self:start; }
  .snapshot-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .quick-ops-heading { align-items:flex-start; flex-direction:column; }
}

/* V46 — saved-reference boats + lower-priority Needs Attention placement */
.attention-panel-bottom { margin:18px 12px 12px; }
.attention-item { align-items:center; }
.attention-item span { flex:1; min-width:0; }
.attention-action { flex:0 0 auto; white-space:nowrap; }
.saved-boat-tools { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:8px 0 10px; padding:10px; border:1px solid #363d46; border-radius:9px; background:#14181d; }
.saved-boat-tools span { color:#aeb5bf; font-size:.82rem; line-height:1.35; }
.saved-boat-form { display:grid; grid-template-columns:minmax(180px,1fr) minmax(180px,1fr); gap:10px; margin:0 0 12px; padding:12px; border:1px solid #5a6673; border-radius:9px; background:#0e1318; }
.saved-boat-form[hidden] { display:none !important; }
.saved-boat-form label { display:grid; gap:5px; font-weight:800; font-size:.82rem; }
.saved-boat-form input, .saved-boat-form select { width:100%; min-width:0; }
.saved-boat-other { display:none !important; }
.saved-boat-other.show { display:grid !important; }
.saved-boat-form-actions { grid-column:1 / -1; display:flex; justify-content:flex-end; gap:8px; }
.directory-status-note { display:block; margin-top:3px; color:#c7ccd3; font-size:.78rem; }
@media (max-width:700px) {
  .attention-panel-bottom { margin:14px 8px 10px; }
  .attention-item { align-items:flex-start; flex-wrap:wrap; }
  .attention-action { width:100%; }
  .saved-boat-form { grid-template-columns:1fr; }
  .saved-boat-form-actions { grid-column:1; display:grid; grid-template-columns:1fr 1fr; }
}


/* V47 — Morning Traffic is SBM-owned boats only; every Needs Attention item is actionable */
.morning-owned-fixed { display:none !important; }
.attention-item.actionable { cursor:pointer; transition:background .12s ease,border-color .12s ease; }
.attention-item.actionable:hover, .attention-item.actionable:focus { background:#151c23; border-color:#6b7785; outline:none; }
.attention-item.actionable:focus-visible { box-shadow:0 0 0 2px rgba(243,195,76,.35); }

/* V53 — long-term data protection, recovery points and permanent billing archives */
.data-protection-panel { margin-top:16px; border:1px solid #39424c; border-radius:10px; background:#0f1318; overflow:hidden; }
.data-protection-panel > summary { cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 13px; font-weight:900; color:#f1f4f7; }
.data-protection-panel[open] > summary { border-bottom:1px solid #2c333b; }
.protection-badge, .protection-count { display:inline-flex; align-items:center; justify-content:center; min-width:28px; padding:3px 8px; border-radius:999px; background:#2f6540; color:#fff; font-size:.72rem; }
.data-protection-body { padding:12px 13px 14px; }
.data-protection-status { padding:10px 11px; border:1px solid #303942; border-radius:8px; background:#151a20; color:#c9d0d7; font-size:.76rem; line-height:1.45; }
.data-protection-status strong { color:#fff; }
.data-protection-actions { display:flex; flex-wrap:wrap; gap:8px; margin:11px 0 9px; }
.data-protection-note { color:#929da8; font-size:.7rem; line-height:1.45; margin-bottom:10px; }
.data-protection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.protection-subpanel { border:1px solid #303943; border-radius:8px; background:#12171c; overflow:hidden; }
.protection-subpanel > summary { cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 10px; color:#e1e6eb; font-size:.77rem; font-weight:850; }
.protection-subpanel[open] > summary { border-bottom:1px solid #303943; }
.protection-count { background:#303943; }
.protection-list { display:grid; gap:6px; padding:8px; max-height:330px; overflow:auto; }
.protection-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:8px 9px; border:1px solid #303943; border-radius:7px; background:#171d23; }
.protection-item-main { min-width:0; }
.protection-item-main strong { display:block; color:#f4f6f8; font-size:.76rem; overflow-wrap:anywhere; }
.protection-item-main span { display:block; margin-top:2px; color:#9da7b1; font-size:.68rem; line-height:1.35; overflow-wrap:anywhere; }
.protection-item-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }
.protection-empty { color:#929da8; font-size:.72rem; padding:5px; }
.protection-board-warning { color:#efc27b !important; }
@media (max-width:1050px) {
  .data-protection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .data-protection-grid { grid-template-columns:1fr; }
  .data-protection-actions .btn { flex:1 1 190px; }
  .protection-item { grid-template-columns:1fr; }
  .protection-item-actions { justify-content:flex-start; }
}


/* V55 — collapsible History & Billing sections */
.collapsible-history-section { padding:0; overflow:hidden; }
.collapsible-history-section > .history-collapse-summary { cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px; color:#f2f4f6; font-size:.96rem; font-weight:900; list-style-position:inside; }
.collapsible-history-section[open] > .history-collapse-summary { border-bottom:1px solid #303640; background:#14181e; }
.history-collapse-body { padding:14px; min-width:0; }
.history-section-head-actions { margin-bottom:8px; }
.billing-archive-body { display:grid; gap:10px; }
.billing-subpanel { min-width:0; border:1px solid #39424c; border-radius:9px; background:#0f1318; overflow:hidden; }
.billing-subpanel > summary { cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; color:#f1f4f7; font-size:.8rem; font-weight:900; }
.billing-subpanel[open] > summary { border-bottom:1px solid #2c333b; background:#14191f; }
.billing-subpanel-body { padding:12px; min-width:0; }
.billing-cycle-panel .billing-head-actions { margin-bottom:10px; display:flex; gap:8px; flex-wrap:wrap; }
.fuel-surcharge-settings-collapsible { margin:0; border:0; border-radius:0; background:transparent; }
.visit-ledger-panel .history-filter-grid { margin-top:0; }
.billing-precheck-panel { margin:0; }
.data-protection-panel { margin-top:0; }
@media (max-width:700px) {
  .history-collapse-body { padding:10px; }
  .collapsible-history-section > .history-collapse-summary { padding:12px 10px; }
  .billing-subpanel > summary { padding:10px; }
  .billing-subpanel-body { padding:10px; }
}

/* V56 - clearer tracked/on-map counts, Morning Report PDF, and open-by-default History/Billing panels */
#morningReportBtn { white-space:nowrap; }


/* V60 — explicit IN/OUT status tabs on map barges. Load status remains on the barge-number label. */
.fleet-map-status { position:absolute; z-index:12; top:-9px; right:-7px; min-width:27px; height:18px; padding:0 5px; border-radius:5px; display:flex; align-items:center; justify-content:center; font-size:9px; line-height:1; font-weight:1000; letter-spacing:.04em; color:#fff; box-shadow:0 2px 5px rgba(0,0,0,.85); pointer-events:none; border:2px solid #fff; }
.fleet-map-status.in { background:#0877d1; border-color:#d7efff; }
.fleet-map-status.out { background:#343b44; border-color:#f2f4f6; }
.barge.fleet-in .barge-shell { box-shadow:0 0 0 2px rgba(8,119,209,.45); }
.barge.fleet-out .barge-shell { box-shadow:0 0 0 2px rgba(255,255,255,.24); opacity:.90; }
.map-status-legend { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-top:8px; padding:7px 9px; border:1px solid #2f3741; border-radius:8px; background:#101419; color:#c5ccd5; font-size:.68rem; }
.map-status-legend > span { display:inline-flex; align-items:center; gap:6px; }
.legend-status { min-width:34px; height:20px; padding:0 6px; border-radius:5px; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:.62rem; font-weight:1000; letter-spacing:.04em; border:2px solid #fff; }
.legend-status.in { background:#0877d1; border-color:#d7efff; }
.legend-status.out { background:#343b44; border-color:#f2f4f6; }
.legend-load { width:18px; height:18px; border-radius:5px; display:inline-block; border:2px solid rgba(255,255,255,.8); box-shadow:0 1px 3px rgba(0,0,0,.5); }
.legend-load.empty { background:#2f8f58; }
.legend-load.loaded { background:#b82f2f; }
.legend-load.partial { background:#c77720; }
.legend-note { color:#9099a4; }
@media (max-width:700px) {
  .fleet-map-status { top:-7px; right:-5px; min-width:24px; height:16px; padding:0 4px; font-size:8px; }
  .map-status-legend { gap:6px 10px; }
  .legend-note { flex-basis:100%; }
}


/* Compact one-site module tabs keep the map and daily controls above the fold. */
.suite-tabs{grid-area:tabs;display:flex;gap:6px;align-items:center;flex-wrap:nowrap;width:100%;margin:0;overflow-x:auto;scrollbar-width:none}
.suite-tabs::-webkit-scrollbar{display:none}
.suite-tab{display:inline-flex;align-items:center;justify-content:center;flex:0 1 210px;min-height:34px;min-width:155px;padding:7px 12px;text-decoration:none;color:#d9e0e7;background:#171a1f;border:1px solid #3a424c;border-radius:8px;font-size:.75rem;font-weight:850;letter-spacing:.01em;white-space:nowrap;box-shadow:none;transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease}
.suite-tab:hover{transform:translateY(-1px);border-color:#d5a11e;background:#29230f;color:#fff}
.suite-tab.active{background:#d5a11e;border-color:#d5a11e;color:#10263d;box-shadow:none}
@media(max-width:1180px){.topbar{grid-template-columns:1fr;grid-template-areas:"brand" "tabs" "actions"}.top-actions{justify-content:flex-start;flex-wrap:nowrap;width:100%;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}.top-actions::-webkit-scrollbar{display:none}.top-actions>*{flex:0 0 auto}.suite-tab{flex:0 0 190px}}
@media(max-width:700px){.suite-tabs{padding-bottom:1px;gap:5px}.suite-tab{flex:0 0 160px;min-width:0;min-height:32px;font-size:.68rem;padding:6px 9px}}
@media print{.suite-tabs{display:none!important}}

/* Couch Construction special billing contract */
.couch-contract-info { grid-column:1 / -1; padding:12px 14px; border:1px solid #7a6221; border-radius:8px; background:#1b1608; display:grid; gap:4px; }
.couch-contract-info[hidden] { display:none !important; }
.couch-contract-info strong { color:#ffe08a; font-size:.82rem; }
.couch-contract-info span { color:#e7d9ad; font-size:.72rem; }
.couch-contract-info small { color:#a99c78; font-size:.68rem; margin-top:2px; }
.standard-fleet-billing.couch-hidden { display:none !important; }


/* Clock movement refinements — 24-hour entry + optional map removal */
#batchTowTime { font-variant-numeric: tabular-nums; letter-spacing:.12em; font-weight:800; }
.batch-tow-map-option { display:none; }
#fleetClockPreview { font-variant-numeric:tabular-nums; }

/* New-barge one-pass setup. Kept isolated so existing barge detail layout is unchanged. */
.new-barge-flow-options { border:1px solid #315b7a; border-radius:10px; background:#101a22; padding:12px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; }
.new-barge-flow-options[hidden] { display:none !important; }
.new-barge-flow-title { grid-column:1 / -1; display:flex; flex-direction:column; gap:3px; color:#dfeaf3; }
.new-barge-flow-title span { color:#9fb0bf; font-size:.78rem; font-weight:500; }
@media (max-width:700px) { .new-barge-flow-options { grid-template-columns:1fr; } .new-barge-flow-title { grid-column:1; } }


/* V22 — one-step Quick Clock IN */
.quick-clock-main-btn { font-weight:900; box-shadow:0 0 0 1px rgba(85,169,120,.18) inset; }
.quick-clock-overlay { z-index:22500; }
.quick-clock-panel { width:min(760px,96vw); max-height:92vh; overflow:auto; background:#14181d; border:1px solid #4a525d; border-radius:14px; box-shadow:var(--shadow); padding:18px; }
.quick-clock-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.quick-clock-heading h2 { margin:4px 0 5px; color:#f4f6f8; font-size:1.2rem; }
.quick-clock-heading p { margin:0; color:#9da6b1; font-size:.75rem; line-height:1.35; }
.quick-clock-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; margin-top:16px; }
.quick-clock-grid label, .quick-clock-assist label { color:#dbe0e5; font-size:.72rem; font-weight:800; }
.quick-clock-grid input, .quick-clock-grid select, .quick-clock-assist input, .quick-clock-assist select { width:100%; margin-top:5px; min-height:44px; border:1px solid #48515c; border-radius:8px; background:#0e1115; color:#f4f6f8; padding:8px 10px; font-size:.95rem; }
.quick-clock-barge-field { grid-column:1 / -1; }
.quick-clock-barge-field input { font-size:1.05rem; font-weight:900; border-color:#3d8e61; }
.quick-clock-barge-group { border:1px solid #365844; border-radius:10px; background:#101b15; padding:11px; }
.quick-clock-barge-group-title { display:flex; justify-content:space-between; gap:12px; align-items:flex-end; margin-bottom:9px; }
.quick-clock-barge-group-title strong { color:#eaf4ed; font-size:.82rem; }
.quick-clock-barge-group-title span { color:#9da6b1; font-size:.68rem; line-height:1.25; text-align:right; max-width:430px; }
.quick-clock-barge-entries { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 10px; }
.quick-clock-barge-entries label { min-width:0; }
.quick-clock-barge-entries input { min-height:42px; }
.quick-clock-match-note { display:block; margin-top:6px; color:#aab2bc; font-size:.7rem; font-weight:700; }
.quick-clock-match-note.saved { color:#9ddbb7; }
.quick-clock-match-note.new { color:#ffd85e; }
.quick-clock-match-note.error { color:#ff9c9c; }
.quick-clock-other { display:none !important; }
.quick-clock-other.show { display:block !important; }
.quick-clock-rate.hidden-field { display:none; }
.quick-clock-assist { margin-top:14px; padding:12px; border:1px solid #365844; border-radius:10px; background:#101b15; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; }
.quick-clock-assist[hidden] { display:none !important; }
.quick-clock-assist-title { grid-column:1 / -1; display:flex; justify-content:space-between; gap:10px; align-items:center; }
.quick-clock-assist-title span { color:#9da6b1; font-size:.7rem; }
.quick-clock-assist-calc { align-self:end; min-height:44px; display:flex; align-items:center; padding:8px 10px; border:1px solid #365844; border-radius:8px; color:#baf0cf; font-weight:850; }
.quick-clock-summary { margin-top:14px; padding:11px 12px; border:1px solid #315b7a; border-radius:9px; background:#101a22; color:#b8c8d7; font-size:.75rem; line-height:1.35; }
.quick-clock-summary strong { color:#e8f3ff; }
.quick-clock-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }
.quick-clock-actions .btn-success { min-width:220px; font-size:.95rem; font-weight:900; }
@media (max-width:640px) {
  .quick-clock-grid, .quick-clock-assist { grid-template-columns:1fr; }
  .quick-clock-barge-field, .quick-clock-assist-title { grid-column:1; }
  .quick-clock-barge-entries { grid-template-columns:1fr; }
  .quick-clock-barge-group-title { align-items:flex-start; flex-direction:column; gap:3px; }
  .quick-clock-barge-group-title span { text-align:left; }
  .quick-clock-actions { display:grid; grid-template-columns:1fr; }
  .quick-clock-actions .btn { width:100%; }
}
@media print { #quickClockInOverlay { display:none !important; } }

/* V23 — Quick Clock IN editable 24-hour clock */
.quick-clock-time-group { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; align-items:end; }
.quick-clock-time-group label { margin:0; }
.quick-clock-now-btn { grid-column:1 / -1; min-height:38px; padding:7px 10px; font-size:.72rem; font-weight:800; }
@media (max-width:640px) { .quick-clock-time-group { grid-template-columns:1fr 1fr; } }

/* Recent barge history */
#bargeHistoryBtn { border-color:#59636f; }
.history-table tbody tr:first-child td { box-shadow:inset 0 1px 0 rgba(245,190,48,.22); }
@media (max-width:720px) {
  #bargeHistoryBtn { order:-1; }
}

/* v96: fleet viewing, delegated map movement, management-only records. */
.fleet-read-only :is(#quickClockInBtn,#addBargeBtn,#addTempBoatBtn,#batchTowBtn,#savedEquipmentBtn,#saveDetailBtn,#saveBoatDetailBtn,#readDailyLogBtn,#deleteBargeBtn,#deleteBoatBtn,#boardToggleBtn,#bargeHistoryBtn,#fleetArriveBtn,#fleetDepartBtn,#needsAttentionPanel,.tools-panel){display:none!important}
.fleet-read-only :is(.morning-barge-picker-row,.morning-barge-remove){display:none!important}
.fleet-read-only :is(#detailOverlay,#boatDetailOverlay) :is(input,select,textarea):disabled{opacity:1;color:inherit;-webkit-text-fill-color:currentColor;cursor:default}
.fleet-access-notice{margin:0 0 10px;padding:9px 12px;border:1px solid var(--border,#738496);border-radius:9px;color:inherit;font-size:13px;line-height:1.45}
.operations-view .operator-badge::after{content:""}
.fleet-can-move .barge:not(.locked){cursor:grab}
.fleet-read-only:not(.fleet-can-move) #lockBtn{display:none!important}
@media print{.fleet-access-notice{display:none!important}}

/* v100: each row's identifier and Edit action stay reachable with a mouse. */
#visitTableScroll{isolation:isolate;scroll-padding-left:156px;scrollbar-width:auto;scrollbar-color:#8493a3 #171d25}
#visitTableScroll:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
#visitTableScroll .history-table{border-collapse:separate;border-spacing:0}
#visitTableScroll .history-record-head,#visitTableScroll .history-record-cell{position:sticky;left:0;min-width:148px;width:148px;border-right:2px solid #63717f;box-shadow:4px 0 6px #0003}
#visitTableScroll .history-record-head{z-index:4;background:#1a1f25}
#visitTableScroll .history-record-cell{z-index:2;background:#0f1419}
#visitTableScroll .open-visit-row .history-record-cell{background:#12261a}
.history-record-content{width:132px;overflow-wrap:anywhere;white-space:normal}
.history-record-content .edit-history-entry{display:block;min-height:40px;width:100%;margin-top:8px;font-size:.72rem;white-space:normal}
.history-record-content .history-barge-edit{max-width:100%}
.history-column-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:8px 0;padding:8px 10px;border:1px solid #42505e;border-radius:8px;background:#17202a;color:#d9e1ea;font-size:.7rem}
.history-column-nav[hidden]{display:none!important}
.history-column-buttons{display:flex;gap:7px;flex-shrink:0}
.history-column-buttons .btn{min-width:82px;min-height:40px}
.history-column-buttons .btn:disabled{opacity:.45;cursor:default}
.history-column-buttons .btn:focus-visible,.history-record-content .btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
@media(max-width:600px){
  #visitTableScroll{scroll-padding-left:128px}
  #visitTableScroll .history-record-head,#visitTableScroll .history-record-cell{min-width:120px;width:120px}
  .history-record-content{width:104px}
  .history-column-nav{align-items:flex-start;flex-direction:column;gap:8px}
  .history-column-buttons{width:100%}
  .history-column-buttons .btn{flex:1;min-height:44px}
  .history-record-content .edit-history-entry{min-height:44px}
}
@media print{.history-column-nav,.history-record-content .edit-history-entry{display:none!important}#visitTableScroll .history-record-head,#visitTableScroll .history-record-cell{position:static;box-shadow:none}}

/* v101: warning colors describe record checks; cargo-status badges stay intact. */
.barge-card.record-needs-fix,.morning-boat-card.record-needs-fix{border-color:#cf666b;border-left-color:#f06570;background:#291519}
.barge-card.record-needs-review,.morning-boat-card.record-needs-review{border-color:#b38339;border-left-color:#f0ae48;background:#282012}
.record-attention-flags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.record-attention-flag{display:inline-block;max-width:100%;padding:4px 7px;border:1px solid;border-radius:6px;font:inherit;font-size:.65rem;font-weight:750;line-height:1.3;text-align:left;white-space:normal;overflow-wrap:anywhere}
button.record-attention-flag{cursor:pointer;min-height:28px}
.record-attention-flag.flag-fix{background:#461b22;border-color:#ef7f8b;color:#ffe4e8}
.record-attention-flag.flag-review{background:#3d2c13;border-color:#e7aa4a;color:#ffe2ad}
.record-attention-flag:focus-visible{outline:3px solid #fff;outline-offset:2px}
.record-check-legend{display:flex;flex-wrap:wrap;gap:6px 12px;padding:6px 8px;color:#b8c4d0;font-size:.65rem;line-height:1.4}
.record-check-fix{color:#ff9ba6}.record-check-review{color:#f5bf70}
#visitTableScroll .record-needs-fix>td{background:#291519}
#visitTableScroll .record-needs-review>td{background:#282012}
#visitTableScroll .record-needs-fix>.history-record-cell{background:#351a20;border-right-color:#d87580;box-shadow:inset 3px 0 #f06570,4px 0 6px #0003}
#visitTableScroll .record-needs-review>.history-record-cell{background:#342614;border-right-color:#c29750;box-shadow:inset 3px 0 #f0ae48,4px 0 6px #0003}
.history-record-content .edit-history-entry{display:inline-flex;align-items:center;justify-content:center;width:auto;max-width:100%;min-height:28px;padding:4px 9px;margin-top:5px;font-size:.64rem;line-height:1.25}
.history-record-content .record-attention-flags{gap:4px;margin-top:5px}
.history-record-content .record-attention-flag{font-size:.6rem;padding:3px 5px}
@media(pointer:coarse){.history-record-content .edit-history-entry,button.record-attention-flag{min-height:44px;min-width:54px}}
@media print{.record-check-legend,.record-attention-flags{display:none!important}}

/* v106: only explicitly unlocked, authorized barges capture a touch drag. */
.fleet-board{touch-action:pan-y pinch-zoom}
.fleet-can-move .barge:not(.locked){touch-action:none}
.barge:focus-visible{outline:3px solid #f3b600;outline-offset:4px}
@media screen and (max-width:760px){.topbar .top-actions{flex-wrap:wrap;overflow:visible}.topbar .top-actions .btn{min-height:44px}}