/* final.css · Nudy FINAL PUSH (Ki 4:01 PM Oct 18 2026). Revert = drop this file's <link>. */
/* 7) Sli'merre: zoom out. The album's own sky strokes (L+R sky of the real cover, texture-quilted, no new paint) shown at the cover's own scale; was a 460px crop blown up ~3x */
.world.era-slimerre::before{background:url(img/sl-sky3.webp?v=2) top center/cover no-repeat,#8ab4f0!important}
.era-slimerre .w-hero::after{width:min(560px,82%)!important;aspect-ratio:1000/793!important;margin:34px auto 18px!important;background:url(img/sl-scene3.webp?v=1) center/contain no-repeat!important;border-radius:12px!important;box-shadow:0 14px 40px rgba(10,36,99,.28)!important}

/* 2) THEN / NOW — no words, just the years */
#thennow{margin:46px auto 8px;max-width:760px;padding:0 4px}
.tn{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,3vw,26px);align-items:end}
.tn-f{margin:0;text-align:center}
.tn-pic{position:relative;overflow:hidden;border-radius:16px;background:#f1f1f1;box-shadow:0 10px 30px rgba(0,0,0,.55)}
.tn-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;display:block}
.tn-pic.tn-photo img{object-fit:cover;object-position:50% 20%}
.tn-then .tn-pic img{filter:none}
.tn-f figcaption{font-family:Anton,Impact,sans-serif;font-size:clamp(30px,8vw,54px);letter-spacing:3px;color:#fff;margin-top:10px;line-height:1}
.tn-then figcaption{color:#e9e9e9}
.tn-now figcaption{color:#39ff14;text-shadow:0 0 16px rgba(57,255,20,.45)}
.tn-cr{text-align:center;font-size:11px;color:#8a9a86;margin:12px 0 0}
.tn-cr a{color:#8a9a86}
/* 4) The snake — one central thing + his words */
.snk{display:flex;flex-direction:column;align-items:center;text-align:center;margin:44px auto 18px;max-width:640px;padding:0 10px}
.snk-med{width:min(280px,66vw);aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px #e9e9e9,0 0 0 7px #8b0000,0 16px 44px rgba(0,0,0,.6);animation:snkb 5.5s ease-in-out infinite}
.snk-med img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes snkb{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.015)}}
@media (prefers-reduced-motion:reduce){.snk-med{animation:none}}
.snk-q{margin:22px 0 0;padding:0}
.snk-q p{font-family:Anton,Impact,sans-serif;font-size:clamp(26px,6.6vw,44px);line-height:1.12;letter-spacing:1px;color:#39ff14;margin:0;text-transform:uppercase}
.snk-q cite{display:block;margin-top:10px;font-style:normal;font-size:13px;letter-spacing:1px}
.snk-q cite a{color:#cfd8cc;text-decoration:none;border-bottom:1px solid #3a5a33}
.era-just-doin-me .snk-q p{color:#fff;text-shadow:0 3px 0 #7a0008}
.era-just-doin-me .snk-q cite a{color:#fff}
/* 6) JDM first */
.btn.jdm-go{margin-left:8px;background:#b3121a;color:#fff;border-color:#ff3b3b}
@media (max-width:480px){.btn.jdm-go{margin:10px 0 0}}
/* 1) timeline photo stops */
.tl-ph .tl-c{flex-direction:column;align-items:center;text-align:center;padding:14px 12px 12px}
.tl-fig{position:relative;width:min(240px,62vw);margin:0;overflow:hidden;border-radius:12px;background:radial-gradient(120% 90% at 50% 100%,#123d0c 0,#0a160a 60%,#050805 100%)}
.tl-fig.lite{background:#f1f1f1}
.tl-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;display:block}
.tl-fig.photo img{object-fit:cover}
.tl-ph .tl-c>span{display:flex;flex-direction:column;gap:2px;margin-top:8px}

/* round 2 (task a55d2b5f): dated press photos, shown whole */
.tl-fig{max-width:100%}
.tl-fig.land{width:340px;max-width:100%}
.tl-ph .tl-c{min-width:0}
.tl-fig.photo{background:#0b0f0b}
.tl-fig.now{background:#ececec}
.tn-pic{max-width:560px;margin:0 auto}
.tn-now .tn-pic{background:#ececec}
/* then/now = Ki's THIS vs THAT pair (5:06 PM), both 500px stage shots */
.tn{max-width:620px;margin:0 auto}
.tn-pic{max-width:300px;background:#0b0f0b}
.tn-pic.tn-photo img{object-fit:cover;object-position:50% 50%}
/* cousins strip (Ki, 5:10 PM) */
#cousins{margin:40px auto 10px;max-width:820px;padding:0 4px;text-align:center}
.cz{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,3vw,22px);max-width:820px;margin:0 auto}
.cz figure{margin:0}
.cz img{display:block;width:100%;max-width:400px;height:auto;margin:0 auto;border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,.6)}
.cz figcaption{margin-top:8px;font:500 13px/1.4 system-ui,-apple-system,sans-serif;color:#cfd8cc}
/* latest drops (Ki 5:11 PM) */
#drops{margin:36px auto 10px;max-width:700px;padding:0 4px;text-align:center}
.dr{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,3vw,24px)}
.dr-c{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
.dr-c img{width:100%;max-width:300px;height:auto;aspect-ratio:1;border-radius:12px;box-shadow:0 10px 28px rgba(0,0,0,.6)}
.dr-c b{font-family:Anton,Impact,sans-serif;font-size:clamp(18px,4.6vw,24px);letter-spacing:1px;color:#fff;margin-top:8px;font-weight:400}
.dr-c small{color:#cfd8cc;font-size:12px}
.dr-b{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:6px}
.dr-b .btn{min-height:44px;display:inline-flex;align-items:center;padding:8px 14px;font-size:14px}
/* official JDM cover in the countdown (Apple Music, Oct 28 2026) */
.jdm-ofc{margin:14px auto 16px;width:min(300px,72vw)}
.jdm-ofc img{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:10px;box-shadow:0 12px 34px rgba(0,0,0,.6)}
.jdm-ofc figcaption{margin-top:8px;font-size:12px;letter-spacing:1px;color:inherit;opacity:.85}
.btn.wdi{margin-left:8px}
@media (max-width:480px){.btn.wdi{margin:10px 0 0}}
/* arcade header photo (Ki 5:14 PM) */
#arc-nudy{position:relative;margin:6px auto 18px;width:min(420px,86vw);border-radius:16px;overflow:hidden;box-shadow:0 12px 34px rgba(0,0,0,.6)}
#arc-nudy img{display:block;width:100%;height:auto;aspect-ratio:1}
#arc-nudy::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.45));pointer-events:none}

/* NEXT PASS (task 18b7da30, Oct 18 2026) */
/* then & now = Ki's 5:31 PM pick: youngest (2017 interview) vs smiling now (his Facebook) */
.tn-pic{max-width:300px}
.tn-pic.tn-photo img{object-fit:cover;object-position:50% 30%}
.tn-f figcaption{font-size:clamp(26px,7vw,48px)}
.tn-f figcaption span{font-size:.55em;letter-spacing:2px;opacity:.85;white-space:nowrap}
/* cousins strip: STEPBROTHERS song tile + his own IG posts */
.cz .cz-song{grid-column:1/-1;max-width:560px;margin:6px auto 0;width:100%}
.cz-play{position:relative;display:block;border-radius:14px;overflow:hidden}
.cz .cz-song img{max-width:100%;aspect-ratio:16/9;object-fit:cover}
.cz-pb{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:rgba(179,18,26,.92);color:#fff;font:400 24px/58px system-ui,sans-serif;text-align:center;box-shadow:0 6px 20px rgba(0,0,0,.6);pointer-events:none}
.cz-song figcaption b{display:block;font:400 clamp(20px,5vw,28px)/1.1 Anton,Impact,sans-serif;letter-spacing:2px;color:#fff;margin-bottom:2px}
.cz-ig{min-width:0}
.cz-reel{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;aspect-ratio:1;max-width:400px;margin:0 auto;border-radius:14px;background:linear-gradient(135deg,#1a1a1a,#3a0508 60%,#b3121a);color:#fff;text-decoration:none;box-shadow:0 10px 28px rgba(0,0,0,.6);padding:12px}
.cz-reel .cz-pb{position:static;transform:none}
.cz-reel b{font:400 clamp(16px,4.4vw,22px)/1.1 Anton,Impact,sans-serif;letter-spacing:1px}
.cz-reel small{font-size:11px;color:#e9d6d6}
.cz-ig figcaption a{color:#cfd8cc;text-decoration:none}
/* latest drops: Who Dat Is on top, wide */
.dr-c.dr-w{grid-column:1/-1}
.dr-c.dr-w img{max-width:560px;aspect-ratio:16/9;object-fit:cover}
/* in-site video player */
.nwv{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.94);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px}
.nwv[hidden]{display:none}
.nwv-f{width:min(960px,100%);aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden}
.nwv-f iframe{width:100%;height:100%;border:0;display:block}
.nwv-t{margin:12px 0 0;color:#cfd8cc;font:500 13px/1.4 system-ui,-apple-system,sans-serif}
.nwv-x{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:14px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font:400 26px/44px system-ui,sans-serif;cursor:pointer}
