/* Light shop layer for the light directions. Same components as shop.css, driven entirely by tokens so each design brings its own world. */
:root{color-scheme:light;--bg:#F4F6FB;--surface:#FFFFFF;--surface-2:#EEF1F7;--ink:#0A1633;--muted:#56627D;--line:rgba(10,22,51,.12);--btn-line:rgba(10,22,51,.22);--accent:#1F4BFF;--accent-ink:#FFFFFF;--accent-hover:#1739D6;--pop:#C9F227;--pop-ink:#0A1633;--good:#0E8A4F;--bad:#C2261D;--radius:14px;--radius-sm:8px;--radius-btn:12px;--focus:var(--accent);--select:var(--accent);--select-ink:var(--accent-ink);--wrap:1360px;--grid-gap:16px;--bar-h:7px;--bar-bg:rgba(10,22,51,.09);--bar-fill:var(--accent);
--shadow-1:0 1px 2px rgba(10,22,51,.06),0 8px 24px -12px rgba(10,22,51,.16);--shadow-2:0 2px 4px rgba(10,22,51,.06),0 22px 44px -18px rgba(10,22,51,.26);
--hero-ink:#FFFFFF;--hero-scrim:10,22,51;--stage-wash:rgba(10,22,51,.5);--tray:#fff;
--pill-bg:rgba(255,255,255,.86);--pill-blur:blur(18px) saturate(1.4);--pill-ink:var(--ink);--pill-edge:var(--line);--pill-dot:var(--accent);--pill-hover:rgba(10,22,51,.06);--pill-cart:var(--accent);--pill-cart-ink:var(--accent-ink);--pill-cart-hover:var(--accent-hover);--pill-count-ink:var(--pop-ink)}
html,body{background:var(--bg);color:var(--ink)}
::selection{background:var(--select);color:var(--select-ink)}
html{scrollbar-color:color-mix(in oklab,var(--ink) 30%,transparent) var(--bg)}
.cart-count{background:var(--pop);color:var(--pop-ink)}
.btn-primary{font-weight:750}
.card-flag{display:none}
.o-pill{box-shadow:0 0 0 1px var(--pill-edge),0 10px 30px -14px rgba(10,22,51,.28)!important}

