/* Sundial Timelines · v1 preview */
:root, [data-theme="ivory"] {
  --bg: #faf6ef; --paper: #fffdf9; --ink: #2b2622; --muted: #7a6f64; --line: #e8dfd2;
  --accent: #b08a4a; --accent-ink: #fff; --soft: #f3ecdf; --key: #fbf3e2;
  --display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --radius: 14px;
}
[data-theme="garden"] {
  --bg: #f3f5ef; --paper: #fdfefb; --ink: #26302a; --muted: #69766c; --line: #dbe3d6;
  --accent: #6f8f72; --accent-ink: #fff; --soft: #e9efe4; --key: #eef4e8;
  --display: "Cormorant Garamond", Georgia, serif;
}
[data-theme="modern"] {
  --bg: #f6f6f4; --paper: #ffffff; --ink: #141414; --muted: #6b6b6b; --line: #e3e3e0;
  --accent: #141414; --accent-ink: #fff; --soft: #efefec; --key: #f4f1ea;
  --display: "Inter", system-ui, sans-serif; --radius: 6px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 15px/1.55 var(--body); }
a { color: var(--accent); }
[data-theme="modern"] a { color: var(--ink); }
h1, h2, h3 { font-family: var(--display); font-weight: 600; line-height: 1.15; margin: 0 0 .4em; }
[data-theme="modern"] h1, [data-theme="modern"] h2 { letter-spacing: -.02em; font-weight: 700; }
h1 { font-size: clamp(2rem, 6vw, 3.2rem); }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.15rem; }
.wrap { max-width: 980px; margin: 0 auto; padding: 0 18px; }
.narrow { max-width: 720px; }
.muted { color: var(--muted); }
.small { font-size: .85rem; }
.eyebrow { text-transform: uppercase; letter-spacing: .18em; font-size: .72rem; color: var(--muted); }
.center { text-align: center; }
.hidden { display: none !important; }

