:root{
  --night:#0b1012; --panel:#121a1d; --panel2:#18232a; --line:#26343b;
  --text:#e9efe9; --muted:#9aaba7; --z:#9be22d; --zdark:#5f8f12;
  --lot:#f2a33a; --box:#c79a63; --blood:#c8352f;
  --display:'Bungee',Impact,'Arial Black',sans-serif;
  --body:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif;
  --cond:'Barlow Condensed','Arial Narrow',sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--night);color:var(--text);font:16px/1.5 var(--body);}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));max-width:1320px;margin:0 auto}
:focus-visible{outline:3px solid var(--z);outline-offset:2px}
/* store header */
.top{background:#070a0b;position:sticky;top:0;z-index:20;border-bottom:1px solid #000}
.top .wrap{display:flex;align-items:center;gap:14px;padding-block:10px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{width:40px;height:40px;border-radius:50%}
.logo span{font-family:var(--display);font-size:22px;letter-spacing:.5px}
.logo b{color:var(--z)}
.deliver{font-size:12px;color:var(--muted);line-height:1.2;white-space:nowrap}
.deliver strong{display:block;color:var(--text);font-size:14px}
.search{flex:1;display:flex;min-width:0;border-radius:8px;overflow:hidden;background:#fff}
.search select{border:0;background:#e6e6e6;color:#222;font:600 13px var(--body);padding:0 8px}
.search input{flex:1;min-width:0;border:0;padding:10px 12px;font:15px var(--body);color:#111;background:#fff}
.search button{border:0;background:var(--lot);width:48px;cursor:pointer;font-size:18px}
.acct{font-size:12px;color:var(--muted);line-height:1.2;white-space:nowrap}
.acct strong{display:block;color:var(--text);font-size:14px}
.cart{display:flex;align-items:flex-end;gap:4px;font-weight:700;text-decoration:none}
.cart i{font-style:normal;font-size:26px;line-height:1}
.cart sup{color:var(--lot);font-size:15px}
.dept{background:var(--panel2)}
.dept .wrap{display:flex;gap:4px;overflow-x:auto;padding-block:6px;scrollbar-width:none}
.dept a{white-space:nowrap;text-decoration:none;font-weight:600;font-size:14px;padding:6px 10px;border:1px solid transparent;border-radius:4px}
.dept a:hover{border-color:var(--text)}
.dept a.hot{color:var(--z)}
@media (max-width:820px){.deliver,.acct{display:none}.top .wrap{flex-wrap:wrap}.search{order:5;flex-basis:100%}}
/* hero */
.hero{position:relative;background:#000}
.hero img{width:100%;aspect-ratio:21/9;object-fit:cover;object-position:center 60%;opacity:.85}
.hero .shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,16,18,.96) 0%,rgba(11,16,18,.55) 45%,rgba(11,16,18,0) 75%),linear-gradient(0deg,var(--night) 0%,rgba(11,16,18,0) 35%)}
.hero .copy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:14px;max-width:1320px;margin:0 auto}
.badge{display:inline-flex;align-items:center;gap:8px;font:700 13px var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.badge b{background:var(--z);color:#071000;padding:1px 6px;border-radius:2px;letter-spacing:1px}
.hero h1{font-family:var(--display);font-size:clamp(40px,7vw,92px);line-height:.95;margin:0;letter-spacing:1px}
.hero h1 .z{color:var(--z);text-shadow:0 0 24px rgba(155,226,45,.45)}
.tag{font-size:clamp(16px,1.6vw,20px);max-width:34ch;margin:0;color:#d8e2dc}
.meta{display:flex;flex-wrap:wrap;gap:10px;font:600 14px var(--body);color:var(--muted)}
.meta .rate{border:1px solid var(--muted);padding:0 6px;color:var(--text)}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:6px;font:700 16px var(--body);text-decoration:none;border:0;cursor:pointer}
.btn.play{background:#fff;color:#000}
.btn.sub{background:rgba(120,130,130,.45);color:#fff}
.btn.z{background:var(--z);color:#071000}
@media (max-width:700px){.hero img{aspect-ratio:4/5;object-position:58% center}.hero .copy{justify-content:flex-end;padding-bottom:28px}.hero .shade{background:linear-gradient(0deg,var(--night) 8%,rgba(11,16,18,.7) 45%,rgba(11,16,18,.1) 80%)}}
/* sections */
section{padding-block:30px}
.sh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}
.sh h2{font-family:var(--display);font-size:clamp(20px,2.4vw,28px);margin:0;letter-spacing:.5px}
.sh a{color:var(--z);font-weight:600;font-size:14px;text-decoration:none}
.row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,32%);gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory}
.row>*{scroll-snap-align:start}
.tile{position:relative;border-radius:6px;overflow:hidden;background:var(--panel);text-decoration:none;display:block}
.tile img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .3s}
.tile:hover img{transform:scale(1.04)}
.tile .cap{padding:10px 12px}
.tile .cap strong{display:block;font-size:16px}
.tile .cap span{font-size:13px;color:var(--muted)}
.flag{position:absolute;top:10px;left:10px;font:700 12px var(--cond);letter-spacing:1px;text-transform:uppercase;background:var(--blood);color:#fff;padding:2px 8px;border-radius:3px}
.flag.g{background:var(--z);color:#071000}
.row.shorts{grid-auto-columns:minmax(150px,15%)}
.row.shorts .tile img{aspect-ratio:9/16}
.row.shorts .cap{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,0));padding-top:30px}
@media (max-width:700px){.row{grid-auto-columns:80%}.row.shorts{grid-auto-columns:42%}}
/* characters as employee badges */
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.idcard{background:#e9e4d6;color:#151a14;border-radius:10px;overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.4);position:relative}
.idcard .clip{height:10px;background:var(--lot)}
.idcard .hd{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;font:700 12px var(--cond);letter-spacing:1px;background:#1b2420;color:#fff}
.idcard .hd b{color:var(--z);font-family:var(--display);font-size:16px}
.idcard img{width:100%;aspect-ratio:4/5;object-fit:cover}
.idcard .bd{padding:10px 12px 12px}
.idcard h3{margin:0;font-family:var(--display);font-size:18px;letter-spacing:.3px}
.idcard .role{font:700 13px var(--cond);letter-spacing:1px;text-transform:uppercase;color:#4b6a12}
.idcard p{margin:6px 0 0;font-size:14px;line-height:1.35}
.idcard .no{font-family:var(--cond);font-size:12px;color:#5d6a60;margin-top:8px;font-variant-numeric:tabular-nums;letter-spacing:1px}
/* store */
.shop{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.prod{background:#fff;color:#111;border-radius:6px;padding:14px;display:flex;flex-direction:column;gap:6px}
.prod .pic{aspect-ratio:1;background:var(--panel2);border-radius:4px;display:grid;place-items:center;font-family:var(--display);color:var(--z);font-size:56px;overflow:hidden}
.prod .pic img{width:100%;height:100%;object-fit:cover}
.prod h3{margin:0;font-size:15px;font-weight:600;line-height:1.3}
.stars{color:#de7921;font-size:14px}
.stars small{color:#007185}
.price{font-size:20px;font-weight:700}
.price small{font-size:13px;color:#565959;font-weight:500}
.prime{font:700 12px var(--cond);color:#4b6a12;letter-spacing:.5px}
.prod button{margin-top:auto;border:0;border-radius:20px;padding:9px;background:#ffd814;font:600 14px var(--body);cursor:pointer}
.prod button.voted{background:var(--z)}
/* fan board */
.board{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}
@media (max-width:860px){.board{grid-template-columns:1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px}
.card h3{margin:0 0 6px;font-family:var(--display);font-size:20px}
.card p.sub{margin:0 0 14px;color:var(--muted)}
form .f{display:grid;gap:6px;margin-bottom:12px}
label{font-weight:600;font-size:14px}
input[type=text],input[type=email],select,textarea{width:100%;background:var(--night);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:10px 12px;font:15px var(--body)}
textarea{min-height:110px;resize:vertical}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{font-weight:500;border:1px solid var(--line);border-radius:20px;padding:6px 12px;cursor:pointer}
.chips input{accent-color:var(--z)}
.ok{display:none;background:rgba(155,226,45,.12);border:1px solid var(--zdark);color:var(--z);padding:10px 12px;border-radius:6px;margin-top:10px}
.wall{display:grid;gap:10px}
.note{background:#f5ecc8;color:#222;padding:12px 14px;border-radius:3px;transform:rotate(-.6deg);box-shadow:0 4px 10px rgba(0,0,0,.35);font-size:15px}
.note:nth-child(2n){transform:rotate(.7deg);background:#e8f2cf}
.note b{display:block;font:700 12px var(--cond);letter-spacing:1px;text-transform:uppercase;color:#5d6a60;margin-bottom:4px}
.poll .opt{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.poll .opt label{flex:1;font-weight:500;border:1px solid var(--line);border-radius:6px;padding:9px 12px;cursor:pointer}
.poll .opt input{accent-color:var(--z)}
/* follow */
.socials{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.soc{display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:8px;background:var(--panel2);text-decoration:none;border:1px solid var(--line)}
.soc:hover{border-color:var(--z)}
.soc strong{font-size:16px}
.soc span{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.soc.soon{opacity:.55}
footer{background:#070a0b;margin-top:30px;padding-block:28px;color:var(--muted);font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between}
.marquee{background:var(--z);color:#071000;font:700 14px var(--cond);letter-spacing:2px;text-transform:uppercase;overflow:hidden;white-space:nowrap}
.marquee div{display:inline-block;padding-block:6px;animation:mq 40s linear infinite}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee div{animation:none}.tile img{transition:none}}
.hidden{display:none}
/* v2: tabs as pages */
.tabs{background:var(--panel2)}
.tabs .wrap{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.tabs a{white-space:nowrap;text-decoration:none;font-weight:700;font-size:15px;padding:11px 14px;border-bottom:3px solid transparent;color:#cdd8d3}
.tabs a:hover{color:var(--text);border-bottom-color:var(--line)}
.tabs a.on{color:var(--z);border-bottom-color:var(--z)}
.pagehead{padding-top:34px;padding-bottom:6px}
.pagehead h1{font-family:var(--display);font-size:clamp(30px,5vw,54px);margin:0;line-height:1}
.pagehead p{color:var(--muted);margin:10px 0 0;max-width:60ch;font-size:17px}
.pagehead p b{color:var(--text)}
.lost{min-height:50vh}.lost .btns{margin-top:18px}
/* crew cards: centered picture, name and job */
a.idcard{text-decoration:none;display:block;transition:transform .2s,box-shadow .2s}
a.idcard:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.55)}
.idcard img{object-position:center center}
.idcard .bd{text-align:center}
.idcard .more{margin-top:8px;font:700 13px var(--cond);letter-spacing:1px;text-transform:uppercase;color:#1b2420;background:var(--z);display:inline-block;padding:3px 10px;border-radius:3px}
.idcard.soon .sil{aspect-ratio:4/5;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#1b2420 0 14px,#212c27 14px 28px);color:var(--z);font-family:var(--display);font-size:90px}
.idcard.soon p{font-size:14px;text-align:center}
.badges{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.row.people{grid-auto-columns:minmax(170px,15%)}
@media (max-width:700px){.row.people{grid-auto-columns:46%}}
.flag.o{background:var(--lot);color:#1a1000}
/* promos */
.split{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:760px){.split{grid-template-columns:1fr}}
.promo{display:flex;flex-direction:column;gap:6px;padding:22px;border-radius:10px;text-decoration:none;background:linear-gradient(135deg,#1d2b14,#121a1d);border:1px solid var(--zdark)}
.promo.o{background:linear-gradient(135deg,#2b2014,#121a1d);border-color:#8a5a1c}
.promo strong{font-family:var(--display);font-size:22px}
.promo span{color:#cfdad5}
.promo em{font-style:normal;color:var(--z);font-weight:700}
.promo.o em{color:var(--lot)}
/* employee file */
.crumbs{padding-top:18px}.crumbs a{color:var(--z);text-decoration:none;font-weight:600}
.file{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:34px;align-items:start;padding-top:14px}
@media (max-width:820px){.file{grid-template-columns:1fr}.fileimg{max-width:340px;margin:0 auto;width:100%}}
.fileimg{position:sticky;top:130px}
@media (max-width:820px){.fileimg{position:static}}
.idcard.big h3{font-size:22px}
.filebody h1{font-family:var(--display);font-size:clamp(34px,5vw,60px);margin:8px 0 0;line-height:1}
.jobtitle{font:700 18px var(--cond);letter-spacing:1.5px;text-transform:uppercase;color:var(--z);margin-top:6px}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:20px 0}
@media (max-width:560px){.facts{grid-template-columns:1fr}}
.facts div{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.facts dt{font:700 12px var(--cond);letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.facts dd{margin:4px 0 0}
blockquote{margin:22px 0;padding:18px 20px;border-left:5px solid var(--z);background:var(--panel);font-family:var(--display);font-size:clamp(20px,2.4vw,28px);line-height:1.2;border-radius:0 8px 8px 0}
blockquote cite{display:block;margin-top:8px;font:600 14px var(--body);font-style:normal;color:var(--muted)}
.filebody h2{font-family:var(--display);font-size:20px;margin:26px 0 8px;letter-spacing:.5px}
.filebody p{margin:0 0 12px;font-size:17px;color:#dde6e1;max-width:68ch}
.known{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.known li{padding:10px 14px;background:var(--panel2);border-radius:6px;border-left:3px solid var(--lot)}
.scene{margin:0 0 20px}.scene img{border-radius:8px;width:100%}
.scene figcaption{color:var(--muted);font-size:15px;margin-top:8px}
.pn{display:flex;justify-content:space-between;margin-top:26px;padding-top:16px;border-top:1px solid var(--line)}
.pn a{color:var(--z);text-decoration:none;font-weight:700}
/* forms and misc */
.stack{display:grid;gap:20px;align-content:start}
.poll .opt label{display:flex;align-items:center;gap:10px}
.poll .opt img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.lbl{font-weight:600;font-size:14px}
.news{margin-top:16px;display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.news .grow{flex:1;min-width:220px;margin:0}
.news .ok{flex-basis:100%}
.desc{font-size:13px;color:#565959}
footer .fz{color:var(--text);font-family:var(--display)}footer .fz span{color:var(--z)}
footer a{color:var(--text)}
.fl{display:flex;flex-wrap:wrap;gap:14px}
.top .tabs .wrap{flex-wrap:nowrap;gap:2px;padding-block:0}
.badges{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
@media (max-width:820px){.tabs a{padding:10px 11px;font-size:14px}}
.seo{margin:0;font:700 13px var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.sent{background:rgba(155,226,45,.10);border:1px solid var(--zdark);border-radius:10px;padding:22px;text-align:center}
.sent .tick{width:54px;height:54px;border-radius:50%;background:var(--z);color:#071000;display:grid;place-items:center;font-size:28px;font-weight:700;margin:0 auto 10px}
.sent strong{display:block;font-family:var(--display);font-size:22px;color:var(--z)}
.sent p{margin:8px auto 14px;max-width:46ch;color:#dde6e1}
.notify{margin-top:8px;display:grid;gap:6px;font-size:13px}
.notify label{font-weight:600;font-size:13px;color:#333}
.notify .row2{display:flex;gap:6px}
.notify input{flex:1;min-width:0;background:#fff;color:#111;border:1px solid #bbb;border-radius:6px;padding:7px 9px;font-size:14px}
.notify button{border:0;border-radius:6px;background:var(--z);font-weight:700;padding:0 10px;cursor:pointer;margin:0}
.okline{color:#4b6a12;font-weight:700;font-size:13px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width:560px){.two{grid-template-columns:1fr}}
select{appearance:auto}
button:disabled{opacity:.7;cursor:wait}
.player{position:relative;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.5);border:1px solid var(--line)}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.under{color:var(--muted);margin:10px 0 0;font-size:15px}
.sent .stamp{display:inline-block;font-family:var(--display);font-size:22px;letter-spacing:3px;color:var(--blood);border:4px solid var(--blood);border-radius:6px;padding:4px 14px;transform:rotate(-7deg);margin:0 0 12px;opacity:.95;mix-blend-mode:screen}
.sent .fine{display:block;font:700 11px var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:12px}

.cd{margin-top:18px;display:inline-flex;flex-wrap:wrap;align-items:center;gap:14px;background:rgba(0,0,0,.55);border:1px solid var(--z);border-radius:12px;padding:10px 14px;max-width:100%}
.cd .cdl{font-size:14px;color:#e8f2cf}.cd .cdl b{color:#fff}.cd .cdl a{color:var(--z)}
.cd .cdr{display:flex;gap:10px}.cd .cdr div{text-align:center;min-width:46px}
.cd .cdr b{display:block;font-size:26px;font-weight:900;color:var(--lot);line-height:1;font-variant-numeric:tabular-nums}
.cd .cdr small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}