:root{color-scheme:dark;--bg:#1c1610;--panel:#2a2118;--line:#8b7255;--text:#fff3df;--muted:#d4c1a5;--gold:#e9bc64;--green:#c4d6a4;--red:#ffb6a0;--control-border:#b89970;--control-bg:#3c2e20;--control-hover:#4a3928;--input-bg:#211a13;--on-gold:#261b0c;--gold-hover:#f5d395;--metric-bg:#30251a;--notice-bg:#35291b;--notice-text:#f5d8a0;--error-bg:#40271e;--good-bg:#2e3021;--table-line:#5e4b36;--category-bg:#382b1e;--planner-bg:#34281b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:var(--gold);text-underline-offset:4px}button,input,select,textarea{font:inherit}button{cursor:pointer;color:var(--text);background:var(--control-bg);border:1px solid var(--control-border);padding:11px 17px;border-radius:4px;font-size:13px;font-weight:600}button:hover{background:var(--control-hover)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}header{max-width:1440px;padding:28px 52px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:15px;align-items:center;color:var(--text);text-decoration:none;letter-spacing:3px;font-size:16px}.brand b{font-weight:400;color:var(--gold)}.brand small{display:block;font-size:8px;letter-spacing:2.3px;margin-top:5px;color:var(--muted)}.version{font-size:10px;letter-spacing:1.5px;color:var(--green)}main{max-width:1440px;margin:auto;padding:0 52px}.hero{display:flex;justify-content:space-between;align-items:center;min-height:325px;overflow:hidden;position:relative}.eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--gold);font-weight:700}.hero h1{font-family:inherit;font-weight:650;font-size:60px;line-height:1.06;margin:18px 0}.hero h1 em{color:var(--gold);font-weight:650;font-style:normal}.hero p:last-child{font-size:14px;color:var(--muted)}nav{display:flex;border-bottom:1px solid var(--line);gap:25px}nav :is(button,.nav-link){border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:17px 0;color:var(--muted);font-size:11px;letter-spacing:1px}nav :is(button,.nav-link) span{margin-left:9px;font-size:14px;letter-spacing:0}nav button.active{color:var(--gold);border-color:var(--gold)}nav :is(button,.nav-link):hover{background:none;color:var(--text)}.save-state{margin-left:auto;align-self:center;font-size:10px;color:var(--muted)}.section-title{display:flex;justify-content:space-between;align-items:center;margin:34px 0 23px;gap:20px}.section-title p{margin:0 0 7px}h2{font-size:24px;font-weight:500;margin:0}h3{font-size:17px;font-weight:500;margin:0}h4{font-size:13px;font-weight:500}p{color:var(--muted)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:25px;margin-bottom:20px}.panel-title{display:flex;align-items:center;gap:12px;margin-bottom:22px}.panel-title .text-btn{margin-left:auto}.step{border:1px solid var(--control-border);color:var(--gold);width:26px;height:26px;text-align:center;line-height:24px;font-size:12px;border-radius:50%}.workspace{display:grid;grid-template-columns:320px 1fr;gap:22px;align-items:start}label{display:block;color:var(--muted);font-size:12px;margin-bottom:16px}input,select,textarea{display:block;background:var(--input-bg);border:1px solid var(--control-border);border-radius:4px;color:var(--text);padding:11px 12px;width:100%;margin-top:7px;min-width:0}input[data-number]{font-variant-numeric:tabular-nums}input[type=checkbox]{accent-color:var(--gold);width:18px;height:18px;margin:3px 0;flex-shrink:0}textarea{font:12px/1.6 ui-monospace,monospace;resize:vertical}.field-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px}.base-controls{grid-template-columns:1fr 1fr 1fr}.hint{font-size:11px;line-height:1.7;margin:10px 0;color:var(--muted)}.divider{height:1px;background:var(--line);margin:22px 0}.toggle{display:flex;gap:12px;color:var(--text);font-size:14px}.toggle small{display:block;font-size:10px;color:var(--gold);margin-top:3px}details{font-size:12px;margin-top:20px}summary{cursor:pointer;color:var(--gold)}.actions{display:flex;gap:10px;flex-wrap:wrap}.primary{background:var(--gold);color:var(--on-gold);border-color:var(--gold)}.primary:hover{background:var(--gold-hover)}.subtle{background:transparent}.text-btn{border:0;background:none;padding:4px;color:var(--gold);font-size:11px}.inventory-head{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:22px}.inventory{max-height:310px;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:1px 24px}.inventory label{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--table-line);padding:6px 0;margin:0;font-size:12px;color:var(--text)}.inventory input{width:100px;flex-shrink:0;margin:0;padding:7px 9px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px}.metric{background:var(--metric-bg);border:1px solid var(--line);padding:23px;border-radius:5px}.metric small{display:block;text-transform:uppercase;letter-spacing:1.5px;font-size:9px;color:var(--muted)}.metric strong{display:block;font-family:inherit;font-weight:500;color:var(--gold);font-size:31px;margin:8px 0 2px}.metric span{font-size:11px;color:var(--muted)}.notice{padding:15px 20px;border-left:3px solid var(--gold);background:var(--notice-bg);color:var(--notice-text);font-size:12px;margin-bottom:20px}.notice.error{border-color:var(--red);background:var(--error-bg);color:var(--red)}.notice.good{border-color:var(--green);background:var(--good-bg);color:var(--green)}.result-head{display:flex;justify-content:space-between;align-items:center;margin:20px 0}.badge{font-size:10px;letter-spacing:.5px;padding:4px 8px;border:1px solid var(--control-border);border-radius:3px;color:var(--green);white-space:nowrap}.badge.warn{border-color:var(--control-border);color:var(--gold)}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:12px}th{text-align:left;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.8px;padding:12px 10px;border-bottom:1px solid var(--line)}td{padding:13px 10px;border-bottom:1px solid var(--table-line);vertical-align:top}td small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.number{text-align:right;font-variant-numeric:tabular-nums}.negative{color:var(--red)}.positive{color:var(--green)}.results-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.equipment{display:grid;grid-template-columns:repeat(3,1fr);gap:0 25px}.equipment label{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:13px 0;margin:0;color:var(--text)}.equipment span{flex:1}.equipment small{display:block;color:var(--muted);font-size:10px}.equipment input{width:65px;margin:0;padding:8px}.empty{padding:20px;color:var(--muted);font-size:12px}.chain{padding:15px 0;border-bottom:1px solid var(--line);display:flex;gap:16px}.chain .idx{color:var(--gold);font-size:12px}.chain p{margin:5px 0;font-size:12px}.chain b{font-weight:500;font-size:14px}.chain small{color:var(--muted);font-size:11px}.chain a{font-size:10px;margin-left:10px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}footer{display:flex;justify-content:space-between;gap:20px;font-size:9px;color:var(--muted);letter-spacing:.5px;padding:30px 0;border-top:1px solid var(--line);margin-top:35px}[hidden]{display:none!important}#references li{margin:12px 0;color:var(--muted);font-size:13px}.panel>p{font-size:13px}
@media(max-width:1000px){main{padding:0 25px}header{padding:24px 25px}.workspace{grid-template-columns:270px 1fr}.inventory{grid-template-columns:1fr}.equipment{grid-template-columns:1fr 1fr}.metrics{grid-template-columns:1fr 1fr}}@media(max-width:680px){main{padding:0 16px}header{padding:22px 16px}.hero{min-height:290px}.hero h1{font-size:45px}.hero p{max-width:280px}.hero>div:first-child{z-index:1}.save-state{display:none}nav{justify-content:space-between;gap:12px}nav :is(button,.nav-link) span{font-size:12px;margin-left:5px}.workspace,.results-grid{grid-template-columns:1fr}.section-title{align-items:flex-start;flex-direction:column}h2{font-size:21px}.panel{padding:19px}.metrics{gap:10px}.metric{padding:18px}.metric strong{font-size:26px}.field-grid{grid-template-columns:1fr}.field-grid label{margin-bottom:0}.actions{margin-top:18px}.base-controls{gap:20px}.equipment{grid-template-columns:1fr}.inventory{grid-template-columns:1fr}.inventory input{width:110px}footer{flex-direction:column}.desktop{display:none}}

.ingredient-planner{border:1px solid var(--control-border);background:var(--planner-bg);padding:18px;border-radius:5px;margin:18px 0}.ingredient-planner h3{margin:0;color:var(--gold);font-size:16px}.ingredient-planner button{margin-top:12px}.matching-table{border-color:var(--control-border)}
.crafting-level label { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; margin-bottom: 6px; }
.crafting-level output { color: var(--gold); font-weight: 700; font-variant-numeric: tabular-nums; }
.crafting-level input[type=range] { padding: 0; border: 0; background: transparent; accent-color: var(--gold); }
#refine-inputs { max-height: none; overflow: visible; }
.refinery-queues td ul { margin: 0; padding-inline-start: 18px; }
.inventory label .refinery-shortage { display: block; color: var(--gold); }
header { gap: 16px; }
.header-tools {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-inline-start: auto;
}
.header-storm {
  display: grid;
  gap: 2px;
  padding: 5px 0;
  border: 0;
  background: none;
  text-align: right;
  white-space: nowrap;
}
.header-storm:hover, .header-storm.active { background: none; color: var(--gold); }
.header-storm span { color: var(--gold); font-size: 10px; letter-spacing: 1px; text-transform: uppercase; }
.header-storm time { font-variant-numeric: tabular-nums; }
.header-data {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  text-align: right;
}
.header-data button { padding: 7px 11px; white-space: nowrap; }
.header-data button.active { color: var(--gold); border-color: var(--gold); }
@media (max-width: 680px) {
  .header-data .version { font-size: 9px; letter-spacing: .5px; }
}
@media (max-width: 560px) {
  header { flex-wrap: wrap; row-gap: 13px; }
  .header-tools { gap: 10px; }
}
.map-source-link {
  display: inline-block;
  border: 1px solid var(--control-border);
  padding: 7px 12px;
  border-radius: 4px;
  font-size: 12px;
  text-decoration: none;
}
.map-source-link:hover { background: var(--control-bg); }
.dd-map-info {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.dd-map-info > div:first-child { flex: 1 1 290px; }
.dd-reset-info strong { color: var(--gold); font-variant-numeric: tabular-nums; }
nav .nav-link { font-weight: 600; text-decoration: none; }
nav { flex-wrap: wrap; column-gap: 22px; row-gap: 0; }
@media (max-width:680px) { nav { justify-content: flex-start; column-gap: 15px; } nav :is(button,.nav-link) { padding: 10px 0; } }
.live-trackers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  flex: 0 1 460px;
  min-width: 0;
  gap: 10px;
  margin: 18px 0 18px 20px;
  align-items: start;
}
.live-tracker { margin: 0; padding: 14px; border-color: var(--control-border); min-width: 0; }
.live-tracker .eyebrow { margin: 0 0 4px; font-size: 8px; letter-spacing: 1px; }
.live-tracker .hint { font-size: 11px; margin: 6px 0; }
.live-tracker .tracker-value {
  display: block;
  margin-top: 5px;
  color: var(--gold);
  font-size: 21px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.live-tracker details { margin-top: 8px; }
.live-tracker form { margin-top: 12px; }
.live-tracker fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.live-tracker fieldset small { display: block; }
.category-heading {
  grid-column: 1 / -1;
  margin: 12px 0 4px;
  color: var(--gold);
  font-size: 12px;
}
.category-row th {
  background: var(--category-bg);
  color: var(--gold);
}
.list-category { list-style: none; margin: 7px 0; }
.list-category > strong { color: var(--gold); }
.list-category > ul { padding-inline-start: 16px; }
.live-tracker label { margin-bottom: 8px; }
.live-tracker button { padding: 8px 10px; }
.live-tracker .widget-result:empty { margin: 0; }
.tracker-bars:not(:empty) { margin: 9px 0; }
.tracker-bar { margin: 6px 0; }
.tracker-bar > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px;
  font-size: 10px;
  line-height: 1.4;
  color: var(--muted);
}
.tracker-bar > div > span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tracker-bar > div > span:last-child {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text);
}
.tracker-bar meter { display: block; width: 100%; height: 8px; }
.tracker-bar meter::-webkit-meter-bar { background: var(--line); border: 0; border-radius: 4px; }
.tracker-bar meter::-webkit-meter-optimum-value { background: var(--green); border-radius: 4px; }
.tracker-bar meter::-moz-meter-bar { background: var(--green); border-radius: 4px; }
#fuel-list, #fuel-tracker-inputs { max-height: 190px; overflow: auto; }
#fuel-list { padding-left: 18px; font-size: 11px; }
@media (max-width: 800px) {
  .hero { flex-direction: column; align-items: stretch; padding-top: 22px; }
  .live-trackers { flex: auto; margin: 12px 0 16px; }
}
@media (max-width: 380px) {
  .live-trackers { grid-template-columns: minmax(0, 1fr); }
}
#base-water-filter-list { max-height: 190px; overflow: auto; padding-left: 18px; font-size: 11px; }