/* top bar */
.topbar { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.topbar .wrap { display: flex; align-items: center; gap: 12px; min-height: 56px; flex-wrap: wrap; }
.brand { font-family: var(--display); font-size: 1.35rem; font-weight: 600; color: var(--ink); text-decoration: none; display: flex; align-items: center; gap: 8px; }
.brand .sun { width: 22px; height: 22px; border-radius: 50%; background: radial-gradient(circle at 50% 60%, #e9b76a 0 45%, transparent 46%), linear-gradient(transparent 55%, var(--accent) 55% 62%, transparent 62%); }
.spacer { flex: 1; }
.badge-preview { position: fixed; right: 10px; bottom: 10px; z-index: 50; background: #2b2622; color: #fff; font: 600 11px/1 var(--body); letter-spacing: .12em; text-transform: uppercase; padding: 7px 10px; border-radius: 999px; opacity: .85; }
.sample-ribbon { background: #fff3cd; color: #6b5200; border-bottom: 1px solid #f0dd9c; text-align: center; font-size: .85rem; padding: 6px 12px; }

/* cards + forms */
.card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; margin: 16px 0; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.card > h2:first-child, .card > h3:first-child { margin-top: 0; }
.grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
label { display: block; font-size: .78rem; font-weight: 600; color: var(--muted); margin-bottom: 4px; letter-spacing: .02em; }
input, select, textarea { width: 100%; font: inherit; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; }
input:focus, select:focus, textarea:focus { outline: 2px solid color-mix(in srgb, var(--accent) 45%, transparent); border-color: var(--accent); }
input[type="checkbox"] { width: auto; margin-right: 6px; vertical-align: middle; }
textarea { min-height: 70px; resize: vertical; }
.check { display: inline-flex; align-items: center; font-size: .85rem; font-weight: 500; color: var(--ink); margin: 0 14px 0 0; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font: 600 .9rem var(--body); padding: 10px 16px; border-radius: 999px; border: 1px solid var(--accent); background: var(--accent); color: var(--accent-ink); cursor: pointer; text-decoration: none; white-space: nowrap; }
.btn.ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn.sm { padding: 6px 11px; font-size: .8rem; }
.btn.danger { background: transparent; color: #a33; border-color: #e6c3c3; }
.btn:disabled { opacity: .5; cursor: default; }
.row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.status { font-size: .8rem; color: var(--muted); }
.status.err { color: #a33; }

/* hero */
.hero { padding: 56px 0 24px; text-align: center; }
.hero p.lead { font-size: 1.1rem; color: var(--muted); max-width: 620px; margin: 0 auto 18px; }
.features { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); margin: 24px 0; }
.feature { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; }
.feature b { font-family: var(--display); font-size: 1.15rem; display: block; margin-bottom: 4px; }

/* editor: events */
.ev { border: 1px solid var(--line); border-radius: 12px; padding: 12px; margin: 10px 0; background: #fff; }
.ev.key { background: var(--key); }
.ev-grid { display: grid; gap: 8px; grid-template-columns: 150px 150px 1fr; }
.ev-grid .wide { grid-column: 1 / -1; }
.ev-grid2 { display: grid; gap: 8px; grid-template-columns: 1fr 1fr; margin-top: 8px; }
.ev-tools { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.vend { display: grid; gap: 8px; grid-template-columns: 1fr 1.2fr 1fr 1.2fr 1.2fr auto; align-items: end; border-bottom: 1px dashed var(--line); padding: 10px 0; }
.triv { display: grid; gap: 8px; grid-template-columns: 1fr 1fr auto; align-items: end; margin: 8px 0; }
.flags { background: #fff8e8; border: 1px solid #f0dfb5; border-radius: 10px; padding: 10px 14px; font-size: .88rem; }
.flags li { margin: 3px 0; }
.share-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.share-box { border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fff; }
.share-box input { font-size: .8rem; }
.qr { width: 150px; height: 150px; margin: 8px auto; }
.row > .qr { margin: 8px 0; }
.qr-pair figure .qr { margin: 0 auto 6px; }
.qr svg { width: 100%; height: 100%; display: block; }
.themes { display: flex; gap: 10px; flex-wrap: wrap; }
.theme-chip { border: 2px solid var(--line); border-radius: 12px; padding: 10px 14px; cursor: pointer; background: #fff; min-width: 140px; }
.theme-chip.on { border-color: var(--accent); }
.theme-chip .sw { display: flex; gap: 4px; margin-top: 6px; }
.theme-chip .sw i { width: 18px; height: 18px; border-radius: 50%; display: block; border: 1px solid rgba(0,0,0,.08); }
.mytl li { margin: 4px 0; }
dialog { border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; max-width: 640px; width: calc(100% - 24px); background: var(--paper); color: var(--ink); }
dialog::backdrop { background: rgba(30,25,20,.45); }

/* Day Sheet */
.sheet-head { text-align: center; padding: 36px 0 12px; }
.sheet-head .names { font-family: var(--display); font-size: clamp(2.2rem, 7vw, 3.6rem); margin: 6px 0; }
.chips { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin: 12px 0; }
.chip { background: var(--soft); border-radius: 999px; padding: 5px 12px; font-size: .85rem; }
table.tl { width: 100%; border-collapse: collapse; font-size: .92rem; }
table.tl th { text-align: left; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); border-bottom: 2px solid var(--line); padding: 8px; }
table.tl td { border-bottom: 1px solid var(--line); padding: 9px 8px; vertical-align: top; }
table.tl td.time { white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; width: 1%; }
table.tl tr.key td { background: var(--key); }
table.tl .title { font-weight: 600; }
.tag { display: inline-block; font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; background: var(--soft); color: var(--muted); border-radius: 4px; padding: 1px 6px; margin-left: 6px; vertical-align: middle; }
.qr-pair { display: flex; gap: 24px; justify-content: center; flex-wrap: wrap; }
.qr-pair figure { margin: 0; text-align: center; font-size: .8rem; color: var(--muted); }
.footer { text-align: center; color: var(--muted); font-size: .82rem; padding: 30px 0 60px; }

/* Guest page */
.g-hero { text-align: center; padding: 54px 18px 26px; background: linear-gradient(180deg, var(--soft), transparent); }
.g-hero .names { font-family: var(--display); font-size: clamp(2.6rem, 10vw, 4.4rem); line-height: 1.05; margin: 8px 0; }
.g-hero .amp { font-style: italic; color: var(--accent); }
.g-times { list-style: none; padding: 0; margin: 0; }
.g-times li { display: flex; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.g-times .t { min-width: 78px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--accent); }
[data-theme="modern"] .g-times .t { color: var(--ink); }
.g-times li.key .what { font-family: var(--display); font-size: 1.2rem; font-weight: 600; }
details.trivia { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin: 8px 0; background: #fff; }
details.trivia summary { cursor: pointer; font-weight: 600; }
details.trivia p { margin: 8px 0 0; color: var(--muted); }
.vendor-list { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.vendor-list .v { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.vendor-list .v .r { font-size: .72rem; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.prewrap { white-space: pre-wrap; }

/* QR sign */
.sign { max-width: 520px; margin: 30px auto; text-align: center; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 36px 28px; }
.sign .qr { width: 280px; height: 280px; margin: 18px auto; }

@media (max-width: 700px) {
  .ev-grid { grid-template-columns: 1fr 1fr; }
  .ev-grid .t3 { grid-column: 1 / -1; }
  .ev-grid2 { grid-template-columns: 1fr; }
  .vend { grid-template-columns: 1fr 1fr; }
  .triv { grid-template-columns: 1fr; }
  table.tl .col-notes { display: none; }
  table.tl td.time { white-space: normal; width: 84px; font-size: .85rem; }
  table.tl td, table.tl th { padding: 8px 5px; }
  .wrap { padding: 0 12px; }
  .card { padding: 14px; }
  table.tl td.notes-inline { display: block; }
}
@media (min-width: 701px) { .notes-inline { display: none; } }

@media print {
  @page { margin: 12mm; }
  body { background: #fff; font-size: 11pt; }
  .no-print, .topbar, .btn { display: none !important; }
  .badge-preview { position: static; display: inline-block; background: none; color: #777; border: 1px solid #bbb; margin: 4px; }
  .card, .share-box, .vendor-list .v, details.trivia { box-shadow: none; border-color: #ccc; break-inside: avoid; }
  table.tl tr { break-inside: avoid; }
  table.tl .col-notes { display: table-cell !important; }
  .notes-inline { display: none !important; }
  details.trivia > *:not(summary) { display: block !important; }
  .g-hero { background: none; padding-top: 10px; }
  .sign { border: none; margin: 0 auto; }
  a { color: inherit; text-decoration: none; }
}

/* ---- v2: editor tabs ---- */
.tabs { border-top: 1px solid var(--line); background: var(--paper); }
.tabs-inner { display: flex; gap: 6px; overflow-x: auto; padding-top: 8px; padding-bottom: 8px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.tabs-inner::-webkit-scrollbar { display: none; }
.tab { flex: 0 0 auto; font: 600 .86rem var(--body); color: var(--ink); background: var(--soft); border: 1px solid transparent; border-radius: 999px; padding: 9px 14px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; }
.tab.on { background: var(--accent); color: var(--accent-ink); }
.tab-n { font-size: .7rem; opacity: .7; }
.pane-nav { display: flex; justify-content: space-between; gap: 10px; margin: 8px 0 60px; }
.pane-nav .btn { min-height: 44px; }
.checklist-sum { list-style: none; padding: 0; margin: 0; }
.checklist-sum li { padding: 8px 0; border-bottom: 1px dashed var(--line); }
.trad-box { margin-top: 12px; background: var(--soft); border-radius: 10px; padding: 10px 12px; }
.trad-list { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 6px; }
.trad-list .check { background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 6px 10px; margin: 0; }
.days-box { margin: 12px 0; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: #fff; }
.days-box summary { cursor: pointer; }
.ev-day { margin-bottom: 8px; max-width: 260px; }
.vend-card { border: 1px solid var(--line); border-radius: 12px; padding: 12px; margin: 10px 0; background: #fff; }
.vend-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.vend-head .vc-logo { width: 40px; height: 40px; }
.upload { position: relative; }
.no-label > label:empty { display: none; }
.menu-edit { border-top: 1px solid var(--line); margin-top: 14px; padding-top: 12px; }
.mi-row { border: 1px solid var(--line); border-radius: 10px; padding: 10px; margin: 8px 0; background: #fff; }
.mi-grid { display: grid; gap: 8px; grid-template-columns: 1fr 1.6fr; margin-bottom: 6px; }
.mi-grid:has(.mi-count) { grid-template-columns: 1fr 1.6fr 90px; }
.diet-check { margin-right: 4px; font-size: .78rem; }
.hide-sm { }

/* ---- v2: menu, vendor cards, guest nav ---- */
.menu-sec { margin: 14px 0; }
.menu-sec h3 { font-size: 1.05rem; margin-bottom: 4px; }
.menu-items { list-style: none; padding: 0; margin: 0; }
.menu-items li { padding: 6px 0; border-bottom: 1px dotted var(--line); }
.mi-name { font-weight: 600; }
.mi-desc { display: block; color: var(--muted); font-size: .88rem; }
.diet { display: inline-block; font-size: .64rem; font-weight: 700; letter-spacing: .04em; border: 1px solid var(--accent); color: var(--accent); border-radius: 4px; padding: 0 4px; margin-left: 6px; vertical-align: middle; }
[data-theme="modern"] .diet { color: var(--ink); border-color: var(--ink); }
.count { margin-left: 8px; font-size: .8rem; background: var(--soft); border-radius: 4px; padding: 1px 6px; font-variant-numeric: tabular-nums; }
.menu-notes { background: var(--soft); border-radius: 8px; padding: 8px 10px; }
.vcards { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.vcard { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; display: flex; flex-direction: column; gap: 6px; }
.vc-top { display: flex; gap: 12px; align-items: center; }
.vc-logo { width: 56px; height: 56px; border-radius: 12px; object-fit: cover; background: var(--soft); flex: 0 0 auto; border: 1px solid var(--line); }
.vc-initials { display: flex; align-items: center; justify-content: center; font-family: var(--display); font-weight: 600; font-size: 1.2rem; color: var(--accent); }
.vc-role { font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.vc-name { font-weight: 600; font-size: 1.02rem; line-height: 1.25; }
.vc-blurb { margin: 0; font-size: .9rem; color: var(--muted); }
.vc-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; padding-top: 4px; }
.vc-actions .btn { min-height: 38px; }
.g-nav { position: sticky; top: 0; z-index: 10; display: flex; gap: 6px; overflow-x: auto; padding: 8px 12px; background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(6px); border-bottom: 1px solid var(--line); justify-content: center; }
.g-nav a { flex: 0 0 auto; text-decoration: none; color: var(--ink); background: var(--soft); border-radius: 999px; padding: 7px 13px; font-size: .85rem; font-weight: 600; }
.day-h { font-size: 1.15rem; margin: 18px 0 4px; color: var(--accent); }
[data-theme="modern"] .day-h { color: var(--ink); }
.story { font-size: 1.02rem; }
.game { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.game-card summary { min-height: 30px; }
.game-a { font-family: var(--display); font-size: 1.25rem; color: var(--accent) !important; }
details.trivia summary { padding: 4px 0; }
[id] { scroll-margin-top: 60px; }

@media (max-width: 700px) {
  .hide-sm { display: none; }
  .topbar .wrap { min-height: 50px; gap: 8px; }
  .topbar .status { order: 10; width: 100%; margin-top: -6px; }
  .mi-grid, .mi-grid:has(.mi-count) { grid-template-columns: 1fr; }
  .g-nav { justify-content: flex-start; }
  .vcards { grid-template-columns: 1fr; }
  input, select, textarea { font-size: 16px; } /* stops iOS zoom on focus */
  .btn.sm { padding: 8px 12px; }
}
@media print {
  .g-nav, .tabs, .pane-nav { display: none !important; }
  .vc-actions { display: none; }
}

/* ---- couple quiz ---- */
.quiz-edit { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.qe { border: 1px solid var(--line); border-radius: 10px; padding: 10px; background: #fff; display: grid; gap: 6px; }
.triv3 { grid-template-columns: 1fr 1fr 1fr auto; }
.quiz-sub { margin: 20px 0 6px; }
.qz { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px 8px; margin: 10px 0; background: #fff; }
.qz legend { font-weight: 600; padding: 0 4px; }
.qz-opt { display: flex; align-items: center; gap: 10px; font-size: .98rem; font-weight: 500; color: var(--ink); border: 1px solid var(--line); border-radius: 10px; padding: 11px 12px; margin: 6px 0; cursor: pointer; min-height: 46px; letter-spacing: 0; }
.qz-opt input { width: 20px; height: 20px; margin: 0; accent-color: var(--accent); flex: 0 0 auto; }
.qz-opt:has(input:checked) { border-color: var(--accent); background: var(--key); }
.graded .qz-opt { cursor: default; }
.graded .qz-opt.is-answer { border-color: #3c8d5a; background: #eaf6ee; }
.graded .qz-opt.is-picked:not(.is-answer) { border-color: #b84a4a; background: #fbecec; }
.qz.right { border-color: #9fd0b0; }
.qz.wrong { border-color: #e3b0b0; }
.qz-result { margin: 6px 2px; font-weight: 600; font-size: .9rem; }
.qz.right .qz-result { color: #2f7a4b; }
.qz.wrong .qz-result { color: #a33; }
.quiz-bar { position: sticky; bottom: 8px; display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--paper); border: 1px solid var(--line); border-radius: 999px; padding: 6px 6px 6px 16px; box-shadow: 0 4px 14px rgba(0,0,0,.08); margin-top: 12px; }
.quiz-bar .btn { min-height: 44px; }
.err { color: #a33 !important; }
.quiz-score { text-align: center; background: var(--soft); border-radius: 12px; padding: 16px; margin-top: 12px; }
.score-n { font-family: var(--display); font-size: 2.4rem; font-weight: 600; color: var(--accent); }
@media (max-width: 700px) { .triv3 { grid-template-columns: 1fr; } }
@media print { .quiz-bar { position: static; box-shadow: none; } }

@media (max-width: 700px) {
  body.editor .topbar { position: relative; }
  .tabs-inner { gap: 6px; }
  .tab { padding: 8px 12px; min-height: 40px; }
  .vend-head .btn { padding: 6px 10px; }
}

/* ---- vendor views + photo checklist ---- */
.vtags { margin-top: 4px; display: flex; flex-wrap: wrap; gap: 4px; }
.vtag { font-size: .66rem; background: var(--soft); color: var(--muted); border-radius: 4px; padding: 1px 6px; }
.vtag.on { background: var(--accent); color: var(--accent-ink); }
table.tl tr.mine td { background: color-mix(in srgb, var(--accent) 12%, #fff); }
.me-card { border-left: 4px solid var(--accent); }
.filter-bar { padding: 12px 16px; }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.seg-b { font: 600 .86rem var(--body); background: #fff; color: var(--ink); border: 0; padding: 10px 14px; cursor: pointer; min-height: 42px; }
.seg-b.on { background: var(--accent); color: var(--accent-ink); }
.ph-head { display: grid; gap: 4px; font-size: .92rem; }
.sync-reminder { margin-top: 8px; font-weight: 800; letter-spacing: .14em; text-align: center; border: 2px dashed var(--accent); border-radius: 10px; padding: 8px; color: var(--accent); }
.ph-progress { position: sticky; top: 0; z-index: 5; padding: 10px 14px; }
.bar { height: 8px; background: var(--soft); border-radius: 99px; overflow: hidden; margin: 8px 0 4px; }
.bar i { display: block; height: 100%; background: var(--accent); transition: width .2s; }
.ph-block { padding: 12px 14px; }
.ph-block.complete { opacity: .7; }
.ph-bh { display: flex; gap: 10px; align-items: baseline; border-bottom: 1px solid var(--line); padding-bottom: 6px; margin-bottom: 4px; }
.ph-time { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--accent); white-space: nowrap; }
[data-theme="modern"] .ph-time { color: var(--ink); }
.ph-title { font-weight: 600; flex: 1; }
.ph-count { font-size: .8rem; color: var(--muted); }
.ph-group { font-weight: 800; margin: 10px 0 2px; }
.ph-sub { font-style: italic; color: var(--muted); margin: 8px 0 2px; }
.ph-item { display: flex; align-items: center; gap: 12px; padding: 10px 4px; min-height: 48px; border-bottom: 1px dotted var(--line); font-size: 1rem; font-weight: 500; color: var(--ink); letter-spacing: 0; cursor: pointer; margin: 0; }
.ph-item input { width: 26px; height: 26px; flex: 0 0 auto; accent-color: var(--accent); margin: 0; }
.ph-item.done span { text-decoration: line-through; color: var(--muted); }
.ev-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.ev-tags .check { background: var(--soft); border-radius: 999px; padding: 4px 10px; margin: 0; font-size: .78rem; }
.vlink { margin-top: 10px; background: var(--soft); border-radius: 10px; padding: 10px; }
.vlink .qr { width: 110px; height: 110px; }
.blk { border: 1px solid var(--line); border-radius: 10px; padding: 10px; margin: 8px 0; background: #fff; }
.blk-grid { display: grid; gap: 8px; grid-template-columns: 120px 1fr 1.5fr; }
.fam { display: grid; gap: 8px; grid-template-columns: 1.2fr 2fr 140px auto; align-items: end; margin: 6px 0; }
@media (max-width: 700px) { .blk-grid, .fam { grid-template-columns: 1fr; } }
@media print { .ph-item input { width: 14px; height: 14px; } .ph-item { min-height: 0; padding: 3px 0; } .ph-progress { display: none; } }
.ph-tag{display:inline-block;font-style:normal;font-size:.72rem;font-weight:600;padding:1px 7px;margin-left:4px;border-radius:99px;background:var(--line,#e8e1d6);color:var(--muted,#6b645a);vertical-align:1px}
.ph-tag.me{background:var(--accent,#b8955a);color:#fff}
.it-tags{margin-top:8px;border-top:1px dashed var(--line,#e8e1d6);padding-top:6px}
.it-tags summary{cursor:pointer;font-size:.88rem;font-weight:600;padding:6px 0}
.it-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:6px 0;border-bottom:1px solid var(--line,#efe9df)}
.it-row .it-t{flex:1 1 100%;font-size:.9rem}
.it-row .check{font-size:.82rem;min-height:32px}
.it-row.hdr .it-t{font-weight:700}
.qz-auto{font-size:.8rem;margin-top:4px}
/* admin */
.admin-login{max-width:420px;margin:60px auto}
.admin-top{gap:8px;margin:24px 0 14px;flex-wrap:wrap}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.stat b{display:block;font-size:1.9rem;line-height:1.1}.stat span{color:var(--muted);font-size:.85rem}
.admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin:14px 0}
.admin-grid .card{margin:0}
.chart{width:100%;height:130px;display:block}.chart rect{fill:var(--accent)}
.chart-axis{display:flex;justify-content:space-between;font-size:.75rem;color:var(--muted)}
.hbar{display:grid;grid-template-columns:110px 1fr 36px;align-items:center;gap:8px;font-size:.88rem;margin:5px 0}
.hbar i{display:block;height:10px;background:var(--accent);border-radius:5px;min-width:3px}.hbar b{text-align:right}
table.mini{width:100%;border-collapse:collapse}table.mini td{padding:5px 0;border-bottom:1px solid var(--line)}table.mini td:last-child{text-align:right;font-weight:600}
.tscroll{overflow-x:auto}.admin-table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:760px}
.admin-table th{text-align:left;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:6px 8px;border-bottom:1px solid var(--line)}
.admin-table td{padding:8px;border-bottom:1px solid var(--line);vertical-align:top}
.pill{display:inline-block;font-size:.7rem;font-weight:600;padding:1px 8px;border-radius:99px;background:var(--soft);border:1px solid var(--line);color:var(--muted)}
.nowrap{white-space:nowrap}
.intake-more{margin-top:14px}.intake-more summary{cursor:pointer;font-weight:600;font-size:.9rem;padding:6px 0}
/* recommended vendors */
.recs .rec-intro{margin:0 0 10px}
.rec-cat{margin:14px 0 6px;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.rec-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.rec{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--paper)}
.rec b{display:block}.rec .stars{font-weight:600}.rec .src{font-size:.75rem;color:var(--muted)}
.rec .row{margin-top:6px;gap:6px}
.team-block{margin-top:16px;border:1px dashed var(--accent);border-radius:12px;padding:12px;background:var(--soft)}
.team-block .pill{margin-left:6px}
.dir-cat{border-top:1px solid var(--line);padding:8px 0}.dir-cat summary{cursor:pointer;padding:4px 0}
.dir-table{min-width:820px}.dir-table tr.ok td{background:var(--key)}.dir-table input.ord{width:64px;padding:4px 6px}
.vform{border:1px solid var(--line);border-radius:12px;padding:12px;margin:10px 0;background:var(--soft)}
.saved{color:#2c7a3f}
.strip{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 8px;scroll-snap-type:x mandatory}
.strip .rec{flex:0 0 230px;scroll-snap-align:start}
.vs-bar{display:grid;grid-template-columns:1fr 170px;gap:8px}
@media (max-width:520px){.vs-bar{grid-template-columns:1fr}}
.vs-own{margin-top:14px;border-top:1px dashed var(--line);padding-top:8px}.vs-own summary{cursor:pointer;font-weight:600;padding:8px 0;min-height:44px}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.plan .price{font:600 1.6rem var(--display);margin:2px 0 6px}.plan ul{padding-left:18px;margin:8px 0 16px}.plan li{margin:4px 0}
.plan.soon{opacity:.75}.pay-note{background:var(--key);border-color:var(--accent)}
/* Day Sheet: sticky now/next bar, big tap targets */
.nn-bar{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);padding:8px 14px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.nn-who{font:600 1rem var(--display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nn-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:.92rem;margin-top:2px}
.nn-now,.nn-next{min-width:0}.nn-now b,.nn-next b{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin-right:4px}
.pill.live{background:#e7f5ea;color:#1f7a3a;border-color:#bfe3c8}
.nn-prev{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;margin:0;color:var(--muted)}.nn-prev input{padding:6px 8px;min-height:40px;width:auto}
table.tl tr.is-now td{background:color-mix(in srgb,var(--accent) 20%,#fff)!important}
table.tl tr.is-now td:first-child{box-shadow:inset 4px 0 0 var(--accent)}
table.tl tr.is-next td{background:color-mix(in srgb,var(--accent) 8%,#fff)}
.nn-tag{display:block;width:max-content;margin-top:4px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:var(--accent);color:var(--accent-ink);padding:2px 7px;border-radius:99px}
.nn-tag.next{background:transparent;color:var(--accent);border:1px solid var(--accent)}
@media (max-width:700px){
  .nn-row{font-size:.88rem}.nn-now,.nn-next{flex:1 1 100%}
  table.tl td{padding:12px 6px}table.tl tr{min-height:56px}
  .btn{min-height:44px}.btn.sm{min-height:40px;padding:8px 13px}
  .seg-b{min-height:44px}#vf{min-height:44px}
}
@media print{.nn-bar{display:none}}
/* QR signs (v7.4: centered on screen, in print preview, letter + 5x7 card stock) */
.sign-tools{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:16px}
.sheet-page{position:relative;margin:0 auto 30px;background:var(--paper);box-shadow:0 2px 18px rgba(0,0,0,.08);display:flex;align-items:center;justify-content:center;box-sizing:border-box}
.sheet-page.card{width:min(100%,8.5in);aspect-ratio:8.5/11;background:#fff}
.sheet-page.poster{width:min(100%,8.5in);aspect-ratio:8.5/11;padding:min(4%,.4in)}
.sheet-page.stock{width:min(100%,5in);aspect-ratio:5/7;background:#fff}
.sign-wrap{position:relative;box-sizing:border-box;display:flex}
.sign-wrap.card{width:min(88%,5in);aspect-ratio:5/7}
.sheet-page.stock .sign-wrap.card{width:100%;height:100%;aspect-ratio:auto}
.sign-wrap.poster{width:100%;height:100%}
.sign2{box-sizing:border-box;width:100%;text-align:center;color:var(--ink);background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center}
.sign2.card{border:1px solid var(--line);border-radius:var(--radius);padding:6% 7%}
.sheet-page.stock .sign2.card{border:none;border-radius:0}
.sign2.poster{border:2px solid var(--accent);border-radius:calc(var(--radius) * 1.5);padding:7%}
.sign2 > *{max-width:100%}
.sign2 .names{font-family:var(--display);font-weight:600;line-height:1.05;font-size:clamp(1.6rem,6vw,2.6rem)}
.sign2.poster .names{font-size:clamp(2rem,8vw,4rem)}
.sign2 .s-date{color:var(--muted);margin-top:4px}
.sign2 .qr{width:min(62%,2.6in);height:auto;aspect-ratio:1;margin:6% auto 4%;align-self:center;flex:none}.sign2.poster .qr{width:min(58%,4.4in)}
.sign2 .qr svg{width:100%;height:100%;display:block;margin:0 auto}
.sign2 h2{font-size:clamp(1.05rem,3.6vw,1.5rem);margin:0}.sign2.poster h2{font-size:clamp(1.3rem,5vw,2.3rem)}
.sign2 .s-sub{color:var(--muted);font-size:.9rem;max-width:34ch;margin:8px auto 0}.sign2 .s-tag{font-weight:600;margin:8px 0 0}
.sign2 .s-url{font-size:.68rem;color:var(--muted);margin-top:auto;padding-top:10px;word-break:break-all}
/* cut marks hug the card itself, so they stay centered whatever the page size */
.cut{position:absolute;width:18px;height:18px;border-color:#bbb;border-style:solid;border-width:0}
.cut.tl{left:-24px;top:-24px;border-right-width:1px;border-bottom-width:1px}
.cut.tr{right:-24px;top:-24px;border-left-width:1px;border-bottom-width:1px}
.cut.bl{left:-24px;bottom:-24px;border-right-width:1px;border-top-width:1px}
.cut.br{right:-24px;bottom:-24px;border-left-width:1px;border-top-width:1px}
@media screen and (max-width:700px){.cut{display:none}}
@media print{
  html,body{background:#fff;margin:0!important;padding:0!important}
  .badge-preview,.sample-ribbon{display:none!important}
  /* Fill whatever printable area the browser/printer leaves, and center inside it (no fixed 8.5in width that
     overflows when a printer adds its own margins). */
  .sheet-page{box-shadow:none;margin:0 auto;width:100%;height:100vh;max-height:11in;aspect-ratio:auto;overflow:hidden;break-inside:avoid;page-break-after:avoid}
  .sheet-page.poster{max-height:10in;padding:0}
  .sheet-page.stock{max-height:7in}
  .sign-wrap.card{width:5in;height:7in;max-width:calc(100% - 0.6in);max-height:calc(100vh - 0.6in);aspect-ratio:auto}
  .sheet-page.stock .sign-wrap.card{width:100%;height:100%;max-width:none;max-height:none}
  .sign2,.sheet-page{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
/* Brand: official Sundial logo (black on light styles, white on dark surfaces) */
.logo{display:block;height:auto}.logo-w{display:none}
[data-tone="dark"] .logo-b{display:none}[data-tone="dark"] .logo-w{display:block}
.brand .logo{height:40px;width:auto}
.hero-logo{display:block;width:min(300px,70vw);height:auto;margin:0 auto 10px}
.page-logo{display:block;width:150px;margin:6px auto 8px}.page-logo .logo{width:100%}
.admin-logo{display:block;width:84px}.admin-logo .logo{width:100%}
.foot-logo{display:block;width:96px;margin:0 auto 8px;opacity:.85}.foot-logo .logo{width:100%}
.s-logo{width:84px;margin:auto auto 0;padding-top:12px;opacity:.9}.sign2.poster .s-logo{width:130px}.s-logo .logo{width:100%}
.s-logo + .s-url{margin-top:4px;padding-top:0}
/* Standout badge for curated (approved) vendors only */
.rec.std{position:relative;border-color:#d8bd7c;box-shadow:inset 0 0 0 1px rgba(191,149,63,.35)}
.standout{display:inline-flex;align-items:center;gap:6px;margin-bottom:4px}
.standout img{width:34px;height:28px;flex:none}
.so-pill{font-size:.62rem;font-weight:700;line-height:1;text-transform:uppercase;letter-spacing:.1em;color:#7a5a17;background:linear-gradient(135deg,#fbf1d6,#f1dfae);border:1px solid #d8bd7c;padding:4px 8px;border-radius:99px}
.rec.std > b{display:block}
@media print{.rec.std{box-shadow:none}}
/* Header logo: horizontal lockup (mark + wordmark) readable on phones; mark only on very narrow screens */
.brand .lockup{display:block;height:46px;width:auto}
.brand .brand-mark{display:none;height:40px;width:auto}
[data-tone="dark"] .brand .lockup.logo-b,[data-tone="dark"] .brand .brand-mark.logo-b{display:none!important}
.brand .lockup.logo-w,.brand .brand-mark.logo-w{display:none}
[data-tone="dark"] .brand .lockup.logo-w{display:block}
@media (max-width:359px){.brand .lockup{display:none!important}.brand .brand-mark.logo-b{display:block}[data-tone="dark"] .brand .brand-mark.logo-w{display:block}}
@media (max-width:420px){.brand .lockup{height:40px}}
/* Check-ins */
.toasts{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:60;display:flex;flex-direction:column;gap:8px;width:min(92vw,420px)}
.toast{background:var(--ink);color:var(--paper);padding:12px 16px;border-radius:12px;box-shadow:0 6px 20px rgba(0,0,0,.2);font-size:.95rem;transition:opacity .5s,transform .5s}
.toast.out{opacity:0;transform:translateY(8px)}
.ci-list{list-style:none;padding:0;margin:8px 0 0}.ci-list li{padding:10px 0;border-top:1px solid var(--line)}.ci-list li.new{background:color-mix(in srgb,var(--accent) 10%,transparent);border-radius:8px;padding:10px 8px}
.tab .badge,.ci-badge{display:inline-block;min-width:18px;padding:1px 6px;margin-left:6px;border-radius:99px;background:#c0392b;color:#fff;font-size:.7rem;font-weight:700;line-height:16px;text-align:center}
.ci-panel{border-color:var(--accent)}
/* Thank-yous (couple-only) */
.ty-row{display:grid;grid-template-columns:1fr 110px auto;gap:8px 12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.ty-row .ty-guide{grid-column:1/-1;font-size:.82rem;color:var(--muted)}
.ty-row input[type=number]{width:100%}
@media (max-width:520px){.ty-row{grid-template-columns:1fr 96px}.ty-row .check{grid-column:1/-1}}
.private-note{border:1px dashed var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--paper))}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.lead-sm{font-size:1.02rem;margin:4px 0 6px}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat{text-align:center;margin:0;padding:14px 8px}.stat .n{font:600 2rem/1.1 var(--display)}
.bars{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;height:130px;align-items:end}
.mbar{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;background:none;border:0;padding:0}.mbar span{display:block;width:100%;min-height:2px;background:var(--accent);border-radius:4px 4px 0 0}
.mbar b{font-size:.7rem}.mbar i{font-style:normal;font-size:.7rem;color:var(--muted);margin-top:4px}
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 14px}.rank{padding-left:20px;margin:6px 0}.rank li{margin:4px 0}
table.tl tr.private-row td{background:color-mix(in srgb,var(--accent) 7%,var(--paper));border-top:1px dashed var(--accent);border-bottom:1px dashed var(--accent)}
/* Rules-placed events: a draft/assumption until the couple or planner edits them. */
.tag.draft-tag { background: transparent; border: 1px dashed currentColor; color: var(--muted); }
/* Timeline Check */
.pill { display: inline-block; border-radius: 99px; padding: 2px 10px; font-size: .78rem; font-weight: 600; }
.pill.sev-red { background: #fde8e6; color: #9b2c22; border: 1px solid #f3c2bc; }
.pill.sev-amber { background: #fff4dc; color: #8a5a00; border: 1px solid #f0dcaa; }
.flag-list { list-style: none; padding: 0; margin: 12px 0; display: grid; gap: 10px; }
.flag { border: 1px solid var(--line); border-left-width: 4px; border-radius: 10px; padding: 10px 12px; background: #fff; }
.flag.sev-red { border-left-color: #c0392b; }
.flag.sev-amber { border-left-color: #d9a01e; }
.flag p { margin: 6px 0; }
.flag-head { display: flex; gap: 6px; align-items: center; }
.ok-msg { background: #eef8f0; border: 1px solid #cfe9d5; border-radius: 10px; padding: 10px 14px; }
.doc-todo { font-size: .82rem; color: #5b4a2f; background: #fbf6ec; border-radius: 6px; padding: 4px 8px; margin-top: 4px; }
input.dur { width: 64px; padding: 4px 6px; }
.admin-table tr.changed td { background: #fff8e8; }

/* v7: Vendor details + coverage */
.cov-box { margin-top: 10px; padding: 10px 12px; border: 1px dashed var(--line, #ddd); border-radius: 10px; background: rgba(0,0,0,.015); }
.cov-box .row { gap: 8px; align-items: baseline; }
.cov-grid { margin-top: 6px; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
.vd-more { margin-top: 10px; }
.tl-scroll { overflow-x: auto; margin: 8px 0 14px; }
.vd-sum td, .vd-sum th { font-size: .9rem; }

/* v7.2 category badges (auto-assigned, replace vendor logos). Ink + subtle gold so the gold Standout mark still pops. */
.cat-badge { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; flex: 0 0 auto; min-width: 56px; }
.cat-badge-svg { display: block; flex: none; }
.cb-label { font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 600; white-space: nowrap; }
.vend-head .cat-badge { min-width: 0; } .vend-head .cb-label { display: none; }
.cov-who { display: inline-flex; align-items: center; gap: 8px; }
.rec-name { display: inline-flex; align-items: center; gap: 6px; }
.s-badge { display: flex; justify-content: center; margin: 0 auto 6px; }
@media print { .cat-badge-svg circle[fill="#FBF8F1"] { fill: #fff; } }

/* v7.2 homepage style carousel */
.styles { margin: 28px 0 8px; text-align: center; }
.styles h2 { margin: 0 0 4px; font-size: clamp(1.5rem, 4vw, 2.1rem); }
.styles > p { margin: 0 auto 10px; max-width: 34rem; }
.sc-viewport { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; padding: 18px 0 22px; margin: 0 calc(50% - 50vw); padding-inline: 6vw;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); outline: none; }
.sc-viewport::-webkit-scrollbar { display: none; }
.sc-viewport:focus-visible { box-shadow: inset 0 0 0 2px var(--accent); }
.sc-track { display: flex; gap: 14px; width: max-content; }
.sc-card { --p: 0; all: unset; box-sizing: border-box; cursor: pointer; width: 216px; flex: 0 0 auto; transform: scale(calc(.9 + .1 * var(--p))); opacity: calc(.55 + .45 * var(--p)); transition: transform .25s ease-out, opacity .25s; }
.sc-in { display: flex; flex-direction: column; gap: 10px; text-align: left; background: var(--paper, #fff); border: 1px solid var(--line); border-radius: 16px; padding: 14px 14px 12px;
  box-shadow: 0 calc(2px + 10px * var(--p)) calc(8px + 18px * var(--p)) rgba(38, 39, 46, calc(.05 + .08 * var(--p))); animation: scBob 5.2s ease-in-out infinite; animation-delay: var(--d); }
.sc-card:focus-visible .sc-in, .sc-card.on .sc-in { border-color: var(--accent); }
@keyframes scBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.sc-top { display: flex; align-items: center; gap: 8px; }
.sc-name { font-family: var(--display); font-weight: 600; font-size: 1.05rem; line-height: 1.15; }
.sc-line { position: relative; height: 10px; margin: 0 2px; }
.sc-line i { position: absolute; left: 4%; right: 4%; top: 4px; height: 2px; background: linear-gradient(90deg, #26272E, #B48A35); border-radius: 2px; opacity: .55; }
.sc-line b { position: absolute; top: 1px; width: 8px; height: 8px; margin-left: -4px; border-radius: 50%; background: #fff; border: 2px solid #B48A35; box-sizing: border-box; }
.sc-times { display: grid; gap: 3px; font-size: .8rem; color: var(--muted); }
.sc-times em, .sc-pv-list em { font-style: normal; font-weight: 600; color: var(--ink, #26272E); display: inline-block; min-width: 4.2em; font-variant-numeric: tabular-nums; }
.sc-preview { max-width: 30rem; margin: 0 auto 8px; text-align: left; background: var(--paper, #fff); border: 1px solid var(--line); border-radius: 16px; padding: 14px 16px; animation: scIn .25s ease-out; }
@keyframes scIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.sc-pv { display: flex; align-items: center; gap: 10px; } .sc-pv > div { flex: 1; }
.sc-pv-list { list-style: none; padding: 0; margin: 10px 0; display: grid; gap: 4px; }
.sc-still .sc-viewport { scroll-snap-type: x mandatory; -webkit-mask-image: none; mask-image: none; }
.sc-still .sc-card { scroll-snap-align: center; transform: none; opacity: 1; transition: none; }
.sc-still .sc-in, .sc-still .sc-preview { animation: none; }
@media (prefers-reduced-motion: reduce) { .sc-in, .sc-preview { animation: none; } .sc-card { transition: none; } }
@media (max-width: 560px) { .sc-card { width: 190px; } .sc-viewport { padding-inline: 4vw; } }

/* v7.3 vendor-scoped items */
.tag.scope-tag { background: #eef2ff; color: #3b4a8a; text-transform: none; letter-spacing: 0; font-weight: 600; }
.vnote { margin-top: 4px; padding: 4px 6px; border-left: 2px solid #c7d0f5; background: #f7f8ff; border-radius: 3px; }
.vnote .scope-tag { margin-left: 0; }
.client-note { margin: 8px 0; padding: 8px 10px; background: var(--soft); border-radius: 6px; font-size: .92rem; }
.vendor-only h2 .tag { font-size: .7rem; }
.vchecks li, .vtips li { margin: 6px 0; }
.sens { color: #8a4b00; }
.card.private { border: 1px dashed #c9a0a0; }
.flag .scope-tag { margin-left: 0; margin-right: 6px; }
.audit-line { font-weight: 600; margin: 4px 0 2px; }
.master-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;border-left:4px solid var(--accent)}

/* v7.4: pages feel like pages: step header, Back, progress, quick/detailed switch, page fade-in */
.page-step { margin: 8px 0 4px; }
.page-step-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.page-title { font-family: var(--display); font-size: 2rem; line-height: 1.15; margin: 6px 0 4px; }
.step-bar { height: 4px; background: var(--line); border-radius: 4px; margin: 10px 0 2px; overflow: hidden; }
.step-bar i { display: block; height: 100%; background: var(--accent); border-radius: 4px; }
.stepper { list-style: none; display: flex; gap: 6px; padding: 0; margin: 14px 0 6px; }
.stepper li { flex: 1; display: flex; align-items: center; gap: 8px; font-size: .8rem; color: var(--muted); border-top: 3px solid var(--line); padding-top: 8px; }
.stepper li span { width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-items: center; font-weight: 700; font-size: .75rem; background: var(--soft); color: var(--muted); flex: none; }
.stepper li.on { color: var(--ink); font-weight: 600; border-color: var(--accent); }
.stepper li.on span, .stepper li.done span { background: var(--accent); color: var(--accent-ink); }
.stepper li.done { border-color: color-mix(in srgb, var(--accent) 50%, var(--line)); }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; padding: 2px; background: var(--paper); }
.seg-b { padding: 5px 12px; border-radius: 999px; text-decoration: none; color: var(--muted); font-weight: 600; }
.seg-b.on { background: var(--accent); color: var(--accent-ink) !important; }
.choice { border: 0; padding: 0; margin: 0; }
.choice legend { font-weight: 600; margin-bottom: 8px; }
.choice-opt { display: flex; gap: 10px; align-items: center; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; margin: 8px 0; cursor: pointer; background: #fff; }
.choice-opt input { width: auto; margin: 0; }
.choice-opt:has(input:checked) { border-color: var(--accent); background: var(--key); }
.page-enter { animation: pageIn .22s ease-out; }
@keyframes pageIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .page-enter { animation: none; } }
@media print { .page-step { display: none; } }
@media (max-width: 560px) { .stepper li { font-size: 0; gap: 0; justify-content: center; } .page-title { font-size: 1.6rem; } }

/* v7.5: drag-and-drop rearrange (owner views only) */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rr-box { border: 1px solid var(--line); border-radius: 12px; background: var(--paper); padding: 12px 14px; margin: 14px 0; }
.rr-head { margin-bottom: 8px; }
.rr-list { list-style: none; margin: 0; padding: 0; }
.rr-row { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-bottom: 1px solid var(--line); background: var(--paper); }
.rr-row.key .rr-title { font-weight: 600; }
.rr-time { flex: none; width: 150px; font-variant-numeric: tabular-nums; color: var(--muted); font-size: .85rem; }
.rr-title { flex: 1; min-width: 0; }
.rr-ctl { display: inline-flex; align-items: center; gap: 2px; margin-right: 6px; vertical-align: middle; }
.rr-row .rr-ctl { margin: 0 0 0 auto; order: 3; }
.rr-handle { touch-action: none; cursor: grab; border: 1px solid var(--line); background: #fff; border-radius: 8px; width: 34px; height: 34px; display: inline-grid; place-items: center; color: var(--muted); padding: 0; }
.rr-handle:active { cursor: grabbing; }
.rr-handle:focus-visible, .rr-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.rr-btn { border: 1px solid var(--line); background: #fff; border-radius: 8px; width: 30px; height: 34px; font-size: .9rem; color: var(--ink); cursor: pointer; padding: 0; }
.rr-lock, .rr-pin { display: inline-grid; place-items: center; width: 30px; height: 34px; color: var(--accent); }
.rr-lock { color: var(--muted); }
.rr-dragging { position: relative; z-index: 30; box-shadow: 0 10px 28px rgba(0,0,0,.18); background: var(--key) !important; opacity: .96; }
.rr-drop-before { box-shadow: inset 0 3px 0 var(--accent); }
.rr-drop-after { box-shadow: inset 0 -3px 0 var(--accent); }
body.rr-active { user-select: none; -webkit-user-select: none; }
td.time .rr-ctl { display: flex; margin: 0 0 4px; }
.rr-bar { position: fixed; left: 50%; bottom: 84px; transform: translateX(-50%); z-index: 60; display: flex; align-items: center; gap: 10px; max-width: min(720px, calc(100vw - 24px)); background: var(--ink); color: #fff; padding: 10px 12px 10px 16px; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,.25); font-size: .88rem; }
.rr-bar[hidden] { display: none; }
.rr-bar .btn { background: #fff; color: var(--ink); border-color: #fff; }
.rr-x { background: none; border: 0; color: #fff; font-size: 1.2rem; cursor: pointer; padding: 0 4px; }
@media (max-width: 560px) { .rr-time { width: 92px; font-size: .78rem; } .rr-btn { width: 28px; } }
@media print { .rr-ctl, .rr-bar, .rr-box { display: none !important; } }

/* v7.5.1 brand lockup: logo with "Timelines" underneath; byline only in the footer */
.topbar .brand{flex-direction:column;align-items:flex-start;gap:1px;padding:6px 0 5px;line-height:1}
.topbar .brand .lockup{height:34px}
.topbar .brand .brand-mark{height:32px}
.brand-sub{font-family:var(--body,inherit);font-size:.62rem;font-weight:600;letter-spacing:.42em;text-transform:uppercase;color:var(--muted);padding-left:calc(34px * 1.4);}
@media (max-width:420px){.topbar .brand .lockup{height:30px}.brand-sub{padding-left:calc(30px * 1.4);font-size:.58rem;letter-spacing:.36em}}
@media (max-width:359px){.brand-sub{padding-left:0}}
.logo-sub{display:block;text-align:center;font-size:.66rem;font-weight:600;letter-spacing:.42em;text-transform:uppercase;color:var(--muted);margin-top:4px;padding-left:.42em}
.admin-logo .logo-sub{font-size:.52rem;letter-spacing:.3em}
.byline{font-size:.72rem;color:var(--muted);letter-spacing:.04em;margin-top:6px;opacity:.85}
.byline-foot{text-align:center;padding:24px 0 40px}
@media print{.byline-foot{display:none}}
.top-link{color:var(--ink);text-decoration:none;font-size:.9rem;padding:6px 8px}
.top-link:hover{text-decoration:underline}
@media (max-width:480px){.hide-xs{display:none}}
/* v7.5.1 homepage */
.home .hero{padding:64px 0 18px}
.hero-title{font-size:clamp(2.4rem,7vw,3.8rem);margin:0;line-height:1.05}
.hero-tag{font-family:var(--display);font-style:italic;font-size:clamp(1.15rem,3.2vw,1.5rem);color:var(--accent);margin:8px 0 16px}
.home .hero p.lead{max-width:36rem;font-size:1.05rem;line-height:1.6}
.choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:760px;margin:8px auto 34px}
.choice{position:relative;display:block;text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:16px 40px 16px 18px;transition:border-color .15s,transform .15s,box-shadow .15s}
.choice b{display:block;font-family:var(--display);font-size:1.18rem;margin-bottom:3px}
.choice span{display:block;color:var(--muted);font-size:.9rem;line-height:1.45}
.choice i{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-style:normal;color:var(--accent);font-size:1.15rem}
.choice:hover,.choice:focus-visible{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.06)}
.choice.primary{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
@media (max-width:640px){.choices{grid-template-columns:1fr}.home .hero{padding:40px 0 12px}}
.how{margin:34px 0 8px;text-align:center}
.how h2{font-size:clamp(1.5rem,4vw,2.1rem);margin:0 0 12px}
.how ol.features{list-style:none;padding:0;text-align:left}
.page-logo,.admin-logo,.brand{text-decoration:none}
.page-logo .logo-sub,.admin-logo .logo-sub{color:var(--muted)}
@media (max-width:640px){.home .hero p.lead{font-size:.98rem;line-height:1.55}.hero-tag{margin-bottom:12px}.choice{padding:13px 38px 13px 15px}.choice b{font-size:1.1rem}.choice span{font-size:.86rem}.choices{gap:10px;margin-bottom:26px}}

/* ---- v7.6 Day Sheet styles + checks ---- */
.sheet-ctl{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.sheet-ctl .ck-sum{display:flex;align-items:center;gap:8px;font-size:.9rem}
.ck-bar{display:inline-block;width:90px;height:6px;border-radius:4px;background:var(--line);overflow:hidden}.ck-bar i{display:block;height:100%;background:var(--accent)}
.ck-status{flex-basis:100%}
.ck-dl{display:inline-flex;gap:6px;flex-wrap:wrap}
input.ck{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-width:20px;border:1.5px solid var(--muted);border-radius:4px;background:#fff;margin:0 8px 0 0;vertical-align:-4px;cursor:pointer;display:inline-grid;place-content:center}
input.ck:checked{background:var(--accent);border-color:var(--accent)}
input.ck:checked::after{content:"";width:10px;height:5px;border:2px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
input.ck:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ck-done{opacity:.5}
.ck-done .title,.ck-done .doc-title,.ck-done .s-title,.ck-done .what,.ck-done .doc-time,.ck-done .s-t,.ck-done td.time{text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--ink) 55%,transparent)}
.ck-done .doc-sub,.ck-done .notes-inline{text-decoration:line-through}
.ck-next{box-shadow:inset 3px 0 0 var(--accent)}
tr.ck-next td{background:color-mix(in srgb,var(--key) 70%,transparent)}
.ck-up{display:inline-block;margin-left:8px;font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:2px 8px;vertical-align:2px;text-decoration:none}
td.time .ck-up{display:block;width:max-content;margin:4px 0 0}
.ck-wrap{display:inline-block}
/* Planner doc */
.doc-sheet .doc-head{text-align:center;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:6px}
.doc-names{font-family:var(--display);font-size:1.7rem}
.doc-sec{font-family:var(--body);font-size:.8rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid color-mix(in srgb,var(--accent) 40%,transparent);padding-bottom:4px;margin:22px 0 6px}
.doc-item{padding:7px 8px;border-radius:8px}
.doc-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 8px;cursor:pointer;font-weight:500}
.doc-line input.ck{align-self:center}
.doc-time{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
.doc-title{font-weight:600}
.doc-sub{margin:3px 0 0 36px;padding-left:10px;border-left:2px solid var(--line);font-size:.88rem;color:var(--muted);display:grid;gap:2px}
.doc-item.key .doc-title{color:var(--ink)}
/* Simple list */
.simple-list{list-style:none;margin:0;padding:0}
.simple-list li{border-bottom:1px solid var(--line);padding:9px 6px;border-radius:6px}
.simple-list li:last-child{border-bottom:0}
.simple-list label{display:flex;align-items:center;gap:4px 10px;cursor:pointer;flex-wrap:wrap}
.simple-list .s-t{font-variant-numeric:tabular-nums;font-weight:700;min-width:5.2em}
.simple-list .s-title{flex:1 1 auto}
.g-times .t input.ck{margin-right:6px}
/* Photo progress */
.ph-cats{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ph-cat{font-size:.8rem;border:1px solid var(--line);border-radius:999px;padding:3px 10px;background:var(--paper)}
.ph-cat b{font-variant-numeric:tabular-nums}
.ph-cat.all{border-color:var(--accent);background:var(--key)}
.ph-part{font-family:var(--body);font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:22px 4px 6px}
.ph-item.done span{text-decoration:line-through;opacity:.55}
@media (max-width:600px){.sheet-ctl .seg{width:100%}.sheet-ctl .seg .seg-b{flex:1}.doc-sub{margin-left:28px}}
@media print{
  .sheet-ctl,.ph-card,.ck-up{display:none!important}
  input.ck{appearance:none;-webkit-appearance:none;width:11px;height:11px;min-width:11px;border:1px solid #000;border-radius:1px;background:#fff!important}
  input.ck:checked::after{display:none}
  .ck-done{opacity:1}
  .ck-done *,.ck-done{text-decoration:none!important}
  .ck-next,tr.ck-next td{box-shadow:none;background:none}
  .doc-sheet{border:0;padding:0}
  .doc-item{break-inside:avoid;padding:3px 0}
  .doc-sec{color:#000;border-color:#999}
  .simple-list li{padding:4px 0}
}
@media print{
  .card.doc-sheet,.card.simple-sheet,.doc-sheet,.simple-sheet{break-inside:auto!important}
  input.ck,input.ck:checked{border-color:#000!important}
  .doc-sec{break-after:avoid}
}
.doc-sheet > .doc-sec:first-child{margin-top:4px}

/* ---- v7.6 My wedding (couple dashboard) + Sundial Showcase ---- */
.top-link.on{font-weight:600;text-decoration:underline;text-underline-offset:4px}
.wd-head{text-align:center;padding:34px 0 8px}
.wd-head .page-title{margin:4px 0}
.wd-actions{display:flex;flex-wrap:wrap;gap:8px}
.wd-style{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.wd-style label{margin:0}
.wd-style select{width:auto;min-width:200px}
.ck-bar.wide{display:block;width:100%;margin:10px 0 4px}
.wd-steps{list-style:none;padding:0;margin:10px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px}
.wd-steps a{display:flex;gap:10px;align-items:flex-start;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--paper)}
.wd-steps a:hover{border-color:var(--accent)}
.wd-steps b{display:block;font-size:.92rem}
.wd-dot{flex:0 0 22px;height:22px;border-radius:50%;border:1.5px solid var(--muted);display:grid;place-content:center;font-size:.75rem;color:var(--accent-ink)}
.wd-steps li.done .wd-dot{background:var(--accent);border-color:var(--accent)}
.wd-vendors{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.wd-v{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--paper)}
.wd-v-links{gap:10px;margin-top:2px}
.wd-empty{text-align:center;max-width:560px;margin:40px auto}
.wd-pick{list-style:none;padding:0;display:grid;gap:8px}
.shw-cats{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 10px}
.chip-b{font:500 .85rem var(--body);border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:999px;padding:7px 12px;cursor:pointer;min-height:36px}
.chip-b.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.chip-b.on .muted{color:inherit;opacity:.8}
.shw-q{max-width:320px;margin-bottom:6px}
.shw-h{margin:16px 0 8px;font-size:1.15rem}
.shw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.shw-card{position:relative;border:1px solid var(--line);border-radius:12px;padding:12px;background:#fff;display:grid;gap:6px;align-content:start}
.shw-card.std{border-color:color-mix(in srgb,var(--accent) 55%,var(--line))}
.shw-card .standout{position:static;margin:0}
.shw-name{display:flex;gap:10px;align-items:center}
.shw-name b{display:block}
.shw-card:not(.std) .shw-name{padding-right:0}
.shw-acts{gap:6px;flex-wrap:wrap}
.shw-added{align-self:center}
.shw-more{margin-top:10px}
@media (max-width:600px){.wd-actions .btn{flex:1 1 calc(50% - 8px);text-align:center}.wd-head{padding-top:22px}}
/* v7.10 Showcase "Coming soon" teaser: blurred static placeholders + lock overlay */
.showcase-soon { position: relative; overflow: hidden; padding: 0; min-height: 300px; }
.tz-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 18px; filter: blur(4.5px); opacity: .9; pointer-events: none; user-select: none; transform: scale(1.02); }
.tz-card { border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden; box-shadow: 0 2px 6px rgba(43,38,34,.06); }
.tz-img { height: 84px; background: linear-gradient(135deg, #c9bca7, #e4d9c6); }
.tz-img1 { background: linear-gradient(135deg, #b9c4b3, #dde4d6); }
.tz-img2 { background: linear-gradient(135deg, #cdbcc1, #e8dcdf); }
.tz-body { display: grid; gap: 4px; padding: 10px 12px 12px; }
.tz-cat { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.tz-name { font-family: var(--display); font-size: 1.2rem; font-weight: 600; color: var(--ink); }
.tz-stars { display: flex; gap: 2px; } .tz-stars svg { fill: var(--accent); }
.tz-rev { font-size: 12px; color: var(--muted); }
.tz-over { position: absolute; inset: 0; display: grid; place-items: center; padding: 16px; background: radial-gradient(ellipse at center, color-mix(in srgb, var(--paper) 45%, transparent) 0%, transparent 65%); }
.tz-panel { text-align: center; max-width: 420px; padding: 20px 24px; border-radius: var(--radius); background: color-mix(in srgb, var(--paper) 92%, transparent); border: 1px solid var(--line); box-shadow: 0 10px 30px rgba(43,38,34,.10); }
.tz-panel h2 { margin: 6px 0 6px; display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
.tz-panel p { margin: 0; color: var(--muted); }
.tz-lock { color: var(--accent); }
.soon-pill { font: 600 11px/1 var(--body); letter-spacing: .06em; text-transform: uppercase; padding: 5px 9px; border-radius: 999px; background: var(--soft); color: var(--ink); border: 1px solid var(--line); }
@media (max-width: 640px) { .tz-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 12px; } .tz-img { height: 60px; } .showcase-soon { min-height: 360px; } .tz-panel { padding: 16px 18px; } }

/* v8.1 homepage: live sample Day Sheet right under the hero */
.ds-peek{max-width:640px;margin:0 auto 26px;background:var(--paper,#fff);border:1px solid var(--line);border-radius:18px;padding:16px 18px 14px;box-shadow:0 10px 30px rgba(38,39,46,.07);text-align:left}
.ds-peek-head{display:flex;align-items:flex-start;gap:10px;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:6px}
.ds-peek-title{font-family:var(--display);font-size:1.45rem;margin:2px 0 0;line-height:1.15}
.ds-live{font-size:.75rem;font-weight:600;color:#2f7d4f;background:#e9f5ee;border-radius:999px;padding:3px 9px;white-space:nowrap}
.ds-peek-list{list-style:none;margin:0;padding:0;display:grid}
.ds-peek-list li{display:grid;grid-template-columns:5.2em 1fr auto;gap:10px;align-items:baseline;padding:6px 0;border-bottom:1px dashed var(--line);font-size:.95rem}
.ds-peek-list li:last-child{border-bottom:0}
.ds-peek-list em{font-style:normal;font-weight:600;font-variant-numeric:tabular-nums}
.ds-peek-list li.key span{font-weight:600}
.ds-peek-list i{font-style:normal;color:var(--muted);font-size:.8rem}
.ds-peek-foot{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
@media (max-width:640px){.ds-peek{padding:14px 14px 12px;margin-bottom:20px}.ds-peek-list li{grid-template-columns:4.8em 1fr;font-size:.9rem}.ds-peek-list i{display:none}}