
/* Geen Birthday — shared design system */
:root{
  color-scheme:dark;
  --color-bg:#160f1b;--color-bg-soft:#211522;--color-surface:rgba(39,24,39,.82);
  --color-surface-raised:rgba(49,29,47,.94);--color-text:#fff5f1;--color-text-soft:#ead6df;
  --color-muted:#cbb0bd;--color-primary:#f4b9cc;--color-primary-strong:#ffdce7;
  --color-primary-ink:#3a1c2c;--color-border:rgba(255,230,239,.14);
  --color-border-strong:rgba(255,230,239,.24);--color-focus:#ffe5ef;
  --shadow-card:0 18px 48px rgba(0,0,0,.22),0 2px 8px rgba(0,0,0,.12);
  --shadow-hover:0 24px 58px rgba(0,0,0,.3);
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;
  --space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;
  --radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-pill:999px;
  --font-body:Georgia,"Times New Roman",serif;--font-ui:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --text-xs:12px;--text-sm:14px;--text-base:17px;--text-lg:20px;--text-xl:clamp(24px,5vw,32px);
  --title-size:clamp(40px,9vw,76px);--line-body:1.75;--line-heading:1.04;
  --ease-standard:cubic-bezier(.2,.7,.2,1);--duration-fast:160ms;--duration-normal:240ms;
}
*{box-sizing:border-box}
html{min-height:100%;scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;min-height:100svh;background:
  radial-gradient(ellipse at 12% 8%,rgba(126,65,99,.32),transparent 34%),
  radial-gradient(ellipse at 88% 78%,rgba(92,45,82,.26),transparent 36%),
  linear-gradient(145deg,#211522 0%,var(--color-bg) 72%);
  color:var(--color-text);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--line-body);overflow-x:hidden}
a{color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit}
button:focus-visible,a:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
.site-shell{position:relative;z-index:1;width:min(100% - 32px,800px);min-height:100svh;margin-inline:auto;padding:clamp(24px,5vh,48px) 0;display:flex;flex-direction:column;justify-content:center}
.page-head{text-align:center;margin:0 auto var(--space-8);max-width:680px}
.eyebrow{font:600 11px/1.5 var(--font-ui);letter-spacing:.22em;text-transform:uppercase;color:var(--color-primary);margin:0 0 var(--space-4)}
h1,h2,h3{font-weight:400;line-height:var(--line-heading);letter-spacing:-.035em}
h1{font-size:var(--title-size);margin:0 0 var(--space-4)}
h1 em{color:var(--color-primary);font-style:italic}
h2{font-size:var(--text-xl);margin:0 0 var(--space-4)}
.lead{max-width:590px;margin:0 auto;color:var(--color-text-soft);font-size:clamp(16px,3.8vw,19px);line-height:1.75}
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-3);margin-top:var(--space-6)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:48px;padding:12px 22px;border:1px solid transparent;border-radius:var(--radius-pill);background:linear-gradient(135deg,#ffe8ef,var(--color-primary));color:var(--color-primary-ink);font:650 var(--text-sm)/1.2 var(--font-ui);text-decoration:none;text-align:center;cursor:pointer;transition:transform var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard),background var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard);box-shadow:0 8px 24px rgba(7,3,9,.2)}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(7,3,9,.28)}
.btn:active{transform:translateY(0) scale(.98)}
.btn:disabled{opacity:.48;cursor:not-allowed;transform:none;box-shadow:none}
.btn-secondary{background:rgba(255,245,250,.06);color:var(--color-text);border-color:var(--color-border-strong);box-shadow:none}
.btn-secondary:hover{background:rgba(255,245,250,.1);border-color:rgba(255,230,239,.38)}
.page-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:var(--space-10) auto 0}
.page-nav a{font:600 11px/1.2 var(--font-ui);text-decoration:none;color:var(--color-text-soft);border:1px solid var(--color-border);border-radius:var(--radius-pill);padding:9px 13px;background:rgba(255,255,255,.025);transition:background var(--duration-fast),color var(--duration-fast),border-color var(--duration-fast)}
.page-nav a:hover{background:rgba(255,255,255,.08);border-color:var(--color-border-strong)}
.page-nav a[aria-current=page]{background:var(--color-primary);color:var(--color-primary-ink);border-color:transparent}
.site-footer{text-align:center;color:var(--color-muted);font:12px/1.5 var(--font-ui);margin-top:var(--space-4)}
.status-text{font:var(--text-sm)/1.5 var(--font-ui);color:var(--color-muted);text-align:center}
[hidden]{display:none!important}
@media(max-width:480px){.site-shell{width:min(100% - 24px,800px);padding:24px 0}.page-head{margin-bottom:var(--space-6)}.page-nav{gap:6px;margin-top:var(--space-8)}.page-nav a{padding:8px 10px}.actions{gap:10px}.actions .btn{width:100%;max-width:340px}}
@media(min-width:768px){.site-shell{padding-block:48px}.page-head{margin-bottom:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
