@property --bg{syntax:"<color>";inherits:true;initial-value:#241634}@property --glow{syntax:"<color>";inherits:true;initial-value:#6b3a6f}@property --ink{syntax:"<color>";inherits:true;initial-value:#fdf2ff}@property --muted{syntax:"<color>";inherits:true;initial-value:#cdb6d8}@property --accent{syntax:"<color>";inherits:true;initial-value:#f2c96b}@property --on-accent{syntax:"<color>";inherits:true;initial-value:#241634}@property --card{syntax:"<color>";inherits:true;initial-value:#ffffff14}:root{--serif:"Playfair Display", Georgia, serif;--script:"Great Vibes", "Snell Roundhand", cursive;--sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;font:16px/1.5 var(--sans);color:var(--ink);background:var(--bg);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;transition:--bg .9s,--glow .9s,--ink .9s,--muted .9s,--accent .9s,--on-accent .9s,--card .9s}*,:before,:after{box-sizing:border-box}body{background:var(--bg);margin:0}h1,h2,p{margin:0}button,input{font:inherit}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){:root{transition:none}*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}.app{min-height:100dvh;padding:max(20px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));background:radial-gradient(120% 60% at 50% 0%, var(--glow), transparent 75%), var(--bg);justify-content:center;display:flex;position:relative;overflow-x:hidden}.screen{z-index:1;flex-direction:column;gap:18px;width:100%;max-width:460px;animation:.5s both rise;display:flex;position:relative}.screen-start,.screen-finale{text-align:center;justify-content:center}@keyframes rise{0%{opacity:0;transform:translateY(12px)}}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-size:.78rem;font-weight:600}.title{font-family:var(--serif);font-size:clamp(2.2rem,11vw,3rem);font-weight:700;line-height:1.05}.title-version{color:var(--accent);margin-top:6px;font-size:.5em;font-style:italic;font-weight:500;display:block}.era-header{text-align:center}.era-name{font-family:var(--serif);margin-top:4px;font-size:clamp(1.6rem,8vw,2.1rem);font-style:italic;font-weight:500;line-height:1.15}.era-tagline{font-family:var(--serif);color:var(--muted);font-size:.95rem}.question{font-family:var(--serif);font-size:clamp(1.3rem,5.6vw,1.6rem);font-weight:500;line-height:1.3}.card{border:1px solid color-mix(in srgb, var(--ink) 12%, transparent);background:var(--card);-webkit-backdrop-filter:blur(10px);border-radius:24px;flex-direction:column;gap:18px;padding:24px 20px;display:flex;box-shadow:0 18px 40px -24px #00000073}.intro{text-align:left;gap:10px}.button{background:var(--accent);width:100%;min-height:54px;color:var(--on-accent);cursor:pointer;box-shadow:0 10px 24px -12px var(--accent);border:none;border-radius:999px;justify-content:center;align-items:center;padding:12px 22px;font-size:1.05rem;font-weight:600;transition:transform .15s,opacity .2s;display:inline-flex}.button:active{transform:scale(.98)}.button:disabled{cursor:default;opacity:.55}.button:focus-visible,.answer-input:focus-visible,.review summary:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 60%, transparent);outline-offset:3px}.button-ghost{color:var(--ink);border:1.5px solid color-mix(in srgb, var(--ink) 25%, transparent);box-shadow:none;background:0 0}.error{color:var(--ink);background:#d62d3a24;border-radius:12px;padding:10px 14px;font-size:.92rem}.answer-form{flex-direction:column;gap:12px;display:flex}.answer-input{border:1.5px solid color-mix(in srgb, var(--ink) 20%, transparent);background:color-mix(in srgb, var(--ink) 5%, transparent);width:100%;min-height:54px;color:var(--ink);border-radius:16px;padding:12px 18px;font-size:1.05rem}.answer-input::placeholder{color:var(--muted)}.answer-input:focus{border-color:var(--accent)}.thinking{align-items:center;gap:10px;display:inline-flex}.vinyl{background:radial-gradient(circle, var(--on-accent) 0 2px, var(--accent) 2.5px 6px, transparent 6.5px), repeating-radial-gradient(circle, #111 0 1.5px, #2b2b2b 1.5px 3px);border-radius:50%;width:26px;height:26px;animation:1.2s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result{border-radius:16px;flex-direction:column;gap:8px;padding:16px;animation:.4s both rise;display:flex}.result-correct{background:#2faa6b29}.result-wrong{background:#d62d3a21}.result-title{font-family:var(--serif);font-size:1.35rem;font-weight:700}.result-answer{color:var(--muted);font-size:.88rem}.result-solution{border-top:1px solid color-mix(in srgb, var(--ink) 12%, transparent);padding-top:8px}.bracelet{width:100%;display:block;overflow:visible}.bracelet-string{stroke:color-mix(in srgb, var(--ink) 30%, transparent);stroke-width:1.5px}.bead circle{fill:color-mix(in srgb, var(--ink) 8%, var(--bg));stroke:color-mix(in srgb, var(--ink) 18%, transparent);stroke-width:1px;transition:fill .5s}.bead text{font:700 13px var(--sans);fill:var(--muted)}.bead-correct circle,.bead-wrong circle{stroke:#00000026}.bead-wrong text{fill:var(--ink)}.bead-current circle{stroke:var(--accent);stroke-width:2.5px;animation:1.6s ease-in-out infinite pulse}.bead-current text{fill:var(--ink)}@keyframes pulse{50%{stroke-width:5px}}.birthday{flex-direction:column;gap:4px;font-weight:400;display:flex}.birthday-line{font-family:var(--serif);font-size:clamp(1.5rem,7vw,2rem);font-style:italic;font-weight:500}.birthday-name{font-family:var(--script);background:linear-gradient(100deg,#d9468c,#f2a93b,#b9a8ec,#2f86bb,#d9468c) 0 0/250% 100%;color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(4rem,20vw,5.5rem);line-height:1.1;animation:6s linear infinite shimmer}@keyframes shimmer{to{background-position:250% 0}}.birthday-heart{font-family:var(--serif);font-size:.55em;font-style:italic}.finale-note{font-family:var(--serif);color:var(--muted);font-size:1.05rem}.score{gap:6px}.score-number{font-family:var(--serif);font-size:3rem;font-weight:700;line-height:1}.score-number span{color:var(--muted);font-size:1rem;font-weight:500}.score-title{color:var(--accent);font-size:1.2rem;font-weight:600}.review{text-align:left;gap:0;padding:0}.review summary{cursor:pointer;border-radius:24px;padding:18px 20px;font-weight:600}.review ol{flex-direction:column;gap:14px;margin:0;padding:0 20px 20px;list-style:none;display:flex}.review li{gap:12px;font-size:.92rem;display:flex}.review li>span{width:1.2em;color:var(--accent);flex:none;font-weight:700}.review-answer{color:var(--muted);font-weight:600}.confetti{z-index:10;pointer-events:none;width:100%;height:100%;position:fixed;inset:0}.sparkles{pointer-events:none;position:fixed;inset:0}.sparkles span{color:var(--accent);opacity:0;animation:4s ease-in-out infinite twinkle;position:absolute}@keyframes twinkle{50%{opacity:.45;transform:scale(1.15)}}