/* Ad Flow Pilot — marketing site. Board "LANDING v2 FINAL — black" (canvas v45) + production layer.
   One accent variable: switch saffron -> blue by changing --accent only. */
:root{
  --accent:#F2A33C;          /* saffron (default). Blue option: #2E6BE6 */
  --page:#0F1015; --band:#15181E; --card:#1A1E25; --card2:#242B36;
  --line:#2A2F38; --line2:#333A45; --ink:#F5F2EA; --ink2:#C9CED6; --ink3:#B9C0CB; --muted:#8E97A5;
  --font:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--page);color:var(--ink);font-family:var(--font)}
img,svg{max-width:100%}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--accent);color:#0F1015;padding:10px 14px;border-radius:10px;font-weight:700}
.skip:focus{left:8px}
.wrap{max-width:1400px;margin:0 auto}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- nav ---------- */
.nav{display:flex;align-items:center;gap:24px;padding:18px 48px;flex-wrap:wrap;position:relative;z-index:2}
.nav .brand{display:flex;align-items:center;gap:11px;margin-right:auto;color:var(--ink)}
.logo{width:38px;height:38px;border-radius:11px;background:var(--accent);color:#0F1015;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px}
.navlink{font-size:15px;font-weight:600;color:#D9DEE6}
.lang{display:flex;align-items:center;background:var(--card);border:1px solid var(--line2);border-radius:99px;padding:3px}
.lang button{font-family:var(--font);font-size:13px;font-weight:600;color:var(--muted);background:transparent;border:0;border-radius:99px;padding:6px 12px;cursor:pointer;min-height:32px}
.lang button[aria-pressed="true"]{font-weight:700;color:#0F1015;background:var(--ink)}
.navcta{font-family:var(--font);font-size:15px;font-weight:700;color:#0F1015;background:var(--accent);padding:10px 18px;border-radius:99px;border:0;cursor:pointer;min-height:44px}

/* ---------- legal pages ---------- */
.legal{max-width:860px;margin:0 auto;padding:40px 24px 72px;color:var(--ink2);font-size:16px;line-height:1.7}
.legal h1{font-size:40px;line-height:1.15;letter-spacing:-1.2px;margin:8px 0 6px;color:var(--ink)}
.legal h2{font-size:21px;letter-spacing:-0.4px;margin:34px 0 8px;color:var(--ink)}
.legal p,.legal li{color:var(--ink2)}
.legal strong{color:var(--ink)}
.legal a{color:var(--accent);text-decoration:underline}
.legal table{width:100%;border-collapse:collapse;margin:14px 0;font-size:14.5px;display:block;overflow-x:auto}
.legal th,.legal td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.legal th{background:var(--card);color:var(--ink)}
.legal blockquote{margin:14px 0;padding:12px 18px;border-left:3px solid var(--accent);background:var(--card);border-radius:0 12px 12px 0}
.draftbar{background:#2A2214;border:1px solid #6E4E1A;color:#F2C98A;border-radius:14px;padding:12px 16px;font-size:14px;line-height:1.5;margin-bottom:18px}
.legalnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.legalnav a{font-size:13px;font-weight:600;color:#D9DEE6;background:var(--card);border:1px solid var(--line2);border-radius:99px;padding:7px 12px;text-decoration:none}
.legalnav a[aria-current="page"]{background:var(--ink);color:#0F1015}
.updated{font-size:13px;color:var(--muted);margin:0 0 20px}

/* ---------- footer ---------- */
.foot{padding:40px 48px 48px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:18px}
.foot .row{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.foot .row a,.foot .row button{font-size:14px;font-weight:600;color:var(--ink2)}
.foot .linkbtn{background:none;border:0;padding:0;font-family:var(--font);cursor:pointer;text-decoration:underline}
.foot .co{font-size:12.5px;color:var(--muted);line-height:1.7;max-width:1100px}
.foot .co a{color:var(--muted);text-decoration:underline}

/* ---------- waitlist dialog ---------- */
dialog.wl{border:1px solid var(--line2);border-radius:20px;background:var(--card);color:var(--ink);padding:0;width:min(480px,calc(100vw - 32px));font-family:var(--font)}
dialog.wl::backdrop{background:rgba(5,6,9,.72)}
.wl-in{padding:26px 26px 22px;display:flex;flex-direction:column;gap:14px}
.wl h2{margin:0;font-size:26px;letter-spacing:-0.7px;font-weight:800}
.wl p{margin:0;color:var(--ink3);font-size:15px;line-height:1.55}
.wl label{font-size:14px;font-weight:700;color:var(--ink)}
.wl input[type=email]{width:100%;font-family:var(--font);font-size:16px;padding:13px 14px;border-radius:12px;border:1.5px solid #3A414D;background:var(--page);color:var(--ink);min-height:48px}
.wl .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.wl .fine{font-size:12.5px;color:var(--muted);line-height:1.55}
.wl .fine a{color:var(--muted);text-decoration:underline}
.wl .msg{font-size:14px;font-weight:600;min-height:20px}
.wl .msg.ok{color:#43C286}.wl .msg.err{color:#F39486}
.wl .x{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;border:0;background:var(--card2);color:var(--ink);font-size:20px;cursor:pointer}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}

/* ---------- cookie banner ---------- */
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:760px;margin:0 auto;background:var(--card);border:1px solid var(--line2);border-radius:18px;padding:18px 20px;box-shadow:0 18px 40px rgba(0,0,0,.45);display:none;flex-direction:column;gap:12px;font-size:14px;line-height:1.55;color:var(--ink2)}
.ck.show{display:flex}
.ck b{color:var(--ink)}
.ck a{color:var(--accent);text-decoration:underline}
.ck .row{display:flex;gap:10px;flex-wrap:wrap}
.ck button{font-family:var(--font);font-weight:700;font-size:14px;border-radius:12px;padding:11px 16px;cursor:pointer;min-height:44px}
.ck .acc{background:var(--accent);color:#0F1015;border:0}
.ck .rej,.ck .ch{background:var(--card2);color:var(--ink);border:1px solid #3A414D}
.ck .prefs{display:none;flex-direction:column;gap:8px;padding:6px 0}
.ck.open .prefs{display:flex}
.ck .prefs label{display:flex;gap:10px;align-items:flex-start;color:var(--ink2)}
.ck .prefs input{width:20px;height:20px;margin-top:2px;accent-color:var(--accent)}

/* ---------- gallery filters (soft-launch examples) ---------- */
.wall .tile[hidden]{display:none}
select option:disabled{color:#5E6672}
.filters select{max-width:230px}
.nores{font-size:14px;color:var(--muted)}

/* ---------- responsive: tablet ---------- */
@media (max-width: 1180px){
  .crewstage{height:auto!important;display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px}
  .crewstage .crewm{position:relative!important;left:auto!important;right:auto!important;top:auto!important;width:auto}
  .crewstage .arrows{display:none}
  .crewstage .stack{position:relative!important;grid-column:1/-1;order:-1;height:640px}
  .crewstage .stack .rd{left:50%;margin-left:-125px;top:30px}
  .crewstage .stack .sheet{left:50%;margin-left:-150px;top:505px}
  .crewstage .crewcap{position:static!important;transform:none!important;width:auto!important;grid-column:1/-1}
  .varstage{height:auto!important;display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
  .varstage>*{position:static!important;width:auto!important}
  .varstage>.card{flex:0 1 230px}
  .varstage>.dcard{flex:0 1 290px}
  .varstage>.vtwall{flex:1 1 100%}
  .varstage>svg{display:none}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
/* ---------- responsive: phone ---------- */
@media (max-width: 760px){
  .nav{padding:14px 16px;gap:10px}
  .navlink{display:none}
  .nav .brand span{font-size:17px!important}
  .navcta{padding:9px 14px;font-size:14px}
  .sec{padding:48px 16px!important;gap:22px!important}
  .h2{font-size:30px!important;letter-spacing:-0.8px!important}
  .sub{font-size:16px!important}
  .hero{min-height:640px!important}
  .hero h1{font-size:44px!important;letter-spacing:-1px!important}
  .hero .heroin{padding:40px 16px!important}
  .hero .heroin p{font-size:17px!important}
  .badge{flex-wrap:wrap;justify-content:center}
  .badge>span:nth-child(2){font-size:28px!important}
  .crewstage{grid-template-columns:1fr}
  .crewstage .stack{height:600px;transform:scale(.92);transform-origin:top center}
  .hlt{font-size:19px!important}
  .tabs{display:flex;width:100%}
  .tab span{padding:9px 12px}
  .g3{grid-template-columns:1fr!important}
  .tile{width:calc(50% - 9px)!important;height:auto!important;aspect-ratio:9/16}
  .stile{width:calc(33.33% - 10px)!important;height:auto!important;aspect-ratio:9/16}
  .vtwall .vt{width:calc(25% - 8px)!important;height:auto!important;aspect-ratio:9/16}
  .closer h2{font-size:34px!important}
  .foot{padding:32px 16px 96px}
  .legal{padding:28px 16px 72px}
  .legal h1{font-size:30px}
  .ig{flex:1 1 100%!important}
  .filters select{flex:1 1 calc(50% - 6px)}
  .filters .count{margin-left:0!important;width:100%}
}
.mark{flex:0 0 auto;display:block}

/* ---- board styles (locked design) ---- */


a{color:#C9CED6;text-decoration:none}a:hover{color:var(--accent)}
h1,h2,h3{font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#F5F2EA}
.btn{font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-weight:700;font-size:16.5px;letter-spacing:-0.2px;padding:16px 28px;border-radius:14px;cursor:pointer;border:none;color:#0F1015}
.btn-s{background:#1A1E25;color:#F5F2EA;border:1.5px solid #3A414D}
.sec{padding:76px 48px;display:flex;flex-direction:column;gap:28px}
.band{background:#15181E}
.h2{margin:0;font-weight:800;font-size:42px;letter-spacing:-1.3px}
.sub{margin:0;font-size:17px;line-height:1.6;color:#B9C0CB;max-width:780px}
.dark h2,.dark h3{color:#F5F2EA}
.dark .sub{color:#B9C0CB}
.tile{width:196px;height:348px;border-radius:16px;position:relative;overflow:hidden;flex:0 0 auto}
.stile{width:146px;height:260px;border-radius:14px;position:relative;overflow:hidden;flex:0 0 auto}
.tilecap{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;background:linear-gradient(transparent,rgba(10,12,16,0.85));color:#F6F3EC;font-size:12.5px;line-height:1.4}
.scap{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;background:linear-gradient(transparent,rgba(10,12,16,0.85));color:#F6F3EC;font-size:11.5px;line-height:1.4}
.play{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,0.9);display:flex;align-items:center;justify-content:center}
.fchip{position:absolute;top:14px;left:14px;background:rgba(255,255,255,0.92);color:#0F1015;font-size:11.5px;font-weight:700;border-radius:99px;padding:5px 10px}
.chip{background:#1A1E25;border:1.5px solid #333A45;border-radius:99px;padding:9px 16px;font-size:14px;font-weight:600;color:#D9DEE6}
.dchip{background:#1A1E25;border:1px solid #333A45;border-radius:99px;padding:9px 16px;font-size:14px;font-weight:600;color:#D9DEE6}
select{appearance:none;-webkit-appearance:none;background:#1A1E25;border:1px solid #333A45;color:#F5F2EA;font-size:14px;font-weight:600;padding:11px 34px 11px 13px;border-radius:14px;font-family:"Plus Jakarta Sans",sans-serif;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238E97A5' stroke-width='1.8'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
select:focus-visible,.btn:focus-visible,summary:focus-visible{outline:2px solid #C97B12;outline-offset:2px}
.hwall{position:absolute;inset:-60px 0;display:flex;gap:14px;justify-content:center;opacity:0.55}
.hcol{display:flex;flex-direction:column;gap:14px;width:150px;flex:0 0 auto}
.htile{width:150px;height:267px;border-radius:12px;flex:0 0 auto}
@media (prefers-reduced-motion: no-preference){
  .drift-d{animation:driftd 36s linear infinite alternate}
  .drift-u{animation:driftu 36s linear infinite alternate}
  @keyframes driftd{from{transform:translateY(-70px)}to{transform:translateY(70px)}}
  @keyframes driftu{from{transform:translateY(70px)}to{transform:translateY(-70px)}}
}
details.faq{background:#1A1E25;border:1px solid #2A2F38;border-radius:16px}
details.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px;font-size:17px;font-weight:700;color:#F5F2EA;letter-spacing:-0.3px}
details.faq summary::-webkit-details-marker{display:none}
summary .pm{width:28px;height:28px;border-radius:50%;background:#242B36;color:#E8A23C;display:flex;align-items:center;justify-content:center;font-size:17px;flex:0 0 auto;font-weight:600}
details.faq p{margin:0;padding:0 22px 20px;font-size:15px;line-height:1.65;color:#B9C0CB}
details.more{border:none;background:transparent}
details.more summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:#D9DEE6;padding:11px 16px;border:1px solid #333A45;border-radius:14px;background:#1A1E25}
details.more summary::-webkit-details-marker{display:none}
.card{background:#1A1E25;border:1px solid #2A2F38;border-radius:18px}
.dcard{background:#1A1E25;border:1px solid #2A2F38;border-radius:18px}
.crew{background:#1A1E25;border:1px solid #2A2F38;border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:9px;flex:1 1 280px}
.crewm{position:absolute;width:300px;box-sizing:border-box;background:#1A1E25;border:1px solid #2A2F38;border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:7px;box-shadow:0 10px 26px rgba(0,0,0,0.35)}
.crewm .nm{font-size:16px;font-weight:700;letter-spacing:-0.3px;color:#F5F2EA}
.crewm .ds{font-size:13.5px;color:#B9C0CB;line-height:1.5}
.cico{width:44px;height:44px;border-radius:12px;background:#2A2214;display:flex;align-items:center;justify-content:center}
.done{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#43C286}
.pico{width:52px;height:52px;border-radius:14px;background:#2A2214;display:flex;align-items:center;justify-content:center}
.pcard{background:#1A1E25;border:1px solid #2A2F38;border-radius:20px;padding:26px;display:flex;flex-direction:column;gap:11px}
.strike{text-decoration:line-through;color:#9AA0A8;font-size:17px;font-weight:600;letter-spacing:0}
.fn{font-size:12.5px;color:#8E97A5;line-height:1.7}
.fn a{color:#8E97A5;text-decoration:underline}
.mult{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mx{font-size:20px;font-weight:800;color:#F2A33C}
.tabs{display:inline-flex;align-items:center;flex-wrap:wrap;background:#1A1E25;border:1.5px solid #333A45;border-radius:99px;padding:4px;gap:2px}
.tab{cursor:pointer;position:relative}
.rt{position:absolute;opacity:0;pointer-events:none}
.tab span{display:inline-block;font-size:14px;font-weight:700;border-radius:99px;padding:9px 18px;color:#8E97A5;transition:background .2s,color .2s}
.tab:hover span{color:#D9DEE6}
.rt:focus-visible+span{outline:2px solid #C97B12;outline-offset:2px}
.rt-a:checked+span{background:#F5F2EA;color:#0F1015}
.rt-b:checked+span{background:#C94A38;color:#FFF6F3}
.rt-c:checked+span{background:#6F5AE0;color:#F4F1FF}
.crewsec .v-b,.crewsec .v-c{display:none}
.crewsec:has(.rt-b:checked) .v-a,.crewsec:has(.rt-c:checked) .v-a{display:none}
.crewsec:has(.rt-b:checked) .v-b,.crewsec:has(.rt-c:checked) .v-c{display:block}
.crewsec:has(.rt-b:checked) .tag.v-b,.crewsec:has(.rt-c:checked) .tag.v-c{display:inline-flex}
.crewsec:has(.rt-b:checked) .fx.v-b,.crewsec:has(.rt-c:checked) .fx.v-c{display:flex}
.tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;border-radius:99px;padding:4px 10px;align-self:flex-start;line-height:1.35}
.tag-a{background:rgba(67,194,134,.12);color:#43C286}
.tag-b{background:rgba(226,105,90,.14);color:#F39486}
.tag-w{background:rgba(242,163,60,.14);color:#F2B45E}
.tag-c{background:rgba(155,135,245,.16);color:#BDB0FF}
.hl{border-radius:18px;padding:20px 22px;background:#1A1E25;border:1px solid #2A2F38;border-left:4px solid #43C286}
.hl.v-b{border-left-color:#E2695A}.hl.v-c{border-left-color:#8B76F2}
.hlt{font-size:24px;font-weight:800;letter-spacing:-0.7px;line-height:1.3;color:#F5F2EA}
.hlf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.hc{font-size:13px;font-weight:700;border-radius:99px;padding:6px 12px;background:#242B36;color:#D9DEE6}
.hop{font-size:16px;font-weight:800;color:#8E97A5}
.crewm{transition:border-color .2s,box-shadow .2s}
.crewsec:has(.rt-b:checked) .crewm{border-color:rgba(226,105,90,.32)}
.crewsec:has(.rt-c:checked) .crewm{border-color:rgba(139,118,242,.34)}
.crewsec:has(.rt-b:checked) .crewm.na .nm{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:#E2695A}
.crewsec:has(.rt-b:checked) g.na{opacity:.18}
.crewsec:has(.rt-b:checked) .cpk{opacity:.5}
.crewsec:has(.rt-b:checked) .cpk b{text-decoration:line-through;text-decoration-color:#E2695A}
.rd{position:absolute;left:527px;top:70px;width:250px;height:445px;border-radius:22px;border:3px solid #0F1015;overflow:hidden;box-sizing:border-box;transition:transform .75s cubic-bezier(.2,.8,.2,1),filter .75s,z-index .75s,box-shadow .75s}
.rd-a{z-index:3;transform:none;filter:none;box-shadow:0 22px 50px rgba(0,0,0,.5)}
.rd-b{z-index:2;transform:translate(36px,-26px) rotate(4deg) scale(.92);filter:brightness(.5)}
.rd-c{z-index:1;transform:translate(-36px,-46px) rotate(-5deg) scale(.85);filter:brightness(.32)}
.crewsec:has(.rt-b:checked) .rd-b{z-index:3;transform:none;filter:none;box-shadow:0 22px 50px rgba(0,0,0,.5)}
.crewsec:has(.rt-b:checked) .rd-c{z-index:2;transform:translate(36px,-26px) rotate(4deg) scale(.92);filter:brightness(.5);box-shadow:none}
.crewsec:has(.rt-b:checked) .rd-a{z-index:1;transform:translate(-36px,-46px) rotate(-5deg) scale(.85);filter:brightness(.32);box-shadow:none}
.crewsec:has(.rt-c:checked) .rd-c{z-index:3;transform:none;filter:none;box-shadow:0 22px 50px rgba(0,0,0,.5)}
.crewsec:has(.rt-c:checked) .rd-a{z-index:2;transform:translate(36px,-26px) rotate(4deg) scale(.92);filter:brightness(.5);box-shadow:none}
.crewsec:has(.rt-c:checked) .rd-b{z-index:1;transform:translate(-36px,-46px) rotate(-5deg) scale(.85);filter:brightness(.32);box-shadow:none}
@media (prefers-reduced-motion: reduce){.rd{transition:none}}
.sheet{position:absolute;left:502px;top:545px;width:300px;border-radius:14px;background:#FFFFFF;border:1.5px solid #D7DAE0;box-shadow:0 10px 26px rgba(0,0,0,.35);padding:12px 14px;display:flex;flex-direction:column;gap:7px;box-sizing:border-box;z-index:4;transition:opacity .3s,box-shadow .15s}
.crewsec:has(.rt-b:checked) .sheet{opacity:.35}
.ph{cursor:default;transition:box-shadow .15s}
g.lyr path,g.lyr circle{transition:opacity .2s}
.crewsec:has(.lyr-writer:hover) .crewm.lyr-writer,.crewsec:has(.lyr-camera:hover) .crewm.lyr-camera,.crewsec:has(.lyr-casting:hover) .crewm.lyr-casting,.crewsec:has(.lyr-voice:hover) .crewm.lyr-voice,.crewsec:has(.lyr-composer:hover) .crewm.lyr-composer,.crewsec:has(.lyr-editor:hover) .crewm.lyr-editor,.crewsec:has(.lyr-translator:hover) .crewm.lyr-translator,.crewsec:has(.lyr-adcopy:hover) .crewm.lyr-adcopy{border-color:#2E6BE6 !important;box-shadow:0 0 0 3px rgba(46,107,230,0.25)}
.crewsec:has(.lyr-writer:hover) g.lyr-writer path,.crewsec:has(.lyr-camera:hover) g.lyr-camera path,.crewsec:has(.lyr-casting:hover) g.lyr-casting path,.crewsec:has(.lyr-voice:hover) g.lyr-voice path,.crewsec:has(.lyr-composer:hover) g.lyr-composer path,.crewsec:has(.lyr-editor:hover) g.lyr-editor path,.crewsec:has(.lyr-translator:hover) g.lyr-translator path,.crewsec:has(.lyr-adcopy:hover) g.lyr-adcopy path{stroke:#2E6BE6;stroke-dasharray:none;opacity:1;marker-end:url(#arrb)}
.crewsec:has(.lyr-writer:hover) g.lyr-writer,.crewsec:has(.lyr-camera:hover) g.lyr-camera,.crewsec:has(.lyr-casting:hover) g.lyr-casting,.crewsec:has(.lyr-voice:hover) g.lyr-voice,.crewsec:has(.lyr-composer:hover) g.lyr-composer,.crewsec:has(.lyr-editor:hover) g.lyr-editor,.crewsec:has(.lyr-translator:hover) g.lyr-translator,.crewsec:has(.lyr-adcopy:hover) g.lyr-adcopy{opacity:1 !important}
.crewsec:has(.lyr-writer:hover) g.lyr-writer circle,.crewsec:has(.lyr-camera:hover) g.lyr-camera circle,.crewsec:has(.lyr-casting:hover) g.lyr-casting circle,.crewsec:has(.lyr-voice:hover) g.lyr-voice circle,.crewsec:has(.lyr-composer:hover) g.lyr-composer circle,.crewsec:has(.lyr-editor:hover) g.lyr-editor circle,.crewsec:has(.lyr-translator:hover) g.lyr-translator circle,.crewsec:has(.lyr-adcopy:hover) g.lyr-adcopy circle{fill:#2E6BE6}
.crewsec:has(.lyr-writer:hover) .ph.lyr-writer,.crewsec:has(.lyr-camera:hover) .ph.lyr-camera,.crewsec:has(.lyr-casting:hover) .ph.lyr-casting,.crewsec:has(.lyr-voice:hover) .ph.lyr-voice,.crewsec:has(.lyr-composer:hover) .ph.lyr-composer,.crewsec:has(.lyr-editor:hover) .ph.lyr-editor,.crewsec:has(.lyr-translator:hover) .ph.lyr-translator,.crewsec:has(.lyr-adcopy:hover) .ph.lyr-adcopy{box-shadow:0 0 0 2.5px #2E6BE6,0 0 22px rgba(46,107,230,0.6) !important;opacity:1 !important}
.crewsec:has(.lyr-camera:hover) .ph.lyr-camera{background:rgba(46,107,230,0.16)}
.afpw{font-weight:800}
.vt{width:72px;height:128px;border-radius:10px;position:relative;overflow:hidden;flex:0 0 auto}
.vt b{position:absolute;left:6px;right:6px;top:7px;font-size:9.5px;line-height:1.2;color:#FFF8EE;font-weight:800}
.vt i{position:absolute;right:5px;bottom:5px;font-style:normal;font-size:8.5px;font-weight:700;background:rgba(255,255,255,.92);color:#0F1015;border-radius:99px;padding:1px 5px}
.vt u{position:absolute;left:50%;top:54px;width:22px;height:22px;margin-left:-11px;border-radius:50%;background:rgba(245,242,234,.55)}
.vt u:after{content:"";position:absolute;left:-9px;top:25px;width:40px;height:22px;border-radius:14px 14px 4px 4px;background:rgba(245,242,234,.35)}
.dial{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#242B36;border-radius:12px;padding:9px 12px}
.dial span{font-size:14px;font-weight:700;color:#F5F2EA}.dial em{font-style:normal;font-size:14px;font-weight:800;color:var(--accent)}
.ig{background:#1A1E25;border:1px solid #2A2F38;border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:14px;flex:1 1 300px}
.igk{font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:#8E97A5}
.dots{display:grid;grid-template-columns:repeat(10,1fr);gap:7px;max-width:290px}
.dots span{height:22px;border-radius:5px;background:#2E3540}
.bar{height:14px;border-radius:99px;background:#2A313C;overflow:hidden}

/* real media */
img.htile{display:block;object-fit:cover;background:#1A1E25}
.tile.vid,.stile.vid{font-family:var(--font);color:inherit;text-align:left}
.tile.vid:hover,.stile.vid:hover{outline:2px solid var(--accent);outline-offset:2px}
.tile.vid .play,.stile.vid .play{transition:transform .15s}
.tile.vid:hover .play,.stile.vid:hover .play{transform:scale(1.12)}
.stile.vid .play{width:30px;height:30px;top:auto;bottom:44px;right:10px}
dialog.player{border:1px solid #333A45;border-radius:20px;background:#15181E;color:#F5F2EA;padding:0;width:min(420px,calc(100vw - 32px))}
dialog.player::backdrop{background:rgba(5,6,9,.85)}
.pl-in{position:relative;padding:16px;display:flex;flex-direction:column;gap:12px;align-items:center}
.pl-in video{width:100%;max-height:72vh;aspect-ratio:9/16;border-radius:14px;background:#000}
.pl-note{margin:0;font-size:12.5px;color:#8E97A5;text-align:center}
.pl-in .x{position:absolute;top:24px;right:24px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:rgba(15,16,21,.8);color:#F5F2EA;font-size:20px;cursor:pointer}

/* phone: template filters as a bottom sheet */
.fsheet-open,.fsheet-apply{display:none}
@media (max-width: 760px){
  .fsheet-open{display:inline-flex;align-self:flex-start}
  .filters{display:none!important}
  .filters.sheet-open{display:flex!important;position:fixed;left:0;right:0;bottom:0;z-index:70;background:#15181E;border-top:1px solid #333A45;border-radius:20px 20px 0 0;padding:20px 16px 24px!important;max-height:80vh;overflow:auto;box-shadow:0 -18px 40px rgba(0,0,0,.5)}
  .filters.sheet-open .fsheet-apply{display:inline-flex;width:100%;justify-content:center}
}

/* ---- example ads layer (media.css) ---- */
/* hero: live wall (five scrolling columns, cursor spotlight, parallax) */
.hero{position:relative;overflow:hidden}
.hero .heroin{position:relative;z-index:2}
.hero h1,.hero .heroin p{text-shadow:0 2px 18px rgba(0,0,0,.55)}
.hw{position:absolute;inset:0;overflow:hidden;z-index:0}
.hwin{position:absolute;inset:-40px -20px;display:flex;gap:16px;justify-content:center;transition:transform .5s cubic-bezier(.2,.8,.2,1);will-change:transform}
.hc{width:212px;flex:0 0 auto;overflow:visible}
.htrack{display:flex;flex-direction:column;gap:16px;animation:hscroll var(--dur,70s) linear infinite}
.hc.rev .htrack{animation-direction:reverse}
.hero.paused .htrack{animation-play-state:paused}
@keyframes hscroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,calc(-50% - 8px),0)}}
.ht{position:relative;width:212px;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#1A1E25;flex:0 0 auto;transition:box-shadow .25s,transform .25s}
.ht img,.ht video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ht video{z-index:1}
.htn{position:absolute;z-index:2;left:10px;right:10px;bottom:10px;font-size:11.5px;font-weight:700;line-height:1.25;color:#F5F2EA;text-shadow:0 1px 6px rgba(0,0,0,.8)}
.htd{position:absolute;z-index:2;top:10px;right:10px;font-size:10.5px;font-weight:800;color:#0F1015;background:rgba(245,242,234,.9);border-radius:99px;padding:2px 7px}
.ht.lit{box-shadow:0 0 0 2px var(--accent),0 18px 50px rgba(0,0,0,.6);transform:scale(1.03)}
.hveil{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 38% 44% at 50% 44%,rgba(15,16,21,.78),rgba(15,16,21,.5) 70%,rgba(15,16,21,.38));transition:background .3s}
.hero.spot .hveil{background:
  radial-gradient(circle 230px at var(--mx,50%) var(--my,50%),rgba(15,16,21,0),rgba(15,16,21,0) 40%,rgba(15,16,21,.5) 100%),
  radial-gradient(ellipse 30% 26% at 50% 44%,rgba(15,16,21,.6),rgba(15,16,21,0))}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(15,16,21,0),#0F1015)}
@media (prefers-reduced-motion: reduce){.htrack{animation:none}.hwin{transition:none}}
@media (max-width: 760px){
  .hc4,.hc5{display:none}
  .hc,.ht{width:128px}
  .hwin{gap:10px}.htrack{gap:10px}
  .htn{font-size:9.5px}
}

/* crew: real ads that stop on each crew member's moment */
.rd video.cv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#0F1015}
.rd .cvl{position:absolute;left:8px;right:8px;bottom:8px;z-index:2;font-size:11.5px;line-height:1.35;font-weight:600;color:#F5F2EA;
  background:rgba(15,16,21,.84);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:7px 9px;transition:border-color .3s}
.rd.held .cvl{border-color:var(--accent)}
.rd-b.held .cvl{border-color:#E2695A}
.rd-c.held .cvl{border-color:#8B76F2}
.rd .cvtag{position:absolute;top:8px;left:8px;z-index:2;font-size:10.5px;font-weight:800;border-radius:99px;padding:3px 9px;background:#F5F2EA;color:#0F1015}
.rd-b .cvtag{background:#C94A38;color:#FFF6F3}
.rd-c .cvtag{background:#6F5AE0;color:#F4F1FF}
.cvsnd{position:absolute;left:792px;top:470px;z-index:4;display:inline-flex;align-items:center;gap:6px;font:700 12.5px var(--font,inherit);
  color:#F5F2EA;background:#1A1E25;border:1px solid #333A45;border-radius:99px;padding:7px 12px;cursor:pointer}
.cvsnd .w{opacity:.35}.cvsnd[aria-pressed=true]{border-color:var(--accent)}.cvsnd[aria-pressed=true] .w{opacity:1}
.crewsec .crewm{cursor:pointer}
.crewsec .crewm.on{border-color:#2E6BE6!important;box-shadow:0 0 0 3px rgba(46,107,230,.25)}
.crewsec g.lyr.on{opacity:1!important}
.crewsec g.lyr.on path{stroke:#2E6BE6;stroke-dasharray:none;opacity:1;marker-end:url(#arrb)}
.crewsec g.lyr.on circle{fill:#2E6BE6}
.sheet .cp{flex:1;font-size:10px;line-height:1.3;color:#3A3F4A;font-weight:600}
.sheet .cp .v-b{color:#B3402E}.sheet .cp .v-c{color:#5A46C8}
@media (max-width: 1100px){.cvsnd{position:static;justify-self:center;grid-column:1/-1}}

/* inline previews */
.vbox{position:relative;display:block;width:100%;aspect-ratio:9/16;border:0;padding:0;border-radius:18px;overflow:hidden;background:#1A1E25;cursor:pointer}
.vbox video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vbox .play{z-index:2;top:auto;bottom:12px;right:12px;left:auto}

/* real product, real place */
.rpgrid{display:grid;grid-template-columns:repeat(3,minmax(0,270px)) minmax(220px,1fr);gap:28px;margin-top:28px;align-items:start}
.rp{margin:0;display:flex;flex-direction:column;gap:12px;position:relative}
.rp-bad .vbox{box-shadow:0 0 0 2px #C94A38}
.rp-good .vbox{box-shadow:0 0 0 2px var(--accent)}
.rp-bad .chip{color:#F39486}
.rp-good .chip{color:var(--accent)}
.rp .chip{align-self:flex-start;font-size:12.5px;line-height:1.35;white-space:normal}
.rpin{position:absolute;top:12px;left:12px;z-index:3;width:36%;border-radius:10px;overflow:hidden;border:2px solid #F5F2EA;box-shadow:0 8px 20px rgba(0,0,0,.5);pointer-events:none}
.rpin img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.rpin b{position:absolute;left:0;right:0;bottom:0;font-size:10px;font-weight:800;color:#0F1015;background:rgba(245,242,234,.92);padding:2px 6px}
.rpbul{display:flex;flex-direction:column;gap:16px;align-self:center}
@media (max-width: 1100px){.rpgrid{grid-template-columns:repeat(3,minmax(0,1fr))}.rpbul{grid-column:1/-1}}
@media (max-width: 680px){.rpgrid{grid-template-columns:minmax(0,320px);justify-content:center}}

/* festivals: picker + strip */
.fpick{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:28px;align-items:start;margin:26px 0 30px}
.fpl label{display:block;font-size:14px;font-weight:800;margin-bottom:10px;color:#F5F2EA}
.fpl select{width:100%}
.fpn{font-size:12.5px;color:#8E97A5;margin:10px 0 0}
.fpo{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;min-height:120px}
.fph{flex-basis:100%;display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.fph b{font-size:22px;font-weight:800;letter-spacing:-.4px;color:#F5F2EA}
.fph span{font-size:14px;color:var(--accent);font-weight:700}
.fpv{width:190px}
.fpc{max-width:260px;font-size:13px;color:#8E97A5;margin:0;align-self:flex-end}
.fpsoon{border:1.5px dashed #333A45;border-radius:16px;padding:18px 20px;max-width:380px;display:flex;flex-direction:column;gap:6px}
.fpsoon b{color:var(--accent)}.fpsoon span{color:#B9C0CB;font-size:14px}
.fstrip{display:flex;gap:14px;flex-wrap:wrap}
.fstrip .stile[hidden]{display:none}
.stile .fdate{position:absolute;top:44px;left:12px;font-size:10.5px;font-weight:800;color:#F5F2EA;background:rgba(15,16,21,.75);border-radius:99px;padding:3px 8px}
@media (max-width: 760px){.fpick{grid-template-columns:1fr}.fpv{width:150px}}

/* demo video: hook -> demo -> end card */
.sq{display:grid;grid-template-columns:150px 34px 160px 34px 150px 240px;align-items:center;column-gap:18px;row-gap:14px;margin-top:22px;justify-content:start}
.sqhooks{display:flex;flex-direction:column;gap:10px}
.hk{position:relative;height:84px;border-radius:12px;background:#1A1E25 center 30%/cover no-repeat;border:2px solid #2A2F38;cursor:pointer;padding:0;overflow:hidden}
.hk:after,.sqpart:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,16,0) 40%,rgba(10,12,16,.85))}
.hk span,.sqpart span{position:absolute;z-index:1;left:8px;right:8px;bottom:6px;font-size:11.5px;font-weight:800;color:#FFF8EE;text-align:left;line-height:1.25}
.hk.on{border-color:#8E97A5}.hk.live,.sqpart.live{border-color:var(--accent);box-shadow:0 0 0 3px rgba(242,163,60,.25)}
.sqpart{position:relative;height:270px;border-radius:14px;background:#1A1E25 center/cover no-repeat;border:2px solid #2A2F38;overflow:hidden;transition:border-color .2s}
.sqplay{position:relative;width:220px;margin-left:30px;aspect-ratio:9/16;border-radius:18px;overflow:hidden;justify-self:center;background:#0F1015;box-shadow:0 22px 50px rgba(0,0,0,.5)}
.sqplay video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sqnow{position:absolute;left:8px;right:8px;bottom:8px;z-index:2;font-size:11.5px;font-weight:700;color:#F5F2EA;background:rgba(15,16,21,.84);border-radius:10px;padding:6px 9px}
.sqsnd{position:absolute;top:8px;right:8px;z-index:2;font:700 11.5px inherit;color:#F5F2EA;background:rgba(15,16,21,.8);border:1px solid #333A45;border-radius:99px;padding:5px 10px;cursor:pointer}
.sqsnd[aria-pressed=true]{border-color:var(--accent)}
.sqnote{font-size:12.5px;color:#8E97A5;margin:14px 0 0}
@media (max-width: 960px){
  .sq{grid-template-columns:1fr 1fr;justify-items:center}
  .sqa{display:none}
  .sqhooks{grid-column:1/-1;flex-direction:row;width:100%}.hk{flex:1}
  .sqpart{height:200px;width:100%}
  .sqplay{grid-column:1/-1}
}

/* retire the old workflow: icons */
.rlist>span{display:flex;gap:12px;align-items:flex-start}
.ri{flex:0 0 30px;height:30px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;margin-top:-3px}
.ri-old{background:rgba(201,74,56,.14);color:#E2695A}
.ri-new{background:rgba(242,163,60,.14);color:var(--accent)}

/* what's happening: an ad per card */
.dcard.hap{display:flex;gap:16px;align-items:center;text-align:left;cursor:pointer;font-family:inherit;color:inherit;width:100%}
.dcard.hap:hover{border-color:var(--accent)}
.hapv{position:relative;flex:0 0 58px;height:103px;border-radius:10px;overflow:hidden;background:#0F1015}
.hapv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hapv .play{transform:scale(.75);top:auto;bottom:4px;right:4px;left:auto}
.hapt{display:flex;flex-direction:column;gap:4px}
.hapt>span{display:block}

/* gallery: all ads, "Load more" */
.tile img.tp{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.more-row{display:flex;justify-content:center;margin-top:24px}
.loadmore[hidden]{display:none}