/* Layout: a working shortlist. Header with the trip's dates, filter rail, then one row per place
   (wide photo left, facts right), with a picking bar fixed to the bottom of the screen. */
:root{
  --sky:#E8EBEE;          /* page: London sky grey, faint blue bias */
  --sky-deep:#DCE0E5;     /* recessed panels */
  --card:#F6F7F8;         /* raised surfaces (inputs, bar) */
  --ink:#16191D;
  --muted:#59606A;
  --rule:#BEC4CC;
  --oxblood:#7C2230;      /* accent: brick and livery red, kept dark */
  --oxblood-soft:#F0DDDF;
  --on-accent:#FFFFFF;
  --open:#2F6B4F;  --open-bg:#DCEBE2;
  --closed:#8A2C22; --closed-bg:#F3DCD7;
  --limited:#7A5510; --limited-bg:#F1E6CC;
  --shade:rgba(22,25,29,.55);

  --f-display:"Libre Caslon Text", "Iowan Old Style", Georgia, serif;
  --f-body:"Libre Franklin", "Helvetica Neue", Arial, sans-serif;
  --f-data:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --sky:#15181C; --sky-deep:#1D2126; --card:#22272D; --ink:#E9ECEF; --muted:#A1A9B3; --rule:#3A4149;
    --oxblood:#E07A86; --oxblood-soft:#3A2227; --on-accent:#1A0E10;
    --open:#7FC9A2; --open-bg:#1E3329; --closed:#EE9488; --closed-bg:#3A221F; --limited:#E2BE72; --limited-bg:#352B17;
    --shade:rgba(0,0,0,.6);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --sky:#15181C; --sky-deep:#1D2126; --card:#22272D; --ink:#E9ECEF; --muted:#A1A9B3; --rule:#3A4149;
  --oxblood:#E07A86; --oxblood-soft:#3A2227; --on-accent:#1A0E10;
  --open:#7FC9A2; --open-bg:#1E3329; --closed:#EE9488; --closed-bg:#3A221F; --limited:#E2BE72; --limited-bg:#352B17;
  --shade:rgba(0,0,0,.6);
  color-scheme:dark;
}

*{box-sizing:border-box;}
body{
  background:var(--sky); color:var(--ink);
  font-family:var(--f-body); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1200px;margin:0 auto;padding-inline:24px;padding-block:0 140px;}

/* ---------- header ---------- */
header{padding-block:48px 8px;}
.eyebrow{font-family:var(--f-data);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--oxblood);margin:0 0 14px;}
h1{
  font-family:var(--f-display);font-weight:700;
  font-size:clamp(34px,5.6vw,58px);line-height:1.02;letter-spacing:-.01em;
  margin:0 0 18px;max-width:22ch;text-wrap:balance;
}
h1 em{font-style:italic;font-weight:400;color:var(--oxblood);}
.standfirst{max-width:64ch;color:var(--muted);margin:0 0 28px;}

.days{
  display:grid;grid-template-columns:repeat(var(--ndays,5),minmax(0,1fr));
  border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);
}
.day{padding:12px 14px 12px 0;border-right:1px solid var(--rule);margin-right:14px;min-width:0;}
.day:last-child{border-right:0;margin-right:0;}
.day b{display:block;font-family:var(--f-display);font-size:22px;line-height:1.1;}
.day span{display:block;font-size:13px;color:var(--muted);}
.day.edge b{color:var(--muted);font-weight:400;font-style:italic;}

/* ---------- filters ---------- */
.controls{padding-block:26px 6px;display:grid;gap:16px;}
.ctrl-row{display:grid;grid-template-columns:120px 1fr;gap:12px;align-items:start;}
.ctrl-row > p{margin:6px 0 0;font-size:13.5px;color:var(--muted);}
.chips{display:flex;flex-wrap:wrap;gap:8px;}
button.chip{
  font:inherit;font-size:14px;line-height:1.2;padding:7px 12px;
  border:1px solid var(--rule);border-radius:2px;background:transparent;color:var(--ink);cursor:pointer;
}
button.chip:hover{border-color:var(--oxblood);}
button.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--sky);}
button.chip .n{font-family:var(--f-data);font-size:12px;opacity:.7;margin-left:4px;}

