@font-face{font-family:Fredoka;src:url(/fonts/fredoka.woff2) format("woff2");font-weight:300 700;font-stretch:75% 125%;font-display:swap}
@font-face{font-family:Outfit;src:url(/fonts/outfit.woff2) format("woff2");font-weight:300 700;font-display:swap}
:root{--cream:#FFF7EC;--cream2:#FFEBD2;--ink:#3A2B4B;--ink2:#5E4C70;--mute:#76668A;--line:rgba(58,43,75,.16);--butter:#FFD66B;--peach:#FFB391;--blush:#FFC4D6;--lilac:#CDBBFF;--mint:#BFEBD6;--sky:#BCE2FF;--coral:#F2735A;--plum:#6B4FA3;
--disp:Fredoka,"Arial Rounded MT Bold",system-ui,sans-serif;--body:Outfit,system-ui,-apple-system,"Segoe UI",sans-serif;--r:30px;--top:68px}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:400 17.5px/1.6 var(--body);color:var(--ink);background:linear-gradient(180deg,#FFF9F0 0,#FFF2E0 38%,#FBEFFF 72%,#EFF7FF 100%) fixed;background-color:var(--cream);padding-bottom:116px;overflow-x:hidden}
body:not(:has(#pbar)){padding-bottom:40px}
img{max-width:100%;display:block}a{color:inherit}
h1,h2,h3{font-family:var(--disp);font-weight:600;line-height:1.04;letter-spacing:-.005em;margin:0}
p{margin:0 0 1em}b,strong{font-weight:600}
:focus-visible{outline:3px solid var(--plum);outline-offset:3px;border-radius:8px}
.wrap{width:min(1240px,100% - 40px);margin-inline:auto}.narrow{width:min(860px,100% - 40px);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:#fff;padding:.7em 1.1em;border-radius:999px;z-index:100;text-decoration:none;font-weight:600}.skip:focus{top:10px}
/* pillow: puffy cream card with a stitched seam */
.pillow{position:relative;background:linear-gradient(180deg,#FFFDF9,#FFF0DC);border-radius:44px;box-shadow:inset 0 2px 0 #fff,inset 0 -14px 28px -10px rgba(255,179,145,.45),0 36px 50px -30px rgba(107,79,163,.45),0 0 0 1px rgba(58,43,75,.07)}
.pillow::after{content:"";position:absolute;inset:11px;border-radius:34px;border:2px dashed rgba(58,43,75,.15);pointer-events:none}
/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(255,247,236,.82);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);border-bottom:2px dashed rgba(58,43,75,.12)}
.top-in{display:flex;align-items:center;gap:18px;min-height:var(--top)}
.mark{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}.mark .lg{width:42px;height:42px;transition:transform .5s cubic-bezier(.3,1.6,.5,1)}.mark:hover .lg{transform:rotate(14deg) scale(1.08)}
.wm{font:600 28px/1 var(--disp);letter-spacing:-.01em}.wm b{font-weight:600;color:var(--plum)}
.nav{display:flex;gap:2px;margin-left:auto;flex-wrap:wrap}.nav a{text-decoration:none;font-weight:500;font-size:16px;padding:.5em .9em;border-radius:999px;transition:background .2s}.nav a:hover{background:rgba(255,214,107,.5)}.nav a[aria-current=page]{background:var(--butter)}
.srch{display:flex;align-items:center;gap:8px;text-decoration:none;font:600 15px var(--body);background:var(--butter);color:var(--ink);border:0;border-radius:999px;padding:.6em 1.1em;cursor:pointer;box-shadow:0 6px 0 -2px rgba(58,43,75,.2);transition:transform .2s cubic-bezier(.3,1.6,.5,1)}.srch:hover{transform:translateY(-2px)}.srch svg{width:15px;height:15px;fill:currentColor}
.menu{display:none;margin-left:auto}.menu summary{list-style:none;cursor:pointer;width:46px;height:46px;border-radius:50%;background:#fff;border:2px solid var(--ink);display:grid;place-content:center;gap:6px}.menu summary::-webkit-details-marker{display:none}.menu summary span{display:block;width:20px;height:2.5px;border-radius:2px;background:var(--ink);transition:transform .25s}
.menu[open] summary span:first-child{transform:translateY(4.25px) rotate(45deg)}.menu[open] summary span:last-child{transform:translateY(-4.25px) rotate(-45deg)}
.menu-p{position:absolute;left:12px;right:12px;top:calc(var(--top) - 4px);background:#fff;border-radius:26px;padding:12px;box-shadow:0 24px 60px -20px rgba(58,43,75,.45)}.menu-p nav{display:grid}.menu-p a,.menu-nap{padding:.85em 1em;border-radius:14px;text-decoration:none;font-weight:500;font-size:18px}.menu-p a:hover{background:var(--cream2)}
.menu-nap{all:unset;box-sizing:border-box;cursor:pointer;padding:.85em 1em;border-radius:14px;font:600 18px var(--body);background:var(--butter);text-align:center;margin-top:6px}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:.55em;font:600 16px/1 var(--body);text-decoration:none;border:2px solid var(--ink);border-radius:999px;padding:.85em 1.3em;background:#fff;color:var(--ink);cursor:pointer;transition:transform .2s cubic-bezier(.3,1.6,.5,1),box-shadow .2s;box-shadow:0 5px 0 -1px rgba(58,43,75,.9)}
.btn svg{width:14px;height:14px;fill:currentColor;flex:none}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(3px);box-shadow:0 1px 0 -1px rgba(58,43,75,.9)}
.btn.big{padding:1em 1.55em;font-size:17px}.btn.sm{padding:.65em 1.05em;font-size:15px}
.btn.ink{background:var(--ink);color:#FFF7EC}.btn.line{background:rgba(255,255,255,.6)}.btn.line.on{background:rgba(255,255,255,.55);color:var(--ink)}
.btn:disabled{opacity:.5;cursor:default}
/* hero */
.hero{position:relative;padding:clamp(30px,5vw,70px) 0 clamp(36px,5vw,70px);overflow:hidden;isolation:isolate}
.hero.small{padding:clamp(30px,5vw,60px) 0 clamp(14px,2vw,28px)}.hero.small h1{font-size:clamp(40px,7vw,86px)}
.sun{position:absolute;z-index:-1;right:-10%;top:-30%;width:min(900px,90vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#FFE9A8 0,rgba(255,214,107,.5) 34%,rgba(255,179,145,.18) 55%,transparent 68%)}
.zs i{position:absolute;z-index:-1;font:600 44px var(--disp);color:var(--lilac);opacity:0;animation:zup 9s ease-in-out infinite;font-style:normal}
.zs i:nth-child(1){left:48%;top:52%}.zs i:nth-child(2){left:54%;top:42%;animation-delay:-3s;font-size:30px}.zs i:nth-child(3){left:44%;top:60%;animation-delay:-6s;font-size:58px;color:var(--blush)}.zs i:nth-child(4){left:58%;top:30%;animation-delay:-1.6s;font-size:26px;color:var(--peach)}
@keyframes zup{0%{opacity:0;transform:translate(0,30px) rotate(-8deg) scale(.7)}20%{opacity:.8}80%{opacity:.5}100%{opacity:0;transform:translate(36px,-120px) rotate(10deg) scale(1.15)}}
.hero-in{display:grid;grid-template-columns:minmax(0,1fr) 480px;gap:clamp(24px,4vw,70px);align-items:center}
.kick{display:inline-flex;align-items:center;gap:.6em;font:500 14px/1.3 var(--body);letter-spacing:.04em;margin:0 0 18px;color:var(--ink2)}
.kd{width:11px;height:11px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 0 rgba(242,115,90,.55);animation:pulse 2.8s infinite;flex:none}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(242,115,90,0)}100%{box-shadow:0 0 0 0 rgba(242,115,90,0)}}
.hero h1{font-size:clamp(60px,9.2vw,138px);line-height:.9;margin-bottom:.3em;font-weight:700}.hero h1 .h1b{margin-top:-.05em}
.h1a,.h1b{display:inline-block}.h1b{position:relative;z-index:0;white-space:nowrap;font-size:.6em;font-weight:600}
.h1b::before{content:"";position:absolute;z-index:-1;left:-.08em;right:-.08em;bottom:.06em;height:.46em;background:var(--butter);border-radius:.3em;transform:rotate(-1.4deg)}
.hero.small .h1b{font-size:inherit}.hero.small h1{line-height:1.02}
.lede{font-size:clamp(19px,2vw,23px);line-height:1.5;max-width:33em;margin-bottom:.7em}.lede2{color:var(--ink2);max-width:33em}
.badges{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:22px 0 0}.badges li{font:500 14px/1 var(--body);background:#fff;border:2px dashed rgba(58,43,75,.28);border-radius:99px;padding:.65em 1em}
/* nap box + clock */
.napbox{padding:34px 30px 28px;text-align:center}
.nb-k{font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;color:var(--plum);margin-bottom:8px}
.napbox h2{font-size:30px;margin-bottom:18px}
.nclock{--w:.333;position:relative;width:min(100%,250px);aspect-ratio:1;margin:0 auto 18px;transition:transform .4s}
.nclock.big{width:min(100%,300px)}
.nc-face{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 34% 28%,#fff,#FFF3E1 72%);box-shadow:inset 0 -14px 26px rgba(255,179,145,.4),0 0 0 11px var(--butter),0 0 0 13px rgba(58,43,75,.22),0 26px 34px -16px rgba(107,79,163,.55)}
.nc-wedge{position:absolute;inset:8%;border-radius:50%;background:conic-gradient(from 0deg,var(--peach) 0,var(--blush) calc(var(--w)*1turn),transparent 0);transition:background .3s}
.nclock.run .nc-wedge{background:conic-gradient(from 0deg,var(--lilac) 0,var(--blush) calc(var(--w)*1turn),transparent 0)}
.nc-ticks{position:absolute;inset:0}.nc-ticks i{position:absolute;inset:0;transform:rotate(var(--r))}.nc-ticks i::before{content:"";position:absolute;left:50%;top:1.6%;width:3px;height:3.4%;margin-left:-1.5px;background:var(--ink);opacity:.45;border-radius:2px}.nc-ticks i.q::before{width:5px;margin-left:-2.5px;height:5.2%;opacity:.85}
.nc-hand{position:absolute;inset:0;transform:rotate(calc(var(--w)*360deg));transition:transform .3s}.nc-hand::before{content:"";position:absolute;left:50%;top:3.4%;width:9%;height:9%;margin-left:-4.5px;margin-left:-4.5%;border-radius:50%;background:var(--ink);box-shadow:0 0 0 4px #fff,0 6px 10px rgba(58,43,75,.4)}
.nc-mid{position:absolute;inset:22%;border-radius:50%;background:var(--cream);display:grid;place-content:center;text-align:center;box-shadow:inset 0 3px 8px rgba(58,43,75,.12),0 0 0 3px #fff}
.nc-t{font:600 clamp(34px,7vw,46px)/1 var(--disp);font-variant-numeric:tabular-nums;letter-spacing:-.02em}.nclock.big .nc-t{font-size:clamp(34px,8vw,50px)}.nc-s{font:500 13px/1.2 var(--body);color:var(--ink2);margin-top:4px;max-width:9em}
.nclock.done .nc-face{animation:ring .6s ease-in-out infinite alternate}@keyframes ring{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
.lenrow{display:flex;gap:10px;justify-content:center;align-items:flex-end;margin:6px 0 14px}
.lenb{all:unset;box-sizing:border-box;position:relative;cursor:pointer;width:calc(64px + var(--k)*9px);height:calc(66px + var(--k)*11px);border-radius:26px;background:var(--c);display:grid;place-content:center;text-align:center;box-shadow:inset 0 2px 0 rgba(255,255,255,.7),inset 0 -8px 14px -6px rgba(58,43,75,.18),0 8px 0 -3px rgba(58,43,75,.18);transition:transform .25s cubic-bezier(.3,1.6,.5,1),box-shadow .2s}
.lenb::after{content:"";position:absolute;inset:5px;border-radius:21px;border:2px dashed rgba(58,43,75,.22);pointer-events:none}
.lenb b{font:700 calc(24px + var(--k)*3px)/1 var(--disp)}.lenb span{font:500 12.5px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;margin-top:3px}
.lenb:hover{transform:translateY(-3px)}.lenb[aria-pressed=true]{transform:translateY(-8px) scale(1.06);box-shadow:inset 0 2px 0 rgba(255,255,255,.7),0 0 0 4px var(--ink),0 14px 0 -4px rgba(58,43,75,.22)}.lenb:focus-visible{outline:3px solid var(--plum);outline-offset:4px}.lenb:disabled{opacity:.55}
.nb-d{min-height:3.2em;margin:4px 0 10px;color:var(--ink2);font-size:17px}
.nb-btns,.nap-btns,.cta-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.cta-row{justify-content:flex-start}
.nb-s{margin:16px 0 0;font-size:14.5px;color:var(--ink2)}
.sec-h{max-width:780px;margin-bottom:clamp(22px,3vw,40px)}
.eyebrow{font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;color:var(--plum);margin-bottom:12px}
.sec-h h2{font-size:clamp(36px,5.2vw,64px);line-height:1}.sec-p{margin:14px 0 0;color:var(--ink2);font-size:19px}
.lengths,.quilt,.cheat,.how,.doze,.newest,.gd,.free,.faqs{padding:clamp(38px,5.5vw,80px) 0}
/* length cards */
.lcs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:stretch}
.lc{position:relative;background:var(--c);border-radius:40px;padding:26px 24px 24px;display:flex;flex-direction:column;justify-content:space-between;gap:18px;box-shadow:inset 0 2px 0 rgba(255,255,255,.7),inset 0 -16px 30px -14px rgba(58,43,75,.2),0 30px 40px -30px rgba(58,43,75,.5);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.lc::after{content:"";position:absolute;inset:9px;border-radius:32px;border:2px dashed rgba(58,43,75,.2);pointer-events:none}.lc:hover{transform:translateY(-6px) rotate(-.6deg)}
.lc-no{display:flex;align-items:baseline;gap:6px;margin-bottom:12px}.lc-no b{font:700 calc(64px + var(--k)*10px)/.9 var(--disp)}.lc-no i{font:500 18px var(--body);font-style:normal}
.lc-k{font:600 12.5px/1.2 var(--body);text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px;color:var(--ink2)}.lc h3{font-size:25px;margin-bottom:8px}.lc h3 a{text-decoration:none}.lc h3 a::before{content:"";position:absolute;inset:0;border-radius:40px;z-index:0}.lc p{font-size:16px}.lc-m{font:500 13.5px/1.4 var(--body);opacity:.8;margin:6px 0 0}
.lc .cta-row{position:relative;z-index:1;gap:8px}.lc .btn{padding:.7em 1em;font-size:15px}
/* quilt */
.pts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pt{position:relative;background:var(--c);border-radius:28px;padding:22px 22px 22px;min-height:196px;display:flex;flex-direction:column;box-shadow:inset 0 2px 0 rgba(255,255,255,.65),inset 0 -12px 22px -12px rgba(58,43,75,.2);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.pt:nth-child(even){transform:rotate(.5deg)}.pt:nth-child(odd){transform:rotate(-.5deg)}.pt:hover{transform:rotate(0) translateY(-5px)}
.pt::after{content:"";position:absolute;inset:7px;border-radius:22px;border:2px dashed rgba(58,43,75,.2);pointer-events:none}
.pt-no{font:600 12.5px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;opacity:.7;margin-bottom:10px}.pt h3{font-size:27px;margin-bottom:6px}.pt h3 a{text-decoration:none}.pt h3 a::before{content:"";position:absolute;inset:0;border-radius:28px;z-index:1}
.pt-t{margin:0 0 auto;font-size:16px}.pt-m{font:500 14px/1.3 var(--body);margin:12px 0 0;opacity:.8;padding-right:56px}
.pt-play{all:unset;box-sizing:border-box;cursor:pointer;position:absolute;z-index:2;right:16px;bottom:16px;width:48px;height:48px;border-radius:50%;background:var(--ink);color:#FFF7EC;display:grid;place-items:center;box-shadow:0 6px 0 -2px rgba(58,43,75,.35);transition:transform .2s cubic-bezier(.3,1.6,.5,1)}.pt-play:hover{transform:scale(1.1)}.pt-play svg{width:17px;height:17px;fill:currentColor;margin-left:2px}
.pt.on .pt-play svg{margin-left:0}.pt.on{animation:breathe 3.4s ease-in-out infinite}@keyframes breathe{50%{transform:scale(1.025)}}
.pt-play:focus-visible{outline:3px solid #fff;outline-offset:3px}
/* cheat table */
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(24px,4vw,56px);align-items:center}
.cheat h2,.doze h2{font-size:clamp(34px,4.6vw,56px);margin-bottom:16px}.cheat p,.doze p{color:var(--ink2)}
.tbl-w{overflow-x:auto;border-radius:28px;background:#fff;box-shadow:0 0 0 2px var(--ink),0 8px 0 -1px rgba(58,43,75,.2)}.tbl{width:100%;border-collapse:collapse;font-size:16px}
.tbl th,.tbl td{text-align:left;padding:.95em 1.1em;border-bottom:2px dashed rgba(58,43,75,.14)}.tbl thead th{font:600 12.5px var(--body);text-transform:uppercase;letter-spacing:.1em;color:var(--plum);background:var(--cream2)}.tbl tbody tr:last-child>*{border-bottom:0}.tbl tbody th{font:600 20px var(--disp)}.tbl a{text-decoration:none}.tbl a:hover{text-decoration:underline}
/* how */
.steps{list-style:none;margin:0 0 28px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.steps li{background:#fff;border-radius:32px;padding:26px 26px 22px;box-shadow:0 0 0 2px rgba(58,43,75,.1),0 18px 26px -22px rgba(58,43,75,.5)}.steps b{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--butter);font:700 22px var(--disp);margin-bottom:12px}.steps li:nth-child(2) b{background:var(--lilac)}.steps li:nth-child(3) b{background:var(--mint)}.steps h3{font-size:24px;margin-bottom:8px}.steps p{margin:0;color:var(--ink2);font-size:17px}
.safe{background:#FFF1B8;border-radius:30px;padding:22px 26px;box-shadow:0 0 0 2px var(--ink),0 7px 0 -1px rgba(58,43,75,.85)}.safe h3{font-size:24px;margin-bottom:6px}.safe p{margin:0}.safe a{font-weight:600}
/* doze */
.dzl{list-style:none;margin:0;padding:0;display:grid;gap:10px}.dzl li{display:grid;grid-template-columns:92px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;background:#fff;border-radius:24px;padding:12px 18px;box-shadow:inset 6px 0 0 var(--c),0 0 0 1px rgba(58,43,75,.08)}.dzl .zz{grid-row:1/3;align-self:center}.dzl b{font:600 19px var(--disp)}.dzl li>span:last-child{font-size:15px;color:var(--ink2);line-height:1.4}
.zz{display:inline-flex;align-items:baseline;gap:1px;font:700 15px/1 var(--disp);white-space:nowrap}.zz i{font-style:normal;color:var(--plum)}.zz i.o{color:rgba(58,43,75,.2)}
.dzl .zz{font-size:19px}
/* newest: "Just landed" = one big pillow card + a numbered bedside list */
.newest{background:linear-gradient(180deg,rgba(205,187,255,0) 0,rgba(205,187,255,.38) 14%,rgba(255,196,214,.34) 86%,rgba(255,196,214,0) 100%)}
.nws{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(22px,3vw,44px);align-items:start}
.nw-f{position:relative;background:linear-gradient(160deg,#FFE8A8,#FFC9A5 62%,#FFB9CB);border-radius:46px;padding:26px 26px 30px;box-shadow:inset 0 3px 0 rgba(255,255,255,.7),0 0 0 2px var(--ink),0 12px 0 -2px rgba(58,43,75,.9),0 34px 50px -26px rgba(58,43,75,.55)}
.nw-f::after{content:"";position:absolute;inset:10px;border-radius:37px;border:2px dashed rgba(58,43,75,.22);pointer-events:none}
.nw-f>*{position:relative;z-index:1}
.nw-f .nf-art{all:unset;box-sizing:border-box;display:block;position:relative;cursor:pointer;width:min(100%,360px);margin:6px auto 22px;transform:rotate(-2.5deg);transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.nw-f .nf-art:hover{transform:rotate(0) scale(1.02)}
.nw-f .nf-art img{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:34px;border:7px solid #fff;box-shadow:0 22px 30px -18px rgba(58,43,75,.65)}
.nf-pl{position:absolute;right:14px;bottom:14px;width:62px;height:62px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;box-shadow:0 0 0 4px #fff,0 10px 18px -6px rgba(0,0,0,.4)}.nf-pl svg{width:22px;height:22px;fill:currentColor;margin-left:3px}
.nf-st{position:absolute;z-index:3!important;left:-12px;top:-18px;width:92px;height:92px;border-radius:50%;background:var(--butter);color:var(--ink);display:grid;align-content:center;justify-items:center;transform:rotate(-12deg);box-shadow:0 0 0 3px var(--ink),0 8px 0 -1px rgba(58,43,75,.85);font:700 17px/1 var(--disp);text-transform:none}
.nf-st b{display:block;font-weight:700}.nf-st::before{content:"";position:absolute;inset:6px;border-radius:50%;border:2px dashed rgba(58,43,75,.4)}
.nf-k{font:600 12.5px/1.2 var(--body);text-transform:uppercase;letter-spacing:.12em;color:var(--ink2);margin:0 0 8px}
.nf-b h3{font:700 clamp(30px,3.4vw,44px)/1.02 var(--disp);margin:0 0 6px;overflow-wrap:anywhere}
.nf-al{margin:0 0 14px;color:var(--ink2)}
.nf-z{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 20px;font-size:15px}.nf-z .zz{font-size:22px;background:rgba(255,255,255,.7);border-radius:99px;padding:.3em .65em}
.nw-f .cta-row{display:flex;flex-wrap:wrap;gap:10px}
.nl{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:none}
.nl .nw{margin:0}
.nl .tp{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;grid-template-columns:38px 52px minmax(0,1fr) auto 52px 44px;align-items:center;gap:14px;background:rgba(255,255,255,.86);border-radius:26px;padding:8px 10px 8px 12px;box-shadow:0 0 0 2px rgba(58,43,75,.1),0 8px 0 -4px rgba(58,43,75,.1);transition:transform .2s,box-shadow .2s,background .2s}
.nl .tp:hover{transform:translateX(4px);background:#fff;box-shadow:0 0 0 2px var(--ink),0 8px 0 -4px rgba(58,43,75,.85)}
.nl .tp:focus-visible{outline:3px solid var(--plum);outline-offset:3px;border-radius:26px}
.nl-n{position:relative;width:34px;height:34px;border-radius:50%;background:var(--lilac);display:grid;place-items:center;font:700 14px/1 var(--disp);color:var(--ink)}.nl-n em{font-style:normal}
.nl .tp img{width:52px;height:52px;border-radius:16px;border:3px solid #fff;box-shadow:0 6px 10px -6px rgba(58,43,75,.6)}
.nl-t{min-width:0}.nl-t b{display:block;font:600 18px/1.15 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nl-t span{display:block;color:var(--mute);font-size:13.5px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nl .zz{font-size:15px}.nl-d{font:600 14px/1 var(--body);color:var(--ink2);font-variant-numeric:tabular-nums;text-align:right}
.nl-p{width:40px;height:40px;border-radius:50%;background:var(--butter);color:var(--ink);display:grid;place-items:center;box-shadow:0 0 0 2px var(--ink)}.nl-p svg{width:15px;height:15px;fill:currentColor;margin-left:2px}
.eq{display:none;gap:2px;align-items:flex-end;height:14px}.eq i{width:3px;height:6px;background:var(--ink);border-radius:2px}
.nw.on .nl-n em{display:none}.nw.on .eq{display:flex}.nl .nw.on .tp{background:#FFF1BF;box-shadow:0 0 0 3px var(--ink),0 8px 0 -4px rgba(58,43,75,.85)}.nw-f.on{box-shadow:inset 0 3px 0 rgba(255,255,255,.7),0 0 0 4px var(--plum),0 12px 0 -2px rgba(58,43,75,.9),0 34px 50px -26px rgba(58,43,75,.55)}
body.playing .nw.on .eq i{animation:eqb .9s ease-in-out infinite alternate}body.playing .nw.on .eq i:nth-child(2){animation-delay:-.3s}body.playing .nw.on .eq i:nth-child(3){animation-delay:-.6s}
@keyframes eqb{from{height:4px}to{height:14px}}
@media (max-width:1080px){.nws{grid-template-columns:1fr}.nw-f{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:8px 28px;align-items:center}.nw-f .nf-art{margin:6px 0}}
@media (max-width:760px){.nw-f{display:block;border-radius:38px;padding:22px 18px 26px}.nw-f .nf-art{width:min(86%,300px);margin:18px auto 20px}.nf-st{left:-6px;top:-14px;width:80px;height:80px;font-size:15px}.nw-f .cta-row .btn{flex:1 1 100%;justify-content:center}}
@media (max-width:560px){.nl .tp{grid-template-columns:32px 46px minmax(0,1fr) 40px;gap:10px;row-gap:2px}.nl .tp .zz{display:none}.nl-d{display:none}.nl .tp img{width:46px;height:46px}.nl-n{width:30px;height:30px}.nl-t b{font-size:17px}}
/* guides */
.gcs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.gcs.wide{grid-template-columns:repeat(2,1fr);gap:18px;margin-bottom:34px}
.gc a{display:grid;gap:6px;height:100%;background:#fff;border-radius:26px;padding:20px 22px;text-decoration:none;box-shadow:0 0 0 2px rgba(58,43,75,.1);transition:transform .3s cubic-bezier(.3,1.6,.5,1),box-shadow .2s}.gc a:hover{transform:translateY(-4px) rotate(-.4deg);box-shadow:0 0 0 2px var(--ink),0 8px 0 -1px rgba(58,43,75,.85)}
.gc b{font:600 21px/1.15 var(--disp)}.gc span{color:var(--ink2);font-size:15.5px;line-height:1.45}.gc.big i{font:600 15px var(--body);font-style:normal;color:var(--plum);display:flex;align-items:center;gap:7px;margin-top:6px}.gc.big i svg{width:13px;height:13px;fill:currentColor}.gc.big b{font-size:26px}
/* rules + credit + faq */
.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rule{background:#fff;border-radius:34px;padding:28px;box-shadow:0 0 0 2px rgba(58,43,75,.1),0 22px 30px -24px rgba(58,43,75,.5)}.rule .rn{font:600 12.5px/1 var(--body);text-transform:uppercase;letter-spacing:.12em;display:inline-block;padding:.65em .95em;border-radius:99px;margin-bottom:14px}
.rule.y .rn{background:var(--mint)}.rule.z .rn{background:var(--lilac)}.rule.n .rn{background:var(--blush)}
.rule h2,.rule h3{font-size:27px;margin-bottom:12px}.rule ul{margin:0;padding-left:1.2em}.rule li{margin:.3em 0}.rule p{color:var(--ink2)}
.credit{margin-top:14px}.cv-tabs{display:flex;gap:6px;margin-bottom:8px}.cv-tabs button{font:600 14px var(--body);border:2px solid var(--ink);background:#fff;border-radius:99px;padding:.4em .9em;cursor:pointer;color:var(--ink)}.cv-tabs button[aria-pressed=true]{background:var(--ink);color:#FFF7EC}
.cv-text{display:block;font:500 14px/1.5 ui-monospace,Menlo,Consolas,monospace;background:var(--cream);border:2px dashed rgba(58,43,75,.25);border-radius:16px;padding:.8em 1em;margin-bottom:10px;word-break:break-word}
.narrow .sec-h{max-width:none}
.faq details{background:#fff;border-radius:24px;margin:0 0 10px;box-shadow:0 0 0 2px rgba(58,43,75,.1);transition:box-shadow .2s}.faq details[open]{box-shadow:0 0 0 2px var(--ink),0 7px 0 -1px rgba(58,43,75,.85)}
.faq summary{cursor:pointer;list-style:none;padding:1.1em 3.2em 1.1em 1.4em;font:600 18px/1.35 var(--body);position:relative}.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:1.1em;top:50%;transform:translateY(-50%);font:600 28px var(--disp);color:var(--plum);transition:transform .25s}.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq p{padding:0 1.4em 1.2em;margin:0;color:var(--ink2)}.more-faq{margin-top:18px}.more-faq svg,.gall svg{width:13px;height:13px;fill:currentColor;display:inline-block;vertical-align:-1px;margin-left:4px}.more-faq a{font-weight:600}
/* footer */
.foot{background:var(--ink);color:#F4E9F7;padding:56px 0 30px;margin-top:40px;border-radius:48px 48px 0 0}
.foot a{text-decoration:none}.foot a:hover{text-decoration:underline}.foot-top{display:grid;grid-template-columns:1.4fr 1.1fr 1.1fr 1fr;gap:34px}
.foot .wm{color:#fff}.foot .wm b{color:var(--butter)}.fcol h2{font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;color:#D8C4F5;margin-bottom:14px}.fcol h2.mt{margin-top:24px}
.fl{list-style:none;margin:0;padding:0;display:grid;gap:8px}.fl i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--c);margin-right:9px}.fabout p{color:#E4D5F0;font-size:15.5px;margin-top:14px;max-width:26em}
.fine{border-top:2px dashed rgba(255,255,255,.2);margin:36px 0 0;padding-top:20px;color:#D8C9E6;font-size:14px;max-width:72em}
/* playlist head */
.slothead{background:var(--c);padding:clamp(28px,4vw,56px) 0 clamp(34px,5vw,64px);border-radius:0 0 clamp(36px,6vw,80px) clamp(36px,6vw,80px);overflow:hidden;position:relative;box-shadow:inset 0 -12px 0 rgba(255,255,255,.35)}
.sh-in{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(24px,4vw,60px);align-items:center}
.crumbs{font:500 14px/1.4 var(--body);margin-bottom:22px;color:var(--ink2)}.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}.crumbs span{opacity:.6;margin:0 .35em}
.slothead .kick{color:var(--ink)}
.slothead h1{font-size:clamp(44px,6.4vw,92px);line-height:.96;margin-bottom:.3em;font-weight:700}.sh-lede{font-size:clamp(18px,1.9vw,22px);max-width:34em}.sh-meta{font:500 14px/1.5 var(--body);opacity:.85;margin:18px 0 0}
.sh-art{display:grid;place-items:center}
.pil-xl{position:relative;width:min(300px,100%);aspect-ratio:1.1;border-radius:60px;background:linear-gradient(180deg,#FFFDF9,#FFF0DC);display:grid;place-content:center;text-align:center;box-shadow:inset 0 3px 0 #fff,inset 0 -18px 34px -12px rgba(255,179,145,.5),0 34px 46px -26px rgba(58,43,75,.65);transform:rotate(-3deg)}
.pil-xl .stitch{position:absolute;inset:12px;border-radius:48px;border:3px dashed rgba(58,43,75,.2)}.pil-xl b{font:700 60px/.95 var(--disp);position:relative}.pil-xl b.bn{font-size:110px}.pil-xl i{font:500 17px var(--body);font-style:normal;position:relative;margin-top:8px;max-width:11em;color:var(--ink2)}
.pg-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(24px,4vw,56px);padding:clamp(32px,5vw,64px) 0;align-items:start}
.notes h2,.tracks h2,.qa h2{font-size:clamp(30px,3.6vw,44px);margin-bottom:14px}.notes{margin-bottom:34px}.notes p{max-width:42em;color:var(--ink2)}
.tracks{margin-bottom:38px}
.trs{list-style:none;margin:0;padding:0}
.tr{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto auto;align-items:center;gap:8px 14px;background:rgba(255,255,255,.78);border-radius:22px;padding:6px 10px 6px 6px;margin-bottom:8px;box-shadow:0 0 0 1.5px rgba(58,43,75,.09);transition:background .2s,transform .2s}
.tr:hover{background:#fff}.tr.on{background:#fff;box-shadow:0 0 0 3px var(--plum),0 14px 24px -14px rgba(107,79,163,.7)}
.tp{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:12px;cursor:pointer;min-width:0;padding:2px}
.tp:focus-visible{outline:3px solid var(--plum);outline-offset:2px;border-radius:14px}
.tp .n{font:500 13px/1 var(--body);color:var(--mute);width:2.6ch;text-align:right;flex:none;font-variant-numeric:tabular-nums}.tp img{width:44px;height:44px;border-radius:14px;flex:none}
.tt{display:grid;min-width:0}.tt b{font-weight:600;font-size:17px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tt span{color:var(--mute);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tr.on .tt b::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--coral);margin-right:8px;animation:pulse 2s infinite}
.tg{font:500 13.5px/1 var(--body);color:var(--mute);white-space:nowrap}
.tr .zz{background:var(--cream);border-radius:99px;padding:.5em .7em}
.d{font:500 14px var(--body);color:var(--mute);font-variant-numeric:tabular-nums}
.dl{font:600 13px/1 var(--body);text-decoration:none;border:2px solid var(--ink);border-radius:99px;padding:.55em .85em;background:transparent}.dl:hover{background:var(--ink);color:#FFF7EC}
.side{position:sticky;top:calc(var(--top) + 18px);display:grid;gap:16px}
.label{background:var(--c);border-radius:var(--r);padding:22px 24px;position:relative;box-shadow:inset 0 2px 0 rgba(255,255,255,.6),inset 0 -12px 22px -12px rgba(58,43,75,.2)}.label::after{content:"";position:absolute;inset:7px;border-radius:24px;border:2px dashed rgba(58,43,75,.2);pointer-events:none}.lab-h{font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;margin-bottom:12px}.label dl{margin:0;display:grid;gap:12px}.label dt{font:600 12px/1 var(--body);text-transform:uppercase;letter-spacing:.1em;opacity:.7;margin-bottom:3px}.label dd{margin:0;font-weight:500}
.side-b{background:rgba(255,255,255,.78);border-radius:var(--r);padding:20px 24px;box-shadow:0 0 0 1.5px rgba(58,43,75,.09)}.side-b h2{font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;color:var(--plum);margin:0 0 10px}.side-b h2:not(:first-child){margin-top:18px}.side-b ul{margin:0;padding-left:1.1em}.side-b li{margin:.3em 0;color:var(--ink2);font-size:16px}
.rt{list-style:none;margin:0;padding:0;display:grid;gap:2px}.rt-ph{font:600 12px/1 var(--body);text-transform:uppercase;letter-spacing:.12em;color:var(--mute);margin:12px 0 4px}.rt-ph:first-child{margin-top:0}
.rt-s a{display:flex;align-items:center;gap:9px;text-decoration:none;font-weight:500;font-size:16px;padding:.3em .5em;border-radius:10px}.rt-s a:hover{background:var(--cream2)}.rt-s i{width:11px;height:11px;border-radius:50%;background:var(--c);flex:none}.rt-s.cur a{background:var(--ink);color:#FFF7EC}
.pn-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.pn{display:grid;gap:4px;background:#fff;border-radius:24px;padding:16px 20px;text-decoration:none;transition:transform .2s;box-shadow:0 0 0 2px rgba(58,43,75,.1)}.pn:hover{transform:translateY(-3px)}.pn small{font:500 13px var(--body);color:var(--mute)}.pn b{font:600 21px/1.15 var(--disp)}.pn.r{text-align:right}
.qa{margin-bottom:30px}
/* guides pages */
.gstart{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:22px;padding:18px 24px;border-radius:34px;background:var(--c);box-shadow:inset 0 2px 0 rgba(255,255,255,.65),0 18px 26px -20px rgba(58,43,75,.6)}.gstart::after{inset:7px;border-radius:28px}.gstart>div{display:grid;position:relative;z-index:1}.gstart b{font:600 23px var(--disp)}.gstart span{font-size:16px}.gstart .btn{position:relative;z-index:1}
.gpage{padding:10px 0 70px}.toc2{background:rgba(255,255,255,.75);border-radius:24px;padding:16px 22px;margin-bottom:24px;box-shadow:0 0 0 1.5px rgba(58,43,75,.09)}.toc2 b{font:600 13px var(--body);text-transform:uppercase;letter-spacing:.14em;color:var(--plum)}.toc2 ol{margin:8px 0 0;padding-left:1.3em;columns:2;column-gap:30px}.toc2 li{margin:.25em 0;font-size:16px}.toc2 a{text-decoration:none;font-weight:500}.toc2 a:hover{text-decoration:underline}
.prose{max-width:780px}.prose h2{font-size:clamp(28px,3.4vw,40px);margin:38px 0 12px;scroll-margin-top:90px}.prose section:first-child h2{margin-top:0}.prose p,.prose li{color:var(--ink2);font-size:18px}.prose a,.about-t a{color:var(--plum);font-weight:600}.prose ul,.prose ol{padding-left:1.3em}.prose li{margin:.45em 0}
.prose code,.about-t code{font:500 14.5px/1.5 ui-monospace,Menlo,Consolas,monospace;background:#fff;padding:.15em .5em;border-radius:8px;word-break:break-word}.about-t{padding:40px 0}.about-t h2{font-size:32px;margin:30px 0 10px}.about-t p{color:var(--ink2)}
.disc{margin-top:34px;font-size:15px!important;color:var(--mute)!important}
.gside{margin-top:30px}.gside h2{font-size:30px;margin-bottom:14px}.gside .gcs{grid-template-columns:repeat(3,1fr)}.gall{margin-top:16px;font-weight:600}.gall a{color:var(--plum)}
/* library */
.pg-lib{padding-bottom:50px}.lib-bar{position:sticky;top:calc(var(--top) + 8px);z-index:20;padding:18px 22px;display:grid;gap:12px;margin-bottom:18px;border-radius:34px}.lib-bar::after{border-radius:26px}
#q{width:100%;font:500 18px var(--body);padding:.8em 1.2em;border-radius:999px;border:2px solid var(--ink);background:#fff;color:var(--ink);position:relative;z-index:1}#q::placeholder{color:var(--mute)}
.matches{margin:0;font:500 14px var(--body);color:var(--mute);min-height:1.2em}.none{padding:24px;text-align:center;color:var(--mute)}
.chips,.sorts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;position:relative;z-index:1}.sorts>span{font:600 12.5px var(--body);text-transform:uppercase;letter-spacing:.1em;color:var(--mute);margin-right:4px}
.chip,.sorts button{font:500 15px var(--body);border:2px solid var(--ink);background:#fff;border-radius:99px;padding:.45em 1em;cursor:pointer;display:inline-flex;align-items:center;gap:7px;color:var(--ink)}.chip i{width:11px;height:11px;border-radius:50%;background:var(--c)}
.chip[aria-pressed=true],.sorts button[aria-pressed=true]{background:var(--ink);color:#FFF7EC}
/* player bar: a cream pillow */
.pbar{position:fixed;z-index:60;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));max-width:1240px;margin-inline:auto;background:rgba(255,248,238,.95);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:var(--ink);border-radius:32px;padding:10px 16px 10px 12px;display:grid;grid-template-columns:minmax(0,300px) 1fr;gap:16px;align-items:center;box-shadow:0 0 0 2px var(--ink),0 8px 0 -1px rgba(58,43,75,.9),0 30px 50px -20px rgba(58,43,75,.55)}
.pb-now{display:flex;align-items:center;gap:12px;min-width:0}.pb-now img{width:52px;height:52px;border-radius:16px;flex:none;box-shadow:0 0 0 3px #fff,0 6px 12px -6px rgba(58,43,75,.6)}.pb-tx{display:grid;min-width:0}.pb-cap{font:500 12.5px/1.3 var(--body);color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pb-tx b{font:600 19px/1.15 var(--disp);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pb-ctl{display:flex;align-items:center;gap:8px;min-width:0}
.ib{all:unset;box-sizing:border-box;cursor:pointer;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--ink);transition:background .2s,transform .15s;position:relative}.ib:hover{background:rgba(255,214,107,.55)}.ib:focus-visible{outline:3px solid var(--plum)}
.ib svg{width:15px;height:15px;fill:currentColor}.ib.sm{width:36px;height:36px}.ib.sm svg{width:14px;height:14px}.ib[aria-pressed=true]{background:var(--lilac)}
.pp{all:unset;box-sizing:border-box;cursor:pointer;width:54px;height:54px;border-radius:50%;background:var(--butter);color:var(--ink);display:grid;place-items:center;flex:none;box-shadow:0 0 0 2px var(--ink),0 5px 0 -1px rgba(58,43,75,.9);transition:transform .2s cubic-bezier(.3,1.6,.5,1)}.pp:hover{transform:scale(1.08)}.pp:focus-visible{outline:3px solid var(--plum);outline-offset:4px}.pp svg{width:20px;height:20px;fill:currentColor}.pp .ppi{display:grid;place-items:center}.pp .ppi svg{margin-left:2px}.pp[aria-label=Pause] .ppi svg{margin-left:0}
.pb-seek{flex:1;display:flex;align-items:center;gap:10px;font:500 13px var(--body);color:var(--ink2);min-width:0;font-variant-numeric:tabular-nums}
#pb-seek{-webkit-appearance:none;appearance:none;flex:1;min-width:60px;height:24px;background:transparent;margin:0;cursor:pointer;--p:0%}
#pb-seek::-webkit-slider-runnable-track{height:9px;border-radius:99px;background:linear-gradient(90deg,var(--peach),var(--lilac)) 0/var(--p) 100% no-repeat,rgba(58,43,75,.14)}
#pb-seek::-moz-range-track{height:9px;border-radius:99px;background:linear-gradient(90deg,var(--peach),var(--lilac)) 0/var(--p) 100% no-repeat,rgba(58,43,75,.14)}
#pb-seek::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;margin-top:-5.5px;border-radius:50%;background:var(--ink);border:3px solid #fff;box-shadow:0 2px 6px rgba(58,43,75,.5)}#pb-seek::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--ink);border:3px solid #fff}
.pb-x{display:flex;gap:2px;flex:none;align-items:center}
.nbtn.on{width:auto;border-radius:99px;padding:0 12px 0 10px;gap:6px;grid-auto-flow:column;background:var(--peach)}.sl-t{font:600 13px var(--body);font-variant-numeric:tabular-nums}.nbtn:not(.on) .sl-t{display:none}
.toast{position:fixed;z-index:90;left:50%;bottom:calc(max(12px,env(safe-area-inset-bottom)) + 104px);transform:translate(-50%,20px);background:var(--ink);color:#FFF7EC;font-weight:500;font-size:15px;padding:.8em 1.3em;border-radius:99px;box-shadow:0 14px 34px -10px rgba(58,43,75,.6);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;max-width:calc(100% - 32px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
/* nap overlay */
.nap{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px 16px 130px;background:rgba(58,43,75,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow:auto}.nap[hidden]{display:none}
.nap-card{position:relative;width:min(520px,100%);background:linear-gradient(180deg,#FFFDF9,#FFEFD9);border-radius:48px;padding:34px 28px 26px;text-align:center;box-shadow:inset 0 3px 0 #fff,0 0 0 2px var(--ink),0 12px 0 -2px rgba(58,43,75,.9),0 40px 70px -20px rgba(0,0,0,.5);margin:auto}
.nap-card::after{content:"";position:absolute;inset:11px;border-radius:38px;border:2px dashed rgba(58,43,75,.15);pointer-events:none}
.nap-card>*{position:relative;z-index:1}
.nap-x{all:unset;box-sizing:border-box;position:absolute!important;right:18px;top:18px;width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 0 0 2px var(--ink);z-index:2}.nap-x svg{width:14px;height:14px;fill:var(--ink)}.nap-x:hover{background:var(--butter)}.nap-x:focus-visible{outline:3px solid var(--plum);outline-offset:3px}
.nap-k{font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;color:var(--plum);margin-bottom:18px;padding-right:44px;padding-left:44px}.nap-card h2{font-size:30px;margin-bottom:16px;outline:0}
.nap-wake{font:500 17px var(--body);color:var(--ink2);min-height:1.5em;margin:0 0 10px}
.nap-sel{display:grid;gap:6px;text-align:left;margin:6px 0 16px;font:600 13px var(--body);text-transform:uppercase;letter-spacing:.1em;color:var(--plum)}.nap-sel select{font:500 17px var(--body);color:var(--ink);padding:.7em 1em;border-radius:18px;border:2px solid var(--ink);background:#fff;text-transform:none;letter-spacing:0;width:100%}
.nap-run,.nap-done{display:none}.nap[data-state=run] .nap-run,.nap[data-state=done] .nap-done{display:block}.nap[data-state=run] .nap-set,.nap[data-state=done] .nap-set{display:none}
.nap[data-state=run] h2,.nap[data-state=done] h2{display:none}
.nap-ph{font:600 22px var(--disp);margin:0 0 14px}
.nap-safe{margin:20px 0 0;font-size:14.5px;color:var(--ink2);background:#FFF1B8;border-radius:18px;padding:.8em 1em;text-align:left}
.nap-wl{margin:10px 0 0;font-size:13.5px;color:var(--mute);min-height:1.2em}
.nap.dim{background:rgba(25,17,34,.92)}.nap.dim .nap-card{filter:brightness(.42) saturate(.7)}
body.nap-open{overflow:hidden}
body.napping .top .ntb{background:var(--peach)}
/* misc */
.pg-404 .hero{padding-bottom:80px}
.rv{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
@media (max-width:1080px){.hero-in{grid-template-columns:1fr}.napbox{max-width:560px}.lcs{grid-template-columns:repeat(2,1fr)}.pts{grid-template-columns:repeat(2,1fr)}.nav{display:none}.srch{margin-left:auto}.menu{display:block;margin-left:0}.foot-top{grid-template-columns:1fr 1fr}.pg-grid,.sh-in{grid-template-columns:1fr}.side{position:static}.sh-art{justify-items:start}.two{grid-template-columns:1fr}.rules{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.gcs{grid-template-columns:repeat(2,1fr)}.gside .gcs{grid-template-columns:1fr}.zs{display:none}}
@media (max-width:680px){body{font-size:16.5px}.srch span{display:none}.srch{padding:.7em}.hero h1{font-size:clamp(54px,17vw,92px)}.h1b{white-space:normal}.lcs,.pts,.gcs,.gcs.wide{grid-template-columns:1fr}.lc{padding:22px 20px}.foot-top{grid-template-columns:1fr}.foot{border-radius:34px 34px 0 0}.napbox{padding:26px 18px 22px}.nclock{width:min(100%,250px)}.lenb{width:calc(58px + var(--k)*7px)}.lenrow{gap:7px}
.tr{grid-template-columns:minmax(0,1fr) auto auto;padding-right:8px}.tg,.d{display:none}.dl{padding:.5em .7em}.tp .n{display:none}.pn-row{grid-template-columns:1fr}.toc2 ol{columns:1}
.pbar{grid-template-columns:minmax(0,1fr) 36px 46px 36px;gap:2px 4px;padding:8px 12px 6px 10px;border-radius:26px;align-items:center}.pb-ctl{display:contents}.pb-now{grid-column:1;grid-row:1}.pb-seek{grid-column:1/3;grid-row:2}.pb-x{grid-column:3/5;grid-row:2;justify-self:end}#pb-shuf,#pb-dl{display:none}.pb-now img{width:42px;height:42px;border-radius:13px}.pb-tx b{font-size:16px}.pp{width:46px;height:46px}.ib{width:36px;height:36px}.pbar>.pb-ctl>.ib,.pbar>.pb-ctl>.pp{grid-row:1}.pb-seek{font-size:12px}
.toast{bottom:calc(max(12px,env(safe-area-inset-bottom)) + 100px)}.pil-xl{width:200px}.pil-xl b{font-size:46px}.pil-xl b.bn{font-size:80px}.lib-bar{position:static}.nap-card{padding:30px 18px 22px;border-radius:40px}.nap{padding-bottom:120px}.slothead .sh-art{display:none}.slothead{padding-bottom:30px}.dzl li{grid-template-columns:78px minmax(0,1fr)}.tbl{font-size:15px}.tbl th,.tbl td{padding:.8em .8em}.gstart{border-radius:28px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}}