/* Taimen Lodge Admin — field-office ledger: river spruce + taimen-tail red, condensed display type, money right-aligned */
:root{
  --bg:#eef2f0; --surface:#ffffff; --sunk:#e3e9e6; --ink:#15201d; --muted:#5a6a65; --line:#d3dcd8;
  --accent:#1c5a52; --accent-ink:#ffffff; --soft:#dceae6;
  --taimen:#b23f26; --taimen-soft:#f6e1da; --good:#2c7339; --good-soft:#deefe0; --warn:#9a6300; --warn-soft:#f5ead2;
  --display:"Fira Sans Condensed","Arial Narrow",Arial,sans-serif;
  --body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:10px; color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0e1513; --surface:#16201e; --sunk:#111a18; --ink:#e4ebe8; --muted:#90a19c; --line:#283532;
  --accent:#62b4a7; --accent-ink:#0a1311; --soft:#1b2e2a;
  --taimen:#e8806a; --taimen-soft:#3a201a; --good:#72c282; --good-soft:#18301d; --warn:#e2ad55; --warn-soft:#352a14;
  color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45;padding-bottom:env(safe-area-inset-bottom,0px)}
[hidden]{display:none!important}
.wrap{max-width:1100px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
a{color:var(--accent);text-underline-offset:2px}
.boot{padding:40px;text-align:center;color:var(--muted)}

/* login */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px 16px}
.authcard{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px 24px;display:flex;flex-direction:column;gap:14px}
.authcard .brandmark{font-family:var(--display);font-weight:700;font-size:30px;text-transform:uppercase;letter-spacing:.03em;line-height:1}
.authcard .brandmark small{display:block;font-family:var(--body);font-weight:400;font-size:13px;text-transform:none;letter-spacing:.02em;color:var(--muted);margin-top:4px}

/* shell */
header.top{position:sticky;top:0;z-index:5;background:var(--surface);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-block:12px 6px}
.brand{display:flex;flex-direction:column;margin-right:auto;min-width:0}
.brand b{font-family:var(--display);font-weight:700;font-size:24px;letter-spacing:.02em;line-height:1;text-transform:uppercase}
.brand span{font-size:12px;color:var(--muted);letter-spacing:.04em}
.ctl{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.ctl select,.pill{border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:6px 10px;font-size:14px;color:var(--ink)}
.pill{font-variant-numeric:tabular-nums}
nav.tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
nav.tabs a{font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding:8px 12px 10px;border-bottom:3px solid transparent;white-space:nowrap}
nav.tabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--taimen)}

main{padding-block:20px 60px;display:flex;flex-direction:column;gap:20px}
h2{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0}
.head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.head h1{font-family:var(--display);font-weight:700;font-size:30px;margin:0 auto 0 0;text-wrap:balance;line-height:1.05;min-width:0;overflow-wrap:anywhere}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 14px;font-weight:500;text-decoration:none;display:inline-block}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.danger{color:var(--taimen);border-color:var(--taimen)}
.btn.danger.armed{background:var(--taimen);color:var(--surface)}
.btn.sm{padding:4px 10px;font-size:13px}
.btn.block{width:100%;padding:11px}
.btn[disabled]{opacity:.55;cursor:default}
.link{background:none;border:0;padding:0;color:var(--accent);font-weight:500;text-decoration:underline;text-underline-offset:2px}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.stat{background:var(--surface);padding:14px 16px;display:flex;flex-direction:column;gap:2px;min-width:0}
.stat small{font-size:12px;color:var(--muted);letter-spacing:.03em}
.stat b{font-family:var(--display);font-weight:600;font-size:30px;line-height:1.1;font-variant-numeric:tabular-nums}
.stat em{font-style:normal;font-size:12px;color:var(--muted)}
.stat.hl b{color:var(--accent)}
.stat.neg b{color:var(--taimen)}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:760px){.grid2{grid-template-columns:1fr}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0}

