:root{--ink:#172725;--muted:#596a66;--green:#104c46;--green-dark:#0b3e39;--line:#e2e7e5;--bg:#f3f3f5;--white:#fff;--radius:15px}
html{background:#f3f3f5}
body{background:#f3f3f5;color:#172725}
.sidebar{background:#f3f3f5;border-color:#e2e7e5;box-shadow:none}
.brand-symbol{background:#104c46;color:#e0f0e8;box-shadow:none}
.brand small{color:#596a66}
.sidebar nav a{color:#4f615c}
.sidebar nav a[aria-current],.sidebar nav a:hover{background:#e1eeea;color:#104c46}
.sidebar nav a[aria-current]{box-shadow:inset 3px 0 #104c46}
.sidebar nav a span:last-child{width:auto}
.sidebar-bottom{color:#4f615c}
.topbar{border-color:#e0e5e3;color:#4f615c}
.topbar .eyebrow,.account{color:#405550}
.topbar-account{display:flex;align-items:center;gap:16px}
.topbar-logout button{padding:7px 10px;border:1px solid #dce4e1;border-radius:8px;background:#fff;color:#405a53;font:inherit;font-size:11px;cursor:pointer}
.topbar-logout button:hover{background:#eef4f1}
.status-dot{background:#32a77f;box-shadow:0 0 0 4px #32a77f20}
.eyebrow{color:#526762}
.muted,.small.muted{color:#596a66}
.page-heading:not(.dashboard-hero){padding:19px 22px;margin-bottom:18px;border:0;border-radius:15px;background:#fff;box-shadow:0 3px 12px #1c312b0b}
.page-heading:not(.dashboard-hero) h1{color:#172725;font-size:clamp(27px,2.6vw,36px);letter-spacing:-1px}
.page-heading:not(.dashboard-hero) p{color:#596a66}
.button{background:#104c46;color:#fff;border-color:transparent;border-radius:9px;box-shadow:none}
.button:hover{background:#0b3e39}
.button.secondary{background:#fff;border-color:#dce4e1;color:#104c46;box-shadow:none}
.button.secondary:hover{background:#eef4f1}
.button.danger{background:#b23e43;color:#fff}
.card,.summary-strip,.form-card,.login-card{background:#fff;border:0;border-radius:15px;box-shadow:0 3px 12px #1c312b0b}
h2,h3,.card-heading h2{color:#172725}
.badge{background:#edf2f0;color:#4b6059}
.text-link,.pagination a,.empty-state a{color:#10594e}
.filter-form{padding:12px 14px;border:0;border-radius:13px;background:#fff;box-shadow:0 3px 12px #1c312b0b}
.filter-form select,.form-card input:not([type=checkbox]),.form-card textarea,.form-card select,.danger-zone input{background:#fafbfa;border-color:#dce4e1;color:#172725;border-radius:9px}
.form-card{padding:26px}
.form-card label{color:#304640}
.helptext{color:#596a66}
.notice{border:0;border-radius:12px;background:#e5f1eb;color:#28564d}
.notice.warning{background:#fbf0d9;color:#6c4c19}
.notice.error{background:#f7e7e4;color:#833932}
.table-scroll{border:0;border-radius:14px;background:#fff;box-shadow:0 3px 12px #1c312b0b}
table{color:#233834}
th{background:#f7f8f8;color:#566963}
td{border-color:#edf0ef}
tr:hover td{background:#f7faf8}
.empty-state{color:#596a66}
.pagination{color:#4e625b}
details{color:#405650}
summary{color:#104c46;font-weight:600}
pre{background:#f4f7f5;color:#304640;border:1px solid #e0e7e4;border-radius:10px}
.detail-card,.delivery-card,.photo-review{background:#fff;border-color:#e2e7e5}
.delivery-card{border-left:3px solid #38a682}
.delivery-card .metric-number{color:#104c46}
.settings-grid .form-card:nth-child(2n){background:#fff}
.status-counts .badge{background:#edf2f0}
.sticky-action{background:#ffffffed;border-color:#e2e7e5;box-shadow:0 5px 22px #183b3015}
.helper-row{background:#fff;border-color:#e2e7e5}
.helper-row strong{color:#1c3832}
.footer,.auth-main .footer{border-color:#e0e5e3;color:#596a66}
.footer span{color:#677873}
.chart-card{background:#fff;border:0;border-radius:15px;box-shadow:0 3px 12px #1c312b0b}
.chart-card .eyebrow{color:#526762}
.chart-card h2{color:#172725}
.chart-controls{background:#f1f4f3}
.chart-tab{color:#596a66}
.chart-tab.active{background:#104c46;color:#fff}
.chart-caption{color:#596a66}
.tank-card{background:#fff;border:0;border-radius:15px;box-shadow:0 3px 12px #1c312b0b}
.tank-card:before{background:#36a981}
.tank-heading-meta .badge{background:#eff3f1;color:#4d605a}
.tank-heading-meta .tank-active-badge{background:#ddf1e8;color:#126449}
.tank-reading{border-color:#fff;background:#ffffffed;box-shadow:0 3px 12px #173b301d}
.tank-reading strong{color:#104c46}
.tank-summary>div:before{background:#39a781}
.tank-role.active{color:#126c52}
.tank-forecast{background:#e8f3ed;border:0;color:#31574b}
.monthly-card{background:#104c46;border:0;border-radius:15px;color:#fff}
.monthly-card:after{border-color:#ffffff22;box-shadow:0 0 0 23px #ffffff08,0 0 0 49px #ffffff05}
.monthly-card h2{color:#fff}
.monthly-card .eyebrow{color:#c1ded3}
.monthly-main strong{color:#fff}
.monthly-main strong small,.monthly-main>span,.monthly-card>p.small{color:#d2e5de}
.monthly-card .month-comparisons li{border-color:#ffffff2b;color:#fff}
.monthly-card .month-comparisons li small,.monthly-card .comparison-empty{color:#d2e5de}
.monthly-card .monthly-history-link{color:#e0f0e8;border-color:#ffffff2b}
.dashboard-hero.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:0;padding:17px 21px;margin:0 0 16px;border:0;border-radius:15px;background:#fff;box-shadow:0 3px 12px #1c312b0b}
.dashboard-hero .hero-copy{min-width:0}
.dashboard-hero .eyebrow{color:#526762;font-size:9px;letter-spacing:1.3px}
.dashboard-hero h1{margin:8px 0 2px;color:#172725;font-size:28px;letter-spacing:-.8px}
.dashboard-hero p{color:#596a66;font-size:12px}
.dashboard-hero .hero-actions{display:flex;align-items:center;gap:14px;flex:none}
.login-card .password-login-form{margin:22px 0 16px}
.login-card .password-login-form label{display:block;margin:0 0 6px;color:#304640;font-size:12px;font-weight:600}
.login-card .password-login-form input:not([type=hidden]){width:100%;min-height:46px;margin:0 0 14px;padding:10px 12px;border:1px solid #dce4e1;border-radius:9px;background:#fafbfa;color:#172725;font:inherit}
.login-card .password-login-form .errorlist{margin:0 0 12px;padding:9px 11px;border-radius:8px;background:#f7e7e4;color:#833932;font-size:12px}
.login-card .password-login-form .button{width:100%}
.account:hover{text-decoration:underline;text-decoration-color:#9ab4ab;text-underline-offset:3px}
.dashboard-hero .button{min-height:42px;padding:0 14px;background:#104c46;color:#fff}
.hero-status-dot{background:#32a77f;box-shadow:0 0 0 4px #32a77f20}
.hero-settings{color:#405a53}
.hero-settings-icon{background:#f3f6f5;border-color:#e1e8e4;color:#104c46}
.hero-orbit{display:none}
.overview-grid{grid-template-columns:minmax(0,1fr)}
.overview-grid .monthly-card{order:-1;min-height:0;display:grid;grid-template-columns:minmax(190px,.72fr) minmax(220px,1fr) minmax(190px,1fr);grid-template-rows:auto 1fr auto;align-items:start;gap:5px 24px;padding:18px 22px}
.monthly-card .eyebrow{grid-column:1/-1}
.monthly-card h2{grid-column:1;grid-row:2;margin:2px 0;color:#fff;font-size:16px}
.monthly-card .monthly-main{grid-column:2;grid-row:2/span 2;margin:0;align-self:center}
.monthly-main strong{color:#fff;font-size:clamp(32px,3vw,42px)}
.monthly-main strong small,.monthly-main>span{color:#d2e5de}
.monthly-card>p.small{grid-column:1;grid-row:3;color:#d2e5de}
.monthly-card .comparison-title{grid-column:3;grid-row:2;margin:2px 0;color:#e1eee9;font-size:12px}
.monthly-card .month-comparisons{grid-column:3;grid-row:3;margin:0}
.monthly-card .month-comparisons li{padding:5px 0;border-color:#ffffff2b;color:#fff}
.monthly-card .month-comparisons li small{color:#d2e5de}
.monthly-card .monthly-history-link{grid-column:1/-1;border-color:#ffffff2b;color:#e0f0e8}
.tank-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.tank-card{padding:16px 18px 14px}
.tank-visual{max-width:370px;margin:5px auto 0}
.chart-card{margin-top:14px;padding:21px 23px}
.helper-row{margin:13px 0 0;padding:15px 18px}
@media(max-width:1050px){.overview-grid .monthly-card{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto auto;gap:4px 18px}.monthly-card .eyebrow{grid-column:1/-1}.monthly-card h2{grid-column:1;grid-row:2}.monthly-card .monthly-main{grid-column:1;grid-row:3}.monthly-card>p.small{grid-column:1;grid-row:4}.monthly-card .comparison-title{grid-column:2;grid-row:2}.monthly-card .month-comparisons{grid-column:2;grid-row:3/span 2}.monthly-card .monthly-history-link{grid-column:1/-1}}
@media(max-width:700px){
  body{background:#f3f3f5}
  .topbar-account{gap:7px}
  .topbar-logout button{padding:6px 8px;font-size:10px}
  .sidebar{background:#ffffffef;border-top:1px solid #e2e7e5;box-shadow:0 -3px 16px #1a312b0c}
  .sidebar nav a[aria-current]{box-shadow:none;background:#e1eeea}
  .page-heading:not(.dashboard-hero){padding:15px 16px;margin-bottom:13px}
  .page-heading:not(.dashboard-hero) h1{font-size:25px}
  .dashboard-hero.page-heading{padding:14px 15px;margin-bottom:12px}
  .dashboard-hero h1{font-size:22px;margin:6px 0 2px}
  .dashboard-hero .eyebrow{font-size:7px;letter-spacing:.8px}
  .dashboard-hero .hero-actions{gap:0}
  .dashboard-hero .button{width:40px;height:40px;min-height:40px;padding:0;justify-content:center;font-size:0}
  .dashboard-hero .hero-button-icon{font-size:22px}
  .dashboard-hero .hero-settings{position:absolute;right:13px;bottom:11px;font-size:0}
  .hero-settings-icon{width:26px;height:26px}
  .hero-settings>span:last-child{display:none}
  .dashboard-hero .hero-copy{padding:0 3px 18px 0}
  .overview-grid{gap:11px}
  .overview-grid .monthly-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:16px;gap:4px 10px}
  .monthly-card .eyebrow{font-size:8px}
  .monthly-card h2{font-size:14px}
  .monthly-main strong{font-size:32px}
  .monthly-card .comparison-title{font-size:10px}
  .month-comparisons li{font-size:10px}
  .month-comparisons li small{font-size:9px}
  .tank-grid{grid-template-columns:1fr;gap:10px}
  .tank-card{padding:14px}
  .tank-visual{max-width:330px}
  .chart-card{margin-top:11px;padding:16px 14px}
  .helper-row{padding:14px}
  .filter-form{padding:11px}
  .form-card{padding:19px 16px}
  .table-scroll{border-radius:13px}
}
@media(max-width:700px){.sidebar nav{grid-template-columns:repeat(5,minmax(0,1fr))}.sidebar nav a{justify-content:center;padding:8px 2px;gap:3px}.sidebar nav a span:last-child{font-size:8px;white-space:nowrap}}
@media(max-width:370px){.overview-grid .monthly-card{grid-template-columns:1fr}.monthly-card .comparison-title,.monthly-card .month-comparisons,.monthly-card .monthly-main,.monthly-card>p.small{grid-column:1;grid-row:auto}}