/* hero slider: a framed stage inside the page, photograph behind light type */
.s-hero{position:relative;width:min(100% - 24px,1440px);height:min(86svh,820px);min-height:600px;margin:12px auto 0;overflow:clip;isolation:isolate;background:var(--surface-2);border-radius:20px}
.s-slide{position:absolute;inset:0;display:flex;align-items:flex-end;visibility:hidden;opacity:0;color:var(--hero-ink);transition:opacity .7s ease-out,visibility 0s .7s}
.s-slide.on{visibility:visible;opacity:1;transition:opacity .7s ease-out}
.s-slide>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.s-slide.on>img{animation:s-zoom 9s linear both}
@keyframes s-zoom{from{transform:scale(1.06)}to{transform:scale(1)}}
.is-paused .s-slide.on>img{animation-play-state:paused}
.s-blank{position:absolute;inset:0;background:radial-gradient(70% 90% at 78% 40%,color-mix(in oklab,var(--accent) 70%,#fff),var(--accent) 45%,color-mix(in oklab,var(--accent) 60%,#000))}
.s-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--hero-scrim),.78) 4%,rgba(var(--hero-scrim),.42) 40%,rgba(var(--hero-scrim),0) 66%),linear-gradient(transparent 56%,rgba(var(--hero-scrim),.7))}
.s-slide-in{position:relative;z-index:1;padding-bottom:120px}
.s-title{max-width:13ch;font-size:clamp(3rem,6.4vw,6rem);line-height:.92;color:inherit}
.s-win{display:block;color:var(--pop);font-size:.4em;line-height:1.3}
.s-alt{margin-top:6px;font-size:clamp(1.05rem,1.5vw,1.3rem)}
.s-facts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:18px}
.s-big b{font:var(--display-weight) clamp(2.6rem,4.4vw,3.8rem)/1 var(--font-display);color:var(--pop)}
.s-big span{margin-left:6px;opacity:.85}
.cd-boxes{display:inline-flex;gap:6px}
.cd-boxes .cd-part{display:grid;justify-items:center;align-content:center;width:62px;height:62px;color:var(--ink);background:rgba(255,255,255,.92);border-radius:10px;box-shadow:0 8px 20px -10px rgba(0,0,0,.4)}
.cd-boxes .cd-part b{font:var(--display-weight) 1.7rem/1 var(--font-display);font-variant-numeric:tabular-nums}
.cd-boxes .cd-part i{font-size:.72rem;color:var(--muted);font-style:normal}
.s-sold{display:grid;grid-template-columns:minmax(0,300px) auto;align-items:center;gap:12px;margin-top:14px;font-size:.92rem}
.s-sold .bar{--bar-bg:rgba(255,255,255,.3);--bar-fill:var(--pop)}
.s-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.s-cta .btn:not(.btn-primary){color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4);backdrop-filter:blur(8px)}
.s-thumbs{position:absolute;left:0;right:0;bottom:16px;z-index:3;display:flex;gap:8px;margin-inline:auto}
.s-thumb{position:relative;flex:1 1 0;min-width:0;display:flex;align-items:center;gap:10px;height:64px;padding:7px 12px 7px 7px;color:var(--ink);font:inherit;font-size:.92rem;font-weight:650;text-align:left;background:rgba(255,255,255,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:0;border-radius:12px;overflow:hidden;transition:background-color .15s}
.s-thumb img{width:66px;height:50px;object-fit:cover;border-radius:7px;flex:none}
.s-thumb span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.s-thumb i{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.s-thumb.on{background:#fff}
.s-thumb.on i{animation:s-fill 6.5s linear both}
.is-paused .s-thumb.on i{animation-play-state:paused}
@keyframes s-fill{to{transform:scaleX(1)}}
@media (hover:hover){.s-thumb:hover{background:#fff}}

/* figures band and category rail */
.s-stats{margin-top:clamp(18px,3vw,32px)}
.s-stats .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.s-stats .wrap>div{padding:16px 18px;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-1)}
.s-stats b{display:block;font:var(--display-weight) clamp(1.35rem,2vw,1.8rem)/1.05 var(--font-display);color:var(--ink)}
.s-stats span{font-size:.92rem;color:var(--muted)}
.s-rail{position:sticky;top:0;z-index:40;margin-top:clamp(18px,3vw,28px);background:color-mix(in oklab,var(--bg) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:padding .42s cubic-bezier(.2,0,0,1)}
.s-rail .wrap{display:flex;gap:6px;padding-block:10px;overflow-x:auto;scrollbar-width:none}
html:not(.pill-away).pill-small .s-rail{padding-top:72px}
.s-rail button{flex:none;display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:0 16px;color:var(--ink);font:inherit;font-size:.95rem;font-weight:650;background:var(--surface);border:0;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);transition:background-color .15s,color .15s,box-shadow .15s}
.s-rail button i{font-style:normal;font-size:.8rem;opacity:.6}
.s-rail button[aria-pressed=true]{color:var(--accent-ink);background:var(--accent);box-shadow:none}
@media (hover:hover){.s-rail button:hover:not([aria-pressed=true]){box-shadow:inset 0 0 0 1px var(--ink)}}

/* shop grid */
#s-shop .grid{--cs:3;grid-template-columns:repeat(12,minmax(0,1fr))}
#s-shop .grid>.card{grid-column:span var(--cs)}
#s-shop .is-wide .card-media{aspect-ratio:21/9}
#s-shop .is-wide h3{min-height:0}
.s-card{position:relative;display:flex;flex-direction:column;overflow:hidden;background:var(--surface);border:0;border-radius:var(--radius);box-shadow:var(--shadow-1);transition:transform .22s cubic-bezier(.2,0,0,1),box-shadow .22s}
.s-card[hidden]{display:none}
@media (hover:hover){.s-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-2)}}
.s-card .card-media{aspect-ratio:4/3;background:var(--surface-2)}
.s-card .card-media img{transition:transform .6s cubic-bezier(.2,0,0,1)}
@media (hover:hover){.s-card:hover .card-media img{transform:scale(1.04)}}
.s-ends{position:absolute;left:12px;top:12px;z-index:2;padding:4px 10px;font-size:.82rem;font-weight:800;color:var(--pop-ink);background:var(--pop);border-radius:7px}
.s-tag{position:absolute;right:12px;top:12px;z-index:2;padding:4px 9px;font-size:.8rem;font-weight:700;color:var(--ink);background:rgba(255,255,255,.92);border-radius:7px}
.s-plate{position:absolute;inset:0;display:grid;place-items:center;padding:18px;text-align:center;background:var(--surface-2)}
.s-plate strong{font:var(--display-weight) clamp(1.8rem,2.8vw,2.6rem)/1 var(--font-display);color:var(--accent)}
.s-card .card-body{padding:16px;gap:8px}
.s-card h3{font-size:clamp(1.12rem,1.3vw,1.26rem);line-height:1.16;min-height:2.32em}
.s-card h3 a{text-decoration:none}
.s-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 7px}
.s-price b{font:var(--display-weight) 1.8rem/1.1 var(--font-display);color:var(--accent)}
.s-price span{font-size:.88rem;color:var(--muted)}
.s-price em{flex-basis:100%;font-size:.86rem;font-style:normal;color:var(--muted)}
.s-enter{width:100%;margin-top:6px}
.s-card .card-tools{padding-top:2px}
.s-card .qa-btn,.s-card .st-compare-btn{min-height:38px;font-size:.88rem}
.pass-eligible-label{font-size:.82rem;color:var(--muted)}

/* free band, winners, passes */
.s-free{margin-block:clamp(28px,5vw,64px);padding-block:clamp(40px,6vw,72px);color:var(--accent-ink);background:var(--accent)}
.s-free .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:28px;align-items:end}
.s-free p{margin-bottom:14px;font-size:1.1rem}
.s-free .btn{color:var(--accent);background:var(--accent-ink);border-color:var(--accent-ink)}
.s-winners ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.s-winners li{display:grid;align-content:start;gap:4px;padding:18px;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-1)}
.s-ticket{color:var(--accent);font-weight:800}
.s-winners strong{font:var(--display-weight) 1.45rem/1.05 var(--font-display)}
.s-winners span{color:var(--muted)}
.s-winners q{margin-top:8px;font-size:.96rem}
.s-proof{margin-top:16px;color:var(--muted)}
.s-pass-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.s-pass{position:relative;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:1.7;padding:clamp(16px,2vw,24px);overflow:hidden;text-decoration:none;border-radius:16px;box-shadow:var(--shadow-2)}
.s-pass img{border-radius:9px}
.s-pass strong{display:block;font:var(--display-weight) clamp(1.6rem,2.4vw,2.2rem)/1 var(--font-display)}
.s-pass span span{display:block;margin-top:4px;font-size:.95rem;opacity:.9}
.s-p-w{color:var(--ink);background:linear-gradient(135deg,#FFFFFF,#E6E9F0)}
.s-p-b{color:#fff;background:linear-gradient(135deg,#2A2D36,#121318)}
.s-p-y{color:var(--accent-ink);background:linear-gradient(135deg,color-mix(in oklab,var(--accent) 78%,#fff),var(--accent))}

/* prize page */
.detail-media{border-radius:var(--radius)}
.detail-info .cd .cd-part{display:inline-grid;justify-items:center;align-content:center;min-width:54px;height:54px;margin-right:4px;background:var(--surface);border-radius:9px;box-shadow:var(--shadow-1)}
.detail-info .cd .cd-part b{font:var(--display-weight) 1.4rem/1 var(--font-display)}
.picker{background:var(--surface);border:0;border-radius:16px;box-shadow:var(--shadow-1)}
.quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.quick-btn{min-height:52px;font-size:1.05rem;font-weight:800;color:var(--ink);background:var(--surface-2);border:0;border-radius:10px;transition:background-color .15s,color .15s}
.quick-btn.on{color:var(--accent-ink);background:var(--accent)}
@media (hover:hover){.quick-btn:hover:not(.on){background:color-mix(in oklab,var(--surface-2) 80%,var(--ink) 8%)}}
.qty-btn{color:var(--ink);background:var(--surface-2);border:0;border-radius:10px;font-size:1.3rem;font-weight:800}
.qty-input{color:var(--ink);background:var(--surface-2);border:0;border-radius:10px}
.picker-total b{color:var(--accent)}
.slider{accent-color:var(--accent)}
.flag{color:var(--accent-ink);background:var(--accent)}
.chip.is-active{color:var(--accent-ink);background:var(--accent)}
.bar-fill{border-radius:inherit}
input,select,textarea{color:var(--ink)}

@media (max-width:1180px){#s-shop .grid{--cs:4}.s-winners ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  #s-shop .grid{--cs:6;gap:10px}
  .s-stats .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}
  .s-free .wrap{grid-template-columns:minmax(0,1fr)}
  .s-pass-row{grid-template-columns:minmax(0,1fr)}.s-pass{aspect-ratio:auto;min-height:150px}
  .s-hero{height:auto;min-height:calc(100svh - 120px);border-radius:16px}
  .s-slide>img{object-position:66% 0;height:62%}
  .s-slide::after{background:linear-gradient(rgba(var(--hero-scrim),0) 26%,rgba(var(--hero-scrim),.86) 58%,rgba(var(--hero-scrim),.96))}
  .s-slide-in{padding-bottom:96px}
  .s-thumb span{display:none}.s-thumb{flex:0 0 auto;padding:4px;height:56px}.s-thumb img{width:66px;height:48px}
  .cd-boxes .cd-part{width:54px;height:54px}.s-sold{grid-template-columns:minmax(0,1fr) auto}
}
@media (max-width:520px){#s-shop .grid{--cs:12}.s-winners ul{grid-template-columns:minmax(0,1fr)}.s-card .card-media{aspect-ratio:16/10}.s-card h3{min-height:0}}
@media (prefers-reduced-motion:reduce){.s-slide.on>img,.s-thumb.on i{animation:none}.s-card,.s-card .card-media img{transition:none}}