/* Type, shapes, tab bar, phone tuning, date bar, quick add and default accent tokens. */
/* ===== Field-gear theme: gunmetal, concrete and burnt orange ===== */
:root{
  --paper:#E4E7E3; --surface:#F6F7F5; --ink:#1C2126; --muted:#56616B; --line:#C5CBCF; --soft:#D9DEE1;
  --accent:#B85A17;
  --health:#3D6B47; --fitness:#2D5A86; --routines:#B85A17; --spiritual:#7A5A2B;
  --mindset:#545A86; --relationships:#8C3636; --career:#3B5D6A; --danger:#A6311D;
  --recovery:#6E4C9A;
  --sans:"Barlow", "Arial Narrow", ui-sans-serif, system-ui, sans-serif;
  --cond:"Barlow Condensed", "Arial Narrow", ui-sans-serif, system-ui, sans-serif;
  --serif:"Barlow", ui-sans-serif, system-ui, sans-serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#111417; --surface:#1A1F23; --ink:#E4E7E9; --muted:#8E98A0; --line:#2C343A; --soft:#21282D;
    --accent:#E07A2E;
    --health:#6FA67A; --fitness:#6C9BCB; --routines:#E07A2E; --spiritual:#C9A060;
    --mindset:#9499C8; --relationships:#D2716F; --career:#7FA3B0; --danger:#E06A52;
    --recovery:#A98BD8;
  }
}
:root[data-theme="dark"]{
  --paper:#111417; --surface:#1A1F23; --ink:#E4E7E9; --muted:#8E98A0; --line:#2C343A; --soft:#21282D;
  --accent:#E07A2E;
  --health:#6FA67A; --fitness:#6C9BCB; --routines:#E07A2E; --spiritual:#C9A060;
  --mindset:#9499C8; --relationships:#D2716F; --career:#7FA3B0; --danger:#E06A52;
  --recovery:#A98BD8;
}
body{font-size:17px;line-height:1.45}
:focus-visible{outline-color:var(--accent);border-radius:3px}

/* type: condensed, heavy headings */
.brand{font-family:var(--cond);font-weight:800;font-size:20px;text-transform:uppercase;letter-spacing:.06em}
.brand::before{content:"";display:inline-block;width:10px;height:10px;background:var(--accent);margin-right:10px;vertical-align:1px}
.date,.vhead{font-family:var(--cond);font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:.95}
.date{font-size:clamp(44px,11vw,72px)}
.date small{font-family:var(--sans);text-transform:none;font-weight:600;color:var(--accent);letter-spacing:0}
.vhead{font-size:clamp(40px,9vw,56px)}
.sech,.formh,.reflect h2,.gname,.compat h2,.empty h3{font-family:var(--cond);font-weight:700;letter-spacing:.01em}
.sech{font-size:26px;text-transform:uppercase;padding-bottom:6px;border-bottom:2px solid var(--ink)}
.formh,.reflect h2{font-size:22px}
.gname{font-size:24px;font-weight:800}
.group h2,.garea,.meal h3{font-family:var(--cond);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.gnum,.tnum{font-family:var(--cond);font-weight:800}
.gnum{font-size:30px}.tnum{font-size:36px}
.gnum small,.tnum small{font-family:var(--sans)}
.hname{font-weight:600}
textarea{font-family:var(--sans);font-size:17px;line-height:1.6}
.entry p,.ltext{font-family:var(--sans)}

/* shapes: squared off */
.rows,.card,.tot,.goal,.compat,.notice,.aires{border-radius:6px}
.goal{border-top-width:5px}
.btn{border-radius:4px;font-family:var(--cond);font-weight:700;font-size:17px;letter-spacing:.04em;text-transform:uppercase;padding:11px 20px}
.btn:not(.ghost){background:var(--ink);color:var(--paper)}
.btn:not(.ghost):hover{background:var(--accent);color:#fff}
.btn.ghost{border:2px solid var(--ink)}
.pill{border-radius:4px;font-family:var(--cond);font-size:16px;font-weight:600;letter-spacing:.02em;padding:6px 12px}
.status{border-radius:3px;font-family:var(--cond);font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.check{border-radius:8px;border-width:2.5px}
.dots span{border-radius:2px}
.cell{border-radius:3px}
.daybar button,.wbtns button{border-radius:6px;border-width:2px}
.daybar .jump{border-radius:4px;font-family:var(--cond);text-transform:uppercase;letter-spacing:.04em}
.bar{border-radius:1px;height:7px}.bar i{border-radius:0}
.meter{gap:2px}.meter i{border-radius:0}
input[type=text],input[type=number],input[type=date],input[type=search],input[type=password],select,textarea{border-radius:4px}
input[type=search]{border:1px solid var(--line);background:var(--paper);padding:11px 12px;width:100%}
.verdict{border-radius:4px;border-left:3px solid var(--accent)}
.compat{border-left-color:var(--accent)}
.legend i{border-radius:0}

/* tabs */
.tab{font-family:var(--cond);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.06em}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
@media (max-width:700px){
  .tabs{background:var(--ink)}
  .tab{color:color-mix(in srgb,var(--paper) 62%,transparent);font-size:15px;letter-spacing:.04em}
  .tab[aria-selected="true"]{color:var(--paper);border-top-color:var(--accent)}
}
.toast{border-radius:4px;font-family:var(--cond);font-size:16px;letter-spacing:.03em}
/* ===== portrait phone tuning ===== */
html{-webkit-text-size-adjust:100%;touch-action:manipulation}
body{overflow-x:hidden}
.plist{list-style:none;margin:4px 0 14px;padding:0}
.plist li{padding:8px 0;border-top:1px solid var(--line)}
.plist li:first-child{border-top:0}
.wrow{flex-wrap:wrap}
#rotate{display:none}
@media (max-width:700px){ .tab{min-height:52px} }
@media (max-width:480px){
  .wrap{padding:0 14px}
  body{font-size:16px}
  .top .wrap{padding-top:10px}
  .sync{font-size:12px}
  .daybar{margin-top:16px}
  .date{font-size:clamp(38px,12vw,52px);margin:8px 0 6px}
  .tally{font-size:17px;margin-bottom:14px}
  .meter{margin-bottom:22px}
  .row{gap:12px;padding:12px}
  .check{width:44px;height:44px}
  .card,.goal,.compat{padding:14px}
  .tots{grid-template-columns:1fr 1fr;gap:8px}
  .tots .tot:first-child{grid-column:1/-1}
  .tot{padding:12px}
  .tnum{font-size:30px}
  .gnums{gap:18px;margin:12px 0 6px}
  .gnum{font-size:26px}
  .vhead{margin-top:20px}
  .sech{font-size:22px;margin-top:28px}
  .logday{grid-template-columns:68px 1fr;gap:12px}
  .addrow{grid-template-columns:1fr}
  input,select,textarea,.mlink select{font-size:16px}
  .btnrow .btn{flex:1 1 auto}
  .logrow input{flex:1 1 100px}
  .group{margin-bottom:22px}
}
@media (orientation:landscape) and (max-height:500px){
  #rotate{display:flex;position:fixed;inset:0;z-index:50;background:var(--ink);color:var(--paper);align-items:center;justify-content:center;text-align:center;padding:24px;font-family:var(--cond);font-size:26px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
}
@keyframes slideFromRight{from{transform:translateX(32px);opacity:.25}to{transform:none;opacity:1}}
@keyframes slideFromLeft{from{transform:translateX(-32px);opacity:.25}to{transform:none;opacity:1}}
.slide-l{animation:slideFromRight .2s ease-out}
.slide-r{animation:slideFromLeft .2s ease-out}
.excard{border:1px solid var(--line);border-radius:6px;padding:12px;margin-bottom:12px;background:var(--paper)}
.exhead{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.exhead input{flex:1;background:var(--surface)}
.setrow{display:grid;grid-template-columns:34px minmax(0,1fr) minmax(0,1fr) 38px;gap:8px;align-items:center;margin-top:6px}
.setlbl{font-size:13px;color:var(--muted);font-weight:600;margin-top:0}
.setn{font-family:var(--cond);font-weight:700;font-size:18px;text-align:center}
.setrow input{padding:9px 10px;background:var(--surface)}
.setdel{width:38px;height:42px;border:1px solid var(--line);background:var(--surface);border-radius:4px;font-size:20px;color:var(--muted)}
.c-recovery{--c:var(--recovery)}
.wcard{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--c);border-radius:6px;padding:14px;margin-bottom:12px}
.wcard .gname{font-size:22px}
.wtools{display:flex;gap:14px;flex-shrink:0}
.wstats{margin:6px 0 0;color:var(--muted);font-size:15px}
.wkstrip{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:12px}
.wday{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:var(--muted)}
.wday.now span{color:var(--ink);font-weight:800}
.wday i{display:grid;place-items:center;width:100%;height:36px;border:1.5px solid var(--line);border-radius:4px;font-style:normal;font-family:var(--cond);font-weight:700;font-size:14px;color:#fff}
.wday i.fut{border-style:dashed;opacity:.5}
.wday i.has{display:flex;align-items:stretch;padding:0;overflow:hidden;border-color:transparent}
.wday i b{flex:1;display:grid;place-items:center;font-weight:inherit;min-width:0}
.wday i b.l{background:var(--fitness)}
.wday i b.c{background:var(--health)}
.wday i b.r{background:var(--recovery)}
.wday i.n3{font-size:12px;letter-spacing:-.02em}
@media (max-width:360px){ .wday i.n3{font-size:11px} }
@media (max-width:420px){.tab{font-size:13px;letter-spacing:.02em}}

/* ===== tab bar with icons (scales to any number of tabs) ===== */
.tabs .tab{display:inline-flex;align-items:center;gap:8px}
.ti{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
@media (max-width:700px){
  .tabs{padding:0 2px calc(2px + env(safe-area-inset-bottom,0px))}
  .tabs .tab{flex:1 1 0;min-width:0;flex-direction:column;justify-content:center;gap:3px;padding:8px 0 7px;min-height:58px;font-size:12px;letter-spacing:.03em;line-height:1}
  .tabs .tab span{white-space:nowrap;overflow:hidden;text-overflow:clip;max-width:100%}
  .tabs .tab .ti{width:23px;height:23px}
  .tabs .tab[aria-selected="true"] .ti{stroke:var(--accent);stroke-width:2.4}
}
/* ===== round 2 design: bar, buttons, date bar, strip, quick add ===== */
:root{ --bar:#1C2126; --bar-ink:#9AA4AC; --bar-on:#FFFFFF; }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --bar:#0A0C0E; } }
:root[data-theme="dark"]{ --bar:#0A0C0E; }
.btn:not(.ghost){background:var(--accent);color:#fff}
.btn:not(.ghost):hover{background:var(--ink);color:var(--paper)}
.btn.ghost{border-width:2px;border-color:var(--line);color:var(--ink)}
.btn.ghost:hover{border-color:var(--ink)}
.pill[aria-pressed="true"],.pill[aria-checked="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chip[aria-checked="true"],.chip[aria-pressed="true"]{background:var(--c);border-color:var(--c);color:#fff}
@media (max-width:700px){
  .tabs{background:var(--bar);border-top:1px solid color-mix(in srgb,var(--bar-ink) 25%,transparent)}
  .tabs .tab{color:var(--bar-ink)}
  .tabs .tab[aria-selected="true"]{color:var(--bar-on);border-top-color:var(--accent)}
  main{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}
}
.mlink{flex-wrap:wrap}
.mlink select{flex:1 1 200px;min-width:0;max-width:none}
.energy{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.energy .lbl{grid-column:1/-1;margin:0}
.energy .pill{padding:8px 2px;text-align:center}
/* date bar */
.daybar,#dateText,#fDate,#tDate{display:none!important}
.datebar{display:flex;align-items:center;gap:6px;width:100%;margin-top:10px;position:relative}
.datebar[hidden]{display:none}
.datebar button{height:40px;border:2px solid var(--line);background:var(--surface);border-radius:6px;color:var(--ink)}
.datebar #dPrev,.datebar #dNext{width:44px;font-size:20px;flex:none}
.datebar #dNext:disabled{opacity:.3}
.datebar .dlabel{flex:1;min-width:0;text-align:left;padding:0 12px;font-family:var(--cond);font-weight:700;font-size:19px;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.datebar #dToday{padding:0 12px;font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--accent);border-color:var(--accent)}
#dPick{position:absolute;left:52px;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
/* today hero + strip */
#tally{margin:22px 0 12px;font-family:var(--cond);font-size:20px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
#tally b{display:block;font-size:56px;font-weight:800;line-height:.95;letter-spacing:0;color:var(--ink);margin-bottom:4px}
#v-food .tots,#v-train .tots{margin-top:18px}
.tbar{display:block;width:100%;height:4px;background:var(--soft);margin-top:6px}
.tbar i{display:block;height:100%;background:var(--accent)}
/* quick add */
.fab{position:fixed;right:16px;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:7;width:58px;height:58px;border-radius:14px;border:0;background:var(--accent);color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.35);display:grid;place-items:center}
.fab svg{width:28px;height:28px;stroke:#fff;stroke-width:3;stroke-linecap:round}
@media (max-width:700px){ .fab{bottom:calc(80px + env(safe-area-inset-bottom,0px))} }
.sheet-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:40}
.sheet-bg[hidden],.sheet[hidden]{display:none}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:41;max-width:560px;margin:0 auto;background:var(--surface);border-radius:14px 14px 0 0;padding:10px 18px calc(18px + env(safe-area-inset-bottom,0px));max-height:85vh;overflow-y:auto;transform:translateY(100%);transition:transform .22s ease-out}
.sheet.open{transform:none}
.sheet-grip{width:44px;height:5px;border-radius:3px;background:var(--line);margin:0 auto 12px}
.qitem{display:block;width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:13px 2px}
.qitem .hname{font-family:var(--cond);font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
/* feedback */
.spark{position:fixed;width:7px;height:7px;margin:-3px 0 0 -3px;z-index:60;pointer-events:none;animation:spark .75s ease-out forwards}
@keyframes spark{to{transform:translate(var(--dx),var(--dy)) rotate(200deg);opacity:0}}
.pop{animation:pop .3s ease-out}
@keyframes pop{0%{transform:scale(.78)}60%{transform:scale(1.14)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.sheet{transition:none}.pop{animation:none}}
/* ===== palettes: Field gear (default), Broncos, Buffaloes ===== */
:root{ --warn:#B85A17; --accent-ink:#B85A17; --on-accent:#FFFFFF; }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --warn:#E07A2E; --accent-ink:#E07A2E; } }
:root[data-theme="dark"]{ --warn:#E07A2E; --accent-ink:#E07A2E; }
.st-watch{background:color-mix(in srgb,var(--warn) 18%,transparent);color:var(--warn)}
.notice{border-left-color:var(--warn)}
.btn:not(.ghost){color:var(--on-accent)}
.fab{color:var(--on-accent)} .fab svg{stroke:var(--on-accent)}
.datebar #dToday{color:var(--accent-ink);border-color:var(--accent-ink)}