/* Accessible controls, readable values, and responsive layouts. */

html { scroll-padding-block: 1rem; }
body { font-size: 1rem; line-height: 1.6; }
main, header { width: 100%; }
main, header, section, aside, form, fieldset, .panel, .workspace > *, .results-grid > *, .field-grid > *, .metric { min-width: 0; }
p, li, label, h1, h2, h3, h4, td, th, .badge { overflow-wrap: anywhere; }
button, input, select, textarea { font-size: 1rem; }
button, input:not([type="checkbox"]), select, summary, .nav-link { min-height: 2.75rem; }
button { white-space: normal; }
input, select, textarea { border-color: var(--control-border); max-width: 100%; }
label { font-size: 1rem; }
small, .hint, .live-tracker .hint, .live-tracker fieldset small, .toggle small,
.panel > p, .empty, .badge, .category-heading, .tracker-bar > div,
.metric small, .metric span, .chain p, .chain small, .chain a, td small,
.equipment small, .save-state, footer, .version { font-size: .875rem; }
.metric small, .version, .eyebrow { letter-spacing: .04em; }
.hero { overflow: visible; gap: 1.5rem; }
.hero h1 { font-size: clamp(2rem, 4.3vw, 3.5rem); }
.hero p:last-child { font-size: 1rem; max-width: 40rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-block: 1rem; }
.brand { letter-spacing: .08em; }
.brand small { font-size: .75rem; letter-spacing: .04em; }
.header-tools { flex-wrap: wrap; min-width: 0; }
.header-storm { min-height: 2.75rem; white-space: normal; }
.header-storm span, .header-data .version { font-size: .875rem; }
.header-data button { padding: .6rem .8rem; }
.header-data { min-width: 0; }
nav { gap: .5rem; align-items: stretch; padding-block: .75rem; }
nav :is(button, .nav-link) { padding: .5rem .75rem; font-size: 1rem; letter-spacing: normal; }
nav :is(button, .nav-link) span { font-size: 1rem; margin-left: .35rem; }
nav .save-state { padding: .5rem; }
.workspace { grid-template-columns: minmax(15rem, 20rem) minmax(0, 1fr); }
.field-grid, .base-controls { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.metrics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.metric { padding: 1rem; }
.metric strong { font-size: 1.65rem; line-height: 1.4; overflow-wrap: anywhere; }
.results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.result-head, .panel-title, .inventory-head { flex-wrap: wrap; gap: .75rem; }
.badge { white-space: normal; }
.live-trackers { flex: 0 1 36rem; gap: 1rem; }
.live-tracker { padding: 1rem; container-type: normal; }
.live-tracker h2 { font-size: 1.125rem; font-weight: 500; }
.live-tracker .eyebrow { font-size: .875rem; }
.live-tracker .tracker-value { font-size: 1.375rem; line-height: 1.5; white-space: normal; }
.tracker-bar > div { grid-template-columns: minmax(0, 1fr) minmax(0, auto); }
.tracker-bar > div > span { white-space: normal; overflow: visible; text-overflow: clip; }
#fuel-list, #base-water-filter-list { max-height: none; overflow: visible; font-size: .875rem; }
.inventory { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.inventory label, .equipment label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(6rem, 9rem);
  align-items: center;
  gap: .75rem;
  font-size: 1rem;
}
.inventory input, .equipment input { width: 100%; min-width: 0; padding: .65rem; }
.equipment { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.text-btn { font-size: .875rem; min-height: 2.75rem; padding: .5rem .75rem; }
.toggle { min-height: 2.75rem; align-items: center; padding-block: .4rem; font-size: 1rem; }
input[type="checkbox"] { width: 1.4rem; height: 1.4rem; }
summary { padding: .55rem .25rem; }
.crafting-level input[type="range"] { min-height: 2.75rem; }
.table-scroll { width: 100%; max-width: 100%; overscroll-behavior-x: contain; }
table { font-size: .875rem; }
th { font-size: .875rem; letter-spacing: normal; }
th, td { padding: .55rem .65rem; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
[tabindex="-1"]:focus { outline: 2px solid var(--gold); outline-offset: 4px; }
.field-error { display: block; grid-column: 1 / -1; color: var(--red); font-size: .875rem; margin: -.5rem 0 .75rem; }
[aria-invalid="true"] { border-color: var(--red); }
.skip-link {
  position: fixed; top: .5rem; left: .5rem; z-index: 100;
  transform: translateY(-180%); padding: .75rem 1rem;
  background: var(--text); color: var(--bg); border: 2px solid var(--gold);
}
.skip-link:focus { transform: none; }
@media (max-width: 64rem) {
  .workspace { grid-template-columns: minmax(0, 1fr); }
  .hero { flex-direction: column; align-items: stretch; min-height: 0; padding-top: 1rem; }
  .live-trackers { flex: auto; margin: 0 0 1.5rem; }
}
@media (max-width: 44rem) {
  header { flex-wrap: wrap; align-items: flex-start; padding: 1rem; }
  main { padding-inline: max(1rem, env(safe-area-inset-left)) max(1rem, env(safe-area-inset-right)); }
  .header-tools { width: 100%; justify-content: space-between; gap: .75rem; margin: 0; }
  .header-data { align-items: flex-start; text-align: left; flex: 1 1 10rem; }
  .header-storm { text-align: left; flex: 1 1 10rem; }
  .live-trackers, .results-grid { grid-template-columns: minmax(0, 1fr); }
  .hero p { max-width: none; }
  .panel { padding: 1rem; }
  .save-state { display: block; margin: 0; width: 100%; }
  .actions > button { flex: 1 1 12rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  button, input, select, textarea, .panel { border: 1px solid CanvasText; }
  :focus-visible { outline-color: Highlight; }
}

/* Preserve complete words and values inside scrollable data tables. */
table th, table td { overflow-wrap: normal; word-break: normal; }
table:has(th:nth-child(4)) { min-width: 36rem; }

input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.map-source-link { display: inline-flex; align-items: center; min-height: 2.75rem; padding-block: .5rem; }

.eyebrow, details, summary { font-size: .875rem; }
h4 { font-size: 1rem; }
.brand small { font-size: .875rem; }
#references li { font-size: 1rem; }

/* Regional Coriolis countdown */
.coriolis-region { display: grid; gap: .25rem; margin: 0; font-size: .875rem; }
.coriolis-region select { min-height: 2.75rem; width: 100%; max-width: 100%; font-size: 1rem; }

.data-check-date { color: var(--muted); font-size: .875rem; }
.header-data .version { white-space: normal; overflow-wrap: anywhere; }

/* Readable site notices at every screen size. */
footer { display: block; }
.footer-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1.25rem; }
footer p { margin: .75rem 0 0; font-size: .875rem; line-height: 1.6; letter-spacing: normal; }

/* Keep the larger wordmark and descriptive subtitle readable on small screens. */
header { flex-wrap: wrap; gap: 1rem; }
.brand { font-size: 1.375rem; min-width: 0; max-width: 100%; }
.brand-context { display: inline; }

.brand-home { color: inherit; text-decoration: none; }
.affiliation-reference { display: inline-flex; align-items: center; justify-content: flex-start; min-width: 2.75rem; min-height: 2.75rem; vertical-align: middle; font-size: inherit; }
.footer-affiliation { scroll-margin-block: 1.5rem; }
.footer-affiliation:target, .footer-affiliation:focus { outline: 2px solid var(--gold); outline-offset: .5rem; }

/* Account controls remain reachable in compact portrait headers. */
.account-menu { position: relative; margin: 0; font-size: .875rem; }
.account-menu > summary { border: 1px solid var(--control-border); border-radius: 4px; padding: .6rem .75rem; min-height: 2.75rem; }
.account-menu-content { position: absolute; inset-inline-end: 0; z-index: 30; width: min(22rem, calc(100vw - 2rem)); padding: 1rem; border: 1px solid var(--control-border); border-radius: 6px; background: var(--panel); box-shadow: 0 .5rem 1.5rem var(--bg); }
.account-menu-content p { overflow-wrap: anywhere; }
.account-links { display: flex; flex-wrap: wrap; gap: .5rem; }
.account-links a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .5rem; }
#account-sync-status { font-size: .875rem; }
@media (max-width: 48rem) {
  .account-menu { margin-inline-start: auto; }
  .account-menu-content { max-height: 70dvh; overflow-y: auto; }
}

/* Gold identifies navigation and tracker progress; status messages retain text labels. */
.version { color: var(--gold); }
.tracker-bar meter::-webkit-meter-optimum-value { background: var(--gold); }
.tracker-bar meter::-moz-meter-bar { background: var(--gold); }

.tracker-bar meter::-webkit-meter-bar { background: var(--input-bg); border: 1px solid var(--control-border); }

/* Use the same readable field colors in native-control browsers. */
select { appearance: none; -webkit-appearance: none; color: var(--text); background-color: var(--input-bg); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23e9bc64' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .85rem center; background-size: .875rem .5rem; padding-inline-end: 2.5rem; }
select option, select optgroup { color: var(--text); background-color: var(--input-bg); }
@media (forced-colors: active) {
  select { appearance: auto; -webkit-appearance: auto; background-image: none; color: CanvasText; background-color: Canvas; }
}

/* Compact portrait dashboard, with full-size controls and expandable setup. */
.mobile-calculator-jump, .mobile-navigation-hint { display: none; }
.live-trackers-disclosure { flex: 0 1 36rem; min-width: 0; margin: 18px 0 18px 20px; }
.live-trackers-disclosure > summary { display: none; }
.live-trackers-disclosure .live-trackers { margin: 0; }
.refinery-setup > details { margin: 0; }
.refinery-setup > details > summary { list-style: none; padding: 0; }
.refinery-setup > details > summary::-webkit-details-marker { display: none; }
.disclosure-action { margin-inline-start: auto; font-size: .875rem; color: var(--gold); }
#save-state { text-align: right; margin: .35rem 0 0; }
@media (max-width: 64rem) {
  .live-trackers-disclosure { flex: auto; margin: 0 0 1rem; }
}
@media (max-width: 48rem) {
  header { padding: 1rem; gap: .75rem; }
  .header-tools { width: 100%; margin: 0; gap: .75rem; }
  .header-data { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .1rem .65rem; width: 100%; flex: 1 1 100%; align-items: center; text-align: left; }
  .header-data .version { grid-column: 1; letter-spacing: 0; }
  .header-data .data-check-date { grid-column: 1; }
  .header-data button { grid-column: 2; grid-row: 1 / 3; font-size: .875rem; padding: .5rem; }
  .hero { padding-top: .75rem; gap: .75rem; }
  .hero .eyebrow { margin-block: 0 .35rem; }
  .hero h1 { font-size: 1.875rem; line-height: 1.15; margin: .35rem 0; }
  .hero p:last-of-type { font-size: .875rem; margin-block: .5rem; }
  .hero-actions { gap: .5rem; margin-block: .5rem; }
  .hero-actions > * { flex: 1 1 8rem; font-size: .875rem; }
  .mobile-calculator-jump { display: inline-flex; justify-content: center; align-items: center; min-height: 2.75rem; border: 1px solid var(--control-border); border-radius: 4px; padding: .5rem; background: var(--control-bg); }
  .live-trackers-disclosure { width: 100%; margin: 0 0 .5rem; border: 1px solid var(--control-border); border-radius: 6px; background: var(--panel); }
  .live-trackers-disclosure > summary { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; padding: .6rem .75rem; min-height: 2.75rem; list-style: none; }
  .live-trackers-disclosure > summary::-webkit-details-marker { display: none; }
  .live-trackers-disclosure .live-trackers { padding: .75rem; gap: .75rem; grid-template-columns: minmax(0, 1fr); }
  .live-tracker { padding: .75rem; }
  .mobile-navigation-hint { display: block; margin: .5rem 0 0; font-size: .875rem; }
  #calculator-navigation { position: sticky; top: 0; z-index: 10; flex-wrap: nowrap; justify-content: flex-start; gap: .25rem; padding: .5rem .25rem; overflow-x: auto; background: var(--bg); scroll-padding-inline: .25rem; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
  #calculator-navigation > :is(button, a) { flex: 0 0 auto; white-space: nowrap; min-height: 2.75rem; padding: .5rem .65rem; }
  #save-state { font-size: .875rem; margin: .35rem 0; }
  .section-title { margin: 1.25rem 0 1rem; gap: .75rem; }
  .tab-panel h2, .table-scroll, #affiliation-notice { scroll-margin-block-start: 6rem; }
  .refinery-setup { padding-block: .5rem; }
  .refinery-setup > details > summary { min-height: 2.75rem; margin-bottom: 0; gap: .5rem; }
  .refinery-setup > details[open] > summary { margin-bottom: 1rem; }
  .panel-title .step { flex: 0 0 26px; }
}
@media (max-width: 30rem) {
  .inventory label, .equipment label { grid-template-columns: minmax(0, 1fr); gap: .35rem; padding-block: .75rem; }
  .inventory input, .equipment input { min-height: 2.75rem; }
  .tracker-bar > div { grid-template-columns: minmax(0, 1fr); gap: .15rem; }
  .tracker-bar > div > span:last-child { text-align: left; }
}

.auth-page {max-width:44rem;padding:clamp(1rem,5vw,3rem);margin:3rem auto;overflow-wrap:anywhere}.auth-sign-in{display:inline-flex;align-items:center;min-height:2.75rem;padding:.75rem 1rem;background:var(--gold);color:var(--on-gold);border-radius:4px;font-weight:600}.auth-page a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.auth-page code{overflow-wrap:anywhere}.account-links form{margin:0}