:root {
  --bg: #f9f1e4;
  --card: #fffdf8;
  --text: #2f241f;
  --muted: #76675a;
  --accent: #c63d35;
  --accent-dark: #8b201d;
  --green: #1f6a4a;
  --green-dark: #164735;
  --gold: #dcae38;
  --gold-soft: #fff0bd;
  --ribbon: #d53649;
  --mint: #e1f2e7;
  --line: rgba(94, 65, 42, 0.18);
  --shadow: 0 18px 45px rgba(64, 47, 32, 0.14);
  --radius: 22px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { min-height: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  color: var(--text);
  background:
    radial-gradient(circle at 8% 0%, rgba(255, 235, 181, .8), transparent 18rem),
    radial-gradient(circle at 93% 6%, rgba(220, 59, 73, .16), transparent 19rem),
    linear-gradient(135deg, rgba(31, 106, 74, .06) 0 25%, transparent 25% 50%, rgba(198, 61, 53, .045) 50% 75%, transparent 75%) 0 0 / 36px 36px,
    var(--bg);
  font-size: 14px;
  line-height: 1.28;
}
a { color: var(--accent-dark); text-underline-offset: .18em; }
.site-hero {
  color: #fff;
  position: relative;
  z-index: 30;
  overflow: visible;
  padding: .65rem 0 .75rem;
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 236, 174, .28), transparent 15rem),
    radial-gradient(circle at 84% 10%, rgba(255, 255, 255, .12), transparent 12rem),
    linear-gradient(135deg, rgba(18, 74, 51, .98), rgba(113, 31, 32, .97));
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .16), 0 18px 36px rgba(63, 32, 24, .15);
}
.site-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background:
    linear-gradient(90deg, transparent 0 calc(50% - 5px), rgba(255,255,255,.95) calc(50% - 5px) calc(50% + 5px), transparent calc(50% + 5px)),
    linear-gradient(0deg, transparent 0 calc(50% - 5px), rgba(255,255,255,.75) calc(50% - 5px) calc(50% + 5px), transparent calc(50% + 5px));
  transform: rotate(-7deg) scale(1.2);
}
.site-hero::after {
  content: "✦  🎁  ✧  ✦  🎀  ✧  🎁  ✦";
  position: absolute;
  right: -1.5rem;
  bottom: .15rem;
  color: rgba(255,255,255,.38);
  font-size: clamp(1.1rem, 3vw, 2.6rem);
  letter-spacing: .35rem;
  pointer-events: none;
  transform: rotate(-4deg);
}
.hero-content, .top-nav { position: relative; z-index: 1; }
.top-nav, .hero-content, .page-shell { width: min(calc(100% - 1rem), 1400px); margin-inline: auto; }
.top-nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .25rem; margin-bottom: .45rem; }
.top-nav a, .top-nav summary, .button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 1.7rem;
  padding: .25rem .55rem; border-radius: 999px; border: 0; font-weight: 850; text-decoration: none; cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, background-color .14s ease, border-color .14s ease;
}
.top-nav a, .top-nav summary { color: #fff; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.28); backdrop-filter: blur(8px); }
.top-nav a:hover, .top-nav summary:hover, .button:hover { transform: translateY(-1px); }
.nav-more { position: relative; }
.nav-more summary { list-style: none; }
.nav-more summary::-webkit-details-marker { display: none; }
.nav-more > div { position: absolute; right: 0; top: calc(100% + .25rem); z-index: 20; display: grid; gap: .2rem; min-width: 11rem; padding: .3rem; border: 1px solid rgba(255,255,255,.35); border-radius: 14px; background: rgba(89,45,39,.96); box-shadow: 0 16px 34px rgba(35,22,17,.25); }
.nav-more:not([open]) > div { display: none; }
.nav-more > div a { justify-content: flex-start; background: rgba(255,255,255,.1); }
h1 { margin: 0; font-size: clamp(1.35rem, 2vw, 2rem); line-height: 1; letter-spacing: -.035em; }
h2 { margin: 0 0 .18rem; font-size: clamp(1rem, 1.4vw, 1.25rem); line-height: 1.08; letter-spacing: -.02em; }
h3 { margin: 0 0 .1rem; font-size: .98rem; }
.eyebrow { margin: 0 0 .2rem; color: var(--accent-dark); font-size: .66rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.site-hero .eyebrow { color: #ffe9a8; }
.page-shell { position: relative; z-index: 1; flex: 1 0 auto; margin-top: .5rem; margin-bottom: 2rem; }
.site-footer { flex-shrink: 0; width: min(calc(100% - 1rem), 1400px); margin: 0 auto 1.5rem; display: flex; justify-content: center; gap: .8rem; color: var(--muted); font-size: .75rem; }
.site-footer a { color: var(--muted); }
.landing-hero { padding: .8rem 0 2rem; }
.landing-hero__content { display: grid; gap: .65rem; max-width: 1180px; }
.landing-hero-grid { grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr); align-items: center; }
.landing-hero-copy { display: grid; gap: .65rem; }
.landing-hero h1 { max-width: 900px; font-size: clamp(2.25rem, 5.8vw, 5rem); line-height: .92; }
.landing-lede { max-width: 760px; margin: 0; color: #fff6dd; font-size: clamp(1rem, 1.8vw, 1.35rem); line-height: 1.35; }
.landing-actions { margin-top: .35rem; }
.landing-actions .button { min-height: 2.25rem; padding: .42rem .82rem; box-shadow: 0 14px 30px rgba(50, 20, 15, .22); }
.landing-actions .button.ghost { box-shadow: none; }
.landing-ghost { color: #fff !important; border-color: rgba(255,255,255,.55) !important; }
.landing-shell { display: grid; gap: .65rem; }
.landing-panel { padding: .75rem .85rem; }
.landing-section-header { display: grid; gap: .25rem; }
.landing-trust-row { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .1rem; }
.landing-trust-row span { display: inline-flex; align-items: center; gap: .18rem; padding: .18rem 0; border-bottom: 2px solid rgba(255,233,168,.46); color: #fff6dd; font-size: .78rem; font-weight: 850; }
.landing-preview-card { position: relative; z-index: 1; display: grid; gap: .45rem; padding: .85rem; border: 1px solid rgba(255,255,255,.28); border-radius: 22px; background: linear-gradient(180deg, rgba(255,253,248,.96), rgba(255,246,225,.9)); color: var(--text); box-shadow: 0 24px 55px rgba(25, 21, 18, .24); }
.landing-preview-card .eyebrow { color: var(--accent-dark); }
.preview-gift-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .45rem; align-items: center; padding: .45rem; border: 1px solid rgba(94,65,42,.14); border-radius: 13px; background: rgba(255,255,255,.72); }
.preview-gift-row small { display: block; margin-top: .05rem; color: var(--muted); font-size: .72rem; font-weight: 750; }
.preview-icon { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 12px; background: var(--gold-soft); }
.preview-pill { padding: .12rem .34rem; border-left: 3px solid var(--green); background: rgba(225,242,231,.62); color: var(--green-dark); font-size: .68rem; font-weight: 900; white-space: nowrap; }
.muted-pill { border-left-color: rgba(118,103,90,.55); background: rgba(239,231,219,.58); color: var(--muted); }
.preview-secret-row { grid-template-columns: auto 1fr; background: linear-gradient(135deg, rgba(225,242,231,.9), rgba(255,253,248,.82)); }
.landing-band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem; padding: .85rem; border-radius: 18px; border: 1px solid rgba(220,174,56,.3); box-shadow: 0 12px 32px rgba(64,47,32,.08); }
.landing-band--warm { background: linear-gradient(135deg, rgba(255,246,207,.9), rgba(225,242,231,.82)); }
.landing-band h2 { max-width: 38rem; }
.landing-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(8rem, 1fr)); gap: .45rem; flex: 1 1 32rem; }
.landing-stat-grid article { padding: .55rem; border: 1px solid rgba(94,65,42,.13); border-radius: 13px; background: rgba(255,255,255,.62); }
.landing-stat-grid strong, .landing-stat-grid span { display: block; }
.landing-stat-grid strong { color: var(--accent-dark); }
.landing-feature-grid { margin-top: .65rem; }
.landing-feature-grid--large { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.landing-feature-card { min-height: 7.6rem; }
.panel, .person-card, .person-list, .gift-card, .form-card {
  background: rgba(255,253,248,.96); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 10px 26px rgba(64,47,32,.08);
}
.panel, .form-card { position: relative; padding: .55rem .65rem; margin-bottom: .55rem; }
.panel::before, .form-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  border-radius: 14px 14px 0 0;
  background: linear-gradient(90deg, var(--green), var(--gold), var(--ribbon));
  opacity: .72;
}
.tip-box { position: relative; margin: .45rem 0; padding: .55rem 2rem .6rem .65rem; border: 1px solid rgba(31,106,74,.22); border-radius: 13px; background: linear-gradient(135deg, #fffdf8, #eef8f1); box-shadow: 0 8px 22px rgba(31, 106, 74, .08); }
.tip-box::before { content: "💡"; float: left; margin-right: .4rem; }
.tip-box h3 { margin-bottom: .2rem; }
.tip-box__dismiss { position: absolute; right: .45rem; top: .35rem; width: 1.35rem; height: 1.35rem; border: 0; border-radius: 999px; background: rgba(118,103,90,.12); color: var(--muted); font-weight: 900; cursor: pointer; }
.tip-box__dismiss:hover { background: rgba(198,61,53,.14); color: var(--accent-dark); }
.landing-feature-grid .person-card { position: relative; padding-top: 2.15rem; overflow: hidden; }
.landing-feature-grid .person-card::before {
  content: "🎁";
  position: absolute;
  left: .65rem;
  top: .45rem;
  width: 1.35rem;
  height: 1.35rem;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--gold-soft);
  box-shadow: inset 0 0 0 1px rgba(220, 174, 56, .35);
}
.landing-feature-grid .person-card:nth-child(2)::before { content: "🤫"; background: #e2f2e9; }
.landing-feature-grid .person-card:nth-child(3)::before { content: "🎉"; background: #ffe4e8; }
.landing-feature-grid .person-card:nth-child(4)::before { content: "💌"; background: #fff0bd; }
.landing-feature-grid .person-card:nth-child(5)::before { content: "🛒"; background: #e2f2e9; }
.landing-feature-grid .person-card:nth-child(6)::before { content: "📝"; background: #ffe4e8; }
.landing-two-column { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .8fr); gap: .65rem; }
.landing-steps { list-style: none; margin: .55rem 0 0; padding: 0; display: grid; gap: .45rem; counter-reset: landing-step; }
.landing-steps li { counter-increment: landing-step; display: grid; grid-template-columns: auto 1fr; gap: .45rem; padding: .48rem; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.62); }
.landing-steps li::before { content: counter(landing-step); display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 999px; background: linear-gradient(135deg, var(--green), var(--green-dark)); color: #fff; font-weight: 950; }
.landing-steps strong, .landing-steps span { display: block; }
.landing-steps span { color: var(--muted); font-size: .8rem; }
.landing-privacy-card { background: linear-gradient(135deg, rgba(255,253,248,.96), rgba(225,242,231,.72)); }
.mini-flow { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin-top: .65rem; }
.mini-flow span { padding: .22rem .42rem; border-left: 3px solid var(--gold); background: rgba(255,255,255,.62); font-weight: 850; }
.mini-flow strong { color: var(--accent-dark); }
.landing-use-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; margin-top: .45rem; }
.landing-use-grid article { padding: .55rem; border: 1px solid rgba(94,65,42,.14); border-radius: 13px; background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,249,236,.7)); }
.landing-use-grid span { display: inline-grid; place-items: center; width: 1.9rem; height: 1.9rem; margin-bottom: .25rem; border-radius: 12px; background: var(--gold-soft); }
.landing-use-grid strong { display: block; }
.landing-use-grid p { margin: .15rem 0 0; color: var(--muted); font-size: .78rem; }
.gift-teaser-panel { background: linear-gradient(135deg, rgba(255,253,248,.96), rgba(255,240,189,.46)); }
.gift-teaser-grid { margin-top: .45rem; }
.gift-teaser-card { min-height: 4.8rem; }
.toolbar { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; justify-content: space-between; }
.toolbar-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .35rem; }
.add-wish-cta { box-shadow: 0 10px 22px rgba(178, 53, 40, .18); }
.tab-bar { display: flex; flex-wrap: wrap; gap: .25rem; margin: 0 0 .55rem; }
.settings-intro { display: grid; gap: .25rem; margin-bottom: .6rem; padding: .65rem; border: 1px solid rgba(220,174,56,.32); border-radius: 15px; background: linear-gradient(135deg, rgba(255,246,207,.82), rgba(225,242,231,.72)); box-shadow: inset 0 1px 0 rgba(255,255,255,.8); }
.settings-tabs { position: sticky; top: .25rem; z-index: 5; padding: .28rem; border: 1px solid rgba(220,174,56,.35); border-radius: 999px; background: rgba(255,253,248,.94); backdrop-filter: blur(8px); box-shadow: 0 10px 24px rgba(64,47,32,.08); }
.settings-tabs .button.ghost { background: rgba(255,255,255,.58); }
.settings-group { position: relative; scroll-margin-top: 4.5rem; display: grid; gap: .45rem; padding: .65rem; border: 1px solid rgba(94,65,42,.16); border-radius: 16px; background: linear-gradient(135deg, rgba(255,253,248,.78), rgba(255,246,207,.42)); box-shadow: 0 12px 28px rgba(64,47,32,.07), inset 0 1px 0 rgba(255,255,255,.78); overflow: hidden; }
.settings-group::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 6px; background: linear-gradient(180deg, var(--green), var(--gold)); opacity: .9; }
.settings-group::after { position: absolute; right: .7rem; top: .55rem; font-size: 1.55rem; opacity: .18; pointer-events: none; }
.settings-group__head { display: grid; gap: .15rem; padding: 0 2.2rem .45rem .15rem; border-bottom: 1px solid rgba(94,65,42,.14); }
#account-login { background: linear-gradient(135deg, rgba(225,242,231,.72), rgba(255,253,248,.86)); }
#account-login::after { content: "✉️"; }
#connected-people { background: linear-gradient(135deg, rgba(255,240,189,.72), rgba(255,253,248,.86)); }
#connected-people::before { background: linear-gradient(180deg, var(--gold), var(--ribbon)); }
#connected-people::after { content: "🤝"; }
#gift-defaults { background: linear-gradient(135deg, rgba(255,228,232,.62), rgba(255,253,248,.88)); }
#gift-defaults::before { background: linear-gradient(180deg, var(--ribbon), var(--gold)); }
#gift-defaults::after { content: "🎁"; }
#email-reminders { background: linear-gradient(135deg, rgba(232,244,236,.74), rgba(255,240,189,.44)); }
#email-reminders::after { content: "🔔"; }
#account-security { background: linear-gradient(135deg, rgba(245,238,228,.9), rgba(255,253,248,.88)); }
#account-security::before { background: linear-gradient(180deg, #76675a, var(--gold)); }
#account-security::after { content: "🔒"; }
#groups-you-use { background: linear-gradient(135deg, rgba(255,246,207,.78), rgba(225,242,231,.56)); }
#groups-you-use::after { content: "👥"; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.person-card, .person-list, .gift-card { padding: .4rem .5rem; }
.person-card { background: linear-gradient(180deg, rgba(255,253,248,.98), rgba(255,249,236,.94)); }
.person-card__head, .gift-card__head { display: flex; gap: .4rem; align-items: start; justify-content: space-between; }
.list-stack { display: grid; gap: .45rem; }
.family-branch { margin-top: .55rem; padding: .5rem; border: 1px solid rgba(31,106,74,.18); border-radius: 12px; background: linear-gradient(180deg, rgba(255,255,255,.7), rgba(225,242,231,.42)); box-shadow: inset 0 1px 0 rgba(255,255,255,.8); }
.family-branch { scroll-margin-top: .75rem; }
.family-branch:target { animation: jump-highlight 1.15s ease-out 1; }
@keyframes jump-highlight {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 0 0 rgba(220,174,56,0); }
  15%, 65% { background: linear-gradient(180deg, #fff6cf, #ffe6a3); box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 0 0 5px rgba(220,174,56,.34), 0 12px 28px rgba(143,47,33,.16); border-color: rgba(220,174,56,.85); }
}
.family-branch__head { margin-bottom: .4rem; padding-bottom: .3rem; border-bottom: 1px solid var(--line); }
.family-branch__head h3 { margin-bottom: .05rem; }
.family-subbranches { display: grid; gap: .45rem; margin-top: .5rem; margin-left: 1rem; padding-left: .75rem; border-left: 3px solid rgba(31,106,74,.24); }
.family-subbranches .family-branch { background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,246,207,.42)); }
.jump-panel { position: sticky; top: 0; z-index: 5; }
.jump-links { display: flex; flex-wrap: wrap; gap: .25rem; }
.person-list { box-shadow: none; background: rgba(255,255,255,.62); }
.type-choice { display: block; color: var(--text); text-decoration: none; }
.type-choice:hover { border-color: rgba(182, 61, 43, .45); }
.muted, .help { color: var(--muted); font-size: .78rem; }
.button { color: #fff; background: linear-gradient(135deg, #d84b3d, var(--accent-dark)); box-shadow: 0 10px 18px rgba(143,47,33,.18); }
.button.secondary { color: #6f3b03; background: linear-gradient(135deg, #ffe9a8, #f5c85c); box-shadow: 0 8px 16px rgba(145, 96, 10, .12); }
.button.ghost { color: var(--text); background: transparent; border: 1px solid var(--line); box-shadow: none; }
.button.small { min-height: 1.45rem; padding: .18rem .42rem; font-size: .76rem; }
.gift-list { list-style: none; margin: .35rem 0 0; padding: 0; display: grid; gap: .22rem; }
.wishlist-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); align-items: start; gap: .35rem; }
.gift-card.unavailable { opacity: .72; }
.gift-card { position: relative; overflow: visible; }
.person-list:has(.gift-card:hover),
.person-list:has(.gift-card:focus-within),
.family-branch:has(.gift-card:hover),
.family-branch:has(.gift-card:focus-within) { position: relative; z-index: 20; overflow: visible; }
.gift-card:hover,
.gift-card:focus-within { z-index: 25; }
.gift-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, var(--ribbon), var(--gold));
  opacity: .7;
}
.gift-card--gift-card { border-color: rgba(215, 167, 58, .48); background: linear-gradient(180deg, #fffdf8, #fff8e4); }
.gift-card--info { border-style: dashed; background: rgba(247,243,236,.62); }
.gift-content { overflow-wrap: anywhere; }
.gift-notes { margin-top: .2rem; color: var(--muted); }
.product-preview { display: none; position: absolute; left: .45rem; top: calc(100% - .2rem); z-index: 30; width: min(13rem, 72vw); padding: .45rem; border: 1px solid rgba(122,85,54,.18); border-radius: 14px; background: rgba(255,255,255,.98); box-shadow: 0 18px 45px rgba(54,36,24,.22); color: var(--muted); font-size: .72rem; font-weight: 800; text-align: center; }
.product-preview img { display: block; width: 100%; max-height: 11rem; object-fit: contain; margin: 0 auto .3rem; border-radius: 10px; background: #fff; }
.gift-card:hover .product-preview,
.gift-card:focus-within .product-preview { display: block; }
.gift-meta { display: inline; margin: 0 0 0 .35rem; }
.gift-card__tools { display: flex; flex-wrap: wrap; gap: .2rem; align-items: center; justify-content: flex-end; flex-shrink: 0; }
.gift-card__tools form { display: inline-flex; }
.gift-card__secondary-actions { margin-top: .35rem; padding-top: .3rem; border-top: 1px dashed rgba(92, 64, 45, .18); }
.gift-card__secondary-actions .button { opacity: .82; }
.status { display: inline-flex; padding: .12rem .32rem; border-radius: 999px; background: #efe7db; color: var(--muted); font-size: .62rem; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.status.available { color: #1f5d40; background: var(--mint); }
.status.claimed { color: #7a4a08; background: #f7e8bd; }
.status.purchased { color: #7d261d; background: #f7dfd7; }
.memorial { border-left: 5px solid var(--gold); }
.forms { display: grid; gap: .6rem; }
.settings-card { display: grid; gap: .35rem; padding: .45rem .5rem; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.58); }
.settings-card legend { padding: 0 .2rem; font-weight: 900; }
.compact-card { gap: .25rem; }
.checkbox-row { display: flex; align-items: center; gap: .35rem; margin: 0; font-weight: 750; }
.checkbox-row input { flex: 0 0 auto; }
.account-section { display: grid; gap: .45rem; padding: .55rem .6rem; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.58); }
.settings-group .account-section { background: rgba(255,253,248,.72); border-color: rgba(94,65,42,.14); box-shadow: inset 0 1px 0 rgba(255,255,255,.76); }
.account-section h2 { margin-bottom: 0; }
.login-email-box { padding: .65rem; border: 1px solid rgba(31, 106, 74, .25); border-radius: 12px; background: linear-gradient(135deg, rgba(255,255,255,.84), rgba(232, 244, 236, .72)); }
.strong-help { font-weight: 750; color: var(--text); }
.compact-fields { gap: .35rem; margin-bottom: .35rem; }
.date-fields { display: grid; grid-template-columns: minmax(8.5rem, 1fr) 4.5rem 7.5rem; gap: .35rem; align-items: center; }
.date-fields .year-input { max-width: 7.5rem; }
label { display: block; margin-bottom: .2rem; font-weight: 850; }
input[type=text], input[type=email], input[type=password], input[type=url], input[type=number], select, textarea {
  width: 100%; padding: .32rem .45rem; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); font: inherit;
}
input[type=text]:focus, input[type=email]:focus, input[type=password]:focus, input[type=url]:focus, input[type=number]:focus, input[type=search]:focus, select:focus, textarea:focus {
  outline: 2px solid rgba(220, 174, 56, .42);
  border-color: rgba(31, 106, 74, .38);
  box-shadow: 0 0 0 4px rgba(220, 174, 56, .12);
}
textarea { min-height: 6rem; resize: vertical; }
.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.choice-group { display: flex; flex-wrap: wrap; gap: .35rem .75rem; border: 1px solid var(--line); border-radius: 10px; padding: .45rem .55rem; }
.choice-group legend { padding: 0 .25rem; font-size: .8rem; font-weight: 800; color: var(--muted); }
.choice-group label { display: inline-flex; align-items: center; gap: .25rem; margin: 0; }
.actions { display: flex; flex-wrap: wrap; gap: .25rem; align-items: center; margin-top: .25rem; }
.claim-form { display: inline-flex; gap: .3rem; align-items: center; }
.inline-claim-form { margin-left: .25rem; }
.anonymous-claim { display: inline-flex; align-items: center; gap: .15rem; margin: 0; color: var(--muted); font-size: .7rem; font-weight: 800; white-space: nowrap; }
.quantity-input { max-width: 3.8rem; padding-block: .22rem !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.alert { padding: .6rem .75rem; border-radius: 12px; background: #f7dfd7; color: #73251a; margin-bottom: .7rem; border: 1px solid rgba(198, 61, 53, .18); }
.status-message { background: var(--mint); color: var(--green-dark); border-color: rgba(31,106,74,.2); }
table { width: 100%; border-collapse: collapse; background: var(--card); border-radius: 18px; overflow: hidden; box-shadow: 0 8px 22px rgba(64,47,32,.06); }
th { background: linear-gradient(180deg, #fff7df, #f9ebc5); color: #5f3d0b; }
th, td { padding: .45rem .55rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.shopping-list { display: grid; gap: .45rem; }
.shopping-person { break-inside: avoid; }
.shopping-item { display: grid; grid-template-columns: auto 1fr; gap: .4rem; padding: .25rem 0; border-bottom: 1px solid var(--line); }
.shopping-item:last-child { border-bottom: 0; }
.shopping-check input { width: 1rem; height: 1rem; }
.amazon-search-box { padding: .45rem .5rem; border: 1px dashed var(--line); border-radius: 10px; background: rgba(247,243,236,.62); }
.amazon-suggestion-box { padding: .55rem .6rem; border: 1px solid rgba(31,106,74,.22); border-radius: 12px; background: linear-gradient(135deg, rgba(225,242,231,.92), rgba(255,253,248,.96)); box-shadow: 0 10px 24px rgba(64,47,32,.08); }
.suggestion-title { margin: 0 0 .12rem; font-weight: 900; color: var(--green-dark); }
.search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .3rem; align-items: end; }
.amazon-search-results { display: grid; gap: .22rem; margin-top: .35rem; }
.amazon-result { display: flex; gap: .35rem; align-items: center; padding: .3rem; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.72); }
.amazon-result__image { width: 4.5rem; height: 4.5rem; object-fit: contain; flex: 0 0 auto; border-radius: 8px; background: #fff; border: 1px solid var(--line); }
.amazon-result__image--placeholder { display: inline-flex; align-items: center; justify-content: center; color: var(--muted); font-size: .68rem; font-weight: 800; text-align: center; padding: .25rem; }
.amazon-result__choose { flex: 1; justify-content: flex-start; text-align: left; white-space: normal; }
.setup-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: .55rem; align-items: start; }
.family-tree { display: grid; gap: .22rem; }
.family-tree-row { display: flex; align-items: center; justify-content: space-between; gap: .35rem; padding: .28rem .35rem; margin-left: calc(var(--depth) * .9rem); border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.6); }
.plain-list { list-style: none; margin: .35rem 0; padding: 0; display: grid; gap: .22rem; }
.plain-list li { display: flex; align-items: center; justify-content: space-between; gap: .35rem; padding: .25rem .35rem; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.56); }
.plain-list small { overflow-wrap: anywhere; word-break: break-word; }
.plain-list form { display: inline-flex; }
.row-actions { display: inline-flex; flex-wrap: wrap; gap: .25rem; justify-content: flex-end; }
.lookup-results { display: flex; flex-wrap: wrap; gap: .2rem; width: 100%; margin-top: .15rem; }
.lookup-result { justify-content: flex-start; }
.setup-guide { background: linear-gradient(135deg, rgba(225,242,231,.76), rgba(255,253,248,.95)); }
.setup-steps { margin: .35rem 0; padding-left: 1.15rem; display: grid; gap: .22rem; }
.help-section { line-height: 1.42; }
.help-section h3 { margin-top: .65rem; }
.help-list { margin: .35rem 0; padding-left: 1.1rem; display: grid; gap: .2rem; }
.has-open-modal { overflow: hidden; }
.qr-modal[hidden] { display: none; }
.qr-modal { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 1rem; }
.qr-modal__shade { position: absolute; inset: 0; background: rgba(34, 24, 18, .55); backdrop-filter: blur(3px); }
.qr-modal__card { position: relative; width: min(100%, 24rem); display: grid; gap: .55rem; padding: .9rem; border: 1px solid rgba(255,255,255,.7); border-radius: 20px; background: linear-gradient(145deg, #fffaf2, #fff); box-shadow: 0 22px 70px rgba(44,28,18,.35); text-align: center; }
.qr-modal__close { position: absolute; top: .45rem; right: .55rem; width: 2rem; height: 2rem; border: 0; border-radius: 999px; background: rgba(104,73,47,.1); color: var(--text); font-size: 1.35rem; line-height: 1; cursor: pointer; }
.qr-modal__code { display: grid; place-items: center; min-height: 15rem; padding: .45rem; border-radius: 16px; background: #fff; border: 1px solid var(--line); }
.qr-modal__code svg { width: min(100%, 16rem); height: auto; display: block; }
.qr-modal__actions { justify-content: center; }
.dashboard-welcome { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.dashboard-stats { display: flex; flex-wrap: wrap; gap: .35rem; }
.dashboard-stats a { min-width: 5rem; padding: .45rem .55rem; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.66); text-align: center; text-decoration: none; color: inherit; }
.dashboard-stats a:hover { border-color: rgba(198, 61, 53, .35); box-shadow: 0 8px 18px rgba(64,47,32,.08); transform: translateY(-1px); }
.dashboard-stats strong { display: block; font-size: 1.25rem; line-height: 1; color: var(--accent-dark); }
.dashboard-stats span { display: block; margin-top: .15rem; color: var(--muted); font-size: .7rem; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem); gap: .65rem; align-items: start; }
.group-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; margin-top: .5rem; }
.group-entry-card { display: grid; gap: .25rem; }
.dashboard-side { display: grid; gap: .65rem; }
.quick-actions { display: grid; gap: .3rem; margin-top: .45rem; }
.quick-actions .button { width: 100%; }
.empty-state { padding: .75rem; border: 1px dashed var(--line); border-radius: 12px; background: rgba(255,255,255,.58); }
.dashboard-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; }

@media (max-width: 760px) {
  body { font-size: 15px; line-height: 1.34; }
  .site-hero { padding: .45rem 0 .55rem; }
  .top-nav, .hero-content, .page-shell { width: min(calc(100% - .65rem), 1400px); }
  .top-nav { justify-content: flex-start; gap: .22rem; margin-bottom: .4rem; }
  .top-nav a, .top-nav summary { min-height: 1.8rem; padding: .28rem .5rem; font-size: .78rem; }
  h1 { font-size: 1.35rem; }
  .landing-hero h1 { font-size: 2.1rem; line-height: 1; }
  .landing-hero-grid, .landing-two-column, .landing-feature-grid--large, .landing-use-grid, .landing-stat-grid { grid-template-columns: 1fr; }
  .landing-preview-card { padding: .65rem; border-radius: 16px; }
  .preview-gift-row { grid-template-columns: auto 1fr; }
  .preview-pill { grid-column: 2; width: fit-content; }
  .landing-lede { font-size: .98rem; }
  .landing-actions .button { width: 100%; }
  h2 { font-size: 1.08rem; }
  .page-shell { margin-top: .35rem; }
  .grid, .form-row, .setup-layout, .dashboard-grid, .group-card-grid { grid-template-columns: 1fr; gap: .5rem; }
  .dashboard-stats { width: 100%; }
  .dashboard-stats a { flex: 1 1 5rem; }
  .list-stack { gap: .5rem; }
  .panel, .form-card { padding: .55rem; border-radius: 12px; }
  .person-card, .person-list, .gift-card { padding: .45rem; border-radius: 10px; }
  .toolbar, .person-card__head, .gift-card__head { align-items: stretch; }
  .person-card__head, .gift-card__head { flex-direction: column; gap: .3rem; }
  .gift-card__tools { justify-content: flex-start; }
  .actions { align-items: stretch; }
  .actions .button, .actions button, .actions select { min-height: 1.9rem; }
  .actions input[type=search], .actions input[type=text], .actions select { width: 100%; }
  .button.small,
  .tab-bar .button,
  .row-actions .button,
  .plain-list .button { min-height: 2.25rem; padding: .38rem .6rem; font-size: .86rem; }
  .tab-bar { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .25rem; -webkit-overflow-scrolling: touch; }
  .tab-bar .button { flex: 0 0 auto; white-space: nowrap; }
  .jump-panel { position: static; }
  .jump-links { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .jump-links .button { flex: 0 0 auto; white-space: nowrap; }
  .row-actions { width: 100%; }
  .row-actions .button,
  .row-actions form,
  .row-actions form button { width: 100%; }
  .lookup-results { flex-direction: column; align-items: stretch; }
  .lookup-result { width: 100%; }
  .plain-list li { align-items: stretch; flex-direction: column; }
  .plain-list li .row-actions { justify-content: flex-start; }
  .family-subbranches { margin-left: .25rem; padding-left: .45rem; }
  .inline-claim-form { margin-left: 0; }
  .gift-meta { display: block; margin: .12rem 0 0; }
  .status { margin-top: .1rem; }
  .date-fields { grid-template-columns: minmax(8.25rem, 1fr) 4.5rem minmax(6.75rem, .8fr); }
  table { display: block; overflow-x: auto; border-radius: 12px; }
  th, td { padding: .4rem; white-space: nowrap; }
  td form.actions { min-width: 18rem; }
  .shopping-item { grid-template-columns: 1.15rem 1fr; }
  .search-row { grid-template-columns: 1fr; }
  .amazon-result { align-items: stretch; }
}

@media (max-width: 430px) {
  body { font-size: 14px; }
  .top-nav a, .top-nav .nav-more { flex: 1 1 auto; }
  .top-nav summary { width: 100%; }
  .nav-more > div { left: 0; right: auto; min-width: 100%; }
  .button, .top-nav a { border-radius: 12px; }
  .date-fields { grid-template-columns: 1fr; }
  .date-fields select,
  .date-fields input { width: 100%; }
  .date-fields .year-input { grid-column: 1 / -1; max-width: none; }
  .claim-form:not(.inline-claim-form) { width: 100%; }
  .claim-form:not(.inline-claim-form) .button { flex: 1; }
  .quantity-input { max-width: 4.5rem; }
}

@media (min-width: 900px) {
  .page-shell { width: min(calc(100% - 1rem), 1500px); }
  .list-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .person-list { break-inside: avoid; }
  .gift-card { box-shadow: none; border-radius: 8px; }
  .gift-card__head { align-items: baseline; }
  .gift-content { font-size: .92rem; }
}

@media (min-width: 1300px) {
  .list-stack { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media print {
  body { background: #fff; font-size: 11px; color: #000; }
  body:has(.print-shopping-content) .site-hero,
  body:has(.print-shopping-content) .site-footer,
  body:has(.print-shopping-content) .no-print { display: none !important; }
  body:has(.print-shopping-content) .page-shell { width: 100%; margin: 0; }
  body:has(.print-shopping-content) .page-shell > *:not(.print-shopping-content) { display: none !important; }
  body:has(.print-shopping-content) .print-shopping-content { display: block; }
  body:has(.print-shopping-content) .panel,
  body:has(.print-shopping-content) .shopping-person { box-shadow: none; border: 0; border-radius: 0; background: #fff; padding: 0; margin: 0 0 .25rem; }
  body:has(.print-shopping-content) .print-title { border-bottom: 1px solid #000; padding-bottom: .2rem; margin-bottom: .35rem; }
  body:has(.print-shopping-content) .print-title .eyebrow { display: none; }
  body:has(.print-shopping-content) .shopping-list { gap: .15rem; }
  body:has(.print-shopping-content) .shopping-person { break-inside: avoid; page-break-inside: avoid; }
  body:has(.print-shopping-content) .shopping-person h2 { font-size: 13px; margin: .25rem 0 .1rem; border-bottom: 1px solid #aaa; }
  body:has(.print-shopping-content) .gift-list { margin-top: .1rem; gap: 0; }
  body:has(.print-shopping-content) .shopping-item { padding: .12rem 0; border-bottom: 1px dotted #ccc; grid-template-columns: 1rem 1fr; }
  body:has(.print-shopping-content) .muted,
  body:has(.print-shopping-content) .help { color: #333; }
  body:has(.print-shopping-content) .gift-notes { color: #333; margin-top: .05rem; }
  a { color: inherit; text-decoration: none; }
}