:root { color-scheme:light; --paper:#f6f3ec; --ink:#233f35; --muted:#637268; --gold:#9b752f; --line:#d8d3c5; --red:#aa3f35; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
button,a,video { -webkit-tap-highlight-color:transparent; }
button { font:inherit; cursor:pointer; }
button,a { touch-action:manipulation; }
button:focus-visible,a:focus-visible,video:focus-visible,textarea:focus-visible { outline:3px solid var(--gold); outline-offset:5px; }
.masthead { max-width:1160px; margin:auto; padding:30px 36px 23px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); }
.wordmark { text-decoration:none; color:var(--ink); display:flex; align-items:center; font:700 27px/1 Georgia,serif; letter-spacing:-1px; }
.wordmark sup { font:11px Arial,sans-serif; margin:0 0 16px 3px; letter-spacing:0; }
.brand-dot { display:inline-block; width:12px; height:12px; border-radius:50%; background:var(--gold); margin-right:10px; box-shadow:0 0 0 4px #9b752f14; }
.season-label { font-size:10px; letter-spacing:.19em; color:var(--muted); }
.experience { max-width:1080px; margin:0 auto; padding:62px 36px 32px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,440px); column-gap:74px; align-items:start; }
.introduction { grid-column:1; grid-row:1; padding-top:50px; }
.eyebrow { display:block; margin:0 0 22px; font-size:10px; line-height:1.6; letter-spacing:.16em; font-weight:700; color:var(--gold); }
.eyebrow span { margin-right:7px; }
h1 { font:400 clamp(33px,3.7vw,48px)/1.14 Georgia,'Times New Roman',serif; letter-spacing:-1.7px; margin:0; }
h1 em { display:inline-block; color:var(--gold); font-weight:400; margin-top:8px; }
.welcome { font-size:15px; line-height:1.8; margin:26px 0 0; color:var(--muted); }
.watch-note { font-size:13px; line-height:1.8; color:var(--muted); max-width:320px; padding-top:26px; margin-top:30px; border-top:1px solid var(--line); }
.small-star { color:var(--gold); font-size:19px; padding-right:4px; }
.film-column { grid-column:2; grid-row:1 / span 2; min-width:0; }
.film { position:relative; border:1px solid #b2a27d88; border-radius:16px; overflow:hidden; background:#132c3c; box-shadow:0 18px 45px #27362e1c; }
video { display:block; width:100%; aspect-ratio:5 / 7; object-fit:contain; background:#132c3c; }
.film-button { position:absolute; left:20px; right:20px; width:calc(100% - 40px); border:1px solid #ffffff70; color:white; display:flex; align-items:center; justify-content:center; gap:10px; padding:18px 12px; border-radius:10px; font-size:13px; font-weight:700; box-shadow:0 4px 24px #0004; background:#173d32f5; }
.start-button { bottom:74px; }
.end-button { bottom:72px; background:#f6f3ecf7; color:var(--ink); border-color:#d4b46d; }
.play-triangle { display:inline-block; border-top:6px solid transparent; border-bottom:6px solid transparent; border-left:9px solid white; }
.film-caption { margin:17px 8px 0; text-align:center; color:var(--muted); font-size:11px; letter-spacing:.03em; }
.video-error { background:white; border:1px solid var(--line); padding:16px; margin-top:16px; border-radius:10px; color:var(--muted); font-size:13px; line-height:1.6; }
.surprise { grid-column:1; grid-row:2; padding:34px 0 0; margin-top:12px; border-top:1px solid var(--line); scroll-margin-top:24px; }
.fortune-topline { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.fortune-topline .eyebrow { margin:0; font-size:9px; letter-spacing:.11em; }
.year-stamp { color:var(--gold); border:1px solid #c4ab75; padding:5px 9px; border-radius:50%; font:15px Georgia,serif; }
h2 { font:400 31px/1.2 Georgia,serif; margin:18px 0 20px; letter-spacing:-.5px; }
h2:focus { outline:none; }
.fortune-slip { padding:24px 22px 20px; position:relative; background:#fffdf7; border:1px solid #e2d7bd; border-radius:2px; box-shadow:3px 5px 0 #e8e2d4; text-align:center; }
.quote-mark { color:#c3a976; font:47px/.6 Georgia,serif; }
#fortune-text { font:400 22px/1.5 Georgia,serif; margin:10px 0 15px; min-height:66px; overflow-wrap:anywhere; }
.slip-star { color:var(--gold); font-size:13px; }
.lucky-numbers { margin:29px 0 24px; text-align:center; }
h3 { font:600 13px/1.4 Arial,sans-serif; margin:0 0 6px; }
.number-caption { color:var(--muted); font-size:11px; margin:0 0 16px; }
.number-balls { margin:0; padding:0; list-style:none; display:flex; justify-content:center; align-items:center; gap:9px; }
.number-ball { flex:0 0 44px; width:44px; height:44px; display:grid; place-items:center; background:#fff; border:1px solid #cfcbbf; color:#23372f; border-radius:50%; font:700 17px/1 Arial,sans-serif; box-shadow:0 3px 0 #ded9cd; position:relative; }
.number-ball.powerball { color:#fff; background:var(--red); border-color:var(--red); box-shadow:0 3px 0 #803229; margin-left:8px; }
.number-ball.powerball::before { content:'+'; position:absolute; left:-15px; color:var(--muted); font-size:12px; font-weight:400; }
.number-key { font-size:10px; color:var(--muted); margin:13px 0 0; }
.number-key span { padding:0 7px; }
.actions { display:flex; flex-direction:column; gap:10px; }
.primary-button,.secondary-button { width:100%; min-height:48px; padding:14px 12px; border-radius:6px; font-size:13px; font-weight:600; }
.primary-button { color:#fff; background:var(--ink); border:1px solid var(--ink); }
.primary-button span { font-size:17px; margin-right:6px; }
.primary-button:hover { background:#315747; }
.secondary-button { background:transparent; border:1px solid #bcbeb1; color:var(--ink); }
.secondary-button:hover { background:#fff8; }
.text-button { color:var(--ink); background:none; border:0; padding:12px 6px; text-decoration:underline; text-underline-offset:4px; font-size:12px; }
.replay-button { display:block; margin:11px auto 4px; }
.copy-note { min-height:16px; font-size:11px; margin:10px 0 0; text-align:center; color:var(--muted); }
.copy-fallback { display:block; margin:8px 0; font-size:12px; line-height:1.6; }
.copy-fallback textarea { display:block; width:100%; border:1px solid var(--line); margin-top:8px; padding:12px; font:13px/1.5 Arial,sans-serif; resize:vertical; background:#fffdf7; color:var(--ink); }
.fun-note { font-size:10px; line-height:1.7; color:#6f746b; text-align:center; margin:18px 5px 0; }
.site-footer { max-width:1080px; margin:34px auto 0; padding:25px 36px 36px; text-align:center; border-top:1px solid var(--line); }
.site-footer p { margin:0 0 9px; font:italic 18px Georgia,serif; }
.site-footer>span { color:var(--muted); font-size:10px; }
.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; }
.noscript-note { grid-column:1 / -1; color:var(--muted); font-size:13px; }
.surprise.revealed { animation:unfold .5s ease-out; }
@keyframes unfold { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:959px) {
  .experience { display:block; max-width:536px; padding:31px 24px 24px; }
  .masthead { max-width:536px; padding:24px; }
  .wordmark { font-size:25px; }
  .season-label { font-size:8px; letter-spacing:.12em; }
  .introduction { padding:0; }
  .eyebrow { font-size:9px; margin-bottom:13px; }
  h1 { font-size:37px; line-height:1.11; letter-spacing:-1.4px; }
  h1 em { margin-top:4px; }
  .welcome { margin-top:17px; font-size:13px; line-height:1.7; }
  .desktop-break { display:none; }
  .watch-note { padding:0; border:0; margin:19px 0 20px; max-width:none; font-size:12px; line-height:1.6; }
  .film { border-radius:12px; }
  .film-caption { font-size:10px; }
  .surprise { padding-top:27px; margin-top:28px; }
  .site-footer { max-width:488px; margin:12px 24px 0; padding:22px 10px 30px; }
}
@media (min-width:537px) and (max-width:959px) { .site-footer { margin-left:auto; margin-right:auto; } }
@media (max-width:359px) {
  .masthead { padding:21px 17px; }
  .season-label { font-size:7px; }
  .experience { padding:26px 17px 22px; }
  h1 { font-size:32px; }
  .number-balls { gap:7px; }
  .number-ball { flex-basis:38px; width:38px; height:38px; font-size:15px; }
  .film-button { left:13px; right:13px; width:calc(100% - 26px); font-size:11px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }