/* The Ask Index: a premium holiday toy-shop window. Own stylesheet; no shared template. */
@font-face{font-family:"Fraunces";src:url(fonts/fraunces.woff2) format("woff2");font-weight:300 800;font-display:swap}
@font-face{font-family:"Fraunces";src:url(fonts/fraunces-italic.woff2) format("woff2");font-weight:300 800;font-style:italic;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter.woff2) format("woff2");font-weight:300 800;font-display:swap}
:root{--pine:#0E2A22;--pine2:#133429;--pine3:#1B4335;--night:#0A1F19;--cream:#F6EFE2;--cream2:#EFE5D3;--kraft:#E6D3B1;--kraft2:#D9C29A;--brass:#D9B26A;--brass2:#F0D49A;--cran:#C8312B;--cran2:#E0554A;--mint:#8DBFA6;--ink:#1B1612;--mut:#A9BDB3;--mut2:#6B5E4E;--line:rgba(217,178,106,.24);--lined:rgba(27,22,18,.14);
--serif:"Fraunces",Georgia,"Times New Roman",serif;--sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--spring:cubic-bezier(.34,1.56,.64,1);--ease:cubic-bezier(.2,.7,.2,1);--r:18px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--pine);color:var(--cream);font:400 1rem/1.65 var(--sans);-webkit-font-smoothing:antialiased;padding-bottom:88px}
@media(min-width:960px){body{padding-bottom:0}}
img,svg{display:block;max-width:100%}
a{color:var(--brass2)}
:focus-visible{outline:2px solid var(--brass2);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:8px;z-index:99;background:var(--cran);color:#fff;padding:.6rem 1rem;border-radius:10px}.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:76rem;margin:0 auto;padding:0 1.25rem}
@media(min-width:720px){.wrap{padding:0 2.25rem}}
h1,h2,h3{font-family:var(--serif);font-weight:500;font-variation-settings:"SOFT" 100,"WONK" 1,"opsz" 120;letter-spacing:-.018em;line-height:1.02;margin:0}
em{font-style:italic}
h1 em,h2 em{color:var(--brass2);font-weight:400}
.ico{width:1.05em;height:1.05em;flex:none;display:inline-block;vertical-align:-.15em}
.kick{display:flex;align-items:center;gap:.5rem;margin:0 0 .7rem;font:700 .68rem/1.3 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--brass)}
.fine{font-size:.8rem;line-height:1.55;color:var(--mut)}
.sec-head{max-width:48rem;margin:0 0 2.4rem}
.sec-head h2{font-size:clamp(2.3rem,5.4vw,3.9rem)}
.sub{color:var(--mut);margin:.9rem 0 0;font-size:.98rem}

/* disclosure: a paper strip */
.disclosure{margin:0;padding:.6rem 1.25rem;background:var(--cream);color:#3B3128;font-size:.77rem;line-height:1.5;text-align:center;border-bottom:1px dashed rgba(27,22,18,.25)}
.disclosure strong{color:var(--ink)}

/* masthead + awning */
.mast{position:sticky;top:0;z-index:40;background:rgba(14,42,34,.9);backdrop-filter:saturate(1.2) blur(12px);-webkit-backdrop-filter:saturate(1.2) blur(12px)}
.mast-in{max-width:76rem;margin:0 auto;padding:.7rem 1.25rem;display:flex;align-items:center;gap:1.6rem}
@media(min-width:720px){.mast-in{padding:.8rem 2.25rem}}
.awning{height:12px;background:repeating-linear-gradient(90deg,var(--cran) 0 28px,var(--cream) 28px 56px);-webkit-mask:radial-gradient(14px 12px at 14px 0,#000 98%,transparent) 0 0/28px 12px repeat-x;mask:radial-gradient(14px 12px at 14px 0,#000 98%,transparent) 0 0/28px 12px repeat-x;filter:drop-shadow(0 3px 2px rgba(0,0,0,.25))}
.wm{display:inline-flex;align-items:center;gap:.5rem;font:500 1.45rem/1 var(--serif);font-variation-settings:"SOFT" 100,"WONK" 1;color:var(--cream);text-decoration:none;white-space:nowrap}
.wm .ico{color:var(--brass);width:1.1em;height:1.1em;transition:transform .5s var(--spring)}
.wm:hover .ico{transform:rotate(-14deg)}
.wm i{color:var(--brass2)}
.wm.big{font-size:2.1rem;margin:0}
.mast nav{display:none;gap:1.6rem;margin-left:auto}
.mast nav a{color:var(--cream);opacity:.75;text-decoration:none;font-size:.85rem;position:relative}
.mast nav a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.mast nav a:hover{opacity:1}.mast nav a:hover::after{transform:scaleX(1)}
.mast-cta{display:none!important}
@media(min-width:960px){.mast nav{display:flex}.mast-cta{display:inline-flex!important}}

/* buttons: wax-seal red and brass */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:50px;padding:.85rem 1.5rem;border-radius:999px;font:650 .94rem/1 var(--sans);text-decoration:none;cursor:pointer;border:1px solid transparent;transition:transform .35s var(--spring),background .3s,box-shadow .3s,color .3s,border-color .3s}
.btn .arr{transition:transform .35s var(--spring)}
.btn:hover .arr{transform:translate(3px,-3px) rotate(8deg)}
.btn:active{transform:scale(.97)}
.btn-red{background:linear-gradient(180deg,#D63A33,var(--cran));color:#fff;box-shadow:0 12px 28px -14px rgba(200,49,43,.9),inset 0 1px 0 rgba(255,255,255,.25),inset 0 -2px 0 rgba(0,0,0,.18)}
.btn-red:hover{transform:translateY(-2px);box-shadow:0 18px 34px -14px rgba(200,49,43,1),inset 0 1px 0 rgba(255,255,255,.25),inset 0 -2px 0 rgba(0,0,0,.18)}
.btn-brass{background:var(--brass);color:var(--night)}
.btn-brass:hover{background:var(--brass2);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--cream);border-color:rgba(246,239,226,.35)}
.btn-ghost:hover{border-color:var(--brass);color:var(--brass2)}
.btn-ghost .ico{color:var(--brass)}
.btn-lg{min-height:58px;padding:1rem 1.8rem;font-size:1rem}
.btn-sm{min-height:42px;padding:.55rem 1.1rem;font-size:.84rem}
.btn-block{width:100%}
.btn-text{background:none;border:0;color:var(--mut);text-decoration:underline;font:500 .9rem var(--sans);cursor:pointer;padding:.6rem}
.tlink{display:inline-block;color:var(--brass2);text-decoration:none;font-weight:600;border-bottom:1px solid var(--line);padding-bottom:2px;margin:.3rem 1.4rem .3rem 0}
.tlink:hover{border-color:var(--brass2)}

/* hero: the shop window */
.hero{position:relative;overflow:hidden;background:radial-gradient(800px 500px at 75% 60%,rgba(217,178,106,.13),transparent 65%),radial-gradient(600px 400px at 0% 0%,rgba(200,49,43,.12),transparent 60%),var(--pine)}
.hero-in{position:relative;max-width:76rem;margin:0 auto;padding:1.4rem 1.25rem 2rem;display:grid;gap:1rem;align-items:center}
@media(min-width:720px){.hero-in{padding:2.4rem 2.25rem 2.4rem}}
@media(min-width:960px){.hero-in{grid-template-columns:1.05fr .95fr;gap:2.4rem;padding:2rem 2.25rem 1.6rem}.hero h1{font-size:4.6rem}.hero-art{max-height:390px}.hero-note{display:none}}
.eyebrow{display:flex;align-items:center;gap:.55rem;margin:0 0 1.1rem;font:700 .7rem/1.2 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--brass)}
.hero h1{font-size:clamp(2.9rem,9.4vw,5.2rem);line-height:.96}
.hero h1 em{color:var(--brass2)}
.lede{max-width:33rem;margin:1.2rem 0 1.6rem;font-size:1.06rem;color:#DCE6E0}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.75rem}
.hero-note{margin:1rem 0 0;font-size:.78rem;color:var(--mut)}
.hero-vis{order:-1;max-width:30rem;margin:0 auto;width:100%}
@media(min-width:960px){.hero-vis{order:0;max-width:none}}
.hero-art{width:100%;height:auto}
@media(max-width:959px){.hero-art{max-height:300px}}
.sn{animation:snow 9s linear infinite}
@keyframes snow{0%{transform:translateY(-30px)}100%{transform:translateY(420px)}}
.lt{animation:twinkle 2.4s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:1}50%{opacity:.35}}
.htag{animation:swing 5s ease-in-out infinite}
.htag:nth-of-type(2n){animation-delay:-2.5s}
@keyframes swing{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}

/* window: top 3 hanging tags */
.window{padding:3.2rem 0 4.5rem;background:linear-gradient(180deg,var(--pine),var(--pine2));position:relative}
.window::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--brass),transparent);opacity:.5}
.wtag-row{display:grid;gap:2.2rem}
@media(min-width:860px){.wtag-row{grid-template-columns:repeat(3,1fr);gap:1.6rem}}
.wtag{position:relative;padding-top:34px}
.string{position:absolute;left:50%;top:0;width:1px;height:46px;background:var(--brass)}
.wtag-in{position:relative;background:var(--kraft);color:var(--ink);border-radius:14px 14px 14px 14px;clip-path:polygon(14% 0,86% 0,100% 7%,100% 100%,0 100%,0 7%);box-shadow:0 30px 50px -30px rgba(0,0,0,.8);transform:rotate(var(--sw));transform-origin:50% -34px;transition:transform .7s var(--spring)}
.wtag:hover .wtag-in{transform:rotate(0) translateY(-4px)}
.hole{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--pine2);box-shadow:inset 0 0 0 3px var(--brass);left:50%;top:12px;transform:translateX(-50%);z-index:2}
.wtag-art{display:block;position:relative;margin:34px 14px 0;border-radius:10px;overflow:hidden;aspect-ratio:16/8}
.wtag-art .art{width:100%;height:100%;transition:transform 1.2s var(--ease)}
.wtag:hover .wtag-art .art{transform:scale(1.06)}
.wtag-n{position:absolute;left:.7rem;top:.5rem;font:500 1.2rem/1 var(--serif);font-style:italic;color:var(--cream);background:rgba(10,31,25,.55);padding:.3rem .6rem;border-radius:999px}
.wtag-body{padding:1.1rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.2rem}
.wtag-body .kick{color:var(--cran)}
.wtag-body h3{font-size:1.7rem;color:var(--ink)}
.wtag-body .hook{margin:.3rem 0 .6rem;color:#4A3E31;font-size:.95rem}
.age{display:inline-flex;align-items:center;gap:.45rem;margin:0 0 .9rem;padding:.35rem .7rem;border-radius:999px;background:rgba(14,42,34,.08);color:var(--pine);font:650 .78rem/1.2 var(--sans)}
.age .ico{color:var(--cran)}

/* countdown + advent */
.countdown{background:var(--cream);color:var(--ink);padding:3.6rem 0;position:relative}
.countdown::before{content:"";position:absolute;left:0;right:0;top:-1px;height:14px;background:radial-gradient(circle at 10px -2px,var(--pine2) 11px,transparent 12px) 0 0/20px 14px repeat-x}
.count-in{display:grid;gap:2rem}
@media(min-width:980px){.count-in{grid-template-columns:.9fr 1.1fr;gap:3rem;align-items:start}.advent{grid-column:1/-1}}
.countdown .kick{color:var(--cran)}
.count-big h2{display:flex;align-items:flex-end;gap:1rem}
.cnum{font:500 clamp(5.5rem,16vw,9rem)/.8 var(--serif);font-variation-settings:"SOFT" 100,"WONK" 1;color:var(--cran)}
.clab{font:400 clamp(1.6rem,3.6vw,2.4rem)/1 var(--serif);color:var(--ink);padding-bottom:.5rem}
.clab em{color:var(--pine)}
.countdown .fine{color:var(--mut2);max-width:28rem}
.dates{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
@media(min-width:640px){.dates{grid-template-columns:repeat(3,1fr)}}
.door{width:100%;text-align:left;display:flex;flex-direction:column;gap:.25rem;padding:1.1rem 1.1rem 1.2rem;border-radius:12px;border:1px solid var(--lined);background:linear-gradient(180deg,#fff,var(--cream2));cursor:pointer;font:inherit;color:var(--ink);box-shadow:0 14px 26px -22px rgba(27,22,18,.6);transition:transform .45s var(--spring),box-shadow .3s}
.door:hover{transform:translateY(-3px) rotate(-.6deg)}
.door .dn{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut2)}
.door b{font:500 1.5rem/1.1 var(--serif)}
.door em{font-style:normal;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cran);font-weight:700}
.dtip{display:none;margin:.6rem 0 0;padding:.8rem 1rem;border-left:3px solid var(--cran);background:#fff;font-size:.86rem;color:#3B3128;border-radius:0 10px 10px 0}
.dates li.open .dtip,.no-js .dtip{display:block;animation:pop .45s var(--spring)}
.dates li.open .door{background:var(--pine);color:var(--cream)}.dates li.open .door .dn{color:var(--mut)}
.advent ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:.4rem}
.advent li{aspect-ratio:1;border-radius:8px;border:1px solid var(--lined);display:grid;place-items:center;font:500 1rem var(--serif);color:var(--mut2);background:#fff}
.advent li.past{background:var(--pine);color:var(--brass2);border-color:var(--pine)}
.advent li.today{background:var(--cran);color:#fff;border-color:var(--cran);animation:pop .6s var(--spring)}
.advent li[data-day="25"]{background:var(--kraft);color:var(--cran);font-style:italic}

/* divider */
.divider{position:relative;height:56px;max-width:76rem;margin:0 auto;padding:0 1.25rem}
.divider svg{position:absolute;inset:0;width:100%;height:100%}
.divider .dbow{inset:auto;left:50%;top:50%;width:70px;height:50px;transform:translate(-50%,-55%)}

/* ledger */
.ledger{padding:3.5rem 0 4.5rem}
.ltable-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--pine2)}
.ltable{width:100%;border-collapse:collapse;min-width:620px}
.ltable th,.ltable td{padding:.75rem .9rem;border-bottom:1px solid var(--line);text-align:center;font-size:.86rem}
.ltable thead th{font:700 .66rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.ltable thead th a{color:inherit;text-decoration:none;border-bottom:1px dotted var(--brass)}
.ltable tbody th{text-align:left;font-weight:400}
.ltable tbody th a{color:var(--cream);text-decoration:none;font:500 1.08rem var(--serif)}
.ltable tbody tr{transition:background .25s}.ltable tbody tr:hover{background:rgba(217,178,106,.07)}
.lr{font-style:italic;color:var(--brass);margin-right:.7rem}
.ltable td span[aria-hidden]{display:inline-block;width:14px;height:14px;border-radius:50%;border:1.5px solid rgba(169,189,179,.35)}
.ltable td.on span[aria-hidden]{background:var(--cran2);border-color:var(--cran2);box-shadow:0 0 0 4px rgba(224,85,74,.15)}
.ltable td.on.alt span[aria-hidden]{background:transparent;border-color:var(--cran2)}
.lage{color:var(--mut);font-size:.8rem!important}

/* takes */
.takes{padding:4.5rem 0;background:var(--pine2)}
.takes-row{display:grid;gap:1.2rem}
@media(min-width:840px){.takes-row{grid-template-columns:repeat(3,1fr)}}
.take{margin:0;padding:1.6rem;border-radius:var(--r);background:linear-gradient(180deg,rgba(217,178,106,.08),transparent);border:1px solid var(--line)}
.take .mono{margin-bottom:1rem}
.take blockquote{margin:0 0 1rem;font:400 1.45rem/1.22 var(--serif);font-style:italic}
.take figcaption{font-size:.8rem;color:var(--mut)}.take figcaption b{color:var(--brass2)}.take figcaption span{display:block}

/* finder: the wrapping counter */
.finder{padding:5rem 0;background:radial-gradient(700px 420px at 90% 0%,rgba(200,49,43,.18),transparent 60%),var(--night);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.finder-in{display:grid;gap:2.2rem}
@media(min-width:960px){.finder-in{grid-template-columns:.8fr 1.2fr;gap:4rem;align-items:start}}
.finder-intro h2{font-size:clamp(2.4rem,5.6vw,4rem);margin-bottom:1rem}
.finder-intro p{color:#CFDCD5}
.quiz{position:relative;padding:1.6rem;border-radius:22px;background:var(--pine2);border:1px solid var(--line);box-shadow:0 40px 80px -50px #000;min-height:22rem}
@media(min-width:720px){.quiz{padding:2.2rem}}
.qprog{list-style:none;margin:0 0 1.2rem;padding:0;display:flex;gap:.4rem}
.qprog li{flex:1;height:4px;border-radius:4px;background:rgba(246,239,226,.14);transition:background .4s}
.quiz[data-step="1"] .qprog li:nth-child(-n+1),.quiz[data-step="2"] .qprog li:nth-child(-n+2),.quiz[data-step="3"] .qprog li{background:var(--brass)}
.q,.result{display:none}
.quiz[data-step="0"] .q[data-q="age"],.quiz[data-step="1"] .q[data-q="interest"],.quiz[data-step="2"] .q[data-q="gift"],.quiz[data-step="3"] .result{display:block;animation:pop .5s var(--spring)}
.no-js .q{display:none}
.qn{font:700 .68rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin:0 0 .6rem}
.q h3{font-size:clamp(1.8rem,3.6vw,2.4rem);margin-bottom:1.3rem}
.opts{display:grid;gap:.6rem}
@media(min-width:560px){.opts{grid-template-columns:1fr 1fr}}
.opts button{position:relative;min-height:58px;text-align:left;padding:.9rem 1.1rem .9rem 2.6rem;border-radius:12px;border:1px solid rgba(246,239,226,.18);background:rgba(246,239,226,.04);color:var(--cream);font:550 .95rem var(--sans);cursor:pointer;transition:transform .35s var(--spring),border-color .25s,background .25s}
.opts button::before{content:"";position:absolute;left:1rem;top:50%;width:12px;height:12px;margin-top:-6px;border:1.5px solid var(--brass);transform:rotate(45deg);transition:background .25s}
.opts button:hover{border-color:var(--brass);background:rgba(217,178,106,.08);transform:translateY(-2px)}
.opts button:hover::before{background:var(--brass)}
.rbox{position:relative}
.rlid{position:absolute;left:-6px;right:-6px;top:-6px;height:44px;border-radius:10px;background:repeating-linear-gradient(40deg,var(--cran) 0 12px,#B12A25 12px 24px);z-index:3;box-shadow:0 8px 14px -8px #000}
.rlid::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:18px;margin-left:-9px;background:var(--brass)}
.quiz[data-step="3"] .rlid{animation:lid 1s var(--ease) .1s forwards}
@keyframes lid{0%{transform:none;opacity:1}60%{transform:translateY(-60px) rotate(-8deg);opacity:1}100%{transform:translateY(-90px) rotate(-14deg);opacity:0}}
.rcard{position:relative;display:grid;gap:0;border-radius:14px;overflow:hidden;background:var(--kraft);color:var(--ink)}
@media(min-width:620px){.rcard{grid-template-columns:.8fr 1.2fr}}
.rcard .hole{left:auto;right:16px;transform:none;background:var(--pine2)}
.rart{min-height:11rem;position:relative}.rart .art{position:absolute;inset:0;width:100%;height:100%}
.rbody{padding:1.3rem 1.4rem}
.rbody .kick{color:var(--cran)}
.rbody h3{font-size:1.9rem;margin-bottom:.4rem}
.rhook{font:italic 400 1.05rem/1.35 var(--serif);color:#4A3E31;margin:0 0 .7rem}
.rwarn{display:none;align-items:flex-start;gap:.45rem;margin:0 0 .6rem;font-size:.8rem;color:#8A231E}
.rwarn.on{display:flex}
.ractions{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-top:1.2rem}
.quiz .fine{margin:.6rem 0 0}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}

/* For / skip */
.fs{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin:.9rem 0}
.fs p,.fs ul{margin:.3rem 0 0;font-size:.9rem;line-height:1.5}.fs ul{padding-left:1.1rem}
.lab{display:inline-block;font:700 .62rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;padding:.38rem .6rem;border-radius:4px}
.lab.ok{background:var(--pine);color:var(--brass2)}
.lab.no{background:rgba(200,49,43,.14);color:var(--cran)}

/* skip/buy: kraft tags */
.skipbuy{padding:5rem 0;background:var(--cream);color:var(--ink)}
.skipbuy .kick{color:var(--cran)}.skipbuy .sub{color:var(--mut2)}
.sb-row{display:grid;gap:1.2rem}
@media(min-width:720px){.sb-row{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.sb-row{grid-template-columns:repeat(4,1fr)}}
.sb{position:relative;display:flex;flex-direction:column;padding:2.6rem 1.4rem 1.5rem;background:var(--kraft);clip-path:polygon(16% 0,84% 0,100% 8%,100% 100%,0 100%,0 8%);border-radius:10px;transition:transform .5s var(--spring)}
.sb:hover{transform:rotate(-1deg) translateY(-3px)}
.sb .hole{background:var(--cream)}
.sb .kick{color:var(--pine)}
.sb-skip p{font:400 1.25rem/1.25 var(--serif);margin:.7rem 0 1.2rem;color:var(--mut2);text-decoration:line-through;text-decoration-color:rgba(200,49,43,.6);text-decoration-thickness:1.5px}
.sb-btn{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;border-radius:999px;border:1px solid var(--pine);background:transparent;color:var(--pine);font:650 .86rem var(--sans);cursor:pointer;transition:background .25s,color .25s,transform .35s var(--spring)}
.sb-btn .ico{color:var(--cran);transition:transform .5s var(--spring)}
.sb-btn:hover{background:var(--pine);color:var(--cream)}.sb-btn:hover .ico{transform:rotate(-20deg) scale(1.15)}
.sb-buy{display:none}
.sb.open .sb-btn,.no-js .sb-btn{display:none}
.sb.open .sb-buy,.no-js .sb-buy{display:block;animation:pop .5s var(--spring)}
.sb-buy>p:first-of-type{font:400 1.25rem/1.25 var(--serif);margin:.7rem 0 .6rem}
.sb-pick{font-size:.84rem;color:var(--mut2);margin:0 0 1rem}

/* index */
.index{padding:5rem 0 1.5rem}
.ranked{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--line)}
@media(min-width:900px){.ranked{grid-template-columns:1fr 1fr;column-gap:3rem}}
.ranked a{display:grid;grid-template-columns:3.2rem 1fr auto;align-items:center;gap:.1rem 1rem;padding:1rem .2rem;border-bottom:1px solid var(--line);text-decoration:none;color:var(--cream);transition:padding .35s var(--spring),background .3s}
.ranked a:hover{padding-left:.8rem;background:rgba(217,178,106,.06)}
.rk{grid-row:span 2;font:400 2.2rem/1 var(--serif);font-style:italic;color:var(--brass)}
.rn{font:500 1.3rem/1.15 var(--serif)}
.rt{grid-column:2;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.tally{grid-row:1/span 2;grid-column:3;display:flex;gap:4px}
.tally i{width:9px;height:9px;border-radius:50%;border:1.5px solid rgba(169,189,179,.35)}
.tally i.on{background:var(--cran2);border-color:var(--cran2)}

/* shelves: gift-tag product cards */
.shelves{padding-bottom:3rem}
.shelf{padding:3rem 0 1rem}
.shelf-head{display:flex;gap:1.3rem;align-items:flex-start;margin-bottom:2.4rem;max-width:52rem}
.shelf-num{font:400 clamp(3.6rem,8vw,6rem)/.8 var(--serif);font-style:italic;color:var(--cran2);min-width:1.3em}
.shelf-head h2{font-size:clamp(2.1rem,4.8vw,3.4rem);margin-bottom:.6rem}
.intro{color:#CFDCD5;margin:0;max-width:40rem}
.gcard{display:grid;margin:0 0 2.2rem;border-radius:22px;overflow:hidden;background:var(--pine2);border:1px solid var(--line);box-shadow:0 40px 70px -50px #000}
@media(min-width:900px){.gcard{grid-template-columns:.95fr 1.05fr}.gcard.flip .slot{order:2}}
.slot{position:relative;margin:0;min-height:15rem;background:var(--pine3);overflow:hidden}
.slot .art{position:absolute;inset:0;width:100%;height:100%;transition:transform 1.4s var(--ease)}
.gcard:hover .slot .art{transform:scale(1.04)}
.slot-cap{position:absolute;left:.9rem;bottom:.7rem;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,239,226,.75);background:rgba(10,31,25,.5);padding:.25rem .5rem;border-radius:4px}
.slot.wide{min-height:12rem;border-radius:16px;margin:0 0 -1.2rem}
.gtag{position:relative;margin:1rem;padding:2.6rem 1.4rem 1.6rem;background:var(--kraft);color:var(--ink);border-radius:12px;clip-path:polygon(8% 0,92% 0,100% 3.5%,100% 100%,0 100%,0 3.5%)}
@media(min-width:720px){.gtag{margin:1.3rem;padding:2.8rem 2.2rem 2rem}}
.gtag .hole{background:var(--pine2)}
.gtag .kick{color:var(--cran);flex-wrap:wrap}
.num{font:italic 500 1.05rem var(--serif);letter-spacing:0;text-transform:none;color:var(--pine)}
.badge{display:inline-block;padding:.22rem .5rem;border-radius:4px;background:var(--cran);color:#fff;font-size:.58rem;letter-spacing:.16em}
.gtag h3{font-size:clamp(1.9rem,3.4vw,2.5rem);margin-bottom:.5rem;color:var(--ink)}
.gtag .hook{font:italic 400 1.2rem/1.3 var(--serif);color:#5A2A20;margin:0 0 .9rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem .8rem;align-items:center;margin-bottom:.9rem}
.chips .age{margin:0}
.lists{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.lists li{display:inline-flex;align-items:center;gap:.35rem;font-size:.68rem;letter-spacing:.06em;padding:.25rem .55rem;border-radius:999px;border:1px solid rgba(27,22,18,.18);color:#6B5E4E}
.lists li i{width:7px;height:7px;border-radius:50%;border:1.5px solid currentColor}
.lists li.on{color:var(--pine);border-color:rgba(14,42,34,.4)}.lists li.on i{background:var(--cran);border-color:var(--cran)}
.lists li.off{opacity:.55}
.safety{display:flex;gap:.6rem;align-items:flex-start;margin:0 0 1rem;padding:.75rem .9rem;border-radius:8px;background:rgba(14,42,34,.06);border:1px solid rgba(14,42,34,.16);font-size:.82rem;color:#3B3128}
.safety .ico{color:var(--pine);margin-top:.15rem}
.safety.hazard{background:#FFF7EE;border:1.5px solid #8A231E}
.safety.hazard .ico{color:#8A231E}
.safety p{margin:0 0 .2rem}.safety .sh{font:700 .6rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#6B5E4E}
.warn-line b{color:#6E1B17}
.why{color:#3B3128;margin:0 0 .6rem}
.proof{font-size:.8rem;color:#6B5E4E;margin:0 0 .4rem;padding-left:.8rem;border-left:2px solid var(--cran)}
.gtag .fs p{color:#3B3128}
.more{margin:.6rem 0 1rem;border-top:1px dashed rgba(27,22,18,.25);border-bottom:1px dashed rgba(27,22,18,.25)}
.more summary{cursor:pointer;padding:.85rem 0;font-weight:650;font-size:.88rem;color:var(--pine);list-style:none}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"+";float:right;font-weight:400;font-size:1.2rem;line-height:1;transition:transform .35s var(--spring)}
.more[open] summary::after{transform:rotate(45deg)}
.more ul{margin:0 0 .8rem;padding-left:1.1rem;font-size:.88rem;color:#3B3128}
.say{font-size:.86rem;color:#3B3128}
.say a,.src a{color:#7A2A1F}
.src{display:block;margin-top:.35rem;font-size:.75rem;color:#6B5E4E}
.ctake{display:flex;gap:.7rem;align-items:flex-start;margin:0 0 1.3rem;font-size:.9rem;color:#3B3128}
.ctake .mono{flex:none}.ctake b{color:var(--pine)}

/* forgot */
.forgot{padding:5rem 0;background:radial-gradient(600px 360px at 50% 0%,rgba(217,178,106,.18),transparent 70%),var(--pine2);text-align:center;border-top:1px solid var(--line)}
.forgot-in{max-width:48rem}
.forgot h2{font-size:clamp(2.3rem,5.8vw,4rem);margin-bottom:1.6rem}
.forgot-ans{display:none;margin-top:.4rem}
.forgot.open .forgot-ans,.no-js .forgot-ans{display:block;animation:pop .6s var(--spring)}
.forgot.open #forgot-btn{display:none}
.forgot .big{font:italic 400 clamp(2.4rem,7vw,4.4rem)/1.02 var(--serif);color:var(--brass2);margin:0 0 1.4rem}
.checklist{list-style:none;margin:0 auto 1.8rem;padding:0;max-width:40rem;text-align:left;display:grid;gap:.6rem}
.checklist li{position:relative;padding:.8rem 1rem .8rem 2.6rem;background:rgba(246,239,226,.05);border:1px solid var(--line);border-radius:10px;font-size:.92rem;color:#DCE6E0}
.checklist li::before{content:"";position:absolute;left:1rem;top:1.05rem;width:12px;height:12px;border:1.5px solid var(--brass);transform:rotate(45deg)}
.checklist b{color:var(--brass2)}

/* hosts */
.hosts{padding:5rem 0;background:var(--cream);color:var(--ink)}
.hosts .kick{color:var(--cran)}
.host-row{display:grid;gap:1.2rem}
@media(min-width:900px){.host-row{grid-template-columns:repeat(3,1fr)}}
.host{padding:1.8rem;border-radius:var(--r);background:#fff;border:1px solid var(--lined);transition:transform .45s var(--spring)}
.host:hover{transform:translateY(-4px)}
.host .mono{margin-bottom:1rem;transform-origin:50% 0;transition:transform .8s var(--spring)}
.host:hover .mono{transform:rotate(8deg)}
.host h3{font-size:2.2rem;margin-bottom:.5rem}
.host p{color:#3B3128;font-size:.93rem}
.host .peeve{font-size:.85rem;color:var(--mut2)}
.host .tlink{color:var(--pine);border-color:var(--cran)}
.about{margin:1.6rem 0 0;padding:1.1rem 1.3rem;border-left:3px solid var(--cran);background:#fff;border-radius:0 12px 12px 0;font-size:.86rem;color:#3B3128;max-width:62rem}

/* final */
.final{padding:5rem 0;text-align:center}
.final-bow{width:90px;height:64px;margin:0 auto 1rem}
.final h2{font-size:clamp(2.3rem,5.8vw,4rem);margin-bottom:1rem}
.final p{color:#CFDCD5;max-width:36rem;margin:0 auto 1.8rem}

/* footer */
.foot{background:var(--night);border-top:1px solid var(--line);padding:3.4rem 0 2.4rem}
.foot-in{max-width:76rem;margin:0 auto;padding:0 1.25rem}
@media(min-width:720px){.foot-in{padding:0 2.25rem}}
.foot .tagline{margin:.5rem 0 1.4rem;color:var(--brass);font-size:.9rem}
.foot .disc{font-size:.9rem;max-width:52rem}
.foot .fine{max-width:62rem}.foot .fine a{color:var(--mut)}

/* sticky */
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:.6rem;padding:.7rem .8rem calc(.7rem + env(safe-area-inset-bottom));background:rgba(10,31,25,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:2px solid var(--brass)}
.sticky-main{flex:1;min-height:52px}.sticky-alt{flex:none}
@media(min-width:960px){.sticky{display:none}}

/* posts: cream paper */
.post{background:var(--cream);color:var(--ink)}
.post .article{max-width:48rem;margin:0 auto;padding:3rem 1.25rem 4rem}
.post .kick{color:var(--cran)}
.post .ahead h1{font-size:clamp(2.4rem,6.6vw,4.2rem);line-height:1;margin-bottom:1rem;color:var(--ink)}
.dek{font:italic 400 1.3rem/1.38 var(--serif);color:var(--pine);margin:0 0 1.6rem}
.byline{display:flex;gap:1rem;align-items:center;padding:1rem 0;border-top:1px dashed var(--lined);border-bottom:1px dashed var(--lined);margin-bottom:1.8rem}
.byline .mono{flex:none}.byline p{margin:0;font-size:.86rem;line-height:1.5}.byline span{color:var(--mut2)}
.aintro{font-size:1.08rem;line-height:1.75;color:#2E2620}
.aintro::first-letter{float:left;font:500 4.4rem/.8 var(--serif);color:var(--cran);padding:.35rem .5rem 0 0}
.sbmini{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:2rem 0 3rem;padding:1.3rem;border-radius:14px;background:var(--kraft)}
.sbmini p{margin:.5rem 0 0;font:400 1.1rem/1.28 var(--serif)}
.pitem{padding:2.4rem 0}
.ptag{position:relative;padding:2.6rem 1.4rem 1.6rem;background:#fff;border:1px solid var(--lined);border-radius:12px;box-shadow:0 30px 50px -40px rgba(27,22,18,.6)}
@media(min-width:720px){.ptag{padding:2.8rem 2.2rem 2rem}}
.ptag .hole{background:var(--cream)}
.pitem h2{font-size:clamp(1.8rem,4.2vw,2.5rem);margin-bottom:1rem;color:var(--ink)}
.pitem h3{font:700 .7rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--pine);margin:1.6rem 0 .6rem}
.src-inline{letter-spacing:0;text-transform:none;font-weight:400;color:var(--mut2);font-size:.8rem}
.src-inline a{color:#7A2A1F}
.facts{margin:0;padding-left:1.1rem;color:#2E2620}.facts li{margin:.3rem 0}
.fs.big{gap:1.4rem}
.verdict{margin:1.6rem 0 1.4rem;padding:1.1rem 1.3rem;border-left:3px solid var(--cran);background:var(--cream);border-radius:0 12px 12px 0;font:400 1.2rem/1.38 var(--serif)}
.verdict b{font-family:var(--sans);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cran);display:block;margin-bottom:.3rem}
.sources{padding:2.4rem 0;border-top:1px dashed var(--lined)}
.sources h2{font-size:2rem;margin-bottom:1rem}
.sources ol{padding-left:1.2rem;font-size:.85rem;color:var(--mut2)}.sources li{margin:.5rem 0}.sources a{color:#7A2A1F}
.more-posts{padding-top:1.6rem;border-top:1px dashed var(--lined)}
.post .tlink{color:var(--pine);border-color:var(--cran)}
.post .lab.ok{background:var(--pine);color:var(--brass2)}

/* reveal on scroll */
.js .reveal-up{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--spring)}
.js .reveal-up.in{opacity:1;transform:none}
.js .wtag.reveal-up.in .wtag-in{animation:drop 1.1s var(--spring) both}
@keyframes drop{0%{transform:translateY(-30px) rotate(6deg)}100%{transform:rotate(var(--sw))}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .reveal-up{opacity:1;transform:none}
  .sn{display:none}
  .quiz[data-step="3"] .rlid{display:none}
}
@media print{.sticky,.mast{display:none}}
.htag{transform-box:view-box}

.skipbuy h2 em,.hosts h2 em,.countdown h2 em,.post h1 em,.post h2 em{color:var(--cran)}
@media(min-width:900px){.gcard{align-items:start}.gcard .slot{position:sticky;top:96px;aspect-ratio:4/3;min-height:0;margin:1.3rem 0 1.3rem 1.3rem;border-radius:16px}.gcard.flip .slot{margin:1.3rem 1.3rem 1.3rem 0}}
@media(min-width:960px){.hero-in{padding:1.2rem 2.25rem .6rem}.hero h1{font-size:4.3rem}.lede{margin:.9rem 0 1.2rem}.hero-art{max-height:350px}.window{padding-top:1.2rem}.window .sec-head{margin-bottom:.2rem;display:flex;align-items:baseline;gap:1.2rem;max-width:none}.window .sec-head .kick{margin:0}.window .sec-head h2{font-size:2.2rem}.wtag-art{aspect-ratio:auto;height:96px}.wtag-body h3{font-size:1.5rem}}
@media(max-width:639px){.ltable{min-width:0}.ltable thead th:last-child,.lage{display:none}.ltable thead th{font-size:.54rem;letter-spacing:.05em}.ltable th,.ltable td{padding:.6rem .35rem}.ltable tbody th a{font-size:.95rem}.lr{margin-right:.35rem}}
.slot.wide .slot-cap{top:.7rem;bottom:auto}
/* ---- Product photo frame (Amazon-served image on a cream mat; original art stays as the wrapping-paper backdrop) ---- */
.slot.has-photo{min-height:20rem}
.mat{position:absolute;inset:0;margin:auto;height:80%;aspect-ratio:1/1;max-width:none;background:var(--cream);border-radius:12px;padding:7%;
  display:grid;place-items:center;box-shadow:0 0 0 1px rgba(217,178,106,.55),0 0 0 7px rgba(246,239,226,.18),0 26px 40px -22px rgba(0,0,0,.65);
  transform:rotate(-1.2deg);transition:transform .5s var(--ease),box-shadow .5s var(--ease);z-index:1}
.gcard.flip .mat{transform:rotate(1.2deg)}
.mat::after{content:"";position:absolute;inset:4%;border:1px dashed rgba(14,42,34,.18);border-radius:8px;pointer-events:none}
.mat-pin{position:absolute;top:-9px;left:50%;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#F0D49A,#B8893E 70%);box-shadow:0 2px 4px rgba(0,0,0,.4);z-index:2}
.pphoto{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#fff;border-radius:4px}
.gcard:hover .mat,.gcard:focus-within .mat{transform:rotate(0) translateY(-4px)}
.has-photo .slot-cap{z-index:2}
.ph{width:100%;height:100%;display:grid;place-items:center;background:#C9C9C9;border:2px dashed #8A8A8A;border-radius:4px;text-align:center;padding:8%}
.ph span{font:700 .72rem/1.35 var(--sans,Inter),sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#3A3A3A}
.wtag-art.has-photo{aspect-ratio:4/3}
.wtag-art.has-photo .mat{height:84%;padding:5%;border-radius:8px}
.wtag-art.has-photo .mat-pin{display:none}
.wtag-art.has-photo .ph span{font-size:.56rem}
.slot.wide.has-photo{min-height:17rem}
@media(min-width:960px){.wtag-art.has-photo{aspect-ratio:auto;height:150px}}
@media(max-width:600px){.slot.has-photo{min-height:0;aspect-ratio:1/1}.mat{height:84%}}
@media(prefers-reduced-motion:reduce){.mat,.gcard:hover .mat{transition:none;transform:none}}
.ph span{text-transform:none;letter-spacing:.06em}
.wtag-art.has-photo .mat{inset:16% 0 5% 0;height:auto}
@media(max-width:600px){.slot.has-photo .mat{inset:0 0 9% 0;height:78%}}
@media(min-width:900px){.gcard .slot.has-photo{aspect-ratio:1/1}.gcard .slot.has-photo .mat{height:82%}}
.wtag-art.has-photo .mat{inset:15% 0 5% 0;height:80%;width:auto}
.wtag-art.has-photo .mat{inset:22% 0 4% 0;height:74%}

/* tag tilt per Top 3 slot (classes, not inline styles, so the CSP stays strict) */
.wtag.sw1{--sw:-3deg}.wtag.sw2{--sw:2deg}.wtag.sw3{--sw:-1.5deg}