﻿.party { max-width: 980px; }
.party-intro { max-width: 56ch; font-size: 1.08rem; line-height: 1.55; color: var(--muted); margin: 0 0 8px; }

.party .p-step { text-align: left; }
.p-step { margin: 52px 0 0; padding: 30px 0 0; border-top: 1.5px solid var(--espresso); }
.p-step h2 { font-family: var(--title-font); font-weight: 400; font-size: clamp(1.6rem, 5vw, 2.2rem); line-height: 1.05; margin: 0 0 16px; display: flex; align-items: baseline; gap: 12px; }
.p-step h2 span { font-family: var(--mono); font-size: 0.55em; letter-spacing: 0.06em; color: var(--oxblood); position: relative; top: -0.2em; }
.party { counter-reset: step; }
.p-step.num { counter-increment: step; }
.p-step.num h2 span::before { content: "0" counter(step); }
.p-help { color: var(--muted); margin: -6px 0 16px; max-width: 60ch; }

.themes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.theme { display: grid; justify-items: start; gap: 6px; text-align: left; font: inherit; color: var(--espresso); background: var(--paper-white); border: 1.5px solid var(--espresso); border-radius: 0; padding: 14px; cursor: pointer; transition: transform 0.15s ease, box-shadow 0.15s ease; }
.theme img { width: 84px; height: 84px; object-fit: contain; transform: rotate(-4deg); margin-bottom: 4px; }
.theme:nth-child(even) img { transform: rotate(4deg); }
.theme strong { font-family: var(--title-font); font-weight: 400; font-size: 1.2rem; line-height: 1.1; }
.theme span { font-size: 0.9rem; line-height: 1.4; color: var(--muted); }
.theme:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--espresso); }
.theme.on { border-color: var(--oxblood); box-shadow: 4px 4px 0 var(--oxblood); transform: none; }
@media (min-width: 820px) { .themes { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.basics { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.basics label { display: grid; gap: 6px; font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--espresso); }
.basics label.wide { grid-column: 1 / -1; }
.basics input, .basics select { font: 1rem var(--body); letter-spacing: 0; text-transform: none; padding: 10px 12px; border: 1.5px solid var(--espresso); border-radius: 0; background: #fff; color: var(--espresso); min-width: 0; width: 100%; box-sizing: border-box; }
.stepper { display: flex; }
.stepper input { text-align: center; border-left: 0; border-right: 0; -moz-appearance: textfield; }
.stepper input::-webkit-outer-spin-button, .stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.stepper button { flex: 0 0 44px; font: 1.2rem var(--body); border: 1.5px solid var(--espresso); background: var(--paper-white); color: var(--espresso); cursor: pointer; border-radius: 0; }

.menu-group { margin: 0 0 30px; }
.menu-group h3 { font-family: var(--mono); font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; margin: 0 0 10px; }
.p-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.p-chip { font: 0.9rem var(--body); padding: 7px 12px; border: 1.5px solid var(--espresso); border-radius: 0; background: transparent; color: var(--espresso); cursor: pointer; }
.p-chip.on { background: var(--espresso); color: var(--paper-white); }
.p-extra { font-style: italic; }
.p-extra a { color: var(--oxblood); text-decoration: underline; text-underline-offset: 3px; }

.shop-grid { display: grid; gap: 22px; margin: 0 0 18px; }
@media (min-width: 720px) { .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.shop-group { background: var(--paper-white); border: 1.5px solid var(--espresso); padding: 16px 18px; }
.shop-group h3 { font-family: var(--title-font); font-weight: 400; font-size: 1.15rem; margin: 0 0 10px; }
.shop-group h3 small { font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.08em; color: var(--muted); margin-left: 6px; }

.ticks, .timeline { list-style: none; margin: 0; padding: 0; }
.ticks li, .timeline li { border-bottom: 1px dashed rgba(23, 20, 18, 0.2); }
.ticks li:last-child { border-bottom: 0; }
.ticks label, .timeline label { display: flex; gap: 10px; align-items: flex-start; padding: 7px 0; cursor: pointer; line-height: 1.4; }
.ticks input, .timeline input { margin-top: 3px; accent-color: var(--oxblood); flex: 0 0 auto; width: 17px; height: 17px; }
.ticks li.done span, .timeline li.done span { text-decoration: line-through; color: var(--muted); }
.timeline { max-width: 640px; }
.timeline b { display: inline-block; min-width: 118px; font-family: var(--mono); font-weight: 500; font-size: 0.8rem; letter-spacing: 0.04em; color: var(--oxblood); }
.timeline li.start b { color: var(--espresso); }
.timeline li.start span { font-weight: 600; }

#invite { width: 100%; box-sizing: border-box; font: 1rem/1.5 var(--body); padding: 14px; border: 1.5px solid var(--espresso); border-radius: 0; background: var(--paper-white); color: var(--espresso); resize: vertical; }
.p-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 12px; }
.p-copied { font-family: var(--marker); font-size: 1.4rem; color: var(--oxblood); }

.printables { display: grid; gap: 16px; }
@media (min-width: 720px) { .printables { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.printable { border: 1.5px dashed var(--espresso); padding: 18px; display: grid; gap: 8px; align-content: start; }
.printable h3 { font-family: var(--title-font); font-weight: 400; font-size: 1.25rem; margin: 0; }
.printable p { margin: 0 0 6px; color: var(--muted); font-size: 0.95rem; line-height: 1.45; }
.printable .btn { justify-self: start; }

.p-safe ul { margin: 0; padding-left: 1.2em; line-height: 1.6; max-width: 62ch; }
.p-safe { background: var(--paper-white); border: 1.5px solid var(--espresso); padding: 26px 22px; margin-top: 52px; }
.p-done p { margin: 0 0 14px; }
.p-done .p-help { margin-top: 12px; }
.p-done a { text-decoration: underline; }

#printSheet { display: none; color: #171412; font-family: "Instrument Sans", Arial, sans-serif; }
#printSheet.measuring { display: block; position: fixed; left: -10000px; top: 0; width: 191.9mm; }
#printSheet h1 { font-family: "Young Serif", Georgia, serif; font-weight: 400; font-size: 34pt; margin: 0 0 6pt; line-height: 1.05; }
#printSheet h3 { font-family: "DM Mono", monospace; font-size: 10pt; letter-spacing: 0.14em; text-transform: uppercase; margin: 18pt 0 6pt; border-bottom: 1px solid #171412; padding-bottom: 3pt; }
#printSheet h3 small { letter-spacing: 0.04em; text-transform: none; font-size: 9pt; color: #5d554d; }
#printSheet .ps-sub { font-size: 11pt; color: #5d554d; margin: 0 0 10pt; }
#printSheet .ps-invite { display: block; max-width: 100%; max-height: 250mm; margin: 0 auto; }
#printSheet .ps-shop { columns: 2; column-gap: 24pt; }
#printSheet .ps-shop > div { break-inside: avoid; }
#printSheet .ps-shop ul { list-style: none; padding: 0; margin: 0; font-size: 10.5pt; }
#printSheet .ps-shop li { padding: 2pt 0; }
#printSheet .ps-shop li::before { content: "\25A1"; margin-right: 6pt; }

#printSheet .ps-frame { position: relative; box-sizing: border-box; height: 253mm; overflow: hidden; border: 2.5pt solid #c23a31; padding: 6pt; }
#printSheet .ps-frame::before { content: ""; position: absolute; inset: 7pt; border: 0.75pt solid #c23a31; }
#printSheet .ps-moon { position: absolute; top: 22pt; left: 26pt; width: 60pt; transform: rotate(-10deg); }
#printSheet .ps-star { position: absolute; top: 26pt; right: 30pt; width: 46pt; transform: rotate(14deg); }
#printSheet .ps-hand { position: absolute; bottom: 28pt; left: 50%; width: 210pt; transform: translateX(-50%); }
#printSheet .ps-body { position: relative; text-align: center; font-size: 10pt; padding: 5.2em 4.4em 86pt; }
#printSheet .ps-body .ps-stamp { display: block; width: 7.4em; margin: 0 auto 1.1em; transform: rotate(4deg); }
#printSheet .ps-body .ps-kicker { font-family: "DM Mono", monospace; font-size: 0.9em; text-transform: uppercase; color: #c23a31; letter-spacing: 0.3em; margin: 0 0 0.4em; }
#printSheet .ps-body h1 { font-size: 3.6em; margin: 0 0 0.15em; }
#printSheet .ps-body .ps-sub { font-size: 1.1em; margin: 0 0 1.2em; }
#printSheet .ps-body h3 { color: #c23a31; border: 0; padding: 0; font-size: 0.85em; letter-spacing: 0.28em; margin: 1.9em 0 0.6em; }
#printSheet .ps-body .pm-item { margin: 0 0 0.85em; }
#printSheet .ps-body .pm-item strong { display: block; font-family: "Young Serif", Georgia, serif; font-weight: 400; font-size: 1.5em; line-height: 1.15; }
#printSheet .ps-body .pm-item span { display: block; max-width: 36em; margin: 0.2em auto 0; font-size: 1em; line-height: 1.35; color: #3a332e; }
#printSheet .ps-body .pm-note { font-style: italic; font-size: 1em; margin: 0.4em 0 0; }
#printSheet .ps-body ol { list-style: none; padding: 0; margin: 2em auto 0; max-width: 40em; counter-reset: i; }
#printSheet .ps-body ol li { counter-increment: i; margin: 0 0 1.4em; }
#printSheet .ps-body ol li::before { content: counter(i, decimal-leading-zero); display: block; font-family: "DM Mono", monospace; font-size: 0.85em; letter-spacing: 0.2em; color: #c23a31; margin-bottom: 0.2em; }
#printSheet .ps-body .ps-qs { font-family: "Young Serif", Georgia, serif; font-size: 1.4em; line-height: 1.4; }

@media print {
  @page { size: letter; margin: 12mm; }
  body.printing > *:not(#printSheet) { display: none !important; }
  body.printing { background: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body.printing #printSheet { display: block; }
}

.book-picks { display: grid; gap: 12px; margin: 0 0 18px; }
@media (min-width: 720px) { .book-picks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.book-pick { display: grid; gap: 4px; text-align: left; font: inherit; color: var(--espresso); background: var(--paper-white); border: 1.5px solid var(--espresso); border-radius: 0; padding: 14px 16px; cursor: pointer; }
.book-pick strong { font-family: var(--title-font); font-weight: 400; font-size: 1.2rem; line-height: 1.15; }
.bp-author { font-size: 0.9rem; color: var(--muted); }
.bp-blurb { font-size: 0.92rem; line-height: 1.45; margin-top: 4px; }
.book-pick.on { border-color: var(--oxblood); box-shadow: 4px 4px 0 var(--oxblood); }
.own-book { margin: 0 0 18px; }
.qs-title { font-family: var(--mono); font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; margin: 8px 0 10px; }
.book-qs { margin: 0; padding-left: 1.4em; line-height: 1.6; max-width: 62ch; }

.invite-wrap { display: grid; gap: 22px; align-items: start; }
@media (min-width: 820px) { .invite-wrap { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); } }
.invite-img { width: 100%; height: auto; display: block; background: #120f0e; box-shadow: 0 14px 30px rgba(23, 20, 18, 0.25); }
.invite-img:not([src]) { aspect-ratio: 4 / 5; }
.invite-side .p-help { margin: 0 0 12px; }
.invite-side .p-actions { margin: 0 0 20px; }
.invite-text-label { margin-top: 8px !important; }
.own-book[hidden], .printable[hidden], .p-step[hidden] { display: none; }
.basics label.check { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.basics label.check input { width: 18px; height: 18px; flex: 0 0 auto; padding: 0; accent-color: var(--oxblood); }
#printSheet .ps-body.compact .pm-item span, #printSheet .ps-body.compact .ps-stamp { display: none; }
#printSheet .ps-body.compact .pm-item { margin: 0 0 0.45em; }
.batch-grid { display: grid; gap: 18px; }
@media (min-width: 720px) { .batch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.batch-card { background: var(--paper-white); border: 1.5px solid var(--espresso); padding: 18px; }
.batch-card h3 { font-family: var(--title-font); font-weight: 400; font-size: 1.25rem; margin: 0 0 8px; }
.batch-card h3 small { display: block; margin-top: 4px; font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--oxblood); }
.batch-card p { margin: 0 0 10px; line-height: 1.5; font-size: 0.95rem; }
.batch-card .batch-tip { color: var(--muted); }
.batch-card ul { margin: 0 0 12px; padding-left: 1.2em; line-height: 1.55; font-size: 0.95rem; }
.batch-card b { font-weight: 600; }

.p-step.is-locked h2 .lock { width: 0.6em; height: 0.6em; color: var(--oxblood); }
.p-lock { position: relative; border: 1.5px dashed var(--espresso); padding: 18px 18px 16px; background: var(--paper-white); }
.p-lock-lines { display: grid; gap: 9px; margin: 0 0 14px; filter: blur(2px); opacity: 0.55; }
.p-lock-lines span { display: block; height: 10px; background: var(--paper-2); }
.p-lock-lines span:nth-child(1) { width: 82%; }
.p-lock-lines span:nth-child(2) { width: 64%; }
.p-lock-lines span:nth-child(3) { width: 74%; }
.p-lock-lines span:nth-child(4) { width: 48%; }
.p-lock p { margin: 0 0 8px; max-width: 56ch; }
.p-lock a { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--oxblood); text-decoration: underline; text-underline-offset: 4px; }
#qsMore .lock { color: var(--oxblood); }
#qsMore a { color: var(--oxblood); text-decoration: underline; }
