.tank-monitor { max-width: 100rem; margin: 0 auto; }
.tank-monitor .page-head { display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap:var(--space-3); margin-bottom:var(--space-4); }
.tank-controls { display:flex; flex-wrap:wrap; gap:var(--space-1); }
.tank-controls .btn { min-height:2.75rem; }
.tank-disclosure { padding:var(--space-3) var(--space-4); border-left:0.25rem solid var(--warn); background:var(--warn-soft); line-height:1.6; }
.tank-disclosure strong { display:block; }
.tank-feed-status { padding:var(--space-3) 0; font-weight:600; }
.tank-summary { display:flex; flex-wrap:wrap; gap:var(--space-5); padding:var(--space-4); align-items:center; }
.tank-summary p { margin:0 0 var(--space-1); }
.tank-counter { display:block; font:500 var(--fs-page-title)/1.4 var(--font-mono); }
.tank-eyebrow { font-size:var(--fs-caption); text-transform:uppercase; letter-spacing:0.06em; font-weight:600; color:var(--ink-3); }
.tank-bay { margin-top:var(--space-5); }
.tank-bay-heading { display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--space-3); margin-bottom:var(--space-3); }
.tank-bay-heading h2 { margin:0; font:500 var(--fs-section-title) var(--font-serif); }
.tank-bay-heading span,.tank-capacity,.tank-note,.tank-footer { color:var(--ink-3); font-size:var(--fs-meta); }
.tank-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr)); gap:var(--space-3); }
.tank-card { overflow:hidden; min-width:0; }
.tank-card-head { display:flex; justify-content:space-between; align-items:center; padding:var(--space-3); border-bottom:1px solid var(--line); }
.tank-card-head h3 { margin:0; font-size:var(--fs-section-title); }
.tank-manual-zone { display:flex; align-items:center; gap:var(--space-4); padding:var(--space-4) var(--space-3); background:var(--bg-sunken); }
.tank-volume { font:500 1.8rem/1.6 var(--font-mono); }
.tank-volume small,.tank-distance small { font-size:var(--fs-body); font-weight:400; }
.tank-vessel { position:relative; flex-shrink:0; height:8.5rem; width:4.5rem; border:2px solid var(--line-2); border-radius:45% 45% var(--radius-lg) var(--radius-lg)/10% 10% var(--radius-lg) var(--radius-lg); overflow:hidden; background:var(--surface); display:flex; align-items:center; justify-content:center; }
.tank-vessel.unknown { border-style:dashed; color:var(--ink-3); font-size:2rem; }
.tank-fill { position:absolute; bottom:0; width:100%; background:var(--accent); opacity:0.75; }
.tank-vessel.low .tank-fill { background:var(--warn); }
.tank-vessel.lowlow .tank-fill { background:var(--neg); }
.tank-vessel-caption { position:absolute; bottom:0.3rem; background:var(--surface); color:var(--ink-2); padding:0.1rem; font:500 0.6rem var(--font-mono); letter-spacing:0.06em; }
.tank-alarm { display:inline-block; padding:0.3rem 0.5rem; border-radius:var(--radius-sm); font-size:var(--fs-meta); background:var(--surface); color:var(--ink-2); font-weight:600; }
.tank-alarm.low { background:var(--warn-soft); color:var(--ink); border:2px solid var(--warn); }
.tank-alarm.lowlow { background:var(--neg-soft); color:var(--ink); border:2px solid var(--neg); }
.tank-card.low .tank-card-head { animation:tank-low-pulse 1.8s ease-in-out infinite; }
.tank-card.lowlow .tank-card-head { animation:tank-lowlow-pulse 1.8s ease-in-out infinite; }
@keyframes tank-low-pulse { 0%,100% {background:var(--warn-soft)} 50% {background:var(--warn)} }
@keyframes tank-lowlow-pulse { 0%,100% {background:var(--neg-soft)} 50% {background:var(--neg)} }
.tank-monitor[data-paused="true"] .tank-card-head { animation:none; }
.tank-card.low .tank-card-head { border-bottom:3px solid var(--warn); }
.tank-card.lowlow .tank-card-head { border-bottom:3px solid var(--neg); }
@media (prefers-reduced-motion:reduce) { .tank-monitor .tank-card-head { animation:none; } }
.tank-live-zone { padding:var(--space-3); }
.tank-distance { font:500 1.65rem/1.6 var(--font-mono); }
.tank-quality { display:block; font-size:var(--fs-meta); font-weight:600; }
.tank-quality.stale,.tank-quality.invalid,.tank-quality.missing { color:var(--ink-2); text-decoration:underline; text-decoration-color:var(--warn); text-underline-offset:0.2em; }
.tank-live-zone dl { display:grid; grid-template-columns:auto 1fr; gap:var(--space-1); margin:var(--space-3) 0 0; font-size:var(--fs-caption); }
.tank-live-zone dt { color:var(--ink-3); }
.tank-live-zone dd { margin:0; text-align:right; overflow-wrap:anywhere; }
.tank-footer { padding:var(--space-4) 0; line-height:1.7; }
@media(max-width:30rem) { .tank-summary { gap:var(--space-3); } .tank-monitor .page-title-group h1 { font-size:1.75rem; } .tank-monitor .page-head { margin-bottom:var(--space-3); } }
/* Compact chemical overview: all nine cards in two desktop rows. */
.tank-monitor { padding-top:12px!important; padding-bottom:8px!important; }
.tank-monitor .page-head { margin-bottom:8px; gap:8px; }
.tank-monitor .page-title-group h1 { font-size:1.7rem;line-height:1.2;margin:0; }
.tank-monitor .page-title-group p { margin:4px 0 0; }
.tank-disclosure { padding:6px 10px;font-size:12px;line-height:1.4; }
.tank-disclosure summary { cursor:pointer;font-weight:600; }
.tank-disclosure p { margin:8px 0 0; }
.tank-feed-status { padding:6px 0;font-size:12px; }
.tank-summary { gap:8px 14px;padding:7px 12px;margin-bottom:10px; }
.tank-summary .tank-counter { display:inline;font-size:24px;line-height:1.2; }
.tank-counter-details { margin-left:auto;font-size:12px; }
.tank-counter-details summary { cursor:pointer; }
.tank-counter-details p { margin:5px 0; }
.tank-grid { grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:start; }
.tank-card-head { padding:6px 8px;align-items:flex-start;gap:4px;flex-wrap:wrap; }
.tank-card-head h3 { font-size:14px;line-height:1.25;display:flex;flex-wrap:wrap;gap:2px 6px; }
.tank-chemical { font-weight:500;color:var(--ink-2); }
.tank-capacity { font-size:10px;white-space:nowrap; }
.tank-manual-zone { padding:6px 8px;gap:8px; }
.tank-manual-zone > div:last-child { min-width:0; }
.tank-vessel { width:38px;height:56px; }
.tank-vessel-caption { font-size:6px;letter-spacing:0; }
.tank-volume { font-size:23px;line-height:1.25;white-space:nowrap; }
.tank-volume small,.tank-distance small { font-size:12px; }
.tank-eyebrow { font-size:9px;letter-spacing:.03em; }
.tank-alarm { padding:3px 4px;font-size:10px;line-height:1.3; }
.tank-live-zone { padding:5px 8px; }
.tank-distance { font-size:19px;line-height:1.3; }
.tank-quality { font-size:10px;line-height:1.5; }
.tank-quality::before { content:'';display:inline-block;width:15px;height:5px;border-radius:2px;background:var(--ink-3);margin:0 5px 1px 0; }
.tank-quality.fresh::before { background:var(--accent); }
.tank-quality.stale::before,.tank-quality.invalid::before,.tank-quality.missing::before { background:var(--warn); }
.tank-details { margin-top:5px;border-top:1px solid var(--line);font-size:10px; }
.tank-details summary { cursor:pointer;padding:5px 0; }
.tank-details summary:focus-visible,.tank-disclosure summary:focus-visible,.tank-counter-details summary:focus-visible { outline:2px solid var(--accent);outline-offset:2px; }
.tank-details .tank-note { font-size:10px;line-height:1.4;margin:3px 0; }
.tank-live-zone dl { margin:6px 0;grid-template-columns:1fr;gap:2px;font-size:10px; }
.tank-live-zone dd { text-align:left;margin-bottom:4px; }
.tank-suspect { font-size:10px;margin:2px 0;font-weight:600; }
.tank-footer { padding:4px 0;font-size:10px;line-height:1.4; }
@media(max-width:1150px) { .tank-grid {grid-template-columns:repeat(3,minmax(0,1fr));} }
@media(max-width:700px) { .tank-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;} .tank-counter-details {margin-left:0;} .tank-controls .btn {font-size:12px;} }
@media(max-width:380px) { .tank-grid {grid-template-columns:minmax(0,1fr);} }