.list{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.panel .list{border:0;border-radius:0;background:none}
.row{display:grid;grid-template-columns:86px 1fr auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line);text-align:left;background:none;border-left:0;border-right:0;border-bottom:0;width:100%;color:inherit;text-decoration:none}
.panel .row{padding-inline:0}
.row:first-child{border-top:0}
a.row:hover,button.row:hover{background:var(--soft)}
.row.two{grid-template-columns:1fr auto}
.when{display:flex;flex-direction:column;line-height:1.15}
.when b{font-family:var(--display);font-weight:600;font-size:18px}
.when span{font-size:12px;color:var(--muted)}
.what{min-width:0}
.what b{display:block;font-weight:600;overflow-wrap:anywhere}
.what span{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.money{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-variant-numeric:tabular-nums}
.money b{font-weight:600}
.money span{font-size:12px;color:var(--muted)}
@media (max-width:480px){.row{grid-template-columns:64px 1fr}.row.two{grid-template-columns:1fr}.money{grid-column:2;align-items:flex-start;text-align:left;flex-direction:row;flex-wrap:wrap;gap:8px}.row.two .money{grid-column:1}}

.chip{display:inline-block;font-size:11.5px;font-weight:600;letter-spacing:.03em;padding:2px 8px;border-radius:999px;white-space:nowrap;background:var(--sunk);color:var(--muted)}
.chip.good{background:var(--good-soft);color:var(--good)}
.chip.warn{background:var(--warn-soft);color:var(--warn)}
.chip.bad{background:var(--taimen-soft);color:var(--taimen)}
.chip.acc{background:var(--soft);color:var(--accent)}

.empty{padding:28px 16px;text-align:center;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:10px}
.empty b{color:var(--ink);font-family:var(--display);font-size:20px;font-weight:600}
.note{font-size:13px;color:var(--muted);margin:0}
.banner{border:1px solid var(--line);border-left:4px solid var(--warn);background:var(--surface);border-radius:8px;padding:10px 14px;font-size:14px}

.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.filters input,.filters select{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 10px;min-width:0}
.filters input{flex:1 1 200px}

.bars{display:flex;flex-direction:column;gap:9px}
.barrow{display:grid;grid-template-columns:150px 1fr 90px;gap:10px;align-items:center;font-size:13px}
@media (max-width:480px){.barrow{grid-template-columns:110px 1fr 76px}}
.track{height:10px;background:var(--sunk);border-radius:5px;overflow:hidden}
.fill{height:100%;background:var(--accent);border-radius:5px}
.fill.cost{background:var(--taimen)}
.barrow .num{text-align:right}

.tbl{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.tbl th{text-align:right;font-weight:600;font-size:12px;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;padding:6px 8px;border-bottom:1px solid var(--line)}
.tbl td{text-align:right;padding:8px;border-bottom:1px solid var(--line)}
.tbl th:first-child,.tbl td:first-child{text-align:left}
.scroll{overflow-x:auto}

/* calendar */
.gwrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.gantt{display:grid;grid-template-columns:150px var(--w);font-size:13px;min-width:max-content}
.glabel{position:sticky;left:0;background:var(--surface);z-index:1;padding:8px 10px;border-top:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.gtrack{position:relative;border-top:1px solid var(--line);height:38px}
.gtrack.hd{height:28px}
.gtrack.hist{height:54px}
.month{position:absolute;top:0;bottom:0;border-left:1px solid var(--line);padding:6px;font-family:var(--display);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.season{position:absolute;top:0;bottom:0;background:var(--soft);opacity:.55}
.today{position:absolute;top:0;bottom:0;width:2px;background:var(--taimen)}
.gbar{position:absolute;top:7px;height:24px;border-radius:6px;background:var(--accent);color:var(--accent-ink);font-size:12px;font-weight:600;padding:3px 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none}
.gbar.tent{background:var(--warn-soft);color:var(--warn);outline:1px dashed var(--warn)}
.hbar{position:absolute;bottom:4px;background:var(--accent);opacity:.75;border-radius:1px 1px 0 0}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);align-items:center}
.sw{display:inline-block;width:14px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}

/* sheet & forms */
.sheet{position:fixed;inset:0;z-index:20;background:rgb(10 16 14 / .45);display:flex;align-items:flex-end;justify-content:center}
@media (min-width:700px){.sheet{align-items:center}}
.panelx{background:var(--surface);width:100%;max-width:560px;max-height:92vh;overflow-y:auto;border-radius:14px 14px 0 0;padding:20px max(18px,env(safe-area-inset-left,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:14px}
@media (min-width:700px){.panelx{border-radius:14px}}
.panelx h3{font-family:var(--display);font-weight:700;font-size:26px;margin:0;line-height:1.1}
.form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fld{display:flex;flex-direction:column;gap:4px;min-width:0}
.fld.full{grid-column:1/-1}
.fld label{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
.fld input,.fld select,.fld textarea{border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:9px 10px;width:100%;min-width:0}
.fld textarea{min-height:80px;resize:vertical}
@media (max-width:420px){.form{grid-template-columns:1fr}}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.actions .sp{margin-right:auto}
.err{color:var(--taimen);font-size:13.5px}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.kv div{display:flex;flex-direction:column}
.kv small{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.kv b{font-variant-numeric:tabular-nums;font-weight:600}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:8px;z-index:30;font-size:14px}
.picklist{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;max-height:220px;overflow-y:auto}
.picklist button{text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:9px 12px}
.picklist button:first-child{border-top:0}
.picklist button:hover{background:var(--soft)}
@media (prefers-reduced-motion:no-preference){.panelx{animation:up .18s ease-out}@keyframes up{from{transform:translateY(16px);opacity:.6}}}

/* trip timeline */
.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:0;counter-reset:step}
.timeline li{position:relative;display:flex;flex-direction:column;gap:2px;padding:10px 12px 10px 14px;border-left:3px solid var(--accent);background:var(--soft)}
.timeline li+li{border-left-color:var(--line)}
.timeline li:first-child{border-radius:8px 0 0 8px}
.timeline li:last-child{border-radius:0 8px 8px 0;border-left-color:var(--taimen)}
.timeline small{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.timeline b{font-family:var(--display);font-weight:600;font-size:19px;font-variant-numeric:tabular-nums}
.timeline span{font-size:12px;color:var(--muted)}
@media (max-width:560px){.timeline{grid-template-columns:1fr}.timeline li,.timeline li:first-child,.timeline li:last-child{border-radius:0}}

/* bookings list: camp dates + transport columns */
.row.brow{grid-template-columns:210px minmax(0,1fr) 150px 170px}
.row.brow .what b{font-family:var(--display);font-weight:700;font-size:21px;line-height:1.15}
.row.brow .bcol{align-self:center}
.campcol{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.campcol b{font-family:var(--display);font-weight:700;font-size:21px;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--accent)}
.campcol b.muted{color:var(--muted);font-weight:500}
.campcol span{font-size:12px;color:var(--muted)}
.bcol{display:flex;flex-direction:column;align-items:flex-start;gap:3px;line-height:1.2;min-width:0}
.bcol b{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.bcol b.muted{color:var(--muted);font-weight:400}
.bcol span{font-size:12px;color:var(--muted)}
@media (max-width:820px){.row.brow{grid-template-columns:minmax(0,1fr) auto}.row.brow .campcol,.row.brow .what,.row.brow .bcol{grid-column:1}.row.brow .money{grid-column:2;grid-row:1/span 3}.row.brow .bcol{flex-direction:row}}
@media (max-width:480px){.row.brow{grid-template-columns:1fr}.row.brow .money{grid-column:1;grid-row:auto}}

/* itinerary */
.itin-list{display:flex;flex-direction:column;gap:12px}
.itin{display:flex;flex-direction:column;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;color:inherit;text-decoration:none}
.itin:hover{border-color:var(--accent)}
.itin-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.itin-head b{font-family:var(--display);font-weight:700;font-size:20px}
.itin-head span:last-child{flex-basis:100%;font-size:13px;color:var(--muted)}
.itin-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--line);border-radius:8px;overflow:hidden}
.itin-steps li{background:var(--bg);padding:9px 11px;display:flex;flex-direction:column;gap:2px;min-width:0}
.itin-steps li.camp{background:var(--soft)}
.itin-steps small{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.itin-steps b{font-family:var(--display);font-weight:600;font-size:18px;font-variant-numeric:tabular-nums}
.itin-steps b.muted{color:var(--muted);font-weight:400}
.itin-steps span{font-size:12px;color:var(--muted)}
@media (max-width:640px){.itin-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.itin-steps li:last-child{grid-column:1/-1}}

/* whole payment / expense row opens the edit form */
.row.tap{cursor:pointer}
.row.tap:hover{background:var(--soft)}

/* received payments are green; expected stay neutral */
.row.rcv{background:var(--soft)}
.row.rcv:hover{background:var(--soft);box-shadow:inset 0 0 0 1px var(--accent)}
.row.rcv .chip.good{background:var(--surface);color:var(--accent)}
.panel .row.rcv{padding-inline:12px;border-radius:8px;border-top-color:transparent;margin-top:4px}
.autobal{border:1px dashed var(--line);border-radius:8px;padding:12px;gap:10px}
.fld label.check{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink);text-transform:none;letter-spacing:0}
.fld label.check input{width:18px;height:18px;accent-color:var(--accent)}

/* expected payments: yellow on hover */
.row.pexp:hover{background:var(--warn-soft)}

/* booking figures: two aligned rows of five columns */
.kv.kv5{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px 16px}
.kv.kv5 small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kv.kv5 b{font-size:17px}
.kv-total b{font-size:20px!important;color:var(--accent)}
.kv-split{padding-top:12px;border-top:1px solid var(--line)}
.bnotes{margin:0;padding:10px 12px;background:var(--bg);border-radius:8px;font-size:14px;white-space:pre-wrap}
@media (max-width:640px){.kv.kv5{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* payment and cost rows inside a group: same padding, rounded, spaced */
.panel .list:has(> .row.tap){gap:6px}
.panel .row.tap{padding:12px;border-radius:8px;border-top:0;margin:0}
@media (min-width:481px){.panel .row.tap .money{justify-content:center}}
.panel .row.rcv{margin-top:0}
a.row.brow:hover .chip.acc{background:var(--surface)}

/* day-by-day trip plan */
.trip-facts{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:760px){.trip-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.days{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.day{display:grid;grid-template-columns:64px 90px minmax(0,1fr);gap:12px;align-items:center;padding:10px 12px;border-radius:8px;background:var(--bg);border-left:4px solid var(--line)}
.day.fish{background:var(--soft);border-left-color:var(--accent)}
.day.move{background:var(--soft);border-left-color:var(--warn)}
.day.arrive,.day.depart{border-left-color:var(--taimen)}
.dnum{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.ddate{display:flex;flex-direction:column;line-height:1.15}
.ddate b{font-family:var(--display);font-weight:700;font-size:19px;font-variant-numeric:tabular-nums}
.ddate span{font-size:12px;color:var(--muted)}
.dwhat{display:flex;flex-direction:column;min-width:0}
.dwhat b{font-weight:600}
.dwhat span{font-size:13px;color:var(--muted)}
@media (max-width:480px){.day{grid-template-columns:72px minmax(0,1fr)}.dnum{grid-column:1/-1}}

/* season calendar v2 */
.gantt{grid-template-columns:170px var(--w)}
.glabel{display:flex;flex-direction:column;justify-content:center;max-width:170px;padding:6px 12px;box-shadow:1px 0 0 var(--line)}
.glabel a{color:var(--ink);text-decoration:none;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glabel a:hover{color:var(--accent);text-decoration:underline}
.glabel span{font-size:11.5px;color:var(--muted)}
.glabel.ghead{z-index:2}
.gtrack{height:44px}
.gtrack.hd{height:30px;background:var(--surface)}
.gtrack.hd2{height:36px;border-top:1px solid var(--line);background:var(--surface)}
.gtrack.hist{height:62px}
.cal-month{position:absolute;top:0;bottom:0;border-left:2px solid var(--ink);padding:6px 8px;font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
.cal-day{position:absolute;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05;font-variant-numeric:tabular-nums}
.cal-day b{font-size:12px;font-weight:600}
.cal-day span{font-size:9.5px;color:var(--muted)}
.cal-day.we{background:var(--sunk)}
.cal-day.now{background:var(--taimen);color:var(--surface);border-radius:4px}
.cal-day.now span{color:var(--surface)}
.cal-grid{position:absolute;inset:0;pointer-events:none}
.cal-grid .we{position:absolute;top:0;bottom:0;background:var(--sunk);opacity:.7}
.cal-grid .wline{position:absolute;top:0;bottom:0;width:1px;background:var(--line)}
.cal-grid .mline{position:absolute;top:0;bottom:0;width:2px;background:var(--muted);opacity:.6}
.cal-grid .today{position:absolute;top:0;bottom:0;width:2px;background:var(--taimen);z-index:3}
.trip{position:absolute;top:13px;height:18px;border-radius:5px;background:var(--line)}
.trip.tent{background:var(--warn-soft)}
.gtrack .gbar{top:9px;height:26px;padding:4px 6px;font-size:12.5px;text-align:center;z-index:2;box-shadow:0 1px 2px rgb(0 0 0 / .15)}
.glab{position:absolute;top:12px;white-space:nowrap;font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;z-index:2;font-variant-numeric:tabular-nums}
.glab:hover{color:var(--accent);text-decoration:underline}
.hbar{display:flex;justify-content:center;border-radius:3px 3px 0 0;opacity:.85}
.hbar.over{background:var(--taimen)}
.hbar em{font-style:normal;font-size:9.5px;font-weight:600;color:var(--surface);margin-top:2px}