:root{
    --bg:#f6f4ef; --card:#fff; --ink:#20242b; --mute:#6b7280; --line:#e3ded4;
    --vac:#1f8f5f; --vac-bg:#e7f6ee;
    --work:#64748b; --work-bg:#eef1f5;
    --trav:#7159c9; --trav-bg:#efeaff;
    --tahoe:#0e7c9b; --tahoe-bg:#e2f4fa;
    --maybe:#c1811f; --maybe-bg:#fdf3e0;
    --accent:#c4562a;
    --shadow:0 1px 2px rgba(16,24,40,.06),0 4px 14px rgba(16,24,40,.06);
  }
  @media(prefers-color-scheme:dark){
    :root{
      --bg:#12151a; --card:#1a1f27; --ink:#e8eaee; --mute:#95a0b0; --line:#2b3240;
      --vac:#4ecf95; --vac-bg:#123125;
      --work:#93a3b8; --work-bg:#1e242e;
      --trav:#a893f5; --trav-bg:#241d3d;
      --tahoe:#4ec6e8; --tahoe-bg:#0d2c37;
      --maybe:#e6ab52; --maybe-bg:#33270f;
      --accent:#f0805a;
      --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.25);
    }
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--bg);color:var(--ink);
    font:16px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
    -webkit-text-size-adjust:100%}
  .wrap{max-width:1280px;margin:0 auto;padding:22px 16px 60px}

  /* ---------- header ---------- */
  header.top{margin-bottom:22px}
  .eyebrow{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700}
  h1{margin:.25em 0 .15em;font-size:clamp(1.7rem,5vw,2.6rem);line-height:1.1;letter-spacing:-.02em}
  .sub{margin:0 0 14px;color:var(--mute);font-size:1.02rem}
  .facts{display:flex;flex-wrap:wrap;gap:8px}
  .fact{display:inline-flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--line);
    border-radius:999px;padding:6px 13px;font-size:.87rem;box-shadow:var(--shadow)}
  .fact b{font-weight:650}

  /* ---------- legend ---------- */
  .legend{display:flex;flex-wrap:wrap;gap:14px;margin:18px 0 26px;padding:12px 15px;background:var(--card);
    border:1px solid var(--line);border-radius:12px;font-size:.85rem;box-shadow:var(--shadow)}
  .lg{display:inline-flex;align-items:center;gap:7px;color:var(--mute)}
  .sw{width:13px;height:13px;border-radius:4px;flex:none}
  .sw.v{background:var(--vac)} .sw.w{background:var(--work)} .sw.t{background:var(--trav)}
  .sw.k{background:var(--tahoe)} .sw.m{background:var(--maybe)}

  /* ---------- week ---------- */
  .week{margin-bottom:26px}
  .whead{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin:0 2px 10px;
    padding-bottom:8px;border-bottom:2px solid var(--line)}
  .wname{font-weight:700;font-size:1.05rem;letter-spacing:-.01em}
  .wrange{color:var(--mute);font-size:.9rem}
  .wcost{margin-left:auto;font-size:.82rem;color:var(--mute);background:var(--card);
    border:1px solid var(--line);border-radius:999px;padding:3px 11px}
  .wcost b{color:var(--ink)}

  .days{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:stretch}

  /* ---------- day card ---------- */
  .day{background:var(--card);border:1px solid var(--line);border-radius:13px;overflow:hidden;
    box-shadow:var(--shadow);border-top:3px solid var(--line);display:flex;flex-direction:column}
  .day.vac{border-top-color:var(--vac)}
  .day.work{border-top-color:var(--work)}
  .day.trav{border-top-color:var(--trav)}
  .day.tahoe{border-top-color:var(--tahoe);background:linear-gradient(180deg,var(--tahoe-bg) 0,var(--card) 78px)}
  .day.maybe{border-style:dashed;border-top-style:solid;border-top-color:var(--maybe)}
  .day.home{opacity:.62;background:transparent;box-shadow:none}

  .dhead{display:flex;align-items:center;gap:7px;padding:9px 11px 7px}
  .dnum{font-size:1.4rem;font-weight:750;line-height:1;letter-spacing:-.03em}
  .dow{font-size:.74rem;text-transform:uppercase;letter-spacing:.09em;color:var(--mute);font-weight:650}
  .tag{margin-left:auto;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
    padding:3px 8px;border-radius:999px;white-space:nowrap}
  .t-vac{background:var(--vac-bg);color:var(--vac)}
  .t-work{background:var(--work-bg);color:var(--work)}
  .t-trav{background:var(--trav-bg);color:var(--trav)}
  .t-maybe{background:var(--maybe-bg);color:var(--maybe)}

  /* Fixed-height strips re-crop themselves at every breakpoint (the box ratio
     tracks card width), which decapitates anyone near the top edge. Pin the
     RATIO on the container so the crop is identical at every width, and let
     one- and two-photo strips stay the same shape. */
  .dphoto{display:flex;gap:2px;background:var(--line);aspect-ratio:3/2;overflow:hidden}
  .dphoto img{width:100%;height:100%;object-fit:cover;display:block;flex:1;min-width:0}
  .dphoto img.top{object-position:50% 0}
  .dbody{padding:10px 11px 12px;flex:1;display:flex;flex-direction:column}
  .dbody h3{margin:0 0 5px;font-size:.98rem;line-height:1.25;letter-spacing:-.01em}
  .dbody p{margin:0 0 8px;font-size:.85rem;color:var(--mute);line-height:1.45}
  .dbody p b{color:var(--ink);font-weight:620}
  .chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto}
  .chip{font-size:.72rem;padding:2.5px 8px;border-radius:999px;background:var(--work-bg);color:var(--mute);
    border:1px solid transparent;white-space:nowrap}
  .chip.k{background:var(--tahoe-bg);color:var(--tahoe)}
  .chip.warn{background:var(--maybe-bg);color:var(--maybe);font-weight:600}
  .chip.joy{background:var(--vac-bg);color:var(--vac);font-weight:600}
  .chip.long{white-space:normal;line-height:1.35}
  .lede{font-size:.86rem;color:var(--mute);margin:0 0 8px}
  .day{cursor:pointer}
  .day:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  dialog#dd{border:none;border-radius:16px;padding:0;max-width:560px;width:calc(100% - 32px);
    background:var(--card);color:var(--ink);box-shadow:0 24px 60px rgba(0,0,0,.32)}
  dialog#dd::backdrop{background:rgba(12,14,18,.55);backdrop-filter:blur(2px)}
  .dd-h{padding:18px 22px 12px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--card);
    border-radius:16px 16px 0 0}
  .dd-date{font-size:.75rem;text-transform:uppercase;letter-spacing:.09em;color:var(--mute);font-weight:650}
  .dd-h h3{margin:2px 0 0;font-size:1.25rem;letter-spacing:-.01em}
  .dd-b{padding:16px 22px 22px;font-size:.93rem;line-height:1.55;max-height:70vh;overflow-y:auto}
  .dd-b p{margin:0 0 11px}
  .dd-b h4{margin:16px 0 7px;font-size:.95rem}
  .dd-b ul{margin:0 0 11px;padding-left:20px}
  .dd-b li{margin-bottom:4px}
  .dd-b .warn-p{background:var(--maybe-bg);color:var(--maybe);padding:10px 13px;border-radius:9px}
  .dd-b .warn-p b{color:inherit}
  .dd-x{position:absolute;top:14px;right:16px;border:none;background:var(--work-bg);color:var(--mute);
    width:30px;height:30px;border-radius:50%;font-size:1rem;cursor:pointer;line-height:1}
  .dd-x:hover{background:var(--line)}
  .chip a{color:inherit}
  .bella{width:1.25em;height:1.25em;vertical-align:-.3em;object-fit:contain;flex:none}
  .fact .bella{width:1.5em;height:1.5em;vertical-align:-.42em;margin-right:2px}
  .ribbon{font-size:.66rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
    background:var(--tahoe);color:#fff;padding:3px 11px;text-align:center}
  .pick{font-size:.72rem;font-weight:700;color:var(--maybe);background:var(--maybe-bg);
    padding:3px 8px;border-radius:6px;display:inline-block;margin-bottom:6px}

  /* ---------- panels ---------- */
  .panels{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px}
  .panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 20px;
    box-shadow:var(--shadow)}
  .panel h2{margin:0 0 4px;font-size:1.12rem;letter-spacing:-.01em}
  .panel .ph{color:var(--mute);font-size:.85rem;margin:0 0 14px}
  .tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table{width:100%;min-width:330px;border-collapse:collapse;font-size:.88rem}
  th,td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--line)}
  th{font-size:.73rem;text-transform:uppercase;letter-spacing:.07em;color:var(--mute);font-weight:650}
  td.n{text-align:right;font-variant-numeric:tabular-nums;font-weight:650}
  tr.tot td{border-bottom:none;border-top:2px solid var(--line);font-weight:700;padding-top:10px}
  .notes{list-style:none;margin:0;padding:0}
  .notes li{padding:9px 0;border-bottom:1px solid var(--line);font-size:.88rem;line-height:1.5;
    display:flex;gap:10px}
  .notes li:last-child{border-bottom:none}
  .notes .ic{flex:none;font-size:1.05rem;line-height:1.35}
  .notes b{font-weight:650}
  a{color:var(--accent)}
  footer{margin-top:34px;padding-top:16px;border-top:1px solid var(--line);color:var(--mute);
    font-size:.76rem;line-height:1.6}
  footer .cred{margin-top:7px;font-size:.71rem;opacity:.85}

  /* ---------- responsive ---------- */
  @media(max-width:1150px){ .days{grid-template-columns:repeat(4,1fr)} }
  @media(max-width:860px){ .days{grid-template-columns:repeat(2,1fr)} .panels{grid-template-columns:1fr} }
  @media(max-width:560px){
    .days{grid-template-columns:1fr;gap:8px}
    .day{flex-direction:row;align-items:stretch}
    .day .dhead{flex-direction:column;align-items:flex-start;gap:2px;padding:11px 0 11px 10px;
      width:70px;flex:none;justify-content:flex-start}
    .day .tag{margin-left:0;margin-top:5px;font-size:.58rem;padding:2px 6px;
      white-space:normal;line-height:1.25;letter-spacing:.03em}
    .dphoto{flex:none;width:84px;flex-direction:column;min-height:88px;aspect-ratio:auto}
    .dphoto img{height:auto;flex:1 1 0;min-height:0}
    .dbody{padding:11px}
    .ribbon{display:none}
    .day.home .dbody{padding:11px}
  }