/* Shared surfaces and controls for public, reading, account and administration pages. */
:root {
  --paper: #f7f6f1;
  --ink: #203d34;
  --muted: #53665b;
  --line: #d6ddd3;
  --accent: #476b54;
  --white: #fffefa;
  --surface-muted: #edf0e7;
  --focus: #2d7455;
  --radius: .875rem;
  --display: Georgia, 'Times New Roman', serif;
  --gold: #806239;
  --shadow: none;
}
html { scroll-padding-top: 1.5rem; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 1rem; line-height: 1.65; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4 { font-family: inherit; font-weight: 600; letter-spacing: -.035em; line-height: 1.16; text-wrap: balance; }
h1 { font-family: var(--display); font-weight: 400; font-size: clamp(2.5rem, 4.5vw, 4rem); letter-spacing: -.03em; }
h2 { font-family: var(--display); font-weight: 400; font-size: clamp(1.8rem, 2.6vw, 2.4rem); letter-spacing: -.025em; }
h3 { font-size: 1.35rem; letter-spacing: -.02em; }
p { text-wrap: pretty; }
a, button, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
main { max-width: 1240px; padding: 3.5rem 2.5rem 6rem; }
.site-header, .landing-page .site-header { position: relative; z-index: 40; display: block; max-width: 1240px; margin: .75rem auto 0; padding: 0 2rem; border: 0; }
.header-content { position: relative; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 1rem 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: var(--paper); box-shadow: none; }

.brand { gap: .6rem; font-size: 1.3rem; font-weight: 600; letter-spacing: -.035em; white-space: nowrap; }
.brand-mark { width: 36px; height: 36px; flex-basis: 36px; }
.site-nav, .landing-page .site-nav { order: 2; margin-left: auto; display: flex; align-items: center; flex-wrap: nowrap; gap: .15rem; font-size: .82rem; }
.site-nav a, .site-nav button, .landing-page .site-nav a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .55rem .75rem; border-radius: .8rem; white-space: nowrap; }
.site-nav a[aria-current='page']:not(.primary) { background: var(--surface-muted); color: var(--ink); }
.site-nav form { margin: 0; }
.site-nav .quiet { font-size: inherit; }
.landing-page .site-nav .landing-nav-login { border: 0; padding: .55rem .75rem; border-radius: .8rem; }
.site-nav .primary, .landing-page .site-nav .landing-nav-register { padding: .55rem 1rem; }
.navigation-toggle { order: 4; display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .5rem .75rem; font-size: .85rem; }
.header-menu { position: relative; margin: 0; }
.header-menu > summary { display: flex; align-items: center; justify-content: center; gap: .4rem; min-height: 44px; padding: .55rem .75rem; border-radius: .8rem; cursor: pointer; list-style: none; white-space: nowrap; }
.header-menu > summary::-webkit-details-marker { display: none; }
.header-menu > summary:hover, .header-menu[open] > summary { background: var(--surface-muted); }
.header-menu > summary:active { background: var(--line); }
.header-menu-panel { position: absolute; top: calc(100% + .65rem); right: 0; z-index: 1; width: 15rem; max-width: calc(100vw - 3rem); padding: .5rem; background: #fff; border: 1px solid var(--line); border-radius: 1rem; box-shadow: 0 12px 32px #203d341a; }
.header-menu-panel a, .header-menu-panel button { display: flex; align-items: center; justify-content: space-between; min-height: 44px; width: 100%; padding: .65rem .8rem; border-radius: .6rem; font-size: .85rem; }
.header-menu-panel form { margin: 0; }
.site-nav .header-menu-panel a { white-space: normal; }
.header-menu-panel a:hover, .header-menu-panel button:hover { background: var(--surface-muted); }
.language-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .15rem .65rem; }
.language-links form { margin: 0; }
.language-links .language-link { display: inline-flex; align-items: center; gap: .35rem; min-height: 36px; margin: 0; padding: .2rem .15rem; border: 0; border-radius: .25rem; background: transparent; box-shadow: none; color: var(--muted); font: inherit; font-size: .75rem; line-height: 1.5; text-decoration: none; white-space: nowrap; cursor: pointer; transition: color 140ms ease; }
.language-link .language-flag { font-size: 1rem; opacity: .6; transition: opacity 140ms ease; }
.language-links .language-link[aria-current='true'] { color: var(--ink); font-weight: 650; }
.language-link[aria-current='true'] .language-flag, .language-link:hover .language-flag, .language-link:focus-visible .language-flag { opacity: 1; }
.language-links .language-link:hover, .language-links .language-link:focus-visible { color: var(--ink); background: transparent; text-decoration: underline; text-underline-offset: .25rem; }
.header-languages { justify-content: center; margin-bottom: .35rem; padding: 0 .5rem; }
.site-footer { display: block; }
.footer-content { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.footer-feedback { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.footer-version { color: var(--muted); font-size: .75rem; }
@media (pointer: coarse) { .language-links .language-link { min-height: 44px; } }
.menu-chevron { font-size: 1rem; }
button, .button, .primary, input[type='submit'] { min-height: 44px; border-radius: .5rem; padding: .75rem 1.15rem; font-size: .9rem; font-weight: 550; line-height: 1.4; touch-action: manipulation; transition: background-color 140ms ease, box-shadow 140ms ease; }
button:active, .button:active, .primary:active { transform: scale(.98); transition: none; }
.primary { background: var(--ink); color: #fff; border-color: var(--ink); box-shadow: 0 2px 4px #203d3410; }
.primary:hover { background: #305747; }
.quiet { border-radius: .65rem; padding: .5rem .65rem; }
.button:hover, button:not(.primary):hover { background-color: var(--surface-muted); }
.eyebrow { color: var(--muted); font-size: .72rem; font-weight: 650; letter-spacing: .12em; }
.lede { font-size: 1.1rem; line-height: 1.65; color: var(--muted); }
.panel, .reading-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 2rem; box-shadow: var(--shadow); }
main > :is(.panel, .form-grid, .account-grid, .reading-grid, .report-grid, .coach-application) + :is(.panel, .form-grid, .account-grid, .reading-grid, .report-grid, .coach-application), .legal-page > .panel + .panel { margin-top: 1.5rem; }
.muted-panel { background: var(--surface-muted); box-shadow: none; }
.page-heading { align-items: center; gap: 1.5rem; margin-bottom: 2rem; }
.page-heading h1 { margin-bottom: .6rem; }
.page-heading p { color: var(--muted); }
.two, .reading-grid, .report-grid, .account-grid { gap: 1.5rem; }
.reading-card h2 { font-size: 1.5rem; }
.status { padding: .35rem .65rem; font-size: .75rem; font-weight: 550; background: var(--surface-muted); }
.panel + .reading-grid { margin-top: 1.5rem; }
.card-bottom { padding-top: 1rem; margin-top: 1.5rem; gap: 1rem; }
.form-grid { gap: 2rem; align-items: start; }
label { margin-top: 1.25rem; font-size: .85rem; font-weight: 550; }
input, select, textarea { min-height: 48px; padding: .8rem .9rem; border: 1px solid #bfcfc4; border-radius: .8rem; font: inherit; background: #fff; color: var(--ink); }
input:focus, select:focus, textarea:focus { border-color: var(--focus); box-shadow: 0 0 0 3px #2d745514; outline-color: var(--focus); }
input[type='checkbox'], input[type='radio'] { min-height: auto; accent-color: var(--ink); }
input::placeholder, textarea::placeholder { color: var(--muted); }
.auth-grid { gap: 5rem; padding: 2rem 0; }
.auth-panel { max-width: 480px; padding: 2.5rem; }
.auth-panel h2 { font-size: 1.75rem; }
.password-field { position: relative; }
.password-field input { width: 100%; margin-top: 0; padding-right: 3.5rem; }
.password-visibility { position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; min-height: 44px; padding: 0; display: grid; place-items: center; color: var(--ink); background: transparent; border: 0; box-shadow: none; }
.password-visibility:hover { background: #e7ede7; }
.password-visibility:active { transform: translateY(-50%); }
.password-visibility[hidden], .password-visibility [hidden] { display: none; }
.notice { border-radius: 1rem; padding: 1rem 1.25rem; background: #e4f0e7; border: 1px solid #c9dfce; }
.notice.error { background: #fff0e9; border-color: #edd0c0; }
summary { min-height: 44px; padding: .65rem 0; font-size: .9rem; }
.table-wrap { border: 1px solid var(--line); border-radius: 1rem; }
th { font-size: .75rem; font-weight: 600; background: var(--surface-muted); }
th, td { padding: .9rem 1rem; }
tbody tr:last-child td { border-bottom: 0; }
.reading-tabs { gap: .3rem; padding: .35rem; background: #e7ede7; border-radius: 1rem; }
.reading-tabs .reading-tab, .reading-tabs a { min-height: 44px; padding: .7rem 1rem; border-radius: .75rem; font-size: .85rem; }
.reading-tabs [role='tab'][aria-selected='true'], .reading-tabs a[aria-current='page'] { color: var(--ink); background: #fff; box-shadow: 0 2px 8px #203d3412; border-bottom-color: transparent; }
.account-grid .panel { scroll-margin-top: 7rem; }
.account-nav { gap: .4rem; }
.account-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: .6rem .9rem; border-radius: .8rem; background: var(--surface-muted); }
.interpretation { margin-top: 3rem; }
.interpretation h2 { font-family: inherit; font-size: 2rem; }
.interpretation p { line-height: 1.8; }
.speech-toolbar { top: 6.5rem; z-index: 25; padding: 1rem; border-radius: 1.25rem; background: #edf2edf5; box-shadow: 0 4px 16px #203d3410; }
.source-tabs button { min-height: 44px; border-radius: .75rem; }
.birth-calendar { border-radius: 1.15rem; padding: 1rem; box-shadow: 0 16px 40px #203d3420; }
.calendar-grid button { min-height: 44px; }
.places-list { border-radius: .85rem; box-shadow: 0 8px 24px #203d3412; }
.places-list button { min-height: 48px; border-radius: 0; }
footer { width: 100%; max-width: none; padding: 2rem 2.5rem; color: var(--muted); gap: 2rem; font-size: .75rem; }
.landing { --landing-gold: var(--gold); }
.landing-page main { padding-top: 2.5rem; }
.landing section[id] { scroll-margin-top: 7rem; }
.landing h2 { font-size: clamp(2.2rem, 3.7vw, 3.25rem); max-width: 26ch; margin-top: 0; }
.landing-hero { grid-template-columns: minmax(0, 1.35fr) minmax(0, .85fr); gap: 2rem; padding: 1.5rem 0 4rem; }
.landing-hero h1 { font-size: clamp(3.25rem, 6.2vw, 5.25rem); line-height: 1.04; margin: 0 0 1.75rem; text-wrap: initial; }
.landing-hero em { font-style: italic; color: var(--accent); }
.landing-hero .lede { font-size: 1.1rem; line-height: 1.75; max-width: 52ch; }
.landing-highlights { gap: .6rem 1.25rem; margin-block: 1.5rem; padding-block: 1rem; border-block: 1px solid var(--line); }
.landing-highlights li { border: 0; border-radius: 0; background: transparent; padding: 0; color: var(--ink); font-size: .8rem; }
.landing-actions { gap: .8rem 1.5rem; }
.landing-actions .primary, .landing-offer-card .primary { padding: .95rem 1.3rem; border-radius: .5rem; }
.landing-text-link { min-height: 44px; }
.landing-product { padding: 2rem 0; background: radial-gradient(ellipse, #dce9df 0%, transparent 70%); }
.landing-book { min-height: 440px; padding: 2.25rem; border: 1px solid #456657; border-radius: 1.75rem; background: linear-gradient(145deg, #315547, #203d34); transform: none; box-shadow: 0 24px 48px #203d3426, inset 0 1px 0 #ffffff20; }
.landing-book .eyebrow, .landing-cover-footer { color: #dbe7de; }
.landing-cover-title { font-family: inherit; font-weight: 500; font-size: 2rem; letter-spacing: -.035em; }
.landing-orbit { border-color: #bdd4b8; }
.landing-orbit::before, .landing-orbit::after { border-color: #bdd4b850; }
.landing-orbit span { color: #d2e5c4; }
.landing-intro { padding: 3.5rem 2rem; border: 0; background: #eaf0ea; border-radius: 2rem; }
.landing-section { padding: 4.5rem 0; }
.landing-features { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 3rem; margin-top: 2.5rem; }
.landing-features article { padding: 1.5rem 0 0; background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; }
.landing-features h3 { font-size: 1.25rem; margin: 0 0 .75rem; }
.landing-number, .landing-steps li::before { font-family: inherit; font-weight: 600; }
.landing-methods { padding: 2rem; border-radius: .875rem; background: var(--surface-muted); }
.landing-methods li { background: #fff; border-color: var(--line); }
.landing-offer, .landing-sample, .landing-gift, .landing-trust { gap: 3.5rem; border-top: 0; }
.landing-calculation-note { margin: 0 0 1.5rem; padding: 1.5rem 0; border-block: 1px solid var(--line); color: var(--ink); font-size: clamp(1.2rem, 2vw, 1.5rem); line-height: 1.4; }
.landing-calculation-note strong { font-weight: 650; }
.legal-details { max-width: 48rem; }
.legal-details dt { margin-top: 1rem; font-size: .85rem; color: var(--muted); }
.legal-details dd { margin: .25rem 0 0; overflow-wrap: anywhere; }
.landing-offer-card { padding: 2.5rem; border: 1px solid var(--line); border-radius: .875rem; background: var(--white); }
.landing-offer-card .landing-price { font-family: inherit; font-size: 4rem; font-weight: 600; letter-spacing: -.055em; }
.landing-sample-page { padding: 2.5rem; border-radius: 1.75rem; box-shadow: var(--shadow); }
.landing-sample-page h3 { font-size: 1.8rem; }
.landing-sample-page blockquote { font: 500 1.25rem/1.6 -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; border-color: var(--accent); }
.landing-steps { gap: 2.5rem; }
.landing-steps li { padding: 1.5rem 0; background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; }
.landing-steps h3 { font-size: 1.4rem; }
.landing-gift-card { background: #edf0e7; border-color: var(--line); border-radius: .875rem; transform: none; box-shadow: none; }
.landing-gift-card > p:last-child { font-family: inherit; font-size: 1rem; }
.landing-faq { border-top: 0; }
.landing-faq summary { font-weight: 550; padding: 1.25rem .25rem; }
.landing-closing { padding: 4rem 2rem; border-radius: .875rem; background: var(--surface-muted); }
.landing-closing h2 { margin-inline: auto; }
@media (hover: hover) { .site-nav a:not(.primary):hover { background: var(--surface-muted); } }
@media (max-width: 68rem) {
  .site-header, .landing-page .site-header { margin-top: .5rem; padding: 0 1rem; }
  .header-content { flex-wrap: wrap; gap: .5rem; padding: .5rem .75rem; }
  .navigation-toggle { margin-left: auto; }
  .site-nav, .landing-page .site-nav { order: 5; margin-left: 0; width: 100%; flex-wrap: wrap; justify-content: start; }
  .navigation-enhanced .site-nav { position: absolute; top: calc(100% + .5rem); left: 0; right: 0; width: auto; display: grid; gap: .3rem; padding: .75rem; border: 1px solid var(--line); border-radius: 1.25rem; background: #fff; box-shadow: 0 16px 40px #203d3420; max-height: calc(100dvh - 6rem); overflow-y: auto; }
  .navigation-enhanced .site-nav a, .navigation-enhanced .site-nav button { justify-content: start; width: 100%; padding: .75rem 1rem; }
  .navigation-enhanced .site-nav .primary { justify-content: center; }
  .navigation-enhanced .account-menu > summary { justify-content: space-between; padding: .75rem 1rem; }
  .account-menu .header-menu-panel { position: static; width: 100%; max-width: none; margin-top: .25rem; box-shadow: none; background: var(--surface-muted); }
}
@media (max-width: 54rem) {
  main { padding: 2.5rem 1.5rem 4rem; }
  .auth-grid { gap: 2rem; }
  .landing-hero { gap: 2rem; }
  .landing-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .landing-offer, .landing-sample, .landing-gift, .landing-trust { gap: 2rem; }
}
@media (max-width: 40rem) {
  main, .landing-page main { padding: 2rem 1.25rem 3rem; }
  .brand { font-size: 1rem; } .brand-mark { width: 32px; height: 32px; flex-basis: 32px; }
  .page-heading { align-items: start; flex-direction: column; }
  .panel, .reading-card, .auth-panel { padding: 1.5rem; border-radius: var(--radius); }
  .auth-grid { padding: 0; } .auth-panel { max-width: none; }
  .two, .reading-grid, .account-grid, .form-grid, .report-grid { grid-template-columns: minmax(0, 1fr); }
  .reading-tabs { flex-wrap: wrap; }
  .reading-tabs .reading-tab, .reading-tabs a { flex: 1 1 auto; }
  .speech-toolbar { top: 5.5rem; }
  .source-selection, .batch-stages { grid-template-columns: minmax(0, 1fr); }
  .birth-calendar { width: 340px; max-width: calc(100vw - 88px); padding: .5rem; }
  .calendar-grid button { min-height: 40px; }
  .lab-controls { grid-template-columns: minmax(0, 1fr); }
  .landing-hero { grid-template-columns: minmax(0, 1fr); padding: 1rem 0 3rem; }
  .landing-hero h1 { font-size: clamp(2.6rem, 10vw, 3.75rem); }
  .landing-product { padding: 1rem 0; }
  .landing-book { max-width: 320px; min-height: 0; padding: 2rem; }
  .landing-section { padding: 3rem 0; }
  .landing-intro, .landing-closing { padding: 2.5rem 1.25rem; border-radius: .875rem; }
  .landing-features { grid-template-columns: minmax(0, 1fr); }
  .landing-methods, .landing-offer-card, .landing-sample-page { padding: 1.5rem; }
  .landing-offer, .landing-sample, .landing-gift, .landing-trust, .landing-steps { grid-template-columns: minmax(0, 1fr); }
  .landing-gift-figure { padding: 0; }
  footer { padding: 2rem 1.25rem; flex-direction: column; gap: .75rem; }
}
.reading-stories { background: var(--surface-muted); }
.reading-stories > h2 { max-width: 32ch; }
.story-cards { margin-top: 1.5rem; }
.story-card { max-width: 70ch; }
.story-type { display: inline-block; margin: 0 0 .75rem; padding: .25rem .65rem; border: 1px solid var(--line); border-radius: .65rem; background: var(--white); color: var(--muted); font-size: .75rem; }
.story-card h3 { margin-top: 0; }
.story-note { padding-left: 1rem; border-left: 2px solid var(--accent); }
.story-sources { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 1rem 0; padding: 0; list-style: none; font-size: .8rem; }
.story-sources a { text-decoration: underline; text-underline-offset: .2em; overflow-wrap: anywhere; }
.story-controls { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.story-controls button { min-width: 44px; }
.story-counter { font-variant-numeric: tabular-nums; }
.story-pause { margin-left: auto; }
@media (max-width: 40rem) { .story-pause { flex-basis: 100%; margin-left: 0; text-align: left; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
  button:active, .button:active, .primary:active { transform: none; filter: brightness(.92); }
}
@media (prefers-reduced-transparency: reduce) {
  .header-content, .speech-toolbar { background: #fff; backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  :root { --muted: #304a3c; --line: #75897c; }
  .header-content, .speech-toolbar { background: #fff; backdrop-filter: none; border: 1px solid #75897c; }
  input, select, textarea { border-color: #577361; }
}

.legal-page { max-width: 56rem; margin: 0 auto; }
.legal-panel-stack { display: grid; gap: 1.5rem; margin-block: 1.5rem; }
.legal-panel-stack > .panel { margin: 0; }
.legal-page h1 { overflow-wrap: anywhere; hyphens: auto; }
.legal-navigation { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; margin-bottom: 2rem; }
.legal-navigation a { padding: .4rem 0; }
.legal-navigation .legal-withdrawal-link { padding: .55rem .85rem; border: 1px solid var(--accent); border-radius: .6rem; color: var(--ink); }
footer { flex-direction: column; align-items: center; gap: .75rem; text-align: center; }
footer .legal-navigation { justify-content: center; margin: 0; }
.legal-text { margin: 1.5rem 0; }
.legal-text p { white-space: pre-line; overflow-wrap: anywhere; }
.legal-text h2 { font-size: clamp(1.3rem, 3vw, 1.8rem); }
@media print {
  header, footer, .legal-navigation, .legal-page .primary { display: none; }
  .legal-page { max-width: none; }
  .legal-text { border: 0; padding: 0; box-shadow: none; }
}

.gift-purchase + .gift-purchase { border-top: 1px solid var(--line, #d9dfda); margin-top: 2rem; padding-top: 2rem; }
.gift-code { margin-block: 1.5rem; }
.gift-code input { font-family: ui-monospace, monospace; font-size: .9rem; }

.coach-fieldset { border: 0; padding: 0; margin: 1.5rem 0; }
.coach-fieldset legend { font-weight: 600; margin-bottom: .75rem; }
.coach-checkbox-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.coach-fieldset .account-checkbox { min-height: 44px; align-items: center; margin-top: .25rem; }
.coach-fieldset .account-checkbox input { margin-top: 0; }
.coach-portrait { width: 10rem; height: 10rem; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.coach-prose { white-space: pre-line; overflow-wrap: anywhere; }
.coach-application > .panel { margin: 1.5rem 0; }
.coach-filters { display: flex; flex-wrap: wrap; gap: 1rem; align-items: end; margin-bottom: 2rem; }
.coach-filters label { flex: 1 1 14rem; }
.coach-card { overflow-wrap: anywhere; }
.coach-application textarea { width: 100%; }
.coach-application .panel, .coach-fieldset, .coach-filters > *, .reading-grid > *, .two > * { min-width: 0; }
.coach-application input[type='file'] { max-width: 100%; }
@media (max-width: 40rem) {
  .coach-checkbox-grid { grid-template-columns: minmax(0, 1fr); }
  .coach-filters { padding: 1.25rem; }
  .coach-filters label, .coach-filters button { width: 100%; }
  .coach-filters select { width: 100%; }
  .coach-application input, .coach-application select, .coach-application textarea { font-size: 1rem; }
  .header-menu > summary { font-size: 1rem; }
  .navigation-toggle { padding-inline: .5rem; }
  .navigation-toggle { width: 44px; padding: 0; justify-content: center; }
  .navigation-toggle-label { display: none; }
  .section-heading > div { min-width: 0; overflow-wrap: anywhere; }
}

.panel-stack { display: grid; gap: 1.5rem; }
.backoffice-period { margin-bottom: 1.5rem; }
.backoffice-user-panel { min-width: 0; }
.backoffice-user-panel th { white-space: normal; min-width: 6rem; }
.backoffice-gift-list { min-width: 16rem; padding-left: 1.25rem; }
.backoffice-gift-list li + li { margin-top: 1rem; }
.gift-page-heading h1 { overflow-wrap: anywhere; hyphens: auto; }
.panel-stack > * { min-width: 0; margin-block: 0; }
.panel-stack > .panel { margin-block: 0; }

/* Feedback uses the shared reading and account surfaces. */
.feedback-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.feedback-category { display: block; text-decoration: none; color: var(--ink); }
a.feedback-category:hover { border-color: var(--accent); background: var(--surface-muted); }
.feedback-category h2 { font-size: 1.4rem; margin: .75rem 0; }
.feedback-category p { color: var(--muted); }
.feedback-category-icon { display: inline-grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: var(--surface-muted); font-size: 1.5rem; }
.feedback-form-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr); gap: 1.5rem; align-items: start; }
.feedback-help h2 { font-size: 1.4rem; }
.feedback-rating, .feedback-topics { border: 0; padding: 0; margin: 1.5rem 0; min-width: 0; }
.feedback-rating legend, .feedback-topics legend { font-size: .9rem; font-weight: 550; }
.feedback-rating-options, .feedback-topic-options { display: flex; flex-wrap: wrap; gap: .6rem; }
.feedback-rating-options label, .feedback-topic-options label { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: .5rem .7rem; margin-top: .65rem; border: 1px solid var(--line); border-radius: .75rem; cursor: pointer; }
.feedback-rating-options label:has(:checked), .feedback-topic-options label:has(:checked) { background: var(--surface-muted); border-color: var(--accent); }
.feedback-checkbox { display: flex; align-items: center; gap: .7rem; }
.feedback-user-agent, .feedback-message { overflow-wrap: anywhere; white-space: pre-wrap; font: inherit; }
.feedback-detail h2 { font-size: 1.6rem; }
.feedback-filters, .feedback-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 1rem; margin-bottom: 1.5rem; }
.feedback-filters label, .feedback-actions label { flex: 1 1 180px; margin: 0; }
.feedback-filters button, .feedback-actions button { margin: 0; }
@media (max-width: 760px) { .feedback-category-grid, .feedback-form-grid { grid-template-columns: 1fr; } }

.gift-occasion-picker { margin: 1.5rem 0; padding: 0; border: 0; }
.gift-occasion-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: .75rem; }
.gift-occasion-option { position: relative; cursor: pointer; margin: 0; }
.gift-occasion-option > input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.gift-occasion-option > span { display: block; height: 100%; border: 2px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--paper); }
.gift-occasion-option img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.gift-occasion-option > span > span { display: block; padding: .65rem; font-size: .9rem; }
.gift-occasion-option input:checked + span { border-color: var(--accent); background: var(--surface-muted); }
.gift-occasion-option input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 3px; }
.gift-card-image { display: block; width: 100%; height: auto; border-radius: 16px; }
.gift-card-preview { margin-bottom: 1.5rem; }
.recipient-gift-card { max-width: 800px; margin: 0 auto; }
.gift-greeting { margin-top: 1.5rem; }
.gift-greeting summary { cursor: pointer; font-size: 1.2rem; font-weight: 600; padding: .75rem 0; }
.gift-message { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 1.1rem; line-height: 1.7; }
.gift-signature { white-space: pre-wrap; overflow-wrap: anywhere; text-align: right; }
@media (max-width: 600px) { .gift-occasion-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gift-countdown-units { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1.5rem 0; }
.gift-countdown-units > span { flex: 1 1 90px; padding: 1rem; border-radius: 12px; background: var(--surface-muted); text-align: center; }
.gift-countdown-units strong { display: block; font-size: 2rem; font-variant-numeric: tabular-nums; }
.gift-waiting [hidden] { display: none; }

/* Fine details shared by the reading, account and public paths. */
::selection { color: var(--white); background: var(--ink); }
input, textarea { caret-color: var(--focus); }
html { scrollbar-color: #8b9b8d var(--paper); }
.panel .panel { box-shadow: none; }
.reading-card h2 { font-family: inherit; font-weight: 600; }
.reading-card h2 a { text-decoration-thickness: 1px; }
.interpretation { max-width: 75ch; margin-inline: auto; }
.interpretation h2 { font-family: var(--display); font-weight: 400; }
.interpretation p { font-size: 1.0625rem; }
.table-wrap { font-variant-numeric: tabular-nums; }
:where(button, .button, .primary):disabled, [aria-disabled='true'] { opacity: .6; cursor: not-allowed; }
.landing-hero > div, .landing-section > div { min-width: 0; }
.landing-hero > div > .small { max-width: 58ch; }
.landing-hero > div > p > strong { font-weight: 500; }
.landing-section-heading > p { max-width: 58ch; }
.landing-steps h3 { margin: .85rem 0; }
.landing-faq details[open] { padding-bottom: .75rem; }
.landing-faq details[open] summary { color: var(--accent); }
.auth-panel { border-top: 3px solid var(--accent); }
.auth-panel h2 { margin-top: 0; }
.auth-grid .intro h1 { font-size: clamp(2.5rem, 4vw, 4rem); }
.example-card { border-radius: var(--radius); background: transparent; }
.example-card h3 { font-family: var(--display); font-weight: 400; }
.example-note { border-left-width: 1px; background: var(--surface-muted); }
@media (min-width: 68.01rem) { .site-header, .landing-page .site-header { padding-inline: 2.5rem; } }
@media (min-width: 40.01rem) and (max-width: 54rem) { .landing-hero { grid-template-columns: minmax(0, 1fr); } .landing-celestial { display: none; } }
@media (max-width: 40rem) {
  .header-content { padding-inline: 0; }
  .landing-actions { align-items: stretch; flex-direction: column; gap: .5rem; }
  .landing-actions .primary { text-align: center; }
  .landing-highlights { gap: .75rem; }
  .landing-highlights li { flex: 1 1 8rem; }
  .landing-steps { gap: 1rem; }
  .landing h2 { overflow-wrap: anywhere; hyphens: auto; }
}
@media (max-width: 40rem) {
  .auth-panel { order: -1; }
  .auth-grid .intro { padding-top: 1rem; }
  .auth-grid .auth-celestial { display: none; }
}