.search-line{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
input[type="search"]{
  font:inherit;padding:9px 12px;flex:1 1 260px;min-width:0;
  border:1px solid var(--rule);border-radius:2px;background:var(--card);color:var(--ink);
}
input[type="search"]::placeholder{color:var(--muted);}
.count{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;}
button.plain{font:inherit;font-size:14px;background:none;border:0;padding:0;color:var(--oxblood);text-decoration:underline;text-underline-offset:3px;cursor:pointer;}
:focus-visible{outline:2px solid var(--oxblood);outline-offset:2px;}

/* ---------- list ---------- */
#list{margin-top:22px;border-top:2px solid var(--ink);}
.group-head{
  display:flex;align-items:baseline;gap:12px;padding-block:28px 6px;border-bottom:1px solid var(--rule);
}
.group-head h2{font-family:var(--f-display);font-weight:400;font-style:italic;font-size:26px;margin:0;}
.group-head span{font-family:var(--f-data);font-size:12.5px;color:var(--muted);}

article{
  display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:32px;
  padding-block:30px;border-bottom:1px solid var(--rule);
}
article.picked{box-shadow:inset 4px 0 0 var(--oxblood);padding-left:18px;}

.title-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:2px;}
h3{font-family:var(--f-display);font-weight:700;font-size:25px;line-height:1.15;margin:0;text-wrap:balance;}
.pc{font-family:var(--f-data);font-size:12.5px;padding:1px 6px;border:1px solid var(--rule);color:var(--muted);}
.place{font-size:14px;color:var(--muted);margin:0 0 12px;}
.body{margin:0 0 12px;max-width:66ch;}

.facts{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0 0 12px;font-size:14px;}
.facts div{min-width:0;}
.facts dt{font-family:var(--f-data);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.facts dd{margin:0;font-weight:500;font-variant-numeric:tabular-nums;}

.week{display:flex;gap:6px;margin:0 0 14px;flex-wrap:wrap;}
.wd{
  font-family:var(--f-data);font-size:12.5px;padding:3px 8px;min-width:58px;text-align:center;border-radius:2px;
}
.wd.open{background:var(--open-bg);color:var(--open);}
.wd.closed{background:var(--closed-bg);color:var(--closed);text-decoration:line-through;}
.wd.limited{background:var(--limited-bg);color:var(--limited);}
.wd.check{background:var(--limited-bg);color:var(--limited);font-style:italic;}

.practical{max-width:66ch;margin:0 0 16px;padding:9px 13px;background:var(--sky-deep);border-left:3px solid var(--rule);font-size:14.5px;}
.practical.alert{background:var(--limited-bg);border-left-color:var(--limited);}

.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
button.pick{
  font:inherit;font-size:14.5px;font-weight:600;padding:9px 16px;border-radius:2px;cursor:pointer;
  border:1.5px solid var(--oxblood);background:transparent;color:var(--oxblood);
}
button.pick[aria-pressed="true"]{background:var(--oxblood);color:var(--on-accent);}
button.must{
  font:inherit;font-size:14px;padding:9px 12px;border-radius:2px;cursor:pointer;
  border:1px dashed var(--rule);background:transparent;color:var(--muted);
}
button.must[aria-pressed="true"]{border-style:solid;border-color:var(--ink);color:var(--ink);font-weight:600;}
button.must[hidden]{display:none;}
a.btn{
  font-size:14px;font-weight:500;padding:9px 14px;border-radius:2px;text-decoration:none;
  border:1px solid var(--rule);color:var(--ink);
}
a.btn:hover{border-color:var(--ink);}

.who{font-size:13px;color:var(--muted);font-style:italic;}
.empty{padding:48px 0;color:var(--muted);}

footer{margin-top:36px;padding-top:18px;border-top:1px solid var(--rule);font-size:13.5px;color:var(--muted);max-width:70ch;}
footer p{margin:0 0 10px;}

/* ---------- picking bar ---------- */
.bar{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  background:var(--card);border-top:2px solid var(--ink);
  padding:12px 24px calc(12px + env(safe-area-inset-bottom, 0px));
}
.bar-in{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;}
.tally{display:flex;gap:18px;align-items:baseline;flex-wrap:wrap;}
.tally b{font-family:var(--f-display);font-size:24px;margin-right:5px;font-variant-numeric:tabular-nums;}
.tally span{font-size:13.5px;color:var(--muted);}
.budget{flex:1 1 220px;min-width:0;}
.budget-track{height:8px;background:var(--sky-deep);border:1px solid var(--rule);position:relative;overflow:hidden;}
.budget-fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--oxblood);transition:width .25s ease;}
.budget-fill.over{background:var(--closed);}
.budget p{margin:4px 0 0;font-size:12.5px;color:var(--muted);}
.save{font-family:var(--f-data);font-size:12px;color:var(--muted);}
.save.ok{color:var(--open);}
.bar .btn-sm{font:inherit;font-size:13.5px;padding:7px 12px;border:1px solid var(--rule);border-radius:2px;background:transparent;color:var(--ink);cursor:pointer;}
.bar .btn-sm[aria-pressed="true"]{background:var(--ink);color:var(--sky);border-color:var(--ink);}

/* ---------- view switch ---------- */
.views{display:flex;gap:0;margin-top:22px;border:1px solid var(--ink);width:max-content;max-width:100%;}
.views button{font:inherit;font-size:14.5px;font-weight:600;padding:9px 18px;border:0;background:transparent;color:var(--ink);cursor:pointer;}
.views button + button{border-left:1px solid var(--ink);}
.views button[aria-selected="true"]{background:var(--ink);color:var(--sky);}
.views .n{font-family:var(--f-data);font-size:12px;font-weight:400;opacity:.7;margin-left:4px;}
#plan-view{margin-top:22px;border-top:2px solid var(--ink);}
#plan-changes{margin-top:18px;}
body.v-plan .bar{display:none;}
body.v-plan .wrap{padding-block-end:60px;}

/* ---------- people: who is picking, and everyone else's picks ---------- */
.crumb{font-size:14px;margin:0 0 18px;}
.crumb a{color:var(--muted);text-underline-offset:3px;}
button.skip{
  font:inherit;font-size:14px;padding:9px 12px;border-radius:2px;cursor:pointer;
  border:1px dashed var(--rule);background:transparent;color:var(--muted);
}
button.skip[aria-pressed="true"]{border-style:solid;border-color:var(--muted);color:var(--ink);text-decoration:line-through;}
button.skip[hidden]{display:none;}
article.skipped h3{color:var(--muted);}
.ppl{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0;align-items:center;font-size:13px;}
.ppl > span:first-child{color:var(--muted);font-style:italic;margin-right:2px;}
.pp{padding:2px 8px;border:1px solid var(--rule);border-radius:2px;white-space:nowrap;}
.pp.must{border-color:var(--oxblood);color:var(--oxblood);font-weight:600;}
.pp.skip{color:var(--muted);text-decoration:line-through;border-style:dashed;}
.pp.me{background:var(--sky-deep);}
.whoami{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;font-size:14px;}
.whoami b{font-weight:600;}
.whoami form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0;}
.whoami label{font-weight:600;}
.whoami input{
  font:inherit;font-size:14px;padding:7px 10px;width:170px;max-width:100%;
  border:1px solid var(--rule);border-radius:2px;background:var(--sky);color:var(--ink);
}
.whoami .msg{font-size:13px;color:var(--muted);}
.whoami .msg.err{color:var(--closed);}
.bar .btn-sm.primary{background:var(--oxblood);border-color:var(--oxblood);color:var(--on-accent);font-weight:600;}
.bar.ask{border-top-color:var(--oxblood);}
.views.solo button{cursor:default;}
.loading{padding:60px 0;color:var(--muted);}
mark.flash{background:none;color:inherit;animation:flash 1.6s ease;}
@keyframes flash{from{background:var(--oxblood-soft);}to{background:transparent;}}

/* ---------- trip list (home page) ---------- */
.trip-list{list-style:none;margin:28px 0 0;padding:0;border-top:2px solid var(--ink);}
.trip-row{
  display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:28px;
  padding-block:26px;border-bottom:1px solid var(--rule);
}
.trip-row .cover{aspect-ratio:4/3;background:var(--sky-deep);border:1px solid var(--rule);overflow:hidden;display:block;}
.trip-row .cover img{width:100%;height:100%;object-fit:cover;display:block;}
.trip-row h2{font-family:var(--f-display);font-weight:700;font-size:32px;line-height:1.1;margin:0 0 4px;}
.trip-row h2 a{color:inherit;text-decoration:none;}
.trip-row h2 a:hover{color:var(--oxblood);}
.trip-row h2 em{font-weight:400;color:var(--oxblood);}
.trip-row p{margin:0 0 12px;max-width:62ch;}
.trip-row .meta{font-family:var(--f-data);font-size:12.5px;color:var(--muted);letter-spacing:.04em;margin-bottom:10px;}
.trip-row .actions{margin-top:14px;}
.trip-row.past{opacity:.75;}

@media (max-width:900px){
  .trip-row{grid-template-columns:minmax(0,1fr);gap:14px;}
  .wrap{padding-inline:16px;}
  article{grid-template-columns:minmax(0,1fr);gap:14px;}
  article.picked{padding-left:12px;}
  .ctrl-row{grid-template-columns:1fr;gap:6px;}
  .ctrl-row > p{margin:0;}
  .bar{padding-inline:16px;}
}
@media (max-width:560px){
  .days{grid-template-columns:repeat(var(--ndays,5),minmax(0,1fr));}
  .day{padding-right:6px;margin-right:6px;}
  .day b{font-size:17px;}
  .day span{font-size:11.5px;}
  .budget{flex-basis:100%;}
  .wrap{padding-block-end:220px;}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;}}