/* 2026-10 redesign (Figma daKDUs4tU0OcBMyXkB2GyD): Gabarito headings, Albert Sans UI,
   Red Hat Mono numbers/labels (Google Fonts, linked in layout.js). Studio grey ground,
   graphite ink, steel surfaces, one orange accent. */
:root{
  /* --gold/--glow names are legacy: they hold the ACCENT. */
  --gold:#ff6a1f; --gold-2:#ff8a3d; --gold-soft:rgba(255,106,31,.10); --gold-line:rgba(255,106,31,.32);
  --gold-ink:#c2410c; --gold-deep:#e2560c; --peach:#ffb27a;
  --glow:255,106,31; --glow2:255,106,31;
  --emerald:#0a0b0f; --teal:#3a3d43;
  --bg:#d9d9d9; --bg-2:#e4e4e5;
  --surface:#fafafa; --surface-2:#f4f4f5; --surface-3:#ececee;
  --steel:linear-gradient(180deg,#fafafa,#efeff1);
  --line:rgba(10,11,15,.09); --line-2:rgba(10,11,15,.16);
  --ink:#0a0b0f; --body:#3a3d43; --muted:#6a6e75; --faint:#9a9da3;
  --tg:#229ed9;
  --radius:22px; --radius-sm:14px; --pill:999px; --maxw:1360px;
  --shadow-sm:0 1px 2px rgba(10,11,15,.05);
  --shadow-md:0 12px 30px rgba(10,11,15,.10);
  --shadow-lg:0 24px 60px rgba(10,11,15,.16);
  --ring:0 0 0 3px rgba(255,106,31,.22);
  --display:"Gabarito",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --font:"Albert Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"Red Hat Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
::selection{background:var(--gold);color:#fff}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
body{margin:0;font-family:var(--font);color:var(--body);line-height:1.62;font-size:16px;
  -webkit-font-smoothing:antialiased;max-width:100%;
  background:var(--bg);
  background-image:radial-gradient(1200px 620px at 78% -8%,rgba(var(--glow),.05),transparent 60%),
                   radial-gradient(1000px 560px at 10% -4%,rgba(var(--glow2),.04),transparent 58%);
  background-attachment:fixed}
img{max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{color:var(--ink);line-height:1.16;margin:0 0 .4em;font-weight:700;letter-spacing:-.02em;font-family:var(--display)}
p{margin:0 0 1em}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.muted{color:var(--muted)}
.small{font-size:.85rem}
.center{text-align:center}
.grad{background:linear-gradient(92deg,var(--gold-2),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.link{color:var(--gold);font-weight:600;font-size:.9rem}
.link:hover{color:var(--gold-2)}
main{min-height:60vh}
/* Content-column rails: two hairlines at the wrap edges, hero to footer
   (owner reference: peerpush's full-height column lines). Fixed so they run
   through every section; behind content, above section backgrounds. */
body::before,body::after{content:"";position:fixed;top:0;bottom:0;width:1px;
  background:var(--line);z-index:10;pointer-events:none}
body::before{left:calc(50% - var(--maxw)/2)}
body::after{right:calc(50% - var(--maxw)/2)}
@media(max-width:1160px){body::before,body::after{display:none}}
/* content sits above the rails */
.site-header,main,.site-footer{position:relative;z-index:2}
.site-header{z-index:50}

/* buttons — refined, subtle depth, gold primary reads premium */
.btn{display:inline-flex;align-items:center;gap:.5em;font-weight:600;font-size:.9rem;font-family:var(--font);
  padding:.72em 1.25em;border:1px solid var(--line-2);border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;
  background:var(--surface-2);color:var(--ink);box-shadow:var(--shadow-sm);
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);border-color:var(--line-2)}
.btn:active{transform:translateY(0)}
.btn-primary{background:linear-gradient(180deg,var(--gold-2),var(--gold));color:#fff;border-color:transparent;font-weight:700;
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 22px rgba(242,106,27,.22)}
.btn-primary:hover{filter:brightness(1.04);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 12px 30px rgba(242,106,27,.3)}
.btn-dark{background:#211c14;color:#fff;border-color:transparent}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-ghost:hover{border-color:var(--gold-line);color:var(--gold-2)}
.btn-lg{padding:.95em 1.7em;font-size:1rem}
/* Telegram CTA — the one place off-palette blue is allowed: it's Telegram's
   own brand color, and the button must read "Telegram" at a glance */
.btn-telegram{background:linear-gradient(180deg,#38b0e3,#229ed9);color:#fff;border-color:transparent;font-weight:700;
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 22px rgba(34,158,217,.25)}
.btn-telegram:hover{filter:brightness(1.05);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 12px 30px rgba(34,158,217,.33)}
.btn-telegram svg{flex:none}
/* .footer-grid a rules (block, muted, gold hover) would otherwise flatten the
   button — re-assert the button look at higher specificity */
.footer-grid a.footer-tg{display:inline-flex;color:#fff;padding:.72em 1.25em;margin:6px 0 22px}
.footer-grid a.footer-tg:hover{color:#fff}
@media (prefers-reduced-motion:reduce){.btn:hover,.btn:active{transform:none}}

/* header — translucent dark glass, hairline base */
.site-header{position:sticky;top:0;z-index:50;background:rgba(245,241,232,.85);backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid rgba(33,28,20,.07)}
/* the column rails cross THROUGH the navbar (vertical over the horizontal
   border) — the header background is opaque-ish, so it draws its own pair. */
.site-header::before,.site-header::after{content:"";position:absolute;top:0;bottom:-1px;width:1px;
  background:var(--line);pointer-events:none}
.site-header::before{left:calc(50% - var(--maxw)/2)}
.site-header::after{right:calc(50% - var(--maxw)/2)}
@media(max-width:1160px){.site-header::before,.site-header::after{display:none}}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px}
.logo{display:inline-flex;align-items:center;gap:11px;font-size:1.2rem;font-weight:700;letter-spacing:-.02em;color:var(--ink);font-family:var(--display)}
.logo-word{font-weight:700}
.logo-word span{color:var(--gold)}
.logo-mark{display:inline-flex;align-items:center;justify-content:center;width:35px;height:35px;flex:none;
  background:linear-gradient(145deg,var(--gold-2),var(--gold));color:#fff;font-size:.82rem;font-weight:800;
  letter-spacing:-.02em;border-radius:10px;font-family:var(--display);
  box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 6px 16px rgba(242,106,27,.22);transition:transform .16s,box-shadow .16s}
.logo:hover .logo-mark{transform:translateY(-1px)}
.logo-sm{font-size:1.05rem}
.logo-sm .logo-mark{width:30px;height:30px;font-size:.74rem}
.nav{display:flex;align-items:center;gap:10px;font-weight:600;font-size:.9rem;flex:1}
/* Nav (owner 2026-09-25 "wall of pills"): plain text links next to the logo,
   one 40px height for every action on the right, no capsule. */
.nav-links{display:flex;align-items:center;gap:2px;margin:0 auto 0 18px;height:40px;padding:0 3px;background:#fff;border:1px solid var(--line);border-radius:var(--pill);box-shadow:var(--shadow-sm)}
.nav-links a{padding:.42em .95em;border-radius:var(--pill);color:var(--body);transition:background .14s,color .14s}
.nav-links a:hover{background:var(--surface-3);color:var(--ink)}
.nav-links a[aria-current="true"]{background:var(--gold-soft);color:var(--gold)}
.nav .btn{height:40px;padding:0 16px;font-size:.88rem;box-shadow:none}
.nav .btn-primary{box-shadow:var(--shadow-sm)}

/* hero — deep, art-directed, felt-green + gold glow, fine grid */
/* Hero stickers: Telegram animated stickers dotted across the hero (owner
   direction). Absolute scatter in the side gutters; play once on load, replay
   on hover / slow stagger (track.js); stills under reduced motion. */
.hero-sticks{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero-sticks .stick{position:absolute;pointer-events:auto;filter:drop-shadow(0 8px 18px rgba(33,28,20,.18))}
.stick-dice{left:3%;top:16%;width:78px;height:78px;transform:rotate(-9deg)}
.stick-coin{right:3%;top:14%;width:60px;height:60px;transform:rotate(11deg)}
.stick-bag{left:13%;top:34%;width:52px;height:52px;transform:rotate(7deg)}
.stick-ball{right:7%;top:56%;width:50px;height:50px;transform:rotate(-8deg)}
.stick-gem{left:6%;top:63%;width:42px;height:42px;transform:rotate(14deg)}
.stick-slot{right:13%;top:36%;width:54px;height:54px;transform:rotate(-12deg)}
/* the tagcloud reaches ~880px wide: park the inner stickers only on wide screens */
@media(max-width:1200px){.stick-bag,.stick-slot{display:none}}
@media(max-width:900px){.stick-gem,.stick-ball{display:none}}
@media(max-width:760px){
  .stick-dice{left:3%;top:8%;width:54px;height:54px}
  .stick-coin{right:3%;top:8%;width:44px;height:44px}}
.hero{position:relative;padding:96px 0 72px;text-align:center;overflow:hidden;
  background:linear-gradient(180deg,#faf7f0,var(--bg) 86%);
  border-bottom:1px solid var(--line)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(760px 300px at 50% -6%,rgba(var(--glow),.08),transparent 62%),
            radial-gradient(680px 320px at 16% 8%,rgba(var(--glow2),.05),transparent 60%)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(33,28,20,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(33,28,20,.075) 1px,transparent 1px);
  background-size:44px 44px;mask:radial-gradient(720px 420px at 50% 30%,#000,transparent 80%)}
.hero .wrap{position:relative;z-index:2}
.hero-deco{display:none}
.hero h1{font-family:var(--display);font-size:clamp(2.2rem,6vw,3.7rem);letter-spacing:-.035em;margin-bottom:.26em;
  font-weight:700;overflow-wrap:break-word;color:var(--ink)}
.hero-sub{font-size:1.16rem;color:var(--muted);margin:0 auto 2em;max-width:620px}
.search{display:flex;gap:9px;max-width:600px;margin:0 auto}
.search input{flex:1;padding:.95em 1.2em;border:1px solid var(--line-2);border-radius:var(--radius-sm);font-size:1rem;
  background:#fff;color:var(--ink);box-shadow:var(--shadow-sm)}
.search input::placeholder{color:var(--faint)}
.search input:focus{outline:none;border-color:var(--gold-line);box-shadow:var(--ring)}
.search-inline{margin:0 0 26px}

/* category pills */
.tagcloud{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:30px auto 0;max-width:880px}
.tagpill{display:inline-flex;align-items:center;gap:7px;font-size:.86rem;font-weight:500;
  padding:.5em .95em;border:1px solid var(--line);border-radius:var(--pill);color:var(--body);background:#fff;transition:.16s}
.tagpill:hover{border-color:var(--gold-line);color:var(--gold-2);background:var(--gold-soft)}
.tagpill b{color:var(--faint);font-weight:600}

/* hero social proof — muted row of the industry's marquee employers */
.social-proof{margin-top:40px}
.sp-label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
.sp-logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 30px}
.sp-co{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:.94rem;color:var(--muted);
  filter:grayscale(1);opacity:.72;transition:filter .18s,opacity .18s;font-family:var(--display)}
.sp-co:hover{filter:none;opacity:1}
.sp-co img{border-radius:6px}
@media(max-width:760px){.sp-logos{gap:10px 18px}.sp-co{font-size:.84rem}.sp-co img{width:18px;height:18px}}

/* sections */
.section{padding-top:38px;padding-bottom:38px}
.section.narrow{max-width:720px}
.section.post-wide{max-width:940px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:18px}
.section-head h2,.block-h{font-family:var(--display);font-size:1.32rem;letter-spacing:-.02em}
.crumbs{font-size:.82rem;margin-bottom:14px;color:var(--muted)}
.crumbs a:hover{color:var(--gold-2)}
.crumbs span{color:var(--body)}

/* job list — premium dark cards, gold-tinted hover, real depth */
.job-list{display:flex;flex-direction:column;gap:11px}
.job-card{display:flex;gap:15px;align-items:center;padding:17px 19px;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--surface);
  box-shadow:var(--shadow-sm);
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease}
.job-card:hover{transform:translateY(-2px);background:var(--surface-2);border-color:var(--line-2);box-shadow:var(--shadow-md)}
.job-card-featured{border-color:var(--gold-line);
  background:linear-gradient(180deg,rgba(var(--glow),.06),var(--surface) 55%);
  box-shadow:0 0 0 1px var(--gold-soft) inset,var(--shadow-sm)}
.job-logo{width:47px;height:47px;border-radius:11px;object-fit:contain;flex:none;background:#fff;border:1px solid var(--line);padding:5px}
.job-logo-fallback{display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;
  background:linear-gradient(145deg,var(--gold-2),var(--gold));font-size:1.15rem;border:none;font-family:var(--display)}
.job-main{flex:1;min-width:0}
.job-head{display:flex;align-items:center;gap:8px}
.job-title{font-size:1.06rem;margin:0;font-weight:700;color:var(--ink);letter-spacing:-.01em;font-family:var(--display)}
.job-company{color:var(--body);font-size:.9rem;margin-top:3px}
.job-company b{font-weight:600;color:var(--ink)}
.job-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:.82rem;color:var(--muted);margin-top:5px;align-items:center}
.job-salary{color:var(--emerald);font-weight:700;font-variant-numeric:tabular-nums}
.job-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.tag{font-size:.74rem;padding:.3em .68em;background:var(--surface-3);border:1px solid var(--line);border-radius:var(--pill);color:#6e675a}
.job-aside{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex:none;text-align:right}
.job-time{font-size:.78rem;color:var(--faint)}
.badge{font-size:.64rem;font-weight:800;padding:.32em .62em;border-radius:var(--pill);text-transform:uppercase;letter-spacing:.06em;font-family:var(--font)}
.badge-featured{background:linear-gradient(180deg,var(--gold-2),var(--gold));color:#fff}
.badge-new{background:rgba(14,159,110,.1);color:var(--emerald);border:1px solid rgba(14,159,110,.28)}
/* paid Spotlight card: animated conic border sweep + breathing glow + sheen
   on the badge. Free owner pins keep the plain .job-card-featured look so the
   paid listing is unmistakably the premium one. */
.job-card-spotlight{position:relative;border-color:transparent;isolation:isolate;
  background:linear-gradient(180deg,rgba(var(--glow),.10),var(--surface) 60%);
  box-shadow:0 0 0 1px rgba(var(--glow),.22) inset,0 12px 34px rgba(var(--glow),.16),var(--shadow-sm);
  animation:spot-breathe 2.8s ease-in-out infinite}
.job-card-spotlight::before{content:"";position:absolute;inset:-2px;border-radius:calc(var(--radius) + 2px);z-index:-1;
  background:conic-gradient(from var(--spot-a,0deg),var(--gold) 0deg,var(--gold-2) 70deg,rgba(255,214,150,.95) 120deg,var(--gold) 180deg,#ffb27a 260deg,var(--gold) 360deg);
  animation:spot-sweep 3.2s linear infinite}
.job-card-spotlight::after{content:"";position:absolute;inset:0;border-radius:var(--radius);z-index:-1;background:var(--surface)}
.job-card-spotlight:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(var(--glow),.28) inset,0 18px 44px rgba(var(--glow),.24)}
.job-card-spotlight .job-title{font-size:1.14rem}
.badge-spotlight{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.35em;
  background:linear-gradient(135deg,#ff9a4d,var(--gold) 55%,#d94f0a);color:#fff;
  box-shadow:0 2px 10px rgba(var(--glow),.45)}
.badge-spotlight::after{content:"";position:absolute;inset:0;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.7) 50%,transparent 70%);
  transform:translateX(-120%);animation:spot-sheen 2.4s ease-in-out infinite}
.badge-spark{display:inline-block;animation:spot-spark 1.6s ease-in-out infinite}
.job-card .view-btn-spotlight,.job-card:hover .view-btn-spotlight{background:linear-gradient(180deg,var(--gold-2),var(--gold));color:#fff;border-color:transparent;
  box-shadow:0 4px 14px rgba(var(--glow),.35)}
@property --spot-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes spot-sweep{to{--spot-a:360deg}}
@keyframes spot-breathe{0%,100%{box-shadow:0 0 0 1px rgba(var(--glow),.22) inset,0 12px 34px rgba(var(--glow),.16),var(--shadow-sm)}
  50%{box-shadow:0 0 0 1px rgba(var(--glow),.30) inset,0 16px 44px rgba(var(--glow),.30),var(--shadow-sm)}}
@keyframes spot-sheen{0%,35%{transform:translateX(-120%)}70%,100%{transform:translateX(120%)}}
@keyframes spot-spark{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.35) rotate(20deg)}}
@media(prefers-reduced-motion:reduce){.job-card-spotlight,.job-card-spotlight::before,.badge-spotlight::after,.badge-spark{animation:none}}
.empty{padding:48px;text-align:center;color:var(--muted);background:var(--surface);border-radius:var(--radius);border:1px solid var(--line)}
.view-btn{display:inline-flex;align-items:center;gap:.3em;font-size:.82rem;font-weight:600;
  padding:.5em 1em;border-radius:var(--radius-sm);background:var(--surface-3);color:var(--body);border:1px solid var(--line);transition:.16s}
.job-card:hover .view-btn{background:linear-gradient(180deg,var(--gold-2),var(--gold));color:#fff;border-color:transparent}

/* salary bars */
.sal-bars{margin-top:8px}
.sal-row{display:flex;align-items:center;gap:14px;padding:14px 6px;border-bottom:1px solid var(--line);transition:background .12s}
.sal-row:hover{background:var(--surface)}
.sal-label{flex:0 0 215px;font-weight:600;color:var(--ink);font-size:.92rem}
.sal-track{position:relative;flex:1;height:20px;background:var(--surface-3);border:1px solid var(--line);border-radius:var(--pill);overflow:hidden}
.sal-bar{position:absolute;top:0;bottom:0;background:linear-gradient(90deg,var(--emerald),var(--teal));opacity:.92;border-radius:var(--pill)}
.sal-med{position:absolute;top:-3px;bottom:-3px;width:3px;background:var(--gold);border-radius:2px}
.sal-val{flex:0 0 128px;text-align:right;font-size:.85rem;color:var(--emerald);font-weight:700;font-variant-numeric:tabular-nums}
.sal-scale{display:flex;justify-content:space-between;font-size:.74rem;color:var(--muted);margin-top:8px;font-variant-numeric:tabular-nums}
.sal-single{margin:16px 0 6px}
@media (max-width:640px){.sal-label{flex-basis:112px;font-size:.78rem}.sal-val{flex-basis:84px;font-size:.72rem}}

/* pager */
.pager{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:34px;font-size:.9rem;color:var(--muted)}

/* stats */
.stats-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;margin:6px 0 26px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.stat{background:#fff;padding:24px 16px;text-align:center}
.stat-n{display:block;font-family:var(--display);font-size:1.7rem;font-weight:700;color:var(--ink);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.stat-l{display:block;font-size:.78rem;color:var(--muted);margin-top:5px}

/* intro / rich copy */
.intro{font-size:1.06rem;color:var(--body);max-width:748px;margin-bottom:24px}
.intro p{margin:0 0 .8em}
h1{font-size:2rem;letter-spacing:-.022em}
.lead{font-size:1.12rem;color:var(--body)}

/* content blocks */
.block{margin:0 0 26px}
.block-h{margin-bottom:12px}
.chip-row{display:flex;flex-wrap:wrap;gap:9px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:.5em .9em;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--pill);font-size:.86rem;font-weight:600;color:var(--ink);transition:.16s}
.chip:hover{border-color:var(--gold-line);color:var(--gold-2)}
.chip img{border-radius:6px;object-fit:contain;background:#fff}
.chip-init{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:6px;
  background:linear-gradient(145deg,var(--gold-2),var(--gold));color:#fff;font-size:.66rem;font-weight:800}
.chip-n{color:var(--faint);font-weight:600;font-size:.76rem;font-variant-numeric:tabular-nums}
.tag-link{font-size:.84rem;font-weight:500;padding:.44em .85em;border:1px solid var(--line);
  border-radius:var(--pill);color:var(--body);display:inline-flex;gap:6px;align-items:center;transition:.16s}
.tag-link:hover{border-color:var(--gold-line);color:var(--gold-2)}

/* company grid */
.company-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(234px,1fr));gap:12px}
.company-card{display:flex;align-items:center;gap:12px;padding:16px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:.16s}
.company-card:hover{border-color:var(--line-2);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.company-card img{border-radius:8px;object-fit:contain;flex:none;background:#fff;border:1px solid var(--line);padding:3px}
.co-init{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;
  background:linear-gradient(145deg,var(--gold-2),var(--gold));color:#fff;font-weight:800;flex:none;font-family:var(--display)}
.co-name{font-weight:700;color:var(--ink);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.co-count{font-size:.78rem;color:var(--muted);flex:none;font-variant-numeric:tabular-nums}

/* FAQ */
.faq{margin:38px 0;max-width:748px}
.faq h2{font-family:var(--display);font-size:1.32rem;margin-bottom:14px}
.faq-item{border-bottom:1px solid var(--line);padding:4px 0}
.faq-item summary{cursor:pointer;font-weight:600;color:var(--ink);padding:16px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";color:var(--gold);font-weight:700;font-size:1.35rem;line-height:1}
.faq-item[open] summary::after{content:"−"}
.faq-a{padding:0 0 16px;color:var(--body)}

/* job detail */
.job-detail{padding:28px 24px 64px;max-width:780px}
.jd-head{display:flex;gap:16px;align-items:center;margin:6px 0 18px}
.jd-logo{width:64px;height:64px;border-radius:13px;object-fit:contain;flex:none;background:#fff;border:1px solid var(--line);padding:7px}
/* .jd-logo's white background wins the cascade over .job-logo-fallback and
   turned the fallback letter white-on-white — re-assert the letter tile */
.jd-logo.job-logo-fallback{background:linear-gradient(145deg,var(--gold-2),var(--gold));border:none;padding:0;font-size:1.7rem}
.jd-company{font-weight:600;color:var(--body)}
.jd-company a{color:var(--ink)}
.jd-company a:hover{color:var(--gold-2)}
.jd-facts{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 22px}
.fact{font-size:.84rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--pill);padding:.44em .9em;color:var(--body)}
.jd-actions{margin:22px 0}
.apply-dialog{border:1px solid var(--line-2);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:28px;max-width:440px;
  margin:auto;background:var(--surface);color:var(--body)}
.apply-dialog::backdrop{background:rgba(33,28,20,.45);backdrop-filter:blur(3px)}
.apply-dialog h2{font-size:1.3rem;margin:0 0 .8em}
.apply-sec-label{display:block;font-size:.7rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.apply-sec-how{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}
.apply-how-note{margin:0 0 12px;font-size:.92rem}
.apply-how-note strong{color:var(--ink)}
.apply-dialog ul{list-style:none;padding:0;margin:0}
.apply-dialog li{position:relative;padding-left:20px;margin:.5em 0;font-size:.88rem;line-height:1.5}
.apply-dialog li::before{content:"";position:absolute;left:2px;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--gold)}
/* .btn's display:inline-flex would beat the [hidden] UA rule — the stage
   toggle depends on hidden actually hiding */
.apply-dialog [hidden]{display:none!important}
.apply-tg-pitch{border:1px solid rgba(34,158,217,.35);background:rgba(34,158,217,.08);border-radius:var(--radius-sm);
  padding:12px 14px;margin:0 0 1.2em}
.apply-tg-pitch p{margin:0;font-size:.92rem}
/* verified-subscribe gate: visual 3-step strip + locked apply preview */
.apply-tg-flow{display:flex;align-items:stretch;margin:12px 0 2px}
.tgf-step{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 4px;font-size:.72rem;line-height:1.25;text-align:center;border:1px solid var(--line-2);border-radius:var(--radius-sm);background:#fff}
.tgf-step .ico{font-size:1.25rem;line-height:1}
.tgf-step small{opacity:.6}
.tgf-arrow{display:flex;align-items:center;padding:0 5px;opacity:.5}
.btn.tg-locked{opacity:.45;pointer-events:none;filter:grayscale(.8)}
/* The recruiter's handle only exists on screen once subscribed — locked
   buttons show the generic label instead */
.btn .go-generic{display:none}
.btn.tg-locked .go-handle{display:none}
.btn.tg-locked .go-generic{display:inline}
.apply-close{position:absolute;top:10px;right:12px;width:32px;height:32px;border:0;background:none;font-size:1.5rem;line-height:1;cursor:pointer;opacity:.55;padding:0}
.apply-close:hover{opacity:1}
.apply-tg-pitch strong{color:var(--ink)}
.apply-tg-skip{background:none;border:none;padding:.72em .4em;font-family:var(--font);font-size:.82rem;
  color:var(--faint);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.apply-tg-skip:hover{color:var(--muted)}
/* post-a-job 1-2-3 steps — numbered strip above the form */
.post-steps{list-style:none;display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;padding:0;margin:26px 0 30px}
@media(max-width:700px){.post-steps{grid-template-columns:1fr}}
.post-steps li{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius-sm);padding:14px 16px}
.step-n{flex:none;width:30px;height:30px;border-radius:50%;background:linear-gradient(180deg,var(--gold-2),var(--gold));
  color:#fff;font-family:var(--display);font-weight:700;font-size:.95rem;display:flex;align-items:center;justify-content:center}
.step-t{font-size:.86rem;color:var(--muted);line-height:1.45}
.step-t b{display:block;color:var(--ink);font-size:.92rem;margin-bottom:2px}

/* payment method radios — inline pills, radio sits next to its label.
   .post-form label/input rules come later in the file, so these carry the
   extra .post-form ancestor to win the cascade. */
.pay-choice{display:flex;gap:12px;flex-wrap:wrap}
.post-form .pay-choice label{display:flex;align-items:center;gap:9px;flex-direction:row;margin:0;
  border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:.8em 1.1em;cursor:pointer;
  background:var(--surface);font-weight:600;font-size:.9rem;color:var(--ink)}
.post-form .pay-choice label:has(input:checked){border-color:var(--gold);box-shadow:var(--ring)}
.post-form .pay-choice input{width:auto;margin:0;accent-color:var(--gold)}
/* post-a-job plan chooser — pricing cards, whole card is the radio */
.plan-choice{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:stretch}
@media(max-width:820px){.plan-choice{grid-template-columns:1fr}}
.plan-card{position:relative;display:block;border:2px solid var(--line-2);border-radius:var(--radius);
  padding:20px 22px 18px;cursor:pointer;background:var(--surface);
  transition:border-color .14s,box-shadow .14s,transform .14s}
.plan-card:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}
.plan-card:has(input:checked){border-color:var(--gold);box-shadow:0 0 0 3px rgba(242,106,27,.14),var(--shadow-md)}
.plan-card:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px}
/* the input stays for a11y and no-JS but the card is the control */
.plan-card input{position:absolute;opacity:0;pointer-events:none}
.plan-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding-bottom:12px;border-bottom:1px dashed var(--line);margin-bottom:12px}
.plan-title{font-family:var(--display);font-weight:700;font-size:1.15rem;color:var(--ink);letter-spacing:-.01em}
.plan-price{font-family:var(--display);font-weight:700;font-size:1.7rem;color:var(--gold-2);letter-spacing:-.02em}
.plan-dur{margin:-6px 0 10px;font-size:.85rem;color:var(--muted)}
.plan-dur b{color:var(--ink)}
.plan-list{list-style:none;padding:0;margin:0}
.plan-list li{position:relative;padding:.32em 0 .32em 1.5em;font-size:.9rem;color:var(--body)}
.plan-list li::before{content:"✓";position:absolute;left:0;top:.32em;color:var(--emerald);font-weight:700}
.plan-list li b{color:var(--ink)}
.plan-list .plan-limit{color:var(--muted)}
.plan-list .plan-limit::before{content:"·";color:var(--faint)}
/* selected state check in the head */
.plan-card::after{content:"";position:absolute;top:16px;right:16px;width:22px;height:22px;border-radius:50%;
  border:2px solid var(--line-2);background:var(--surface-2)}
.plan-card:has(input:checked)::after{content:"✓";border-color:var(--gold);background:linear-gradient(180deg,var(--gold-2),var(--gold));
  color:#fff;font-weight:800;font-size:.8rem;line-height:22px;text-align:center}
.plan-card .plan-head{padding-right:30px}
/* featured card: warm tint + flag */
.plan-card-featured{background:linear-gradient(180deg,#fff,#fdf3e7)}
.plan-flag{position:absolute;top:-11px;left:18px;background:linear-gradient(180deg,var(--gold-2),var(--gold));color:#fff;
  font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:var(--pill);
  box-shadow:0 4px 12px rgba(242,106,27,.3)}
.apply-dialog li strong{color:var(--ink)}
.apply-dialog-actions{display:flex;gap:10px;flex-wrap:wrap}
.apply-dialog-actions .btn{flex:1 1 0;justify-content:center;text-align:center;white-space:normal;padding:.85em .9em}
.apply-dialog-actions .apply-tg-skip{flex:1 1 100%;text-align:center}
.jd-tags{margin:0 0 22px}
.jd-body{font-size:1.05rem;color:var(--body)}
.jd-body p{margin:0 0 1em}
.jd-body ul{padding-left:1.2em}
.jd-body li{margin:.4em 0}
.jd-actions-bottom{border-top:1px solid var(--line);padding-top:26px;margin-top:34px}
.jd-body h2,.jd-faqs h2{font-family:var(--display);font-size:1.32rem;margin:1.6em 0 .6em;color:var(--ink)}
.jd-body h3{font-size:1.1rem;margin:1.3em 0 .5em;color:var(--ink)}
.jd-body h4{font-size:1rem;margin:1.1em 0 .4em;color:var(--ink)}
.jd-closed{margin:14px 0 20px;padding:15px 18px;background:var(--gold-soft);border:1px solid var(--gold-line);border-radius:var(--radius);font-size:.95rem}
.jd-closed strong{display:block;color:var(--ink);margin-bottom:2px}
.jd-closed a{color:var(--gold-2);font-weight:600}
.fact-closed{background:rgba(196,64,50,.08);color:#c24032;font-weight:700;border-color:rgba(196,64,50,.28)}
.fact-quality{background:rgba(var(--glow2),.1);color:var(--emerald);font-weight:700;border-color:rgba(14,159,110,.28)}
.jd-tldr{margin:4px 0 8px;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:var(--radius-sm)}
.jd-tldr h2{font-family:var(--display);font-size:1rem;margin:0 0 .45em;color:var(--ink)}
.jd-tldr p{margin:0;color:var(--body)}
.jd-skill-notes{padding-left:1.2em}
.jd-skill-notes li{margin:.45em 0}
.jd-salary-note{font-weight:600;color:var(--ink)}
.jd-faqs details{border-bottom:1px solid var(--line)}
.jd-faqs summary{cursor:pointer;font-weight:600;color:var(--ink);padding:15px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.jd-faqs summary::-webkit-details-marker{display:none}
.jd-faqs summary::after{content:"+";color:var(--gold);font-weight:700;font-size:1.3rem;line-height:1}
.jd-faqs details[open] summary::after{content:"−"}
.jd-faqs details p{padding:0 0 14px;margin:0;color:var(--body)}
.funnel-card{margin:34px 0;padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.funnel-card h3{font-family:var(--display);font-size:1.1rem;margin-bottom:.3em}

/* post form */
.post-form fieldset{border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin:0 0 18px;background:var(--surface)}
.post-form legend{font-family:var(--display);font-weight:700;color:var(--ink);padding:0 8px}
.post-form label{display:block;font-weight:600;font-size:.88rem;margin:0 0 16px;color:var(--ink)}
.post-form input,.post-form select,.post-form textarea{display:block;width:100%;margin-top:6px;
  padding:.72em .9em;border:1px solid var(--line-2);border-radius:var(--radius-sm);font-size:1rem;font-family:inherit;font-weight:400;
  color:var(--ink);background:#fff}
.post-form input::placeholder,.post-form textarea::placeholder{color:var(--faint)}
.post-form input:focus,.post-form select:focus,.post-form textarea:focus{outline:none;border-color:var(--gold-line);box-shadow:var(--ring)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.alert{background:rgba(196,64,50,.07);border:1px solid rgba(196,64,50,.28);color:#c24032;padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:16px}
.pay-methods{display:flex;gap:18px;flex-wrap:wrap;margin-top:4px}
.pay-method{display:inline-flex!important;align-items:center;gap:8px;font-weight:600;margin:0!important}
.pay-method input{width:auto!important;margin:0!important;display:inline!important;accent-color:var(--gold)}

/* salary pages */
.salary-stats{margin:14px 0 24px}
.salary-card{justify-content:space-between}
.salary-card .co-count{font-size:.95rem;font-weight:700;color:var(--ink)}
.salary-note{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;color:var(--body);margin:14px 0 24px;max-width:748px}

/* guides */
.guide-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.guide-card{display:flex;flex-direction:column;gap:9px;padding:22px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--surface);box-shadow:var(--shadow-sm);transition:.16s;position:relative;overflow:hidden}
.guide-card:hover{border-color:var(--line-2);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.guide-card::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;
  background:linear-gradient(90deg,var(--gold),var(--gold-2));transform:scaleX(0);transform-origin:left;transition:transform .22s}
.guide-card:hover::before{transform:scaleX(1)}
.guide-card h3{font-family:var(--display);font-size:1.1rem;margin-bottom:.4em}
.guide-card p{font-size:.9rem;margin:0 0 .8em;flex:1}
.guide-more{font-size:.84rem;font-weight:600;color:var(--gold-2)}
.guide-article{max-width:780px}
.guide-date{font-size:.82rem;margin-top:-.4em;color:var(--muted)}
.guide-body{font-size:1.06rem;color:var(--body)}
.guide-body h2{font-family:var(--display);font-size:1.42rem;margin:1.6em 0 .5em}
.guide-body p{margin:0 0 1em}
.guide-body ul{padding-left:1.3em;margin:0 0 1em}
.guide-body li{margin:.4em 0}
.guide-body a{color:var(--gold-2);font-weight:600}
.guide-body a:hover{text-decoration:underline}

/* seo text */
.seo-text{max-width:780px}
.seo-text h2{font-family:var(--display)}
.seo-text a{color:var(--gold-2);font-weight:600}
.seo-text a:hover{text-decoration:underline}

/* cta band — rich, expensive, subtle gold sheen */
.cta-band{position:relative;overflow:hidden;color:var(--ink);border-radius:var(--radius);padding:40px;margin:48px auto;max-width:calc(var(--maxw) - 48px);
  background:linear-gradient(135deg,#262016,#1a150e);border:1px solid #362d20;
  box-shadow:var(--shadow-md)}
.cta-band::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(520px 220px at 88% -20%,rgba(var(--glow),.2),transparent 60%)}
.cta-band h2{color:#fff;font-family:var(--display);font-size:1.6rem;position:relative}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;position:relative}
.cta-band .muted{color:#b9ab94}

/* hub header band */
.subnav{display:none}
.page-hero{position:relative;padding:38px 0 28px;border-bottom:1px solid var(--line);overflow:hidden;
  background:linear-gradient(180deg,var(--bg-2),var(--bg))}
.page-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(560px 220px at 84% -30%,rgba(var(--glow),.07),transparent 62%)}
.page-hero .wrap{position:relative}
.page-hero .crumbs{margin-bottom:12px}
.eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:11px}
.page-hero h1{font-family:var(--display);font-size:clamp(1.85rem,4.6vw,2.7rem);letter-spacing:-.03em;margin:0 0 .3em}
.page-sub{font-size:1.08rem;color:var(--body);max-width:720px;margin:0}
.hero-links{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.page-hero + .section{padding-top:28px}

/* rich tile grid */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(226px,1fr));gap:12px}
.cat-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:.16s}
.cat-card:hover{border-color:var(--gold-line);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.cat-name{display:flex;align-items:center;gap:12px;font-weight:700;color:var(--ink);font-size:.98rem;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-ico{width:33px;height:33px;border-radius:10px;background:var(--gold-soft);color:var(--gold-2);flex:none;
  display:inline-flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;font-size:.9rem;transition:.16s;border:1px solid var(--gold-line)}
.cat-card:hover .cat-ico{background:linear-gradient(145deg,var(--gold-2),var(--gold));color:#fff;border-color:transparent}
.cat-count{font-size:.84rem;font-weight:700;color:var(--ink);flex:none;font-variant-numeric:tabular-nums}
.cat-count.empty-c{color:var(--muted);font-weight:500}

/* internal candidate CTA band */
.funnel-band{background:linear-gradient(135deg,#262016,#1a150e)}
.funnel-band h2{color:#fff}

/* footer */
.site-footer{border-top:1px solid var(--line);margin-top:60px;padding:52px 0 30px;background:var(--bg-2)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr 1.5fr;gap:28px}
.footer-grid h3{font-family:var(--display);font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;color:var(--faint);font-weight:700}
.footer-grid a{display:block;font-size:.88rem;padding:3px 0;color:var(--muted)}
.footer-grid a:hover{color:var(--gold-2)}
/* the .footer-grid a column rules (block, muted, .88rem) would otherwise
   out-specific .logo and stack/discolor the brand — pin it to match the navbar */
.footer-brand .logo{display:inline-flex;font-size:1.2rem;color:var(--ink);padding:0}
.footer-brand p{margin:10px 0 14px;color:var(--muted)}
.footer-bar{margin-top:32px;padding-top:20px;border-top:1px solid var(--line);font-size:.82rem;color:var(--faint)}

@media(max-width:760px){
  .hero{padding:60px 0 38px}
  .nav{gap:11px;font-size:.88rem}
  .nav-links{display:none}
  /* icon-only Telegram button — two labeled buttons don't fit next to the logo */
  .nav-tg span{display:none}
  .nav-tg{padding:.6em .7em}
  .btn{padding:.6em 1em;font-size:.84rem}
  .logo{font-size:1.05rem}
  .header-inner{height:62px}
  .subnav{display:flex;gap:8px;overflow-x:auto;padding:10px 18px 12px;border-top:1px solid var(--line);
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .subnav::-webkit-scrollbar{display:none}
  .subnav a{flex:none;font-size:.82rem;font-weight:600;color:var(--body);background:var(--surface);
    padding:.8em 1em;border:1px solid var(--line);border-radius:var(--pill);white-space:nowrap}
  /* 44px tap floor on touch layouts; desktop look unchanged */
  .chip{padding:.8em 1em}
  .subnav a:hover{border-color:var(--gold-line);color:var(--gold-2)}
  .page-hero{padding:26px 0 22px}
  .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cat-card{padding:14px 13px;gap:8px}
  .cat-name{font-size:.9rem;gap:9px}
  .cat-ico{width:29px;height:29px}
  .row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .cta-inner{flex-direction:column;align-items:flex-start}
  .cta-band{margin:34px 0;padding:28px 24px}
  .job-aside .view-btn{display:none}
  .jd-actions-bottom{position:sticky;bottom:0;z-index:40;background:var(--bg);
    margin:34px -24px 0;padding:12px 24px calc(12px + env(safe-area-inset-bottom));
    border-top:1px solid var(--line-2)}
  .jd-actions-bottom .btn{width:100%;justify-content:center}
}

.footer-bar a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.footer-bar a:hover{color:var(--gold-2)}

/* brand mark — just the die, no box. Clean die at rest; on hover it rolls once
   (Lottie sticker -> play-once transparent animated WebP). overflow:visible so
   the bounce isn't clipped. track.js restarts the roll per hover. */
.logo-mark.diebox{position:relative;width:44px;height:44px;padding:0;
  background:none;border:none;box-shadow:none;overflow:hidden}
.logo-sm .logo-mark.diebox{width:38px;height:38px}
/* contain keeps the die inside the mark; overflow:hidden is the hard guarantee
   it can never render over the navbar during the roll. */
.dice-static,.dice-roll{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.dice-roll{opacity:0;transition:opacity .1s ease}
.logo.rolling .dice-roll{opacity:1}
.logo.rolling .dice-static{opacity:0}
@media(prefers-reduced-motion:reduce){.logo.rolling .dice-roll{opacity:0}.logo.rolling .dice-static{opacity:1}}

/* Email-apply reveal (mailto is never opened; address shown + copy button) */
.apply-email{border:1px solid var(--line);background:var(--surface-3);border-radius:var(--radius-sm);padding:12px 16px;margin:0 0 14px}
.apply-email-addr{display:block;font-size:1.08rem;font-weight:700;color:var(--ink);user-select:all;word-break:break-all}

/* stats strip inside the hero: one thin row (owner 2026-09-16) */
.hero-stats{margin:14px auto 4px;max-width:900px}
.hero-stats .stats-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:0;margin:0 auto;width:fit-content;max-width:100%;background:transparent;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.hero-stats .stat{background:rgba(255,255,255,.6);padding:8px 18px;display:flex;align-items:baseline;gap:7px;text-align:left;border-right:1px solid var(--line)}
.hero-stats .stat:last-child{border-right:0}
.hero-stats .stat-n{font-size:1.05rem;display:inline}
.hero-stats .stat-l{font-size:.74rem;margin:0;display:inline;white-space:nowrap}
@media(max-width:700px){.hero-stats .stats-bar{border-radius:14px}.hero-stats .stat{flex:1 1 45%;justify-content:center;border-right:0;border-bottom:1px solid var(--line)}}
/* Hiring reports */
.rep-article .stats-bar{margin-top:18px}
.tbl-wrap{overflow-x:auto;margin:0 0 1.4em}
.rep-table{width:100%;border-collapse:collapse;font-size:.95rem}
.rep-table th,.rep-table td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.rep-table th{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.rep-table td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.rep-bars{display:grid;gap:6px;margin:0 0 1.4em}
.rep-row{display:grid;grid-template-columns:minmax(120px,1fr) 3fr 52px;align-items:center;gap:10px;font-size:.92rem}
.rep-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rep-track{position:relative;height:10px;background:var(--line);border-radius:5px;overflow:hidden}
.rep-bar{position:absolute;left:0;top:0;bottom:0;background:var(--gold-2);border-radius:5px}
.rep-val{text-align:right;font-variant-numeric:tabular-nums;color:var(--muted)}

/* ---- List filter row (2026-09-25): segmented apply control, role/location
   selects, chips, sort. Plain controls, no box: the old dashed green panel read
   as a notice, not a filter. ---- */
.filter-bar{display:flex;align-items:center;gap:10px;margin:0 0 18px;flex-wrap:wrap;scroll-margin-top:84px}
.seg{display:inline-flex;padding:3px;border:1px solid var(--line-2);border-radius:var(--pill);background:var(--surface-3);gap:2px}
.seg-btn{display:inline-flex;align-items:center;gap:8px;padding:.5em .95em;border-radius:var(--pill);color:var(--muted);font-size:.88rem;font-weight:700;text-decoration:none;line-height:1;white-space:nowrap;transition:.14s}
.seg-btn:hover{color:var(--ink)}
.seg-btn.is-on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(33,28,20,.12),0 0 0 1px rgba(33,28,20,.05)}
.seg-count{font-weight:600;opacity:.6;font-variant-numeric:tabular-nums;font-size:.8em}
.seg-sort{margin-left:auto}
.filter-form{display:inline-flex;align-items:center;gap:8px}
.filter-select select{appearance:none;-webkit-appearance:none;padding:.55em 2.1em .55em .95em;border:1px solid var(--line-2);border-radius:var(--pill);background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237a6f60' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right .8em center;color:var(--ink);font:inherit;font-size:.86rem;font-weight:600;cursor:pointer;width:150px}
.filter-select select:hover{border-color:var(--gold-line)}
.filter-go{padding:.5em .9em;font-size:.86rem}
.js .filter-go{display:none}
.chip.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.chip.is-on:hover{color:#fff;border-color:var(--ink)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* empty state: Telegram opt-in next to "Browse all" */
.empty .empty-tg{margin-left:8px}
@media (max-width:600px){.empty .empty-tg{margin:10px 0 0}}
/* applied state (applied.js): the talent API says which cards this visitor already applied to */
.badge-applied{background:rgba(33,28,20,.08);color:var(--ink);border:1px solid rgba(33,28,20,.15)}
.job-card-applied .view-btn{background:var(--surface-3)}
.jd-applied{display:inline-flex;align-items:center;gap:8px;margin:0 0 12px;padding:.55em .95em;border-radius:var(--pill);background:rgba(14,159,110,.1);color:var(--emerald);font-size:.86rem;font-weight:700;text-decoration:none}
.jd-applied:hover{background:rgba(14,159,110,.16)}
.help-tip{position:relative;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;border:1px solid var(--line);font-size:.72rem;font-weight:800;color:var(--muted);cursor:help;background:var(--surface-3)}
.help-tip::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);width:min(280px,80vw);padding:10px 12px;border-radius:10px;background:#1a1713;color:#fff;font-size:.78rem;font-weight:500;line-height:1.4;text-align:left;box-shadow:0 8px 24px rgba(0,0,0,.18);opacity:0;pointer-events:none;transition:opacity .12s;z-index:20}
.help-tip:hover::after,.help-tip:focus::after,.help-tip:focus-visible::after{opacity:1}
.tag-direct{background:rgba(14,159,110,.1);border-color:rgba(14,159,110,.32);color:var(--emerald);font-weight:700}
.apply-direct{margin:10px 0 0;font-size:.86rem;color:var(--emerald);font-weight:600}

.hero-direct{display:inline-flex;align-items:center;gap:10px;margin:14px auto 0;padding:.7em 1.15em .7em .9em;border:1.5px solid rgba(14,159,110,.5);border-radius:var(--pill);background:#fff;color:var(--emerald);font-weight:800;font-size:1rem;text-decoration:none;box-shadow:0 2px 10px rgba(14,159,110,.12)}
.hero-direct:hover{background:rgba(14,159,110,.08)}
.hero-direct.is-on{background:var(--emerald);color:#fff;border-color:var(--emerald)}
.hero-direct.is-on .filter-box{background:#fff;color:var(--emerald);border-color:#fff}
.hero-direct-n{font-weight:700;opacity:.8;font-variant-numeric:tabular-nums}
.hero-direct-sub{font-weight:500;font-size:.86rem;opacity:.75}
@media (max-width:600px){.hero-direct{flex-wrap:wrap;justify-content:center}.hero-direct-sub{flex-basis:100%;text-align:center}}

/* ---- mobile layout fixes (2026-09-22) ----
   Root cause of the "shifted page" on phones: .help-tip::after is a 280px
   tooltip centred on a 20px tip that sits near the right edge, so it pushed
   the document 84px wider than the viewport and every section rendered
   horizontally scrolled. Anchor it to the right and clamp it on narrow
   screens, then guard the remaining overflow sources. */
body{overflow-x:clip}
/* the visually-hidden plan radio inherited .post-form input{width:100%} and
   escaped its card; fieldset needs min-width:0 to shrink below its content */
.post-form .plan-card input{width:auto;left:0;top:0}
.post-form fieldset{min-width:0}
@media (max-width:760px){
  /* tooltip: right-anchored, never wider than the screen */
  .help-tip::after{left:auto;right:-8px;transform:none;
    width:min(260px,calc(100vw - 40px));max-width:calc(100vw - 40px)}
  /* job cards: title + badge must wrap instead of forcing the row wide */
  .job-head{flex-wrap:wrap;row-gap:6px}
  .job-title{font-size:1rem;overflow-wrap:anywhere}
  .job-card{gap:12px;padding:15px 14px;align-items:flex-start}
  .job-logo{width:40px;height:40px}
  .job-aside{align-items:flex-start;text-align:left}
  /* filter row: apply control full width, selects share a row, sort drops below */
  .filter-bar{gap:8px}
  .filter-bar>.seg:first-child{width:100%}
  .filter-bar>.seg:first-child .seg-btn{flex:1 1 0;justify-content:center;font-size:.84rem;padding:.6em .5em}
  .filter-form{width:100%}
  .filter-select{flex:1 1 0;min-width:0}
  .filter-select select{width:100%;max-width:none}
  .seg-sort{margin-left:0}
  /* hero stats strip: two readable columns, no mid-number wrapping */
  .hero-stats .stat{padding:10px 12px}
  .hero-stats .stat-n{white-space:nowrap}
  .hero-sub{font-size:1.02rem}
  /* talent widget decoration must not escape its card */
  .talent-card .hlt-band,.hlt-band{overflow:hidden}
}
@media (max-width:420px){
  .hero-stats .stats-bar{width:100%}
  .hero-stats .stat{flex:1 1 100%}
  .cat-grid{grid-template-columns:1fr}
}

/* ---- /talent CV dropzone on mobile (2026-09-22) ----
   .hlt-drop.hero is a nowrap flex row: icon (48px) + text (flex:1 1 0) +
   "Choose file" (124px) + 2x18px gaps. At 390px the row has ~260px of content
   box, so the text column collapses to 48px and "Drop your CV here" breaks one
   word per line. This is the conversion point of the Telegram Ads funnel, so
   stack it on narrow screens. */
@media (max-width:760px){
  .hlt-drop.hero{flex-direction:column;align-items:center;text-align:center;gap:12px}
  .hlt-drop.hero .txt{flex:0 0 auto;width:100%;text-align:center}
  .hlt-drop.hero .browse{align-self:center;margin:8px auto 0!important}
}

/* gate-only modal: the Subscribe button lives in the Telegram box now */
.apply-tg-pitch .js-apply-tg{display:flex;width:100%;justify-content:center;margin-top:14px}
.apply-tg-pitch .js-apply-tg[hidden]{display:none}
.apply-safe[hidden],.apply-sec-how[hidden]{display:none}

/* ---- apply gate, redesigned (owner 2026-09-23: "looks AI-ish") ----
   One surface, no nested boxes, no emoji tiles: pick the channel as a
   Telegram-style row, one flat Telegram-blue action, quiet steps below. */
.apply-tg-pitch.gate{border:0;background:none;padding:0;margin:0}
.gate-lede{margin:-6px 0 18px!important;font-size:.95rem!important;line-height:1.5;color:var(--body)}
.gate-channels{display:grid;gap:8px;margin:0 0 16px}
.gate-ch{position:relative;display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);
  background:var(--surface);cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}
.gate-ch:hover{border-color:var(--line-2);background:var(--surface-2)}
.gate-ch input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.gate-ch:has(input:checked){border-color:#2AABEE;background:#f4fbff;box-shadow:0 0 0 3px rgba(42,171,238,.14)}
.gate-ch:has(input:focus-visible){outline:2px solid #2AABEE;outline-offset:2px}
.gate-ava{width:36px;height:36px;flex:none;border-radius:50%;background:var(--surface-3);padding:6px;box-sizing:border-box}
.gate-ch-txt{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.gate-ch-txt b{color:var(--ink);font-weight:700;font-size:.95rem}
.gate-ch-txt small{color:var(--muted);font-size:.8rem;margin-top:1px}
.gate-radio{width:18px;height:18px;flex:none;border-radius:50%;border:1.5px solid var(--line-2);background:#fff;transition:all .15s ease}
.gate-ch:has(input:checked) .gate-radio{border-color:#2AABEE;background:#2AABEE;box-shadow:inset 0 0 0 3.5px #fff}
.gate-cta{display:flex;width:100%;align-items:center;justify-content:center;gap:9px;padding:.95em 1em;border:0;border-radius:var(--radius-sm);
  background:#2AABEE;color:#fff;font-weight:700;font-size:1rem;letter-spacing:.005em;box-shadow:none;transition:background .15s ease,transform .1s ease}
.gate-cta:hover{background:#1f9ad9;color:#fff}
.gate-cta:active{transform:translateY(1px)}
.gate-cta[hidden]{display:none}
.gate-steps{list-style:none;counter-reset:gs;display:flex;justify-content:space-between;gap:10px;margin:14px 0 0;padding:0}
.apply-dialog .gate-steps li{counter-increment:gs;flex:1;display:flex;align-items:center;gap:7px;padding:0;margin:0;font-size:.78rem;line-height:1.3;color:var(--muted)}
.apply-dialog .gate-steps li::before{content:counter(gs);position:static;flex:none;width:18px;height:18px;border-radius:50%;
  background:var(--surface-3);color:var(--body);font-size:.68rem;font-weight:700;display:grid;place-items:center}
.gate .apply-tg-wait{display:flex;align-items:center;gap:8px;margin:12px 0 0;font-size:.82rem;color:var(--muted)}
.gate-spin{width:12px;height:12px;border-radius:50%;border:2px solid rgba(42,171,238,.25);border-top-color:#2AABEE;animation:gatespin .8s linear infinite}
@keyframes gatespin{to{transform:rotate(360deg)}}
@media (max-width:480px){.gate-steps{flex-direction:column;gap:6px}}
.gate-cta:focus{outline:none;box-shadow:none}
.gate-cta:focus-visible{outline:none;box-shadow:0 0 0 3px #fff,0 0 0 5px rgba(42,171,238,.55)}
.apply-dialog .gate-steps li{white-space:nowrap}

/* My applications (native apply, 2026-09-23): shown by the talent widget only for a signed-in candidate */
.nav-me{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px;color:inherit;border:1px solid var(--line,#e0d8c7);margin-right:.4em}
.nav-me:hover{background:rgba(0,0,0,.04)}
.nav-me[hidden]{display:none}
/* list -> job -> apply -> back: the card anchor lands below the sticky header (2026-09-24) */
.job-card{scroll-margin-top:96px}

/* =====================================================================
   V2 REDESIGN LAYER (2026-10, Figma daKDUs4tU0OcBMyXkB2GyD)
   Global chrome + components first, then home. Overrides the rules above.
   ===================================================================== */
body{color:var(--body);background:radial-gradient(1100px 460px at 50% -120px,#f4f4f5 0%,rgba(244,244,245,0) 70%),linear-gradient(180deg,#dcdcdc 0%,#d9d9d9 40%,#d2d2d3 100%);background-attachment:scroll;min-height:100vh}
body::before,body::after,.site-header::before,.site-header::after{display:none}
.wrap{padding:0 40px}
h1,h2,h3,h4{font-family:var(--display);color:var(--ink);font-weight:600;letter-spacing:-.035em}
.mono{font-family:var(--mono);letter-spacing:-.02em}
.link{color:var(--ink);display:inline-flex;align-items:center;gap:6px;padding-bottom:2px;border-bottom:1.5px solid var(--gold)}
.link:hover{color:var(--gold-ink)}
::selection{background:var(--ink)}
.ico{flex:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* buttons: graphite chrome primary w/ orange hotspot, silver chrome secondary, Telegram blue */
.btn{height:42px;padding:0 17px;justify-content:center;border-radius:var(--pill);font-weight:600;font-size:14px;color:var(--ink);
  background:linear-gradient(180deg,#fff 0%,#f1f2f4 46%,#dcdfe3 54%,#f4f5f7 100%);border:1px solid rgba(10,11,15,.15);
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(10,11,15,.06),0 2px 6px rgba(10,11,15,.08)}
.btn:hover{border-color:rgba(10,11,15,.24);box-shadow:inset 0 1px 0 #fff,0 6px 16px rgba(10,11,15,.12)}
.btn-primary{color:#fff;border-color:#06070a;font-weight:600;
  background:radial-gradient(70px 46px at 100% 60%,rgba(255,154,77,.95),rgba(255,106,31,.35) 55%,transparent 100%),linear-gradient(180deg,#4a4f57 0%,#1d2025 47%,#0a0b0e 53%,#24282e 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 0 0 1px rgba(255,106,31,.08),0 10px 24px rgba(10,11,15,.28),0 6px 20px rgba(255,106,31,.18)}
.btn-primary:hover{filter:brightness(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 12px 28px rgba(10,11,15,.3),0 8px 24px rgba(255,106,31,.26)}
.btn-ghost{background:transparent;box-shadow:none;border-color:rgba(10,11,15,.14);color:var(--ink)}
.btn-ghost:hover{background:rgba(255,255,255,.5);color:var(--ink);border-color:rgba(10,11,15,.24)}
.btn-dark{background:linear-gradient(180deg,#4a4f57 0%,#1d2025 47%,#0a0b0e 53%,#24282e 100%);color:#fff;border-color:#06070a}
.btn-telegram{color:#fff;background:linear-gradient(180deg,#3cb6ea,#1f98d6);border-color:rgba(0,0,0,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 16px rgba(34,158,217,.25)}
.btn-lg{height:50px;padding:0 24px;font-size:15px}
.btn-sm{height:36px;padding:0 14px;font-size:13px}
.kbd{font-family:var(--mono);font-size:11px;padding:4px 8px;border-radius:7px;border:1px solid rgba(10,11,15,.15);background:#fafafa;color:var(--muted);box-shadow:0 1px 0 rgba(10,11,15,.12);cursor:pointer}

/* logo pill (owner pick 2026-10-16), ~/igamingjobs-assets/logo-pill.css */
.logo-pill{position:relative;display:inline-flex;align-items:center;flex:none;padding:.32em .75em .4em;border-radius:60px;overflow:hidden;
  font:700 19px/1 var(--display);letter-spacing:-.03em;color:#fff;background:#0a0b0f;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 0 1px rgba(255,255,255,.14),0 4px 14px rgba(255,106,31,.14)}
.logo-pill::before{content:"";position:absolute;inset:-60% -30%;pointer-events:none;
  background:radial-gradient(40% 55% at 50% 50%,rgba(255,106,31,.32),rgba(255,106,31,.1) 45%,transparent 70%);
  animation:pill-glow 9s ease-in-out infinite alternate}
.logo-pill span{position:relative}
@keyframes pill-glow{0%{transform:translateX(28%);opacity:.75}50%{opacity:1}100%{transform:translateX(-22%);opacity:.6}}
@media (prefers-reduced-motion:reduce){.logo-pill::before{animation:none}}

/* header: black stats strip + floating light nav pill */
.site-header{position:relative;background:none;backdrop-filter:none;border:0;padding-bottom:6px}
.topstrip{background:#0a0b0f;color:#c9ccd1;font-size:10.5px;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;overflow:hidden}
.ts-in{display:flex;align-items:center;height:34px;gap:0}
.ts-i{display:inline-flex;gap:6px;padding:0 14px;border-left:1px solid rgba(255,255,255,.16);color:#8b9098;line-height:1}
.ts-i:first-child{padding-left:0;border-left:0}
.ts-i b{color:#fff;font-weight:600}.ts-up b{color:var(--peach)}
.ts-r{display:flex;margin-left:auto}
.ts-k{background:none;border:0;border-left:1px solid rgba(255,255,255,.16);font:inherit;text-transform:inherit;color:#c9ccd1;cursor:pointer;padding-right:0}
.ts-k:hover{color:#fff}
.navpill{display:flex;align-items:center;gap:10px;height:62px;margin-top:14px;padding:0 8px 0 10px;border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(238,238,240,.85));border:1px solid #fff;backdrop-filter:blur(12px);
  box-shadow:0 1px 0 rgba(10,11,15,.04),0 12px 32px rgba(10,11,15,.10),0 0 0 1px rgba(10,11,15,.07)}
.navpill .nav-links{display:flex;gap:2px;height:auto;margin:0 auto 0 18px;padding:0;background:none;border:0;box-shadow:none}
.navpill .nav-links a{padding:9px 14px;border-radius:999px;font-weight:500;font-size:14px;color:#4a4e55;white-space:nowrap}
.navpill .nav-links a:hover{background:rgba(10,11,15,.05);color:var(--ink)}
.navpill .nav-links a.on{background:#0a0b0f;color:#fff}
.navpill sup{font-family:var(--mono);font-size:9px;margin-left:3px;color:var(--peach);vertical-align:6px}
.nav-actions{display:flex;align-items:center;gap:8px}
.nav-actions .btn{height:42px}
.price-chip{font-size:11px;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.16);color:#ffd2b3}
.nav-me{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;color:var(--ink);
  background:linear-gradient(180deg,#fff 0%,#f1f2f4 46%,#dcdfe3 54%,#f4f5f7 100%);border:1px solid rgba(10,11,15,.15)}
.subnav{display:none}

/* ⌘K palette */
.cmdk{position:fixed;inset:0;z-index:200;display:flex;justify-content:center;align-items:flex-start;padding:12vh 16px 16px;background:rgba(10,11,15,.42);backdrop-filter:blur(4px)}
.cmdk[hidden]{display:none}
html.cmdk-open{overflow:hidden}
.cmdk-box{width:min(640px,100%);max-height:70vh;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:var(--steel);border:1px solid #fff;box-shadow:0 30px 80px rgba(10,11,15,.35)}
.cmdk-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.cmdk-in input{flex:1;border:0;background:none;font:500 17px var(--font);color:var(--ink);outline:none}
.cmdk-res{overflow:auto;padding:6px 8px 10px}
.cmdk-g{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);padding:12px 10px 6px}
.cmdk-i{display:flex;justify-content:space-between;gap:12px;padding:9px 10px;border-radius:12px;font-size:14px}
.cmdk-i b{font-weight:600;color:var(--ink)}.cmdk-i span{color:var(--muted);font-size:13px;white-space:nowrap}
.cmdk-i:hover,.cmdk-i.on{background:#fff;box-shadow:0 1px 3px rgba(10,11,15,.1),inset 3px 0 0 var(--gold)}
.cmdk-empty{padding:18px 10px;color:var(--muted);font-size:14px}

/* shared components */
.tag{font-size:12px;padding:4px 10px;border-radius:999px;background:rgba(10,11,15,.045);color:var(--body);border:0;font-weight:500}
.tag-dir{display:inline-flex;align-items:center;gap:4px;background:rgba(255,106,31,.10);color:var(--gold-ink);font-weight:600}
.tag-dark{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#d6d8db}
.job-logo{border-radius:12px;background:#fff;object-fit:contain;
  box-shadow:0 0 0 1px rgba(10,11,15,.08),0 0 0 3px rgba(255,255,255,.7),0 0 0 4px rgba(10,11,15,.06),0 4px 10px rgba(10,11,15,.08)}
.job-logo-fallback{display:inline-flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;color:var(--ink);background:#fff;border:0}
.kick{display:flex;align-items:center;gap:8px;font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kick.blue{color:#1f98d6}
.lbl{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#7f848c;margin:22px 0 10px}
.lbl.inline{margin:0}.lbl b{color:var(--ink);font-weight:600}
.idx{font-size:9px;padding:2px 5px;border-radius:4px;background:rgba(10,11,15,.07);color:var(--ink)}
.seg{display:flex;padding:3px;border-radius:999px;border:0;background:rgba(10,11,15,.06);gap:2px;box-shadow:inset 0 1px 2px rgba(10,11,15,.06)}
.seg-btn{flex:1;justify-content:center;gap:5px;padding:8px 12px;font-size:12.5px;font-weight:600;color:var(--muted)}
.seg-btn.is-on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(10,11,15,.14),0 0 0 1px rgba(10,11,15,.04)}
.seg-btn.is-on .ico{color:var(--gold)}
.panel,.tile{border-radius:var(--radius);padding:20px;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(240,240,242,.7));border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.04)}
.cta-band,.funnel-band{background:var(--steel);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.05);max-width:calc(var(--maxw) - 80px);border-radius:var(--radius)}
.cta-band::before{display:none}
.cta-band h2,.funnel-band h2{color:var(--ink)}
.cta-band .muted{color:var(--muted)}
/* FAQ = one steel card with divided rows (Figma 34:2, 24:2) */
.faq-list{border-radius:var(--radius);padding:4px 24px;background:var(--steel);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.05)}
.faq-list .faq-item,.faq-list details{background:none;border:0;border-radius:0;padding:0}
.faq-list .faq-item+.faq-item,.faq-list details+details{border-top:1px solid var(--line)}
.faq-list summary{padding:18px 0;align-items:center;font-size:15.5px}
.faq-list summary::after{font-size:20px;font-weight:600;color:var(--gold);flex:none}
.faq-list .faq-a,.faq-list details p{padding:0 0 18px;margin:0;color:var(--body);line-height:1.6}
@media (max-width:640px){.faq-list{padding:2px 18px}.faq-list summary{padding:16px 0;font-size:15px}}

/* footer */
.site-footer{background:none;border-top:1px solid rgba(10,11,15,.12);margin-top:64px}
.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr 1fr 1.3fr}
.footer-grid h3{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.08em;color:#7f848c}
.footer-grid a{color:var(--body)}
.footer-grid a:hover{color:var(--gold-ink)}
.footer-grid a.logo-pill{display:inline-flex;color:#fff;padding:.32em .75em .4em;font-size:19px}
.footer-grid a.logo-pill:hover{color:#fff}
.footer-brand p{color:var(--muted);font-size:14px}
.footer-bar{font-size:11px;color:var(--faint);border-color:rgba(10,11,15,.12)}

/* ---------- HOME console ---------- */
.console{padding-top:34px}
.con-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
.console h1{font-size:50px;line-height:1;font-weight:500;letter-spacing:-.045em;margin:12px 0 0;max-width:680px}
.mono-num{font-weight:700}
.bigsearch{display:flex;align-items:center;gap:14px;height:66px;margin-top:24px;padding:0 8px 0 24px;border-radius:999px;color:var(--ink);
  background:linear-gradient(180deg,#fff,#f3f3f4);border:1px solid rgba(10,11,15,.12);box-shadow:inset 0 1px 0 #fff,0 18px 40px rgba(10,11,15,.10),0 0 0 6px rgba(255,255,255,.35)}
.bigsearch input{flex:1;min-width:0;border:0;background:none;outline:none;font:400 16px var(--font);color:var(--ink)}
.bigsearch input::placeholder{color:var(--faint)}
.sdiv{width:1px;height:28px;background:rgba(10,11,15,.12)}
.ssel{display:flex;align-items:center;gap:8px;padding:0 6px}
.ssel select{border:0;background:none;font:500 14.5px var(--font);color:var(--ink);max-width:160px;cursor:pointer;outline:none}
.bigsearch .btn-primary{height:50px;padding:0 24px;font-size:15px}
.rolepills{display:flex;gap:8px;margin:18px 0 26px;overflow-x:auto;scrollbar-width:none;padding:2px}
.rolepills::-webkit-scrollbar{display:none}
.pill{display:inline-flex;gap:8px;align-items:center;flex:none;height:38px;padding:0 15px;border-radius:999px;background:rgba(255,255,255,.55);border:1px solid rgba(10,11,15,.09);font-size:13.5px;font-weight:500;color:var(--ink);white-space:nowrap;box-shadow:inset 0 1px 0 #fff}
.pill:hover{background:#fff}
.pill b{font-size:10.5px;font-weight:500;color:var(--faint)}
.pill.on{background:linear-gradient(180deg,#2b2f35,#0a0b0e);color:#fff;border-color:#06070a;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 6px 14px rgba(10,11,15,.2)}.pill.on b{color:var(--peach)}
.m-tools{display:none}
.grid3{display:grid;grid-template-columns:250px minmax(0,1fr) 290px;gap:22px;align-items:start}
.ph{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:600;color:var(--ink);font-size:16px}
.ph a{margin-left:auto;font:500 13px var(--font);color:var(--faint)}
.checks{display:grid;gap:10px}
.chk{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink)}
.chk i{width:19px;height:19px;border-radius:6px;border:1.5px solid rgba(10,11,15,.22);background:#fff}
.chk:hover i{border-color:var(--gold)}
.flist{display:grid;gap:1px}
.flist a{display:flex;align-items:center;gap:10px;padding:7px 10px;margin:0 -10px;border-radius:11px;font-size:14px;color:var(--ink)}
.flist a:hover{background:#fff;box-shadow:0 1px 2px rgba(10,11,15,.08)}
.flist a>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flist a b{margin-left:auto;font-size:11px;font-weight:500;color:var(--faint)}
.flist a.more{color:var(--muted);font-size:13px;font-weight:600;gap:6px;margin-top:4px}
.flist img,.co-i{width:24px;height:24px;border-radius:7px;flex:none;background:#fff;object-fit:contain;box-shadow:0 0 0 1px rgba(10,11,15,.08)}
.co-i{display:inline-flex;align-items:center;justify-content:center;font:700 12px var(--display);color:var(--ink)}
.feedbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.feedbar .seg{background:rgba(255,255,255,.4)}
.seg-sort{margin-left:0;flex:none}

/* Spotlight: the ONE graphite object */
.spot{position:relative;display:block;min-height:190px;margin-bottom:14px;padding:26px;border-radius:var(--radius);overflow:hidden;color:#fff;border:1px solid #06070a;
  background:radial-gradient(520px 260px at 82% 50%,rgba(255,106,31,.28),transparent 70%),linear-gradient(160deg,#30343a 0%,#121418 55%,#0a0b0e 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 26px 50px rgba(10,11,15,.28)}
.spot-art{position:absolute;right:-30px;top:50%;width:420px;transform:translateY(-50%);mix-blend-mode:screen;pointer-events:none}
.spot-in{position:relative;display:grid;gap:16px;max-width:560px}
.spot-k{display:flex;align-items:center;gap:10px;font-size:10.5px;color:#8b9098}
.badge-hot{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:4px 9px;border-radius:999px;color:#fff;background:linear-gradient(135deg,#fdbc49,#ff6a1f 55%,#d94f0a);box-shadow:0 4px 14px rgba(255,106,31,.45)}
.spot-h{display:flex;align-items:center;gap:14px}
.spot-h .job-logo{width:52px;height:52px}
.spot-t{display:block;font:600 26px/1.1 var(--display);letter-spacing:-.03em;color:#fff}
.spot-c{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:13.5px;color:#9aa0a7}.spot-c b{color:#e6e7e9;font-weight:600;margin-right:4px}
.spot-f{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.spot-pay{font-size:22px;font-weight:500;color:#fff;margin-right:8px}
.spot-cta{position:absolute;right:24px;bottom:24px}

/* vacancy LIST, scrolls inside its card */
.jlist{position:relative;max-height:660px;overflow-y:auto;overscroll-behavior:contain;border-radius:var(--radius);background:var(--steel);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.05);scrollbar-width:thin}
.jl-head,.jrow{display:grid;grid-template-columns:44px minmax(0,1.5fr) minmax(0,1fr) 110px 96px;gap:16px;align-items:center}
.jl-head{position:sticky;top:0;z-index:2;padding:12px 16px;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);background:rgba(250,250,250,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.jl-head span:first-child{grid-column:2}.jl-head span:last-child{text-align:right}
.jrow{padding:14px 16px;border-top:1px solid rgba(10,11,15,.06);border-left:3px solid transparent;transition:background .14s,box-shadow .14s}
.jl-head+.jrow{border-top:0}
.jrow:hover{background:#fff;border-left-color:var(--gold);box-shadow:0 10px 26px rgba(10,11,15,.10);position:relative;z-index:1}
.jrow .job-logo{width:40px;height:40px;font-size:16px}
.jr-main{min-width:0}
.jr-t{display:block;font:600 15px/1.25 var(--display);color:var(--ink);letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jr-c{display:flex;align-items:center;gap:10px;margin-top:4px;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden}
.jr-c b{color:var(--ink);font-weight:600}
.jr-l{display:inline-flex;align-items:center;gap:4px;overflow:hidden;text-overflow:ellipsis}
.jr-tags{display:flex;flex-wrap:wrap;gap:6px;overflow:hidden;max-height:58px}
.jr-tags .tag{font-size:11px;padding:3px 9px}
.jr-pay{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right}
.jr-pay b{font-size:14px;font-weight:500;color:var(--ink);white-space:nowrap}
.jr-pay span{font-size:9.5px;color:var(--faint);text-transform:uppercase}
.jr-cta{justify-self:end}
.jrow:hover .jr-cta{color:#fff;border-color:#06070a;background:radial-gradient(40px 30px at 100% 60%,rgba(255,154,77,.9),transparent 100%),linear-gradient(180deg,#3a3f46,#0a0b0e)}
.more-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px;padding:14px 14px 14px 22px;border-radius:var(--radius);background:rgba(255,255,255,.35);border:1.5px dashed rgba(10,11,15,.16)}
.more-bar>div{display:flex;align-items:baseline;gap:14px;min-width:0}
.more-bar b{font-size:26px;font-weight:500;color:var(--ink)}
.more-bar span{color:var(--muted);font-size:14px}

/* right rail tiles */
.rail{display:grid;gap:14px}
.tile{position:relative;overflow:hidden;min-height:168px}
.tile h3{position:relative;font-size:22px;font-weight:600;letter-spacing:-.04em;margin:10px 0 6px;line-height:1.05;max-width:190px}
.tile p{position:relative;font-size:13px;color:var(--muted);margin-bottom:16px;max-width:160px;line-height:1.45}
.tile p .mono{color:var(--ink);font-size:12px}
.tile .btn{position:relative;z-index:1}
.art-t{background:#d9d9d9;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 1px 2px rgba(10,11,15,.05)}
.tg-t{background:radial-gradient(260px 140px at 100% 0%,rgba(34,158,217,.18),transparent 70%),linear-gradient(180deg,rgba(255,255,255,.75),rgba(240,240,242,.75))}
.art{position:absolute;pointer-events:none;width:140px;height:auto;right:-14px;bottom:-14px}
.a-cards{width:150px;right:-26px;bottom:-22px}
.top-t{min-height:0}
.toplist{display:grid;margin:12px 0 14px}
.toplist a{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid rgba(10,11,15,.06)}
.toplist a:first-child{border-top:0}
.toplist img,.toplist .co-i{width:28px;height:28px;border-radius:8px;flex:none;background:#fff;object-fit:contain;box-shadow:0 0 0 1px rgba(10,11,15,.08)}
.toplist a>span:nth-child(2){flex:1;min-width:0}
.toplist b{display:block;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.toplist em{display:block;font-style:normal;font-size:12px;color:var(--faint)}
.toplist .mono{font-size:13px;color:var(--ink)}

/* below the console */
.logoband{display:flex;align-items:center;gap:32px;margin-top:48px;padding:20px 0;border-top:1px solid rgba(10,11,15,.10);border-bottom:1px solid rgba(10,11,15,.10)}
.logoband .sp-logos{display:flex;flex-wrap:wrap;gap:12px 24px}
.logoband .sp-co{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:#4a4e55;font-size:14.5px}
.logoband .sp-co img{border-radius:6px;background:#fff;box-shadow:0 0 0 1px rgba(10,11,15,.08)}
.paysec{margin-top:48px}
.sec-h{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:1px solid rgba(10,11,15,.14);padding-bottom:14px;margin-bottom:20px}
.sec-h h2{font-size:40px;font-weight:500;letter-spacing:-.05em;margin:0}
.paygrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.payc{display:block;border-radius:var(--radius);padding:20px;background:var(--steel);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff}
.payc:hover{background:#fff}
.sr{font-size:13px;color:var(--muted)}.payc b{display:block;font-size:20px;font-weight:500;color:var(--ink);margin:6px 0 16px}
.bar{position:relative;display:block;height:8px;border-radius:9px;background:rgba(10,11,15,.07)}
.bar i{position:absolute;top:0;bottom:0;border-radius:9px;background:linear-gradient(90deg,#2b2f35,#ff6a1f)}
.bar u{position:absolute;top:-3px;width:3px;height:14px;border-radius:2px;background:#0a0b0f;box-shadow:0 0 0 2px #fff;margin-left:-1px}
.tiny{display:flex;justify-content:space-between;font-size:9.5px;color:var(--faint);margin-top:8px}
.talent-card-home:empty{display:none}

/* ---------- responsive ---------- */
@media(max-width:1280px){
  .navpill .nav-actions .nav-hire{display:none}
  .grid3{grid-template-columns:230px minmax(0,1fr)}
  .rail{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .con-head{flex-direction:column;align-items:flex-start;gap:20px}
}
@media(max-width:1100px){
  .navpill .nav-links{display:none}
  .navpill .nav-actions{margin-left:auto}
  .subnav{display:flex;gap:6px;margin-top:10px;padding:0;border:0;overflow-x:auto;scrollbar-width:none}
  .subnav a{flex:none;padding:8px 13px;border-radius:999px;background:rgba(255,255,255,.6);border:1px solid rgba(10,11,15,.08);font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap}
  .subnav a.on{background:#0a0b0f;color:#fff}
  .paygrid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .grid3{grid-template-columns:minmax(0,1fr)}
  .filters{display:none}.filters.show{display:block}
  .m-tools{display:flex;gap:8px;margin:0 0 14px}
  .m-tools .seg{flex:1}
  .jl-head{display:none}
  .jrow{grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"logo main pay" "logo tags tags";gap:6px 12px;padding:14px}
  .jrow .job-logo{grid-area:logo;align-self:start}
  .jr-main{grid-area:main}.jr-pay{grid-area:pay;align-self:start}.jr-tags{grid-area:tags}
  .jr-t{white-space:normal}
  .jr-cta{display:none}
  .jlist{max-height:342px}
  .logoband{flex-direction:column;align-items:flex-start;gap:14px}
}
@media(max-width:760px){
  .wrap{padding:0 16px}
  .topstrip{font-size:9.5px}
  .ts-i{padding:0 10px}
  .ts-d{display:none}
  .navpill{height:54px;padding:0 6px 0 8px;margin-top:8px}
  .logo-pill{font-size:17px}
  .nav-actions .nav-tg,.nav-actions .nav-signin{display:none}
  .nav-actions .nav-me[hidden]{display:inline-flex}
  .nav-post .price-chip{display:none}
  .console{padding-top:22px}
  .console h1{font-size:32px}
  .bigsearch{height:56px;padding:0 6px 0 16px;margin-top:16px;gap:8px}
  .bigsearch .kbd,.bigsearch .sdiv,.bigsearch .ssel{display:none}
  .bigsearch .btn-primary{height:44px;padding:0 18px}
  .rolepills{margin:14px 0}
  .feedbar .lbl{font-size:9px}
  .spot{padding:20px}
  .spot-art{width:300px;right:-80px}
  .spot-t{font-size:21px}
  .spot-cta{position:relative;right:auto;bottom:auto;width:100%;margin-top:18px}
  .more-bar{flex-direction:column;align-items:stretch;padding:16px}
  .more-bar .btn{width:100%}
  .sec-h h2{font-size:28px}
  .paygrid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
  .cta-band{margin:32px 16px}
}
/* v2 fixes: rail copy above the 3D art, body links in ink, rhythm after the console */
.tile .kick,.tile h3,.tile p,.tile .toplist{position:relative;z-index:1}
.art{width:120px;right:-18px;bottom:-18px}
.seo-text a,.page-body a:not(.btn),.faq-a a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.console+.wrap{margin-top:40px}
.seo-text{margin-top:56px}
.toplist{grid-template-columns:minmax(0,1fr)}
.spot-art{right:-70px;width:400px}

/* ---------- v2 button motion (owner 2026-10-16: "clean", no loops) ----------
   One quiet response: 1px lift + deeper shadow, orange hotspot brightens on the
   primary, soft press, arrow nudges. Same easing everywhere. */
.btn{position:relative;isolation:isolate;overflow:hidden;
  transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s cubic-bezier(.2,.7,.2,1),border-color .2s ease}
.btn:hover{transform:translateY(-1px);filter:none}
.btn:active{transform:translateY(0) scale(.98);transition-duration:.06s}
.btn-primary{background:linear-gradient(180deg,#4a4f57 0%,#1d2025 47%,#0a0b0e 53%,#24282e 100%)}
.btn-primary::before{content:"";position:absolute;z-index:-1;inset:-40% -24px -40% auto;width:110px;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,154,77,.95),rgba(255,106,31,.38) 55%,transparent 100%);
  opacity:.9;transition:opacity .25s ease}
.btn-primary:hover::before{opacity:1}
.btn-primary:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 14px 28px rgba(10,11,15,.28),0 8px 22px rgba(255,106,31,.24)}
.btn .ico{transition:transform .2s cubic-bezier(.2,.7,.2,1)}
.btn:hover .ico,.jrow:hover .jr-cta .ico,.spot:hover .spot-cta .ico{transform:translateX(2px)}
.pill,.seg-btn,.chk i,.flist a,.navpill .nav-links a{transition:background .18s ease,color .18s ease,box-shadow .18s ease,border-color .18s ease}
@media (prefers-reduced-motion:reduce){
  .btn,.btn:hover,.btn:active{transform:none}
  .btn:hover .ico{transform:none}
}
.spot .spot-cta{position:absolute}
@media(max-width:760px){.spot .spot-cta{position:relative}}
.console h1 .h1-b{color:var(--muted)}

/* sidebar tags */
.ftags{display:flex;flex-wrap:wrap;gap:6px}
.ftags .tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:5px 10px;background:#fff;box-shadow:0 0 0 1px rgba(10,11,15,.07);color:var(--ink);transition:box-shadow .18s ease,color .18s ease}
.ftags .tag b{font-size:10px;font-weight:500;color:var(--faint)}
.ftags .tag:hover{box-shadow:0 0 0 1px var(--gold-line),0 2px 6px rgba(255,106,31,.12);color:var(--gold-ink)}

/* logo glow, more prominent (owner 2026-10-16) */
.logo-pill{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 1px rgba(255,255,255,.14),0 4px 16px rgba(255,106,31,.22);animation:pill-halo 7s ease-in-out infinite alternate}
.logo-pill::before{inset:-70% -40%;background:radial-gradient(42% 60% at 50% 50%,rgba(255,122,48,.55),rgba(255,106,31,.18) 45%,transparent 72%);animation:pill-glow2 7s ease-in-out infinite alternate}
@keyframes pill-glow2{0%{transform:translateX(34%);opacity:.8}50%{opacity:1}100%{transform:translateX(-30%);opacity:.75}}
@keyframes pill-halo{0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 1px rgba(255,255,255,.14),0 4px 16px rgba(255,106,31,.18)}50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 1px rgba(255,255,255,.16),0 6px 24px rgba(255,106,31,.34)}}
@media (prefers-reduced-motion:reduce){.logo-pill,.logo-pill::before{animation:none}}

/* sticky nav, hirehi-style (owner 2026-10-16): flat at the top; once pinned a
   light glass layer fades + scales in behind the same contents (no layout shift).
   Header sticks at -34px so the black stats strip scrolls away. */
.site-header{position:sticky;top:-34px;z-index:60;padding-bottom:0}
.navpill{position:relative;isolation:isolate;background:none;border-color:transparent;box-shadow:none;backdrop-filter:none}
.navpill::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.80),rgba(238,238,240,.72));
  -webkit-backdrop-filter:blur(20px) saturate(1.2);backdrop-filter:blur(20px) saturate(1.2);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:0 1px 0 rgba(10,11,15,.04),0 14px 34px rgba(10,11,15,.12),0 0 0 1px rgba(10,11,15,.07);
  opacity:0;transform:scale(.98);
  transition:opacity .55s cubic-bezier(.22,1,.36,1),transform .55s cubic-bezier(.22,1,.36,1)}
.site-header.is-pinned .navpill::before{opacity:1;transform:none}
.subnav{transition:max-height .45s cubic-bezier(.22,1,.36,1),opacity .3s ease,margin .45s cubic-bezier(.22,1,.36,1);max-height:60px}
.site-header.is-pinned .subnav{max-height:0;opacity:0;margin-top:0;overflow:hidden}
@media (prefers-reduced-motion:reduce){.navpill::before,.subnav{transition:none}}
.jrow:first-child{border-top:0}

/* home list v3 (owner 2026-10-16, ref hirehi): separate rounded rows, no Apply
   button, the whole row is the target; hover = lighten, 1px lift, arrow slides in */
.jlist{display:grid;gap:6px;padding:2px 4px 6px;background:none;border:0;box-shadow:none;border-radius:0}
.jl-head,.jrow{grid-template-columns:44px minmax(0,1.5fr) minmax(0,1fr) 110px 20px}
.jrow{border:1px solid rgba(10,11,15,.07);border-radius:18px;background:var(--steel);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.04);
  transition:background-color .2s ease,box-shadow .25s cubic-bezier(.22,1,.36,1),transform .25s cubic-bezier(.22,1,.36,1),border-color .2s ease}
.jrow:hover{background:#fff;border-color:rgba(10,11,15,.10);border-left-color:rgba(10,11,15,.10);transform:translateY(-1px);
  box-shadow:inset 0 1px 0 #fff,0 10px 24px rgba(10,11,15,.08)}
.jr-go{display:flex;justify-content:flex-end;color:var(--ink);opacity:0;transform:translateX(-6px);
  transition:opacity .2s ease,transform .25s cubic-bezier(.22,1,.36,1)}
.jrow:hover .jr-go{opacity:1;transform:none}
.jrow:hover .jr-t{color:var(--ink)}
@media(max-width:860px){.jr-go{display:none}.jrow{border-radius:16px}}
@media (prefers-reduced-motion:reduce){.jrow,.jrow:hover,.jr-go{transform:none;transition:none}}

/* in-place home filters */
#home-live{transition:opacity .2s ease}
#home-live.is-loading{opacity:.55;pointer-events:none}
.chk i{display:inline-flex;align-items:center;justify-content:center;color:transparent}
.chk.on i{color:#fff;background:linear-gradient(180deg,#ff8a3d,#ff6a1f);border-color:#e85a12;box-shadow:0 2px 8px rgba(255,106,31,.35)}
.flist a.on{background:#fff;box-shadow:0 1px 2px rgba(10,11,15,.08),inset 3px 0 0 var(--gold)}
.ftags .tag.on{background:var(--ink);color:#fff;box-shadow:none}.ftags .tag.on b{color:var(--peach)}
.fdot{color:var(--gold);margin-left:2px}

/* ---------- home board v4 (owner 2026-10-16, ref hirehi): tiles up top, then a
   wide live feed + right filter panel with chip groups and live counts ---------- */
.toprail{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:28px 0 30px}
.toprail .tile{min-height:0;padding:16px 20px}
.con-head{margin-bottom:28px}
.con-head>div:first-child{flex:none}
.con-head .toprail{flex:1;max-width:980px;margin:0;grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1280px){.con-head{flex-direction:column;align-items:stretch;gap:20px}.con-head .toprail{max-width:none}}
.toprail .tile h3{font-size:19px;margin:6px 0 4px;max-width:none}
.toprail .tile p{max-width:300px;margin-bottom:12px}
.toprail .tile p br{display:none}
.toprail .tile p .mono+.mono,.toprail .tile p br+.mono{margin-left:10px}
.toprail .art{width:96px;right:-10px;bottom:-14px}
.toprail .a-cards{width:104px;right:-16px;bottom:-18px}
.board{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}
.board .filters{position:sticky;top:90px;max-height:calc(100vh - 110px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:18px}
.feedsearch{display:flex;align-items:center;gap:12px;height:58px;padding:0 6px 0 20px;border-radius:999px;color:var(--ink);
  background:linear-gradient(180deg,#fff,#f3f3f4);border:1px solid rgba(10,11,15,.12);box-shadow:inset 0 1px 0 #fff,0 12px 30px rgba(10,11,15,.08)}
.feedsearch input{flex:1;min-width:0;border:0;background:none;outline:none;font:400 16px var(--font);color:var(--ink)}
.feedsearch input::placeholder{color:var(--faint)}
.feedsearch .seg{background:rgba(10,11,15,.05)}
.board .feedbar{justify-content:flex-start;flex-wrap:wrap;gap:8px;margin:14px 2px}
.board .feedbar .lbl{margin-right:4px}
.achip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 6px 0 11px;border-radius:999px;background:var(--ink);color:#fff;font-size:12.5px;font-weight:500}
.achip span{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.14);font-size:13px;line-height:1}
.achip:hover span{background:var(--gold)}
.areset{font-size:12.5px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.m-filt{display:none;margin-left:auto}
.m-filt b{font-size:10px;padding:1px 6px;border-radius:999px;background:var(--ink);color:#fff}
.fsel label{position:relative;display:flex;flex-direction:column;gap:2px;padding:10px 40px 10px 14px;border-radius:16px;background:rgba(10,11,15,.05)}
.fsel label>span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.fsel select{appearance:none;-webkit-appearance:none;border:0;background:none;font:600 15px var(--font);color:var(--ink);outline:none;cursor:pointer;width:100%}
.fsel .ico{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.fgroup{margin-top:18px}
.fgroup h4{margin:0 0 9px;font:600 14px var(--display);letter-spacing:-.01em;color:var(--ink)}
.fchips{display:flex;flex-wrap:wrap;gap:6px}
.fmore{display:contents}
.fmore[hidden]{display:none}
.fchip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;border-radius:999px;background:#fff;border:0;box-shadow:0 0 0 1px rgba(10,11,15,.08);
  font:500 13px var(--font);color:var(--ink);cursor:pointer;white-space:nowrap;transition:box-shadow .18s ease,background-color .18s ease,color .18s ease}
.fchip b{font-size:10.5px;font-weight:500;color:var(--faint)}
.fchip img{width:16px;height:16px;border-radius:4px;object-fit:contain}
.fchip .ico{color:var(--gold)}
.fchip:hover{box-shadow:0 0 0 1px rgba(10,11,15,.18),0 2px 6px rgba(10,11,15,.06)}
.fchip.on{background:var(--ink);color:#fff;box-shadow:0 4px 12px rgba(10,11,15,.18)}
.fchip.on b{color:var(--peach)}
.fchip.zero{opacity:.45}
.fshow{background:none;box-shadow:none;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.fshow:hover{box-shadow:none;color:var(--ink)}
.board .jlist{max-height:none;overflow:visible}
#home-live.is-loading .feed{opacity:.5}
@media(max-width:1100px){.board{grid-template-columns:minmax(0,1fr) 280px}}
@media(max-width:860px){
  .board{grid-template-columns:minmax(0,1fr)}
  .board .filters{display:none;position:static;max-height:none;order:-1}
  .board .filters.show{display:block}
  .m-filt{display:inline-flex}
  .toprail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:20px -16px 22px;padding:0 16px 4px;scrollbar-width:none}
  .toprail::-webkit-scrollbar{display:none}
  .toprail .tile{flex:0 0 78%;scroll-snap-align:start}
  .feedsearch{height:52px;padding-left:16px}
  .feedsearch .kbd{display:none}
}
@media(max-width:520px){.feedsearch .seg-sort .seg-btn{padding:7px 9px}}
@media(max-width:860px){
  .jrow{grid-template-columns:40px minmax(0,1fr) auto}
  .toprail{scroll-padding-inline:16px}
}
/* mobile: filter panel = bottom sheet, stays open while chips update in place */
.f-done{display:none}
@media(max-width:860px){
  .board .filters.show{position:fixed;left:8px;right:8px;bottom:8px;top:auto;z-index:120;max-height:78vh;overflow-y:auto;
    background:linear-gradient(180deg,#fbfbfb,#efeff1);box-shadow:0 -10px 50px rgba(10,11,15,.28),0 0 0 1px rgba(10,11,15,.08);padding-bottom:0;
    animation:sheet-up .32s cubic-bezier(.22,1,.36,1)}
  .board .filters.show .f-done{display:flex;position:sticky;bottom:0;width:calc(100% + 36px);margin:18px -18px 0;height:56px;border-radius:0 0 22px 22px}
  .spot-art{opacity:.45}
}
@keyframes sheet-up{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.board .filters.show{animation:none}}
@media(max-width:760px){.con-head .toprail{margin:0 -16px;padding:0 16px 4px}}

/* ── /post v2 (Figma 76:2) ── */
.pj-page{padding-top:30px;padding-bottom:60px}
.pj-page>h1{font-family:var(--display);font-size:clamp(34px,4vw,48px);font-weight:600;letter-spacing:-.04em;line-height:1.05;margin:10px 0 12px}
.pj-page>.lead{max-width:560px;color:var(--muted);font-size:15px;line-height:1.55;margin:0 0 24px}
.pj-steps{list-style:none;display:flex;gap:10px;padding:0;margin:0 0 22px;flex-wrap:wrap}
.pj-steps li{display:flex;align-items:center;gap:10px;min-width:220px;padding:11px 14px;border-radius:14px;font-size:13.5px;font-weight:500;color:var(--faint);background:rgba(255,255,255,.35);border:1px solid rgba(10,11,15,.05)}
.pj-steps li.on{color:var(--ink);background:#fff;border-color:rgba(10,11,15,.08);box-shadow:0 1px 2px rgba(10,11,15,.05)}
.pj-steps span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font:600 11px var(--mono);background:rgba(10,11,15,.07)}
.pj-steps li.on span{background:var(--ink);color:#fff}
.pj-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}
.pj-side{display:grid;gap:14px}
.pj-card{padding:22px 22px 8px;border-radius:22px;background:linear-gradient(180deg,#fafafa,#efeff1);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.04)}
.pj-card h2{display:flex;align-items:baseline;gap:8px;font-family:var(--display);font-size:22px;font-weight:600;letter-spacing:-.03em;margin:0 0 16px}
.pj-card h2 .mono{font-size:10px;color:var(--faint);letter-spacing:.04em}
.pj-f3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px}
.pj-f2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.post-form.pj label{display:block;margin:0 0 16px;font-size:12.5px;font-weight:600;color:var(--ink)}
.post-form.pj label em{font-style:normal;font-weight:400;color:var(--faint)}
.post-form.pj input:not([type=radio]),.post-form.pj select,.post-form.pj textarea{display:block;width:100%;margin-top:7px;padding:11px 14px;border:1px solid rgba(10,11,15,.1);border-radius:12px;background:#fff;font:400 14px var(--font);color:var(--ink);box-shadow:none;transition:border-color .2s,box-shadow .2s}
.post-form.pj select{appearance:none;-webkit-appearance:none;padding-right:36px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a8d94' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center}
.post-form.pj textarea{min-height:130px;resize:vertical}
.post-form.pj input:focus,.post-form.pj select:focus,.post-form.pj textarea:focus{outline:none;border-color:rgba(255,106,31,.55);box-shadow:0 0 0 3px rgba(255,106,31,.14)}
.pj-help{padding-bottom:20px;background:linear-gradient(135deg,#f6f6f7 40%,#dcebf5)}
.pj-help b{font-family:var(--display);font-size:16px;font-weight:600;letter-spacing:-.02em}
.pj-help p{font-size:12.5px;color:var(--muted);line-height:1.45;margin:6px 0 14px}
.pj-vis{text-align:center;margin:48px 0 26px}
.pj-vis h2{font-family:var(--display);font-size:clamp(24px,2.6vw,32px);font-weight:600;letter-spacing:-.035em;margin:10px 0 8px}
.pj-vis p{color:var(--muted);font-size:14px;margin:0}
.pj-plans{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.17fr);gap:14px;max-width:960px;margin:0 auto;align-items:stretch}
.pj-plan{position:relative;display:flex!important;flex-direction:column;margin:0!important;padding:28px 24px 24px;border-radius:22px;cursor:pointer;background:linear-gradient(180deg,#ececee,#e3e3e5);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);font-weight:400!important;transition:transform .2s,box-shadow .2s}
.pj-plan:hover{transform:translateY(-1px)}
.pj-plan input{position:absolute;opacity:0;pointer-events:none}
.pj-plan:has(input:focus-visible){outline:2px solid var(--orange,#ff6a1f);outline-offset:3px}
.pj-spot{padding-top:56px;background:linear-gradient(180deg,#fff,#fbfbfb);border:2px solid #ff6a1f;box-shadow:0 18px 40px -18px rgba(255,106,31,.35);overflow:hidden}
.pj-flag{position:absolute;top:0;left:0;right:0;padding:9px;text-align:center;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:linear-gradient(180deg,#ff8a3d,#ff6a1f)}
.pj-dot{position:absolute;right:24px;top:30px;width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(10,11,15,.25);background:#fff}
.pj-spot .pj-dot{top:58px}
.pj-plan:has(input:checked) .pj-dot{border:5px solid #ff6a1f}
.pj-pt{font-family:var(--display);font-size:22px;font-weight:600;letter-spacing:-.03em}
.pj-ps{font-size:12.5px;color:var(--muted);margin-top:4px}
.pj-price{display:flex;align-items:baseline;gap:8px;margin-top:22px}
.pj-price b{font-size:44px;font-weight:500;letter-spacing:-.04em;color:var(--ink);line-height:1}
.pj-spot .pj-price b{font-size:54px}
.pj-price s{font-size:14px;color:var(--faint)}
.pj-price em{align-self:center;font-style:normal;font-size:10.5px;padding:4px 9px;border-radius:999px;background:var(--ink);color:#fff}
.pj-dur{font-size:12px;color:var(--muted);margin:6px 0 18px;padding-bottom:18px;border-bottom:1px solid rgba(10,11,15,.08)}
.pj-plan ul{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:9px;font-size:13.5px;color:var(--ink)}
.pj-plan li{padding-left:22px;position:relative}
.pj-plan li::before{content:"✓";position:absolute;left:2px;font-size:12px;color:var(--muted)}
.pj-spot li::before{color:#ff6a1f}
.pj-pick{margin-top:auto;display:grid;place-items:center;height:42px;border-radius:999px;font-size:13.5px;font-weight:600;color:var(--muted);border:1px solid rgba(10,11,15,.12);background:rgba(255,255,255,.4)}
.pj-pick::after{content:attr(data-off)}
.pj-plan:has(input:checked) .pj-pick{color:#fff;border-color:transparent;background:radial-gradient(120% 140% at 100% 50%,#ff7a2a 0,#6a3a1c 22%,#121317 48%,#0a0b0f 100%);box-shadow:0 10px 22px -10px rgba(10,11,15,.6)}
.pj-plan:has(input:checked) .pj-pick::after{content:attr(data-on)}
.pj-plan:not(:has(input:checked)){opacity:.92}
.post-form.pj .cf-turnstile{display:flex;justify-content:center;margin:18px 0 0}
.pj-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;max-width:860px;margin:18px auto 0;padding:10px 10px 10px 18px;border-radius:999px;background:#fff;border:1px solid rgba(10,11,15,.08);box-shadow:0 14px 34px -18px rgba(10,11,15,.35)}
.pj-pay{display:flex;align-items:center;gap:4px;font-size:12.5px;color:var(--muted)}
.pj-pay>span{margin-right:8px}
.post-form.pj .pj-pay label{margin:0;font-size:12.5px;font-weight:500;padding:8px 14px;border-radius:999px;cursor:pointer;color:var(--muted)}
.pj-pay label:has(input:checked){background:#fff;color:var(--ink);box-shadow:0 0 0 1px rgba(10,11,15,.1),0 1px 3px rgba(10,11,15,.08)}
.pj-pay input{position:absolute;opacity:0;pointer-events:none}
.pj-pay label:has(input:focus-visible){outline:2px solid #ff6a1f}
.pj-sum{margin-left:auto;font-size:12px;color:var(--muted)}
.pj-sum b{font:600 19px var(--mono);color:var(--ink);margin-left:8px}
.pj-note{text-align:center;font-size:12.5px;color:var(--muted);margin:14px 0 0}
@media(max-width:980px){.pj-grid{grid-template-columns:1fr}.pj-f3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
  .pj-f3,.pj-f2,.pj-plans{grid-template-columns:1fr}
  .pj-steps li{min-width:0;flex:1 1 100%}
  .pj-bar{border-radius:22px;padding:14px}
  .pj-sum{margin-left:0}
  .pj-bar .btn{width:100%;justify-content:center}
}
.pj-vis .kick{justify-content:center;text-align:center}

/* ── /talent v2 (Figma 52:2 / 56:2). TALENT_CSS is inline and shared across boards,
   so these carry .tp-outer to win; !important vars beat the hirelabs theme inline style. ── */
.tp-outer .tp{--tp-a:#ff6a1f!important;--tp-ink:#0a0b0f!important;--tp-mu:#5c5f66!important;--tp-ln:rgba(10,11,15,.09)!important;--tp-bg:#fbfbfb!important;--tp-panel:#0a0b0f!important;--tp-fd:var(--display)!important;--tp-f:var(--font)!important;--tp-fm:var(--mono)!important;--tp-r:16px!important;
  border-radius:24px;overflow:hidden;border:1px solid rgba(10,11,15,.08);background:linear-gradient(180deg,#fdfdfd,#f3f3f4);box-shadow:inset 0 1px 0 #fff,0 30px 60px -36px rgba(10,11,15,.35);margin:28px 0 56px}
.tp-outer .tp-grid,.tp-outer .tp-b,.tp-outer .tp-panel::after,.tp-outer .tp-panel-bottom::before{display:none!important}
.tp-outer .tp-eyebrow::before,.tp-outer .tp-eyebrow::after{display:none}
.tp-outer .tp-eyebrow{letter-spacing:.14em;font-weight:500}
.tp-outer .tp-panel{background:#0a0b0f;justify-content:flex-end}
.tp-outer .tp-loop{position:absolute;left:0;right:0;top:0;width:100%;height:62%;object-fit:cover;mix-blend-mode:screen;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
.tp-outer .tp-panel-top{position:relative;z-index:1;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.12)}
.tp-outer .tp-panel-bottom{padding-top:6px;max-width:none}
.tp-outer .tp-usps{border-top:0;padding-top:16px;gap:20px}
.tp-outer .tp-usps li>svg{color:#ff6a1f;background:rgba(255,106,31,.16)}
.tp-outer .tp-usps b{font-size:16px;font-weight:600;letter-spacing:-.02em}
.tp-outer .tp-usps span{font-size:13px;max-width:44ch}
.tp-outer .tp h1{font-weight:600;letter-spacing:-.045em;font-size:clamp(30px,3.4vw,44px);max-width:none}
.tp-outer .tp-main{background:transparent;box-shadow:none;border-left:0}
.tp-outer .tp-eyebrow-m{color:var(--muted)}
.tp-outer .tp-already{font-family:var(--font);font-size:14px;letter-spacing:0;padding-top:22px}
.tp-outer .tp-already a{text-transform:none;font-weight:600;border-bottom:1.5px solid #ff6a1f;padding-bottom:1px}
.tp-outer .tp-trust{margin-top:14px;font-weight:500}
.tp-outer .tp-trust svg{color:var(--faint)}
@media(min-width:1000px){
  .tp-outer .tp{height:auto;min-height:640px;max-height:none;grid-template-columns:42% 1fr}
  .tp-outer .tp-main{overflow:visible;padding:56px 56px 48px;align-items:center}
  .tp-outer .tp-eyebrow-m{display:inline-flex}
}
@media(max-width:999px){.tp-outer .tp-panel{padding-top:150px}.tp-outer .tp-loop{height:170px;-webkit-mask-image:none;mask-image:none}.tp-outer .tp-usps span{display:none}}
@media(prefers-reduced-motion:reduce){.tp-outer .tp-loop{display:none}}
.tp-outer .tp-panel-top{margin-top:auto}
.tp-outer .tp-panel-bottom{margin-top:0}
@media(max-width:999px){.tp-outer .tp-panel-top{display:none}.tp-outer .tp-panel{padding-top:160px}.tp-outer .tp-loop{-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}}
@media(min-width:1000px){.tp-outer .tp-loop{height:40%;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}}

/* ── job page v2 (Figma 24:2 / 25:2) ── */
.job-detail.jv{max-width:var(--maxw);padding:22px 40px 64px}
.jv .crumbs,.jv .breadcrumbs{font:500 10.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.jv .jd-head{margin:14px 0 14px;gap:14px}
.jv .jd-logo{width:58px;height:58px;border-radius:16px;border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.06)}
.jv h1{font-family:var(--display);font-size:clamp(28px,3.2vw,42px);font-weight:600;letter-spacing:-.045em;line-height:1.05;margin:0 0 6px}
.jv .jd-company{font-size:14px;font-weight:500;display:flex;gap:10px;align-items:baseline}
.jv .jd-web{font-size:12.5px;border-bottom:1.5px solid #ff6a1f;padding-bottom:1px}
.jv .jd-facts{gap:6px;margin:0 0 22px}
.jv .fact{font-size:12.5px;font-weight:500;color:var(--ink);background:linear-gradient(180deg,#fafafa,#efeff1);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff;padding:7px 13px}
.jv-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start}
.jv-main{display:grid;gap:14px;min-width:0}
.jv-side{position:sticky;top:96px;display:grid;gap:14px}
.jv-card{padding:22px 24px;border-radius:22px;background:linear-gradient(180deg,#fafafa,#f1f1f3);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.04)}
.jv .jd-tldr{margin:0;padding:0;background:none;border:0}
.jv .jd-tldr h2,.jv .jd-body h2,.jv .jd-faqs h2{font-family:var(--display);font-size:21px;font-weight:600;letter-spacing:-.03em;color:var(--ink);margin:0 0 10px}
.jv .jd-tldr p{font-size:14px;line-height:1.6;color:var(--muted)}
.jv .jd-tags{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
.jv .jd-body .jd-tags{margin:0 0 16px}
.jv .jd-tags .tag{font-size:11.5px;padding:4px 10px;border-radius:999px;background:rgba(10,11,15,.05);color:var(--muted);border:0}
.jv .jd-body{font-size:14px;line-height:1.65;color:#3c3f45}
.jv .jd-body h2{margin-top:26px}
.jv .jd-body>h2:first-child,.jv .jd-body>.jd-tags+h2{margin-top:4px}
.jv .jd-body h3{font-size:15px;font-weight:600;margin:20px 0 6px}
.jv .jd-salary-note{font-size:12.5px;font-weight:400;color:var(--faint)}
.jv .jd-faqs{margin:0}
.jv .jd-faqs details{border-bottom:1px solid rgba(10,11,15,.08)}
.jv .jd-faqs details:last-child{border-bottom:0}
.jv .jd-faqs summary{font-size:14px;padding:14px 0}
.jv .jd-faqs summary::after{content:"";width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:4px 4px 0 0;flex:none;transition:transform .2s}
.jv .jd-faqs details[open] summary::after{transform:rotate(-135deg)}
.jv .jd-faqs details p{font-size:13.5px;color:var(--muted);margin:-4px 0 14px}
.jv .jd-actions{margin:0}
.jv .jd-actions-bottom{border-top:1px solid rgba(10,11,15,.08);padding:18px 24px;margin:0}
.jv .jd-actions .btn{width:100%;justify-content:center}
.jv .apply-direct{font-size:12px;line-height:1.5;color:var(--muted);margin:10px 0 0}
.jv-pay-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.jv-sal{font-size:36px;font-weight:500;letter-spacing:-.04em;color:var(--ink);margin:8px 0 16px;line-height:1.1}
.jv-sal span{font-size:18px;color:var(--faint)}
.jv-facts{margin:18px 0 0;padding:0}
.jv-facts div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid rgba(10,11,15,.07);font-size:12.5px}
.jv-facts dt{color:var(--muted)}
.jv-facts dd{margin:0;font-weight:500;color:var(--ink);text-align:right;text-transform:capitalize}
.jv-talent{min-height:0}
.jv-talent p{max-width:150px}
.jv-similar{margin-top:44px}
.jv-similar h2{font-family:var(--display);font-size:26px;font-weight:600;letter-spacing:-.035em;margin:0 0 14px;padding-bottom:14px;border-bottom:1px solid rgba(10,11,15,.1)}
.jv-rel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(max-width:1000px){
  .jv-grid{grid-template-columns:1fr}
  .jv-side{position:static;order:-1}
  .jv-talent{display:none}
  .jv-rel{grid-template-columns:1fr}
}
@media(max-width:700px){.job-detail.jv{padding:16px 16px 48px}.jv-card{padding:18px}.jv-sal{font-size:30px}}
.jv-rel .jr-tags{display:none}
@media(min-width:1001px){.jv-rel .jrow{grid-template-columns:44px minmax(0,1fr) auto 20px}}
@media(max-width:760px){
  .jv .jd-actions-bottom{position:sticky;bottom:0;z-index:40;margin:0 -16px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-radius:0;border:0;border-top:1px solid rgba(10,11,15,.08);background:rgba(236,236,238,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:none}
  .jv .jd-actions-bottom .apply-direct{display:none}
}
/* /post single centred column (owner 2026-10-16: contact on the right looked crooked) */
.pj-page{max-width:1000px;margin:0 auto}
.pj-grid,.pj-side{display:grid;grid-template-columns:1fr;gap:14px}
.pj-plans,.pj-bar{max-width:none}
.pj-help{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 22px}
.pj-help p{margin:4px 0 0}
.pj-vis{margin:40px 0 22px}
.pj-steps li{color:var(--ink);background:rgba(255,255,255,.6);border-color:rgba(10,11,15,.07)}
.pj-steps li span{background:var(--ink);color:#fff}
.pj-help>div{flex:1 1 320px}
/* /post sales sections (owner 2026-10-16: proof, explainers, preview, FAQ) */
.pj-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pj-steps li{min-width:0;align-items:flex-start;padding:14px 16px;font-weight:400;font-size:12.5px;line-height:1.5;color:var(--muted);background:linear-gradient(180deg,#fafafa,#efeff1);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff}
.pj-steps li b{display:block;font-size:14px;font-weight:600;color:var(--ink);margin-bottom:2px}
.pj-steps li span{flex:none;margin-top:1px}
.pj-where-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pj-where-g div{padding:18px;border-radius:18px;background:linear-gradient(180deg,#fafafa,#efeff1);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff}
.pj-where-g b{font-size:14.5px;font-weight:600}
.pj-where-g p{font-size:12.5px;line-height:1.5;color:var(--muted);margin:6px 0 0}
.pj-faq details{border-bottom:1px solid rgba(10,11,15,.08)}
.pj-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;padding:16px 0;font-size:15px;font-weight:600}
.pj-faq summary::-webkit-details-marker{display:none}
.pj-faq summary::after{content:"+";color:#ff6a1f;font-weight:500;font-size:18px;line-height:1}
.pj-faq details[open] summary::after{content:"–"}
.pj-faq details p{margin:-4px 0 16px;font-size:14px;line-height:1.6;color:var(--muted);max-width:70ch}
.pj-faq .btn{margin-top:24px}
@media(max-width:860px){.pj-where-g{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* loops fade softly into their card instead of hard-cropping at the edges */
.spot-art{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,rgba(0,0,0,.6) 60%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,rgba(0,0,0,.6) 60%,transparent 100%)}
.tp-outer .tp-loop{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 32%,rgba(0,0,0,.55) 66%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 32%,rgba(0,0,0,.55) 66%,transparent 100%)}
@media(max-width:999px){.tp-outer .tp-loop{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,transparent 100%)}}
/* testimonials: one snapping row, no orphan gap */
@media(min-width:1000px){.tp-outer .tp-loop{top:0;height:56%;object-fit:cover;object-position:50% 46%}.tp-outer .tp-panel-top{visibility:hidden}}
/* /post preview: Featured vs Spotlight side by side, chosen plan in focus */
/* testimonials v3: one big quote on graphite + role tabs */
.pj-quotes-s{margin-top:54px}
.pj-tq{position:relative;overflow:hidden;border-radius:28px;padding:56px 64px 48px;text-align:center;color:#d6d8db;
  background:radial-gradient(520px 260px at 50% 0%,rgba(255,106,31,.22),transparent 70%),linear-gradient(160deg,#30343a 0%,#121418 55%,#0a0b0e 100%);
  border:1px solid #06070a;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 26px 50px rgba(10,11,15,.22)}
.pj-tq-i{margin:0;max-width:720px;margin-inline:auto}
.pj-qm{display:block;height:44px;font-family:var(--display);font-size:84px;line-height:1;font-weight:700;color:var(--gold)}
.pj-q-t{display:block;font-family:var(--display);font-size:32px;line-height:1.1;font-weight:600;letter-spacing:-.035em;color:#fff;margin:6px 0 16px}
.pj-tq blockquote{margin:0 auto 24px;font-size:17px;line-height:1.65;color:#b9bdc3;max-width:640px}
.pj-tq figcaption{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#ffb27a}
.pj-tq-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:16px}
.pj-tq-tab{height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(10,11,15,.12);background:rgba(255,255,255,.6);font:500 13px/1 var(--sans,inherit);color:var(--muted);cursor:pointer}
.pj-tq-tab:hover{color:var(--ink)}
.pj-tq-tab.is-on{background:#0a0b0f;border-color:#0a0b0f;color:#fff}
@media(max-width:640px){.pj-tq{padding:36px 22px 30px;border-radius:22px}.pj-q-t{font-size:24px}.pj-tq blockquote{font-size:15.5px}.pj-tq-tabs{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}}
/* primary button: fixed-size orange hotspot clipped INSIDE the pill (Figma recipe) */
.btn-primary{position:relative;isolation:isolate;overflow:hidden;
  background:radial-gradient(64px 44px at 100% 58%,rgba(255,154,77,.92),rgba(255,106,31,.34) 55%,transparent 100%),linear-gradient(180deg,#4a4f57 0%,#1d2025 47%,#0a0b0e 53%,#24282e 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 20px rgba(10,11,15,.24),0 4px 14px rgba(255,106,31,.14)}
.btn-primary::before{content:none}
.btn-primary:hover{filter:brightness(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 12px 26px rgba(10,11,15,.28),0 6px 18px rgba(255,106,31,.2)}
.btn-primary .price-chip{background:rgba(255,255,255,.14);color:#ffd2b3}
/* selected plan pill: same recipe, hotspot does not stretch with width */
.pj-plan:has(input:checked) .pj-pick{color:#fff;border-color:#06070a;overflow:hidden;
  background:radial-gradient(70px 46px at 100% 58%,rgba(255,154,77,.9),rgba(255,106,31,.32) 55%,transparent 100%),linear-gradient(180deg,#4a4f57 0%,#1d2025 47%,#0a0b0e 53%,#24282e 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 20px rgba(10,11,15,.22)}
.pj-tq-tab{font-family:inherit;font-size:12.5px;font-weight:500;line-height:1;height:32px;padding:0 13px}
.pj-tq-tabs{margin-top:14px}
.pj-quotes-s{margin-bottom:24px}
.pj-quotes-s{margin-bottom:56px}
/* primary glow v3: lit-from-within (no blob, no crease, no muddy ring) */
.btn-primary,.pj-plan:has(input:checked) .pj-pick{border:1px solid #07080a;
  background:
    radial-gradient(110px 54px at calc(100% - 4px) 115%,rgba(255,150,70,.62),rgba(255,120,45,.22) 45%,rgba(255,106,31,0) 72%),
    linear-gradient(180deg,#464a52 0%,#24272d 38%,#121418 70%,#0d0e11 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 -1px 0 rgba(255,150,70,.45),
    inset -12px -8px 16px -12px rgba(255,130,50,.75),
    0 8px 18px -6px rgba(10,11,15,.45),
    0 12px 28px -12px rgba(255,106,31,.5)}
.btn-primary:hover{filter:none;
  background:
    radial-gradient(130px 60px at calc(100% - 4px) 110%,rgba(255,160,80,.75),rgba(255,120,45,.28) 45%,rgba(255,106,31,0) 72%),
    linear-gradient(180deg,#4d525a 0%,#272a31 38%,#131519 70%,#0d0e11 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 0 rgba(255,160,80,.55),inset -14px -8px 18px -12px rgba(255,140,60,.85),0 10px 22px -6px rgba(10,11,15,.5),0 14px 32px -12px rgba(255,106,31,.6)}
.btn-primary .price-chip{background:rgba(255,255,255,.1);color:#ffcfae;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
/* /post preview v3: framed board window, only the chosen plan shows */
.pj-prev{margin:0 0 26px;pointer-events:none}
.pj-prev-h{font-family:var(--display);font-size:20px;font-weight:600;letter-spacing:-.02em;color:var(--ink);margin:0 0 12px;text-align:center}
.pj-win{border-radius:20px;overflow:hidden;background:#e4e4e6;border:1px solid rgba(10,11,15,.12);box-shadow:0 24px 50px rgba(10,11,15,.14),inset 0 1px 0 #fff}
.pj-win-bar{display:flex;align-items:center;gap:7px;height:38px;padding:0 14px;background:linear-gradient(180deg,#f7f7f8,#ececee);border-bottom:1px solid rgba(10,11,15,.08)}
.pj-win-bar i{width:10px;height:10px;border-radius:50%;background:#cfd1d4}
.pj-win-url{margin-left:10px;flex:1;max-width:340px;height:24px;display:flex;align-items:center;padding:0 12px;border-radius:999px;background:#fff;border:1px solid rgba(10,11,15,.08);font-size:11px;color:#7f848c}
.pj-win-tag{margin-left:auto;font-size:11px;font-weight:600;color:#c2410c;background:rgba(255,106,31,.12);padding:4px 10px;border-radius:999px}
.pj-win-body{display:grid;gap:12px;padding:16px;background:#d9d9d9}
.pj-win-body .spot{margin:0}
.pj-win-list{max-height:none;overflow:hidden}
.pj-ghost{filter:blur(2.5px);opacity:.55}
.pj:has(input[name=plan][value=featured]:checked) .pj-prev-s,.pj:has(input[name=plan][value=spotlight]:checked) .pj-prev-f{display:none}
.pj:has(input[name=plan][value=featured]:checked) .pj-prev-f .jrow,.pj:has(input[name=plan][value=featured]:checked) .pj-prev-f>*{box-shadow:inset 3px 0 0 #ff6a1f}
@media(max-width:640px){.pj-win-url{display:none}.pj-win-body{padding:10px}}
/* CTA / funnel band sits on the same column edges as .wrap (40px gutters, maxw) */
.cta-band,.funnel-band{width:auto;max-width:none;margin:48px max(40px,calc((100% - var(--maxw)) / 2 + 40px))}
@media(max-width:760px){.cta-band,.funnel-band{margin:32px 16px}}
/* breathing room: every content section gets a clear gap above its heading */
.block{margin:0 0 48px}
.block-h,.block>h2:first-child{margin-bottom:16px}
.section-head{margin-top:48px;margin-bottom:18px}
.job-list+.block,.job-list+.section-head,.empty+.block,.pager+.block,.post-form+*{margin-top:48px}
.intro+.section-head,.stats-bar+.block,.salary-note+.block{margin-top:48px}
.seo-text h2{margin-top:36px;margin-bottom:10px}
.seo-text h2:first-child{margin-top:0}
.pj-prev{margin-top:36px}
@media(max-width:760px){.block{margin-bottom:36px}.section-head,.job-list+.block,.job-list+.section-head,.empty+.block,.pager+.block,.post-form+*,.intro+.section-head,.stats-bar+.block,.salary-note+.block{margin-top:36px}}

/* lock-in board (owner 2026-10-17): past the hero, search + filters pin under the
   navbar and only the vacancy list scrolls; the hero fades out as it leaves. */
.board .feedtop{position:sticky;top:84px;z-index:20;margin:0 -10px;padding:0 10px 2px;border-radius:0 0 26px 26px;
  transition:background-color .45s ease,box-shadow .45s ease,backdrop-filter .45s ease}
.board .filters{top:84px;max-height:calc(100vh - 100px)}
.board .feedtop::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:84px;pointer-events:none;opacity:0;transition:opacity .45s ease;
  background:#d9d9d9}
.lock-in .board .feedtop::before{opacity:1}
.lock-in .board .feedtop{background:rgba(217,217,217,.86);-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);
  box-shadow:0 18px 24px -20px rgba(10,11,15,.25)}
.feedsearch{position:relative;overflow:hidden;transition:box-shadow .45s ease,border-color .45s ease}
.feedsearch::after{content:"";position:absolute;inset:0;pointer-events:none;transform:translateX(-110%);
  background:linear-gradient(100deg,transparent 30%,rgba(255,138,61,.28) 50%,transparent 70%)}
.lock-in .feedsearch{border-color:rgba(255,106,31,.45);animation:lock-ring .9s cubic-bezier(.22,1,.36,1)}
.lock-in .feedsearch::after{animation:lock-sweep 1s .1s cubic-bezier(.22,1,.36,1) both}
.lock-in .board .filters{animation:lock-panel .6s cubic-bezier(.22,1,.36,1)}
@keyframes lock-ring{0%{box-shadow:inset 0 1px 0 #fff,0 0 0 0 rgba(255,106,31,.5),0 12px 30px rgba(10,11,15,.08)}
  100%{box-shadow:inset 0 1px 0 #fff,0 0 0 10px rgba(255,106,31,0),0 12px 30px rgba(10,11,15,.08)}}
@keyframes lock-sweep{to{transform:translateX(110%)}}
@keyframes lock-panel{0%{transform:translateY(10px);box-shadow:0 0 0 1px rgba(255,106,31,.4)}100%{transform:none}}
@supports (animation-timeline:view()){
  .con-head{animation:hero-out linear both;animation-timeline:view();animation-range:exit-crossing 0% exit-crossing 70%}
  @keyframes hero-out{to{opacity:0;filter:blur(6px);transform:translateY(-24px) scale(.97)}}
}
@media(max-width:860px){.board .feedtop{top:68px;margin:0 -16px;padding:0 16px 2px}.board .feedtop::before{height:68px}}
@media (prefers-reduced-motion:reduce){.con-head,.lock-in .feedsearch,.lock-in .feedsearch::after,.lock-in .board .filters{animation:none}}
.board .feedtop{padding-bottom:10px}
.board .feedbar{margin:10px 2px 0}
@media(min-width:861px){.board .feedbar:not(:has(.achip)){display:none}}
/* pull-to-exit: only the content under the docked search stretches */
.feed{position:relative}
.feed>:not(.feedtop):not(.pull-ring){transform:translateY(var(--pull,0px));transition:transform .5s cubic-bezier(.22,1,.36,1)}
.feed.is-pulling>:not(.feedtop):not(.pull-ring){transition:none}
.pull-ring{position:sticky;top:154px;z-index:19;display:flex;justify-content:center;height:0;pointer-events:none;
  opacity:calc(var(--pp,0)*1.6);transform:translateY(calc(var(--pull,0px)*.35)) scale(calc(.6 + var(--pp,0)*.4));transition:opacity .3s ease,transform .5s cubic-bezier(.22,1,.36,1)}
.feed.is-pulling .pull-ring{transition:none}
.pull-ring svg{flex:none;overflow:visible;color:var(--ink);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pull-ring circle{stroke:var(--gold);stroke-dasharray:69.12;stroke-dashoffset:69.12;transform:rotate(-90deg);transform-origin:center}
.pull-ring path{stroke:currentColor}
.feed.is-done .pull-ring svg{animation:pull-pop .26s cubic-bezier(.22,1,.36,1)}
@keyframes pull-pop{50%{transform:scale(1.25)}}
/* band = flat page grey, ends 6px under the search so rows vanish cleanly and the
   first visible row sits one row-gap below the search (owner 2026-10-17) */
.board .feedtop{padding-bottom:6px;border-radius:0}
.lock-in .board .feedtop{background:#d9d9d9;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
.board .feedtop+*{margin-top:0}
/* lock-in dims the page; the sticky band uses the same dimmed grey so it stays seamless */
.board .feedtop::before{transition:opacity .45s ease,background-color .6s ease}
.lock-in .board .feedtop,.lock-in .board .feedtop::before{background:#c4c4c4}
/* dim = the page colour itself fading, so the sticky band always matches it exactly */
body{transition:background-color .6s ease}
.lock-in body{background:#c4c4c4}
/* band and search line up with the job cards' edges (cards sit 4px inside .jlist) */
.board .feedtop{margin:0;padding:0 4px 6px}
.board .feedtop,.board .feedtop::before{transition:background-color .6s ease}

/* company strip, $999/mo (owner 2026-10-17): 3x the stats strip, graphite like the
   Spotlight card with the same chip loop; whole strip opens the company page */
.takeover{position:relative;display:block;height:102px;overflow:hidden;isolation:isolate;color:#fff;
  background:radial-gradient(60% 140% at 85% 50%,rgba(255,106,31,.20),transparent 60%),linear-gradient(180deg,#22252b,#0d0e12);
  border-bottom:1px solid rgba(255,138,61,.35)}
.to-art{position:absolute;right:0;top:50%;width:420px;transform:translateY(-50%);mix-blend-mode:screen;opacity:.85;z-index:-1;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%)}
.to-in{display:flex;align-items:center;gap:18px;height:100%}
.to-logo{flex:none;width:56px;height:56px;border-radius:16px;background:#fff;object-fit:contain;padding:6px;box-shadow:0 0 0 1px rgba(255,255,255,.15),0 8px 22px rgba(0,0,0,.4);
  display:inline-flex;align-items:center;justify-content:center;font:700 24px var(--display);color:var(--ink)}
.to-txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.to-h{font:600 22px/1.1 var(--display);letter-spacing:-.02em}
.to-s{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#9aa0a8}
.to-roles{display:flex;gap:6px;margin-left:auto;min-width:0;overflow:hidden}
.to-roles .tag{white-space:nowrap}
.to-cta{flex:none;background:linear-gradient(180deg,#fff,#e9e9eb);color:var(--ink);transition:transform .25s cubic-bezier(.22,1,.36,1)}
.takeover:hover .to-cta{transform:translateX(3px)}
.site-header.has-takeover{top:-136px}
@media(max-width:1100px){.to-roles{display:none}.to-cta{margin-left:auto}}
@media(max-width:860px){.takeover{height:76px}.site-header.has-takeover{top:-110px}.to-logo{width:44px;height:44px;border-radius:12px}.to-h{font-size:16px}.to-art{width:260px}.to-cta{display:none}}
@media (prefers-reduced-motion:reduce){.to-art{display:none}}
/* hover flicker fix (owner 2026-10-17): invisible 3px hit zone above/below each row so
   the 6px gap always belongs to a card; slower ease-out so leaving doesn't snap */
.jrow{position:relative}
.jrow::after{content:"";position:absolute;inset:-4px -1px;border-radius:inherit}
.jrow{transition:background-color .35s ease,box-shadow .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1),border-color .35s ease}
.jrow:hover{transition-duration:.18s,.25s,.25s,.18s}
.board .spot{margin-left:4px;margin-right:4px}
.ask-ai{margin-top:22px}
.ask-ai h3{margin:0 0 10px}
.ask-ai-row{display:flex;flex-wrap:wrap;gap:6px}
.site-footer .ask-ai-row a.ai-pill{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px 0 9px;margin:0;border-radius:999px;background:#fff;
  box-shadow:0 0 0 1px rgba(10,11,15,.08);font:500 13px var(--font);color:var(--ink);transition:box-shadow .18s ease,transform .18s ease}
.ai-pill img{border-radius:4px}
.site-footer .ask-ai-row a.ai-pill:hover{box-shadow:0 0 0 1px rgba(10,11,15,.18),0 4px 10px rgba(10,11,15,.08);transform:translateY(-1px)}
.con-sub{margin:12px 0 0;font:400 19px/1.4 var(--font);color:var(--muted);letter-spacing:-.01em}
@media(max-width:860px){.con-sub{font-size:16px;margin-top:8px}}
/* bottom apply card duplicated the sidebar one (owner 2026-10-17); kept only as the mobile sticky bar */
@media(min-width:761px){.jv .jd-actions-bottom{display:none}}
.ask-ai-row{flex-direction:column;align-items:flex-start}
/* talent block lives inside the apply card (owner 2026-10-17): divider, no card of its own */
.jv-pay-top{justify-content:flex-end}
.jv-pay .jv-talent{margin:22px -24px -22px;padding:20px 24px 22px;border:0;border-top:1px solid rgba(10,11,15,.08);border-radius:0 0 22px 22px;box-shadow:none}
@media(max-width:700px){.jv-pay .jv-talent{margin:18px -18px -18px;padding:18px}}
/* band v3 (owner 2026-10-17 "no boxy edge"): no rectangle, the cards fade out as they
   slide under the docked search. Page and fade share one animated colour token. */
@property --ground{syntax:'<color>';inherits:true;initial-value:#d9d9d9}
html{--ground:#d9d9d9;transition:--ground .6s ease}
html.lock-in{--ground:#c4c4c4}
.lock-in body{background:var(--ground);transition:none}
.board .feedtop,.lock-in .board .feedtop{padding-bottom:6px;margin-bottom:-22px;border-bottom:22px solid transparent;background-clip:border-box;transition:none}
.lock-in .board .feedtop{background:linear-gradient(var(--ground) calc(100% - 22px),transparent)}
.board .feedtop::before,.lock-in .board .feedtop::before{background:var(--ground);transition:none}

/* page ground v2 (owner 2026-10-17, ref: spotlight-loop backdrop): bright silver at the
   top cooling into blue-steel, instead of flat neutral grey. Lock-in deepens the steel. */
:root{--bg:#dfe3e5;--bg-2:#eceef0}
body{background:radial-gradient(1100px 460px at 50% -120px,#fbfbfb 0%,rgba(251,251,251,0) 70%),linear-gradient(180deg,#f2f3f3 0%,#e4e7e8 38%,#d8dde0 100%)}
@property --ground{syntax:'<color>';inherits:true;initial-value:#dfe3e5}
html{--ground:#dfe3e5}
html.lock-in{--ground:#ccd3d7}
/* band v4: covers only down to the middle of the docked search, so cards slide under the
   pill itself; no strip edge, no square corners, works over the dark Spotlight card too */
.board .feedtop,.lock-in .board .feedtop{margin-bottom:0;border-bottom:0;padding-bottom:6px}
.lock-in .board .feedtop{background:linear-gradient(var(--ground) 29px,transparent 29px)}
/* band v5: no pseudo layer (it resolved its colour inconsistently = visible box). When
   locked the search container itself reaches the viewport top: -84px margin + 84px
   padding (net zero layout), painted page colour down to the search pill's middle. */
.board .feedtop::before{display:none}
.lock-in .board .feedtop{top:0;margin-top:-84px;padding-top:84px;background:linear-gradient(var(--ground) 113px,transparent 113px)}
@media(max-width:860px){.lock-in .board .feedtop{margin-top:-68px;padding-top:68px;background:linear-gradient(var(--ground) 94px,transparent 94px)}}
/* locked search: no grey drop shadow (it stacked with the nav shadow into a visible box), soft orange glow instead */
.lock-in .feedsearch{box-shadow:inset 0 1px 0 #fff,0 6px 22px rgba(255,106,31,.16)}
/* hero tiles: buttons sit on one baseline whatever the copy length (owner 2026-10-17) */
.toprail .tile{display:flex;flex-direction:column;align-items:flex-start}
.toprail .tile .btn{margin-top:auto}
/* band v6 (owner 2026-10-17, box still visible on owner's screen): NO painted band at all.
   JS clips the list at the middle of the docked search instead, so only the real page
   shows above it. */
.lock-in .board .feedtop{top:84px;margin-top:0;padding-top:0;background:none}
@media(max-width:860px){.lock-in .board .feedtop{top:68px;margin-top:0;padding-top:0;background:none}}
/* fade-under-search mask geometry (owner 2026-10-17): see clip() in home.js */
.board .feed>*{-webkit-mask-size:calc(100% + 120px) calc(100% + 120px);mask-size:calc(100% + 120px) calc(100% + 120px);
  -webkit-mask-position:-60px -60px;mask-position:-60px -60px;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-clip:no-clip;mask-clip:no-clip}
/* strip content uses the navbar pill inset so logo and CTA line up with the nav logo and Post a job */
.to-logo{margin-left:11px}.to-cta{margin-right:9px}
@media(max-width:860px){.to-logo{margin-left:9px}}
/* hero tiles end where the search/feed column ends, not past it (owner 2026-10-17) */
.con-head{padding-right:342px}
@media(max-width:1100px){.con-head{padding-right:302px}}
@media(max-width:860px){.con-head{padding-right:0}}
.con-head{padding-left:4px;padding-right:346px}
@media(max-width:1100px){.con-head{padding-right:306px}}
@media(max-width:860px){.con-head{padding-left:0;padding-right:0}}
.con-head .toprail{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}

/* ---------- hirelabs talent widget on our brand (owner 2026-10-17) ----------
   The widget's theme still comes from hirelabs config (old warm palette); re-theme it
   here, board side only, so the widget code and the other boards stay untouched. */
body .hlt{--a:#ff6a1f!important;--af:#fff!important;--ink:#0a0b0f!important;--mu:#6a6e75!important;--ln:rgba(10,11,15,.10)!important;
  --sf:#fafafa!important;--bg:#f1f2f4!important;--r:22px!important;--rs:14px!important;
  --fd:Gabarito,var(--display),sans-serif!important;--fm:"Red Hat Mono",ui-monospace,monospace!important;font-family:"Albert Sans",var(--font),sans-serif!important}
.hlt-ov{background:rgba(10,11,15,.42)!important;-webkit-backdrop-filter:blur(10px) saturate(1.1);backdrop-filter:blur(10px) saturate(1.1)}
/* sign-in modal: narrow and vertical, everything stacked full width */
.hlt-modal:has(input[name=email]):not(:has(textarea)){max-width:420px!important;padding:34px 30px 28px!important;text-align:center;
  background:radial-gradient(260px 120px at 50% 0,rgba(255,106,31,.10),transparent 70%),linear-gradient(180deg,#fff,#f1f2f4)!important;
  border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 30px 80px rgba(10,11,15,.30)!important}
.hlt-modal .hlt-h{font-family:Gabarito,sans-serif!important;font-size:28px!important;font-weight:600!important;letter-spacing:-.03em!important;margin:4px 0 8px!important}
.hlt-modal .hlt-sub{font-size:15px!important;line-height:1.5;margin:0 auto 24px!important;max-width:320px}
.hlt-modal .hlt-f{text-align:left}
.hlt-modal .hlt-f label{font-size:10.5px!important}
.hlt-modal .hlt-f input{height:52px;border-radius:16px!important;background:#fff!important;border:1px solid rgba(10,11,15,.12)!important;box-shadow:inset 0 1px 2px rgba(10,11,15,.04)}
.hlt-modal .hlt-f input:focus{border-color:rgba(255,106,31,.55)!important;box-shadow:0 0 0 4px rgba(255,106,31,.12)!important}
.hlt-modal .hlt-actions{flex-direction:column;align-items:stretch;gap:14px!important}
.hlt-modal .hlt-actions .hlt-mini{order:9}
.hlt-modal .hlt-btn{width:100%!important;height:52px;min-height:52px;border-radius:999px!important;font:600 15px "Albert Sans",sans-serif!important;letter-spacing:0!important;text-transform:none!important;
  color:#fff;border:1px solid #07080a!important;
  background:radial-gradient(130px 60px at calc(100% - 4px) 115%,rgba(255,150,70,.62),rgba(255,120,45,.22) 45%,rgba(255,106,31,0) 72%),linear-gradient(180deg,#464a52 0%,#24272d 38%,#121418 70%,#0d0e11 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(255,150,70,.45),0 8px 20px rgba(10,11,15,.22),0 6px 16px rgba(255,106,31,.14)}
.hlt-modal .hlt-btn:hover{filter:brightness(1.08)}
.hlt-modal .hlt-btn .hlt-i{background:none!important;color:inherit!important;padding:0}
.hlt-modal .hlt-btn[style*="2AABEE"]{background:linear-gradient(180deg,#3cb4ec,#229ed9)!important;border-color:#1b8fc6!important;margin-top:0!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 20px rgba(34,158,217,.25)!important}
.hlt-modal .hlt-or{margin:22px 0!important;font-family:"Red Hat Mono",monospace;font-size:11px!important;letter-spacing:.1em;text-transform:uppercase}
.hlt-modal .hlt-mini{font-size:13px!important;line-height:1.5}
.hlt-modal .hlt-mini a{color:var(--ink)!important;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.hlt-modal .hlt-x{top:14px!important;right:14px!important;background:rgba(10,11,15,.05)!important}
@media(max-width:640px){.hlt-modal:has(input[name=email]):not(:has(textarea)){max-width:none!important;padding:56px 20px 28px!important;border-radius:0!important}}
.console h1 .mono-num{font-weight:400}

/* lock-in ground v3 (owner 2026-10-17, ref: silver -> blue-steel -> near-black gradient).
   A fixed layer under the content fades in (opacity transition, no instant swap = no flicker).
   The body keeps its light silver gradient; nothing paints a flat colour any more. */
.lock-in body{background:radial-gradient(1100px 460px at 50% -120px,#fbfbfb 0%,rgba(251,251,251,0) 70%),linear-gradient(180deg,#f2f3f3 0%,#e4e7e8 38%,#d8dde0 100%)}
body::before{display:block!important;content:"";position:fixed;inset:0;left:0;right:0;width:auto;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,#f2f3f3 0%,#dde1e2 24%,#b8c1c5 44%,#8e9ba1 56%,#4e5b62 68%,#1d262b 80%,#05090c 94%,#030507 100%);
  opacity:0;transition:opacity .9s cubic-bezier(.4,0,.2,1)}
.lock-in body::before{opacity:1}
@media (prefers-reduced-motion:reduce){body::before{transition:none}}
/* pull ring v2: sits in the middle of the revealed gap, turns solid orange when "let go" will take you home */
.pull-ring{transform:translateY(calc(var(--pull,0px)*.5 - 6px)) scale(calc(.6 + var(--pp,0)*.4))}
.pull-ring circle{transition:fill .2s ease}
.pull-ring path{transition:stroke .2s ease}
.feed.is-ready .pull-ring circle{fill:var(--gold)}
.feed.is-ready .pull-ring path{stroke:#fff}

/* row hover v3 (owner 2026-10-17 "flickers in the gap, not subtle"):
   - no physical gap: rows touch; the visible 6px gap is each row's transparent 3px top/bottom border
     (background-clip:padding-box), so the pointer is always over a row
   - hover = a white wash fading in (opacity, animatable) instead of swapping the gradient (not animatable)
   - no lift, no big shadow; one speed in and out */
.board .jlist{gap:0!important;padding-top:0;margin-top:-3px}
.jrow{position:relative;isolation:isolate;border:0!important;border-top:3px solid transparent!important;border-bottom:3px solid transparent!important;
  background-clip:padding-box!important;border-radius:18px;transform:none!important;
  box-shadow:inset 0 0 0 1px rgba(10,11,15,.07),inset 0 2px 0 rgba(255,255,255,.9)!important;
  transition:box-shadow .2s ease!important}
.jrow::after{content:none!important}
.jrow::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:15px;background:#fff;opacity:0;transition:opacity .2s ease}
.jrow:hover{transform:none!important;box-shadow:inset 0 0 0 1px rgba(10,11,15,.13),inset 0 2px 0 #fff!important}
.jrow:hover::before{opacity:.75}
.jr-go{transition:opacity .2s ease,transform .2s ease!important}
.jrow:first-child{border-top:3px solid transparent!important}
@media (prefers-reduced-motion:reduce){.jrow::before{transition:none}}
/* calmer spring-back after a short pull */
.feed>:not(.feedtop):not(.pull-ring){transition:transform .6s cubic-bezier(.16,1,.3,1)}
/* ring v3: 22px, centred in the gap between the search (bottom 142px) and the stretched list;
   only fades in once the gap is wide enough to hold it clear of both (--pk set in JS) */
.pull-ring{top:142px;opacity:var(--pk,0);transform:translateY(calc(var(--pull,0px)*.5 - 8px)) scale(calc(.8 + var(--pp,0)*.2))}
.pull-ring svg{width:22px;height:22px}
@media(max-width:860px){.pull-ring{top:126px}}
.pull-ring{transform:translateY(calc(var(--pull,0px)*.5 - 3px)) scale(calc(.8 + var(--pp,0)*.2))}
/* signed-in nav pill (owner 2026-10-17 "what the hell is this"): was border-radius:50% on a wide box
   (= ellipse) with 0 left padding. Now a real pill like Log in, avatar in a graphite circle. */
.navpill .nav-me.has-name{width:auto;height:42px;border-radius:999px;padding:0 16px 0 5px;gap:9px;
  font:600 14px var(--font);letter-spacing:0;color:var(--ink);border:1px solid rgba(10,11,15,.10);
  background:linear-gradient(180deg,#fff,#eef0f2);box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(10,11,15,.07)}
.navpill .nav-me.has-name:hover{box-shadow:inset 0 1px 0 #fff,0 4px 12px rgba(10,11,15,.10)}
.navpill .nav-me.has-name .hlt-i,.navpill .nav-me.has-name img{flex:none;width:32px;height:32px;border-radius:50%;padding:0;
  display:inline-flex;align-items:center;justify-content:center;object-fit:cover;
  background:linear-gradient(180deg,#464a52,#121418);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.navpill .nav-me.has-name .hlt-i svg{width:16px;height:16px}
.navpill .nav-me.has-name .nav-me-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:760px){.navpill .nav-me.has-name{width:42px;padding:0;justify-content:center}}

/* ---------- profile modal on brand (owner 2026-10-17) ---------- */
/* secondary widget buttons (Add a role, Add education, Cancel): light silver pill, dark text. The
   graphite recipe above is for the primary button only. */
.hlt-modal .hlt-btn.sec,.hlt-modal .hlt-btn.ghost,.hlt-modal .hlt-btn.sm{color:var(--ink)!important;border:1px solid rgba(10,11,15,.12)!important;
  background:linear-gradient(180deg,#fff,#eef0f2)!important;box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(10,11,15,.06)!important}
.hlt-modal .hlt-btn.sec .hlt-i,.hlt-modal .hlt-btn.ghost .hlt-i{color:var(--ink)!important}
.hlt-modal .hlt-btn.sm{height:36px;min-height:36px;width:auto!important;padding:0 14px}
/* profile modal: roomier, brand header and tabs */
.hlt-modal:has(.hlt-phead){max-width:760px!important;padding:30px 30px 0!important;background:linear-gradient(180deg,#fff,#f3f4f6)!important;
  border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 30px 80px rgba(10,11,15,.30)!important}
.hlt-phead h2{font-family:Gabarito,sans-serif!important;font-size:26px!important;font-weight:600!important;letter-spacing:-.025em}
.hlt-tabs{display:flex;gap:4px!important;padding:4px!important;margin:18px 0 18px!important;border:0!important;border-radius:999px;background:rgba(10,11,15,.05);overflow-x:auto;scrollbar-width:none}
.hlt-tabs::-webkit-scrollbar{display:none}
.hlt-tabs button{flex:none;height:36px;padding:0 14px!important;border:0!important;border-radius:999px!important;background:none!important;color:var(--mu)!important;
  font:500 13.5px "Albert Sans",sans-serif!important;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;margin:0!important}
.hlt-tabs button:hover{color:var(--ink)!important}
.hlt-tabs button.on{background:#fff!important;color:var(--ink)!important;box-shadow:0 1px 2px rgba(10,11,15,.08),0 0 0 1px rgba(10,11,15,.06)}
.hlt-tabs button .pct{font:600 10.5px "Red Hat Mono",monospace;color:var(--gold-ink,#c2410c);background:rgba(255,106,31,.12);padding:2px 6px;border-radius:999px}
/* overview cards */
.hlt-sum{display:grid;gap:12px;padding-bottom:30px}
.hlt-sum-card{border-radius:18px;background:#fff;border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.04);padding:16px 18px 18px}
.hlt-sum-card header{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.hlt-sum-card header .ic{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:rgba(255,106,31,.10);color:#e2560c}
.hlt-sum-card h4{margin:0;flex:1;font:600 16px Gabarito,sans-serif;letter-spacing:-.01em;color:var(--ink)}
.hlt-sum-edit{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;border:1px solid rgba(10,11,15,.12);
  background:linear-gradient(180deg,#fff,#eef0f2);color:var(--ink);font:500 12.5px "Albert Sans",sans-serif;cursor:pointer;transition:box-shadow .18s ease}
.hlt-sum-edit:hover{box-shadow:0 2px 8px rgba(10,11,15,.10)}
.hlt-sum-edit .hlt-i{background:none!important;padding:0;color:inherit!important}
.hlt-sum-lead{margin:0 0 4px;font:600 16px "Albert Sans",sans-serif;color:var(--ink)}
.hlt-sum-meta{margin:0 0 8px;font:500 11px "Red Hat Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--mu)}
.hlt-sum-text,.hlt-sum-tl p{margin:0;font-size:14px;line-height:1.55;color:#3a3d43}
.hlt-sum-none{margin:0;font-size:13.5px;color:var(--mu);font-style:italic}
.hlt-sum-tl{list-style:none;margin:0;padding:0 0 0 16px;display:grid;gap:14px;border-left:2px solid rgba(255,106,31,.25)}
.hlt-sum-tl li{position:relative}
.hlt-sum-tl li::before{content:"";position:absolute;left:-22px;top:5px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid #ff6a1f}
.hlt-sum-tl b{display:block;font:600 14.5px "Albert Sans",sans-serif;color:var(--ink)}
.hlt-sum-tl span{display:block;margin:2px 0 4px;font-size:12.5px;color:var(--mu)}
.hlt-sum-chips{display:flex;flex-wrap:wrap;gap:6px}
.hlt-sum-chips span{height:28px;display:inline-flex;align-items:center;padding:0 11px;border-radius:999px;background:rgba(10,11,15,.05);font-size:13px;color:var(--ink)}
.hlt-sum-sub{margin-top:12px}.hlt-sum-sub small{display:block;margin-bottom:6px;font:500 10.5px "Red Hat Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mu)}
.hlt-sum-links{display:flex;flex-wrap:wrap;gap:6px}
.hlt-sum-links a{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;border:1px solid rgba(10,11,15,.10);font-size:13px;color:var(--ink);text-decoration:none}
.hlt-sum-links a .hlt-i{background:none!important;padding:0}
.hlt-sum-kv{display:grid;grid-template-columns:max-content 1fr;gap:8px 18px;margin:0}
.hlt-sum-kv dt{font:500 10.5px "Red Hat Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);padding-top:2px}
.hlt-sum-kv dd{margin:0;font-size:14px;color:var(--ink)}
/* edit one section: the form shows only that section; Cancel + Save side by side */
.hlt-form-one .hlt-sec{border:0!important;padding-top:0!important}
.hlt-modal .hlt-actions.sticky{flex-direction:row!important;gap:10px!important;background:linear-gradient(180deg,rgba(243,244,246,.6),#f3f4f6 40%)!important;box-shadow:none!important;margin:8px -30px 0!important;padding:14px 30px 20px!important}
.hlt-modal .hlt-actions.sticky .hlt-btn{flex:1;width:auto!important}
/* lock entrance plays once, on the moment of locking (.lock-enter, 1.2s), never when filters
   swap the board in place (that replayed it = the flicker on sort/filter clicks) */
.lock-in .feedsearch,.lock-in .feedsearch::after,.lock-in .board .filters{animation:none}
.lock-enter .feedsearch{animation:lock-ring .9s cubic-bezier(.22,1,.36,1)}
.lock-enter .feedsearch::after{animation:lock-sweep 1s .1s cubic-bezier(.22,1,.36,1) both}
.lock-enter .board .filters{animation:lock-panel .6s cubic-bezier(.22,1,.36,1)}
/* in-place filter swap: gentle dim while loading, new list fades in */
#home-live.is-loading{opacity:.8}
#home-live.is-loading .feed{opacity:.75}
#home-live .jlist{animation:feed-in .28s ease both}
@keyframes feed-in{from{opacity:.6}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.lock-enter .feedsearch,.lock-enter .feedsearch::after,.lock-enter .board .filters,#home-live .jlist{animation:none}}
/* hiring band + real client quotes (owner 2026-10-17) */
.cta-band.has-quotes .cta-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.cta-pitch .btn{margin-top:22px}
.cta-quotes{position:relative;display:grid;padding:26px 28px 22px;border-radius:22px;color:#fff;overflow:hidden;
  background:radial-gradient(260px 140px at 100% 100%,rgba(255,106,31,.22),transparent 70%),linear-gradient(180deg,#2a2d33,#0d0e11);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 18px 40px rgba(10,11,15,.22)}
.cq{grid-area:1/1;margin:0;opacity:0;transform:translateY(6px);transition:opacity .5s ease,transform .5s cubic-bezier(.22,1,.36,1);pointer-events:none}
.cq.is-on{opacity:1;transform:none;pointer-events:auto}
.cq-m{display:block;height:34px;font:700 54px/1 Gabarito,serif;color:#ff8a3d}
.cq b{display:block;margin:4px 0 8px;font:600 20px/1.25 Gabarito,sans-serif;letter-spacing:-.02em}
.cq blockquote{margin:0;font-size:15px;line-height:1.6;color:#c9ccd1}
.cq figcaption{margin-top:14px;font:500 11px "Red Hat Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:#8b9098}
.cq-dots{grid-area:2/1;display:flex;gap:6px;margin-top:18px}
.cq-dots button{width:8px;height:8px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.22);cursor:pointer;transition:width .3s ease,background-color .3s ease}
.cq-dots button.is-on{width:22px;background:#ff8a3d}
@media(max-width:860px){.cta-band.has-quotes .cta-inner{grid-template-columns:1fr;gap:24px}}
@media (prefers-reduced-motion:reduce){.cq{transition:none}}
/* active filters = a tray that drops from under the search pill (owner 2026-10-17) */
.board .feedsearch{z-index:2}
.board .feedbar:has(.achip){position:relative;z-index:1;margin:-26px 22px 0;padding:34px 14px 10px;
  border-radius:0 0 22px 22px;border:1px solid rgba(10,11,15,.08);border-top:0;
  background:linear-gradient(180deg,#e9ebee,#f4f5f6);box-shadow:inset 0 -1px 0 #fff,0 8px 18px rgba(10,11,15,.06);
  transform-origin:top center;animation:tray-drop .32s cubic-bezier(.22,1,.36,1)}
@keyframes tray-drop{from{opacity:0;transform:translateY(-10px) scaleY(.9)}to{opacity:1;transform:none}}
.board .feedtop:has(.achip){padding-bottom:16px}
.board .feedbar:has(.achip) .areset{margin-left:4px}
@media(max-width:860px){.board .feedbar:has(.achip){margin:-24px 10px 0;padding:32px 10px 10px}}
@media (prefers-reduced-motion:reduce){.board .feedbar:has(.achip){animation:none}}
/* profile modal fixes (owner 2026-10-17): bottom padding back (non-sticky Save touched the edge);
   sticky action bar still sits flush to the bottom */
.hlt-modal:has(.hlt-phead){padding-bottom:28px!important}
.hlt-modal .hlt-actions.sticky{margin-bottom:-28px!important}
.hlt-modal .hlt-actions:not(.sticky){margin-top:22px}
/* segmented choices (alert frequency, visibility): brand pill switcher, normal case */
.hlt .hlt-seg{display:flex;gap:4px;padding:4px;border:0;border-radius:999px;background:rgba(10,11,15,.05)}
.hlt .hlt-seg label{flex:1;display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 16px;border-radius:999px;cursor:pointer;
  font:500 14px "Albert Sans",sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--mu);transition:background-color .18s ease,color .18s ease,box-shadow .18s ease}
.hlt .hlt-seg label.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(10,11,15,.08),0 0 0 1px rgba(10,11,15,.06)}
/* page behind a widget modal does not scroll */
html:has(.hlt-ov){overflow:hidden}
/* all six profile tabs fit the modal (no cut-off "Account") */
.hlt-tabs{overflow:visible!important}
.hlt-tabs button{flex:1 1 auto;justify-content:center;padding:0 8px!important;gap:5px!important;font-size:13px!important}
.hlt-tabs button .hlt-i{width:14px;height:14px}
@media(max-width:700px){.hlt-tabs{overflow-x:auto!important}.hlt-tabs button{flex:none}}
/* destructive action reads as one: light pill, red outline + text */
.hlt-modal .hlt-btn.danger{color:#b42318!important;border:1px solid rgba(180,35,24,.35)!important;background:#fff!important;
  box-shadow:0 2px 6px rgba(10,11,15,.05)!important}
.hlt-modal .hlt-btn.danger:hover{background:#fff5f4!important}
.hlt-modal .hlt-btn.danger .hlt-i{color:#b42318!important}
.board .feedbar:has(.achip){animation:none}
.board .feedbar.tray-new{animation:tray-drop .32s cubic-bezier(.22,1,.36,1)}
@media (prefers-reduced-motion:reduce){.board .feedbar.tray-new{animation:none}}
/* pull (owner 2026-10-17): the docked search + filters panel come DOWN, the list stays put */
.feed>:not(.feedtop):not(.pull-ring){transform:none!important}
#home-live .feedtop,#home-live .board .filters,#home-live.board .filters{transform:translateY(var(--pull,0px));transition:transform .6s cubic-bezier(.16,1,.3,1)}
#home-live.is-pulling .feedtop,#home-live.is-pulling .filters{transition:none}
/* tabs always fit the modal width: no horizontal scroll at any size */
.hlt-tabs{container-type:inline-size;overflow:hidden!important;flex-wrap:nowrap}
.hlt-tabs button{flex:1 1 auto;min-width:0}
@container (max-width:740px){.hlt-tabs button .hlt-i{display:none}.hlt-tabs button{padding:0 6px!important}}
@container (max-width:600px){.hlt-tabs button{font-size:12px!important;padding:0 4px!important}.hlt-tabs button .pct{display:none}}
@media(max-width:700px){.hlt-tabs{overflow:hidden!important}.hlt-tabs button{flex:1 1 auto}}
/* delete: graphite button like the rest, white text (owner 2026-10-17) */
.hlt-modal .hlt-btn.danger{color:#fff!important;border:1px solid #07080a!important;
  background:linear-gradient(180deg,#464a52 0%,#24272d 38%,#121418 70%,#0d0e11 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 8px 20px rgba(10,11,15,.22)!important}
.hlt-modal .hlt-btn.danger:hover{filter:brightness(1.08);background:linear-gradient(180deg,#464a52 0%,#24272d 38%,#121418 70%,#0d0e11 100%)!important}
.hlt-modal .hlt-btn.danger .hlt-i{color:#ff8a7a!important}
.fgroup-first{margin-top:0}
/* pull: everything on the board slides down together (owner 2026-10-17) */
.feed>:not(.feedtop):not(.pull-ring){transform:translateY(var(--pull,0px))!important}
/* floating "My profile" pill: redundant with the signed-in nav button (owner 2026-10-17) */
.hlt-pill{display:none!important}
/* modal entrance (owner 2026-10-17): backdrop fades + blurs in, card rises and scales with a soft spring;
   tab switches fade the new pane in */
.hlt-ov{animation:hlt-ov-in .35s ease both!important}
.hlt-modal{animation:hlt-card-in .5s cubic-bezier(.16,1,.3,1) both!important;transform-origin:50% 30%}
@keyframes hlt-ov-in{from{background-color:rgba(10,11,15,0);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}
@keyframes hlt-card-in{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
.hlt-tabs~div{animation:hlt-pane-in .32s cubic-bezier(.22,1,.36,1) both}
@keyframes hlt-pane-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:640px){@keyframes hlt-card-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}}
@media (prefers-reduced-motion:reduce){.hlt-ov,.hlt-modal,.hlt-tabs~div{animation:none!important}}
/* modal exit: the entrance in reverse, a little quicker (widget waits 280ms before removing) */
.hlt-ov.hlt-closing{animation:hlt-ov-out .22s ease both!important}
.hlt-ov.hlt-closing .hlt-modal{animation:hlt-card-out .2s cubic-bezier(.4,0,.6,1) both!important}
@keyframes hlt-ov-out{to{background-color:rgba(10,11,15,0);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}
@keyframes hlt-card-out{to{opacity:0;transform:translateY(10px) scale(.97)}}
@media (prefers-reduced-motion:reduce){.hlt-ov.hlt-closing,.hlt-ov.hlt-closing .hlt-modal{animation:none!important}}
/* live-search suggestions under the search pill */
.feedtop{position:sticky}
.fs-sugg{position:absolute;left:24px;right:24px;top:64px;z-index:30;display:grid;padding:6px;border-radius:20px;background:#fff;
  border:1px solid rgba(10,11,15,.08);box-shadow:0 18px 40px rgba(10,11,15,.16);animation:sugg-in .18s cubic-bezier(.22,1,.36,1)}
.fs-sugg[hidden]{display:none}
.fs-sugg button{display:grid;grid-template-columns:76px 1fr auto;align-items:center;gap:10px;height:42px;padding:0 14px;border:0;border-radius:14px;background:none;
  text-align:left;cursor:pointer;font:500 14px var(--font);color:var(--ink)}
.fs-sugg button:hover,.fs-sugg button.on{background:rgba(10,11,15,.05)}
.fs-sugg .g{font:500 10.5px "Red Hat Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.fs-sugg b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-sugg i{font:500 11px "Red Hat Mono",monospace;font-style:normal;color:var(--faint)}
@keyframes sugg-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media(max-width:860px){.fs-sugg{left:8px;right:8px;top:58px}}
.feedsearch input::-webkit-search-cancel-button{filter:grayscale(1) opacity(.45);cursor:pointer}
/* fade v7 (owner 2026-10-17 "flickers when scrolling fast"): JS masks lagged a frame behind compositor
   scrolling. Now a band moves WITH the sticky search and is painted with the SAME gradient as the
   lock-in ground, background-attachment:fixed, so it matches the page pixel for pixel; it fades out
   24px below the search (or the filter tray). */
.board .feedtop::before{display:block!important;content:"";position:absolute;left:-12px;right:-12px;top:-90px;bottom:-24px;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,#f2f3f3 0%,#dde1e2 24%,#b8c1c5 44%,#8e9ba1 56%,#4e5b62 68%,#1d262b 80%,#05090c 94%,#030507 100%) fixed;
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 24px),transparent);
  opacity:0;transition:opacity .9s cubic-bezier(.4,0,.2,1)}
.lock-in .board .feedtop::before{opacity:1}
.lock-in .board .feedtop{background:none!important}
.board .feed>*{-webkit-mask-image:none!important;mask-image:none!important}
/* a transform (even 0px) breaks background-attachment:fixed on the band: only transform while pulling */
#home-live .feedtop{transform:none}
#home-live.is-pulling .feedtop{transform:translateY(var(--pull,0px))}
/* band shows only while content is under the search; soft, short fade (owner 2026-10-17 "subtle") */
.board .feedtop::before{bottom:-16px!important;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 16px),transparent)!important;mask-image:linear-gradient(to bottom,#000 calc(100% - 16px),transparent)!important;transition:opacity .3s ease!important}
.lock-in .board .feedtop::before{opacity:0}
.lock-in.lock-under .board .feedtop::before{opacity:1}
.board .feedtop::before,.lock-in .board .feedtop::before{background:linear-gradient(180deg,#f2f3f3 0%,#dde1e2 24%,#b8c1c5 44%,#8e9ba1 56%,#4e5b62 68%,#1d262b 80%,#05090c 94%,#030507 100%) fixed!important}
.board .feedtop::before{height:auto!important}
/* pull without transform on the sticky search/filters (transform breaks the band's fixed gradient = box) */
#home-live.is-pulling .feedtop,#home-live .feedtop{transform:none!important}
#home-live .feedtop{transition:top .6s cubic-bezier(.16,1,.3,1)}
#home-live.is-pulling .feedtop{top:calc(84px + var(--pull,0px));transition:none}
#home-live .board .filters,#home-live.board .filters{transform:none!important;transition:top .6s cubic-bezier(.16,1,.3,1)}
#home-live.is-pulling .filters{top:calc(84px + var(--pull,0px))!important;transition:none}
/* band REMOVED for good (owner 2026-10-17): read as a box on real screens. Cards just pass under the
   solid search pill and navbar. */
.board .feedtop::before,.lock-in .board .feedtop::before,.lock-in.lock-under .board .feedtop::before{display:none!important}
/* navbar: solid when pinned (backdrop blur re-rendered every scroll frame), own layer so text AA never switches */
.navpill{transform:translateZ(0);-webkit-font-smoothing:antialiased}
.site-header.is-pinned .navpill::before{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:linear-gradient(180deg,#fff,#eff1f3)!important}
/* top strip: the ⌘K button inherits the strip's type so it sits on the same line as "Updated" */
.ts-r{display:inline-flex;align-items:center;margin-left:auto}
.topstrip .ts-k{font:inherit;line-height:1;letter-spacing:inherit;text-transform:inherit;background:none;border:0;border-left:1px solid rgba(255,255,255,.16);color:#c9ccd1;cursor:pointer;margin:0;height:auto;display:inline-flex;align-items:center}
.topstrip .ts-k:hover{color:#fff}
/* in-place swaps: no fade, no dim (read as flicker) */
#home-live .jlist{animation:none!important}
#home-live.is-loading,#home-live.is-loading .feed{opacity:1!important}

/* Spotlight carousel (owner 2026-10-17) */
.spot{display:block}
.spot-slides{position:relative;display:grid}
.spot-slide{grid-area:1/1;display:block;color:inherit;opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .45s ease,transform .5s cubic-bezier(.22,1,.36,1),visibility 0s .45s}
.spot-slide.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .45s ease,transform .5s cubic-bezier(.22,1,.36,1),visibility 0s}
.spot-slide .spot-cta{position:absolute;right:0;bottom:0}
.spot-bar{position:absolute;left:26px;right:26px;top:12px;z-index:3;display:flex;gap:6px}
.spot-bar button{flex:1;height:4px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.16);cursor:pointer;overflow:hidden;position:relative}
.spot-bar button::before{content:"";position:absolute;inset:-8px 0}
.spot-bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#ff8a3d,#ffb27a)}
.spot-bar button.is-done i{width:100%}
.spot-bar~.spot-slides{margin-top:6px}
@media (prefers-reduced-motion:reduce){.spot-slide{transition:none}}
/* OWNER RULE 2026-10-17: never a single word alone on the last line, anywhere */
h1,h2,h3,h4,.spot-t,.jr-t,.cq b,.to-h{text-wrap:balance}
p,li,blockquote,figcaption,dd,.muted,.con-sub{text-wrap:pretty}
.job-list~.spot,.spot+.job-list{margin-top:14px}
.page .spot,.wrap>.spot{margin-bottom:14px}
/* strip: no role tags (owner: count + See all roles says it); Hiring partner label */
.to-k{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#ffb27a}
.to-txt{gap:3px}
.to-cta{margin-left:auto}
/* carousel v2 (owner): slim white bar, slow crossfade without slide movement */
.spot-bar{top:14px;left:26px;right:auto;width:min(180px,40%);gap:4px}
.spot-bar button{height:2px;background:rgba(255,255,255,.22)}
.spot-bar i{background:#fff}
.spot-bar~.spot-slides{margin-top:4px}
.spot-slide{transform:none!important;transition:opacity .9s cubic-bezier(.4,0,.2,1),visibility 0s .9s!important}
.spot-slide.is-on{transition:opacity .9s cubic-bezier(.4,0,.2,1) .15s,visibility 0s!important}
.co-partner{display:inline-block;margin-bottom:6px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#c2410c}
.jd-head:has(.co-careers){display:flex;align-items:center;gap:18px}
.co-careers{margin-left:auto;flex:none}
@media(max-width:700px){.jd-head:has(.co-careers){flex-wrap:wrap}.co-careers{margin-left:0;width:100%}}
/* three plans (Hiring Partner, owner 2026-10-17) */
.pj-plans{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr) minmax(0,1fr);max-width:1180px}
.pj-partner-plan{padding-top:56px;overflow:hidden;background:linear-gradient(180deg,#2a2d33,#0d0e11);color:#fff;border-color:#06070a}
.pj-partner-plan .pj-flag{background:linear-gradient(90deg,#3a3d43,#24272d);color:#ffb27a}
.pj-partner-plan .pj-ps,.pj-partner-plan .pj-dur{color:#9aa0a8}
.pj-partner-plan .pj-pt,.pj-partner-plan .pj-price b,.pj-partner-plan ul{color:#fff}
.pj-partner-plan li::before{color:#ff8a3d}
.pj-partner-plan .pj-dot{top:58px}
.pj-partner{display:grid;gap:12px}
.pj-partner[hidden],[data-role-only][hidden]{display:none!important}
.pj-partner-note{margin:0;font-size:13.5px;color:var(--muted)}
@media(max-width:1100px){.pj-plans{grid-template-columns:1fr}}

/* /pricing (owner 2026-10-17) */
.pr-page{padding-top:40px;padding-bottom:20px}
.pr-page h1{font:600 52px/1.05 var(--display);letter-spacing:-.04em;margin:0 0 10px}
.pr-page .lead{max-width:640px;color:var(--muted);font-size:18px;margin:0 0 36px}
.pr-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.pr-plan{position:relative;display:flex;flex-direction:column;padding:30px 26px 26px;border-radius:22px;background:linear-gradient(180deg,#fafafa,#efeff1);border:1px solid rgba(10,11,15,.08);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(10,11,15,.04)}
.pr-hot{border:2px solid #ff6a1f;box-shadow:0 18px 40px -18px rgba(255,106,31,.35)}
.pr-dark{background:linear-gradient(180deg,#2a2d33,#0d0e11);color:#fff;border-color:#06070a}
.pr-flag{align-self:flex-start;margin-bottom:14px;padding:5px 10px;border-radius:999px;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,106,31,.12);color:#c2410c}
.pr-dark .pr-flag{background:rgba(255,255,255,.08);color:#ffb27a}
.pr-name{font:600 24px var(--display);letter-spacing:-.02em}
.pr-sub{margin-top:4px;font-size:14px;color:var(--muted)}
.pr-dark .pr-sub,.pr-dark .pr-price span{color:#9aa0a8}
.pr-price{display:flex;align-items:baseline;gap:8px;margin:20px 0 18px}
.pr-price b{font-size:46px;font-weight:600;letter-spacing:-.03em}
.pr-price span{font-size:14px;color:var(--muted)}
.pr-plan ul{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:10px;font-size:14px}
.pr-plan li{position:relative;padding-left:22px}
.pr-plan li::before{content:"✓";position:absolute;left:2px;color:#ff6a1f}
.pr-cta{margin-top:auto;justify-content:center}
.pr-quote{max-width:760px;margin:56px auto 8px;text-align:center}
.pr-quote blockquote{margin:0;font:500 22px/1.45 var(--display);letter-spacing:-.01em;color:var(--ink)}
.pr-quote figcaption{margin-top:12px;font:500 11px "Red Hat Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media(max-width:960px){.pr-plans{grid-template-columns:1fr}.pr-page h1{font-size:38px}}
.spot-bar{left:auto;right:26px}

/* Spotlight art pool (owner 2026-10-17): per-slide animated pieces. Stills move with CSS (float,
   tilt, spin) and a soft orange light sweeps across the metal (masked by the piece's own alpha). */
.spot-slide{position:static}
.spot{min-height:206px}
.sa{position:absolute;right:120px;top:50%;width:250px;height:250px;margin-top:-125px;pointer-events:none;z-index:0}
.sa img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 30px rgba(0,0,0,.45))}
.sa::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:linear-gradient(105deg,transparent 35%,rgba(255,150,70,.55) 50%,transparent 65%) no-repeat;background-size:250% 100%;
  -webkit-mask:var(--art) center/contain no-repeat;mask:var(--art) center/contain no-repeat;animation:sa-sweep 5.5s ease-in-out infinite}
.sa-coins{right:-30px;width:420px;height:auto;margin-top:0;transform:translateY(-50%)}
.sa-coins::after{content:none}
.sa-coins video{display:block;width:100%;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,rgba(0,0,0,.6) 60%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,rgba(0,0,0,.6) 60%,transparent 100%)}
.spot-in,.spot-slide .spot-cta{position:relative;z-index:1}
@keyframes sa-sweep{0%,15%{background-position:120% 0}60%,100%{background-position:-120% 0}}
@keyframes sa-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@keyframes sa-spin{to{transform:rotate(360deg)}}
@keyframes sa-tumble{0%,100%{transform:translateY(0) rotate(-6deg) scale(1)}50%{transform:translateY(-12px) rotate(5deg) scale(1.03)}}
@keyframes sa-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.sa-roulette img{animation:sa-float 7s ease-in-out infinite}
.sa-slots img{animation:sa-bob 4.5s ease-in-out infinite}
.sa-football img{animation:sa-spin 24s linear infinite}
.sa-football{animation:sa-bob 5s ease-in-out infinite}
.sa-chips img{animation:sa-bob 3.8s ease-in-out infinite}
.sa-dice img{animation:sa-tumble 6s ease-in-out infinite}
@media(max-width:860px){.sa{right:-30px;width:180px;height:180px;margin-top:-90px;opacity:.7}.sa-coins{width:300px;height:auto;margin-top:0}}
@media (prefers-reduced-motion:reduce){.sa img,.sa,.sa::after{animation:none!important}}
.spot .spot-slide .spot-cta{position:absolute;right:26px;bottom:26px;z-index:2}
.sa{right:200px;width:176px;height:176px;margin-top:-80px}
.sa-coins{right:-30px;width:420px;height:auto;margin-top:0}
@keyframes sa-flip{0%,100%{transform:perspective(600px) rotateY(-14deg) rotate(-4deg)}50%{transform:perspective(600px) rotateY(14deg) rotate(3deg) translateY(-6px)}}
.sa-card img{animation:sa-flip 6.5s ease-in-out infinite}
.sa-crown img{animation:sa-float 6s ease-in-out infinite}
.sa-headset img{animation:sa-bob 5s ease-in-out infinite}
/* strip art stronger (owner 2026-10-17 "too weak"): full brightness, larger, shorter fade */
.to-art{width:620px;opacity:1;filter:brightness(1.18) saturate(1.15);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 28%);mask-image:linear-gradient(90deg,transparent 0,#000 28%)}
.takeover{background:radial-gradient(55% 160% at 82% 50%,rgba(255,106,31,.32),transparent 62%),linear-gradient(180deg,#22252b,#0d0e11)}
@media(max-width:860px){.to-art{width:360px}}
/* 777 reels loop (Higgsfield MiniMax H3 Max, 2026-10-17): strip art + Spotlight pool */
.to-art{width:330px;right:200px;filter:brightness(1.12);-webkit-mask-image:radial-gradient(ellipse 48% 46% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 48% 46% at 50% 50%,#000 55%,transparent 100%)}
.sa-reels{right:150px;width:320px}
@media(max-width:860px){.to-art{width:220px;right:-20px}}
.to-art{width:210px;right:215px}
/* strip back to the coin stream (owner: background-style loop), strengthened */
.to-art{width:620px;right:0;filter:brightness(1.18) saturate(1.15);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 28%);mask-image:linear-gradient(90deg,transparent 0,#000 28%)}
@media(max-width:860px){.to-art{width:360px;right:0}}
/* chip stream mirrored + steeper so it reads differently from the coins */
.sa-chips video{transform:scaleX(-1) rotate(-14deg) scale(1.08)}
/* rain fills the frame edge to edge: soften its edges more; fan/ring are centred objects */
.sa-rain video{-webkit-mask-image:radial-gradient(ellipse 55% 55% at 55% 50%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse 55% 55% at 55% 50%,#000 30%,transparent 80%)}
.sa-fan,.sa-ring{right:60px;width:360px}
/* full-frame scatter loops share the chip-rain treatment (owner benchmark) */
.sa-cards video,.sa-rise video,.sa-drift video{-webkit-mask-image:radial-gradient(ellipse 55% 55% at 55% 50%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse 55% 55% at 55% 50%,#000 30%,transparent 80%)}
.sa-vortex video,.sa-burst video{-webkit-mask-image:radial-gradient(ellipse 55% 55% at 55% 50%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse 55% 55% at 55% 50%,#000 30%,transparent 80%)}
/* pinned rows (paid Featured + Hiring Partner pins): orange edge only, no label (owner 2026-10-17) */
/* the row skin above forces its shadow with !important, so the pin edge must too */
.jrow.jrow-pin,.jrow.jrow-pin:hover{background-color:#fff;box-shadow:inset 3px 0 0 #ff6a1f,inset 0 0 0 1px rgba(10,11,15,.07)!important}
/* /post v3 (owner 2026-10-17): proof + USPs + how it works up top, then plans, then a preview and form that follow the plan */
.pj-top{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;align-items:center;margin:0 0 18px}
.pj-top h1{font-family:var(--display);font-size:clamp(32px,3.6vw,44px);font-weight:600;letter-spacing:-.04em;line-height:1.05;margin:10px 0 10px}
.pj-top .lead{color:var(--muted);font-size:15px;line-height:1.55;margin:0 0 16px;max-width:520px}
.pj-usp{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pj-usp li{padding:10px 12px 10px 30px;position:relative;border-radius:12px;font-size:12px;line-height:1.4;color:var(--muted);background:rgba(255,255,255,.6);border:1px solid rgba(10,11,15,.07)}
.pj-usp li::before{content:"✓";position:absolute;left:12px;top:10px;color:#ff6a1f;font-weight:700}
.pj-usp b{display:block;font-size:13px;font-weight:600;color:var(--ink)}
.pj-top .pj-quotes-s{margin:0}
.pj-top .pj-tq{padding:22px 24px 20px;border-radius:20px;text-align:left}
.pj-top .pj-qm{height:26px;font-size:52px}
.pj-top .pj-tq blockquote{font-size:14px;line-height:1.6;margin:0 0 12px;max-width:none}
.pj-top .pj-tq figcaption{font-size:10.5px}
.pj-top .pj-tq-tabs{justify-content:flex-start;gap:6px;margin-top:10px}
.pj-top .pj-tq-tab{width:22px;height:6px;padding:0;border-radius:999px;border:0;background:rgba(10,11,15,.15)}
.pj-top .pj-tq-tab.is-on{background:#0a0b0f}
.pj-vis-form{margin-top:34px}
/* preview: each plan shows exactly where it lands */
.pj-prev-cap{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#c2410c;margin:0 2px}
.pj-prev-p,.pj-prev-pin,.pj-prev-cap-s,.pj-prev-cap-f,.pj-prev-cap-p{display:none}
.pj:has(input[name=plan][value=spotlight]:checked) .pj-prev-cap-s,.pj:has(input[name=plan][value=featured]:checked) .pj-prev-cap-f{display:block}
.pj:has(input[name=plan][value=partner]:checked) :is(.pj-prev-p,.pj-prev-pin,.pj-prev-cap-p){display:block}
.pj:has(input[name=plan][value=partner]:checked) :is(.pj-prev-s,.pj-prev-f){display:none}
.pj-prev-pin{display:none}
.pj:has(input[name=plan][value=partner]:checked) .pj-prev-pin{display:grid;gap:6px}
.pj-strip{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;color:#fff;
  background:radial-gradient(55% 160% at 82% 50%,rgba(255,106,31,.32),transparent 62%),linear-gradient(180deg,#22252b,#0d0e11)}
.pj-strip .to-logo{width:36px;height:36px;border-radius:10px;margin:0;display:grid;place-items:center;color:#0a0b0f;font:700 16px var(--display)}
.pj-strip .to-txt{display:grid;gap:2px;flex:1}
.pj-strip .to-h{font-size:15px}
.pj-strip-cta{font-size:12px;font-weight:600;padding:7px 12px;border-radius:999px;background:#fff;color:#0a0b0f}
.pj-prev-p .pj-prev-cap{margin-top:8px}
@media(max-width:860px){.pj-top{grid-template-columns:1fr}.pj-usp{grid-template-columns:1fr 1fr}}
@media(max-width:420px){.pj-usp{grid-template-columns:1fr}.pj-strip-cta{display:none}}
.pj-partner-plan:not(:has(input:checked)) .pj-pick{color:#e6e8eb;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
@media(max-width:640px){.pj-steps{grid-template-columns:1fr}}
/* /post ad preview (?adpreview=plan, in an iframe): the real page with ONLY the chosen plan's spot sharp,
   everything else, other ad spots included, blurred (owner 2026-10-17: "show just featured, blur everything out") */
.adpv body{pointer-events:none}
.adpv :is(.topstrip,.takeover,.navpill,.subnav,.con-head,.feedtop,.filters,.spot,.jrow,.console~*,footer){filter:blur(4px);opacity:.35;transition:filter .3s,opacity .3s}
.adpv-featured .jrow-feat[data-job-id^="adpv"],.adpv-spotlight .spot,.adpv-partner :is(.takeover,.jrow-partner[data-job-id^="adpv"]){filter:none;opacity:1;outline:3px solid #ff6a1f;outline-offset:3px;position:relative;z-index:2}
.adpv-featured .jrow-feat[data-job-id^="adpv"]::after,.adpv-spotlight .spot::after,.adpv-partner :is(.takeover,.jrow-partner[data-job-id^="adpv"]:first-child)::after{
  position:absolute!important;inset:auto!important;top:-11px!important;right:14px!important;left:auto!important;z-index:5;
  padding:5px 12px;border-radius:999px;font:600 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:#fff;background:#ff6a1f;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.adpv-featured .jrow-feat[data-job-id^="adpv"]::after{content:"Your Featured role · pinned on top"!important}
.adpv-spotlight .spot::after{content:"Your Spotlight · first on every listing";top:10px!important}
.adpv.adpv-partner .takeover.takeover::after{content:"Your company · strip on every page";top:auto!important;bottom:8px!important;left:50%!important;right:auto!important;transform:translateX(-50%)}
.adpv-partner .jrow-partner[data-job-id^="adpv"]:first-child::after{content:"Your pinned roles · up to 3"!important}
/* /post frame: the page at desktop width, scaled to fit */
.pj-frame{position:relative;overflow:hidden;border-radius:0 0 20px 20px;background:#e9e9eb;height:calc(1150px * var(--s,.68))}
.pj-frame iframe{position:absolute;top:0;left:0;width:1440px;height:1150px;border:0;transform:scale(var(--s,.68));transform-origin:0 0;pointer-events:none}
.to-rot>.takeover[hidden]{display:none}
.pj-prev-seg{pointer-events:auto;display:flex;width:max-content;max-width:100%;margin:16px auto 8px;overflow-x:auto}
.pj-prev-seg .seg-btn{border:0;font:inherit;cursor:pointer;white-space:nowrap}
.pj-prev-seg .seg-btn .mono{opacity:.6;margin-left:4px;font-size:.92em}
.pj-prev-note{text-align:center;color:var(--muted);font-size:13px;margin:0}
/* explainer card over the blurred hero of the ad preview: where the chosen plan shows up, in plain words */
.pj-win{position:relative}
.pj-expl{position:absolute;z-index:3;left:5%;top:calc(38px + 205px * var(--s,.68));width:min(400px,46%);padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.94);
  border:1px solid rgba(10,11,15,.08);box-shadow:0 18px 40px rgba(10,11,15,.16);font-size:13.5px;line-height:1.55;color:var(--muted);text-wrap:pretty;pointer-events:none}
.pj-expl b{display:block;margin-bottom:4px;font:600 15px/1.3 var(--display);color:var(--ink)}
@media(max-width:760px){.pj-expl{position:static;width:auto;margin:10px;box-shadow:none}}
/* plan switcher hangs off the bottom edge of the showcase window */
.pj-prev-seg{position:relative;z-index:4;margin:-24px auto 0;box-shadow:0 14px 30px rgba(10,11,15,.22)}
/* rows already carry their orange pinned edge: no extra preview ring on them (owner: "orange bit twice") */
.adpv .jrow[data-job-id^="adpv"]{outline:none!important}
/* testimonials: all quotes share one grid cell so the box is always as tall as the longest, no jump on rotate */
.pj-tq{display:grid}
.pj-tq-i{grid-area:1/1}
.pj-tq-i[hidden]{display:block;visibility:hidden}
/* plan switcher v2 (owner 2026-10-17 "make these nicer"): graphite track, selected = the brand's orange-glow button */
.pj-prev-seg{gap:4px;padding:5px;border-radius:999px;border:1px solid #06070a;
  background:linear-gradient(180deg,#2a2d33,#0d0e11);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 16px 34px rgba(10,11,15,.32)}
.pj-prev-seg .seg-btn{height:42px;padding:0 18px;border-radius:999px;background:transparent;color:#a6abb2;
  font:600 14px/1 var(--display);letter-spacing:-.01em;display:inline-flex;align-items:center;gap:8px;transition:color .2s,background .25s,box-shadow .25s}
.pj-prev-seg .seg-btn:hover{color:#fff;background:rgba(255,255,255,.06)}
.pj-prev-seg .seg-btn .mono{opacity:1;margin:0;font:500 12px/1 var(--mono);color:#6f747c}
.pj-prev-seg .seg-btn.is-on{color:#fff;background:radial-gradient(120% 160% at 100% 50%,#ff7a2a 0,#6a3a1c 26%,#1b1d22 55%,#121317 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px rgba(255,138,61,.35),0 8px 18px -6px rgba(255,106,31,.45)}
.pj-prev-seg .seg-btn.is-on .mono{color:#ffb27a}
@media(max-width:560px){.pj-prev-seg .seg-btn{height:38px;padding:0 12px;font-size:13px}.pj-prev-seg .seg-btn .mono{display:none}}
/* Telegram button hover: the generic .btn:hover dark border + white inset read as an outer ring on blue (owner 2026-10-17) */
.btn.btn-telegram:hover{border-color:transparent;filter:brightness(1.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 24px rgba(34,158,217,.32)}
/* /pricing v2 (owner 2026-10-17): thin bold hero, the /post testimonial card, centred FAQ */
.pr-hero{position:relative;overflow:hidden;isolation:isolate;margin:0 0 34px;padding:30px 36px 28px;border-radius:24px;color:#fff;border:1px solid #06070a;
  background:radial-gradient(55% 160% at 82% 50%,rgba(255,106,31,.30),transparent 62%),linear-gradient(180deg,#22252b,#0d0e11);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 24px 50px rgba(10,11,15,.18)}
.pr-hero-art{position:absolute;right:0;top:50%;width:520px;transform:translateY(-50%);mix-blend-mode:screen;opacity:.9;z-index:-1;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%)}
.pr-hero-k{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#ffb27a}
.pr-hero h1{font:600 clamp(32px,4.4vw,52px)/1.02 var(--display);letter-spacing:-.04em;margin:8px 0 8px;color:#fff;max-width:640px}
.pr-hero p{margin:0;max-width:520px;color:#b9bdc3;font-size:15.5px;line-height:1.5}
.pr-page .pj-quotes-s{margin:64px 0 0}
.pr-page .pj-quotes-s>h2,.pr-page .faq h2{text-align:center;font:600 clamp(24px,2.6vw,32px)/1.1 var(--display);letter-spacing:-.035em;margin:0 0 18px}
.pr-page .faq{margin:64px auto 30px;max-width:760px}
@media(max-width:640px){.pr-hero{padding:24px 20px}.pr-hero-art{width:300px;opacity:.5}}
@media (prefers-reduced-motion:reduce){.pr-hero-art{display:none}}
/* ad preview ~25% larger than the 1000px column (owner 2026-10-17), never wider than the screen */
.pj-prev .pj-win{width:min(1250px,calc(100vw - 32px));position:relative;left:50%;transform:translateX(-50%)}
.pj-page .pr-hero{margin-bottom:22px}
/* /post top after the /pricing merge: selling points fill the testimonial's height instead of floating mid-column */
.pj-top{align-items:stretch}
.pj-top-l{display:flex}
.pj-top-l .pj-usp{flex:1;grid-auto-rows:1fr}
.pj-top-l .pj-usp li{display:flex;flex-direction:column;justify-content:center;padding:14px 16px 14px 36px;font-size:13px}
.pj-top-l .pj-usp li::before{top:50%;transform:translateY(-50%);left:14px}
.pj-top-l .pj-usp b{font-size:15px;margin-bottom:2px}
/* phone: the carousel's desktop rule pinned Apply to the card corner, so it overflowed and covered the tags (owner screenshot 2026-10-18) */
@media(max-width:760px){.spot .spot-slide .spot-cta{position:relative;right:auto;bottom:auto;width:100%;margin-top:16px;justify-content:center}}
/* phones (owner 2026-10-18): background loops smaller and pushed to the right edge so the text sits on plain graphite */
@media(max-width:760px){
  .spot .sa{left:auto!important;right:-34px!important;top:18px!important;width:170px!important;height:170px!important;margin-top:0!important;transform:none!important;opacity:.85}
  .spot .sa video{width:100%;height:100%;object-fit:cover}
  .pr-hero-art{width:190px;right:-40px;top:20px;transform:none;opacity:.85}
  .pr-hero h1,.pr-hero p,.pr-hero-k{max-width:72%}
}
/* desktop hero: loop a touch smaller and further right so the subtitle never runs into it */
@media(min-width:761px){.pr-hero-art{width:440px;right:-40px}}
/* testimonial dots centred under the card (owner 2026-10-18) */
.pj-top .pj-tq-tabs{justify-content:center}
@media(max-width:760px){
  /* strip: coin loop small + far right, soft-edged, so the company line stays readable */
  .takeover .to-art{width:150px;right:-30px;opacity:.75;-webkit-mask-image:radial-gradient(closest-side,#000 40%,transparent 100%);mask-image:radial-gradient(closest-side,#000 40%,transparent 100%)}
  .to-txt{max-width:calc(100% - 90px)}
  /* hero loop: soft round edge instead of a hard square cut */
  .pr-hero-art{width:160px;right:-34px;top:14px;-webkit-mask-image:radial-gradient(closest-side,#000 45%,transparent 100%);mask-image:radial-gradient(closest-side,#000 45%,transparent 100%)}
  /* selling points stay a compact 2x2 on phones */
  .pj-top-l .pj-usp{grid-template-columns:1fr 1fr;gap:8px}
  .pj-top-l .pj-usp li{padding:12px 10px 12px 30px;font-size:11.5px}
  .pj-top-l .pj-usp li::before{left:11px}
  .pj-top-l .pj-usp b{font-size:13.5px}
}
/* Filters inside the search row on phones (owner 2026-10-18: the button floated over the list when locked) */
.feedsearch .m-filt{position:relative;flex:none;width:42px;height:42px;border-radius:50%;border:0;padding:0;align-items:center;justify-content:center;cursor:pointer;
  color:var(--ink);background:linear-gradient(180deg,#fff,#ececee);box-shadow:inset 0 0 0 1px rgba(10,11,15,.1),0 2px 6px rgba(10,11,15,.08);margin-left:0}
.feedsearch .m-filt[aria-expanded="true"]{color:#fff;background:#0a0b0f}
.feedsearch .m-filt b{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;padding:0 5px;display:grid;place-items:center;border-radius:999px;font-size:10px;background:#ff6a1f;color:#fff}
@media(max-width:760px){.feedsearch{gap:8px;padding:0 6px 0 16px}.feedsearch .seg-sort .seg-btn{padding:0 10px;font-size:13px}.feedbar:not(:has(.achip)){display:none}}
/* phones: no Newest / Top pay toggle (owner 2026-10-18); the search gets the room */
@media(max-width:760px){.feedsearch .seg-sort{display:none}}
.f-all{display:inline-block;margin-top:8px;font-size:12.5px;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
/* phones (owner 2026-10-18): hero cards keep the swipe layout, one card = exactly the search bar's width, auto-rotating */
@media(max-width:760px){
  .con-head .toprail{margin:0 4px;padding:0 0 4px;gap:12px;scroll-padding-inline:0}
  .toprail .tile{flex:0 0 100%}
}
/* phones: Spotlight art = a soft glow on the right edge, no hard square crop (owner 2026-10-18 "looks ass") */
@media(max-width:760px){
  .spot .sa{right:-70px!important;top:50%!important;width:250px!important;height:250px!important;transform:translateY(-50%)!important;opacity:.8;
    -webkit-mask-image:radial-gradient(closest-side,#000 30%,rgba(0,0,0,.55) 62%,transparent 100%);mask-image:radial-gradient(closest-side,#000 30%,rgba(0,0,0,.55) 62%,transparent 100%)}
  .spot .sa video{-webkit-mask-image:none;mask-image:none}
}
/* desktop hero cards (owner 2026-10-18 "these broke"): with 3 cards (Telegram on live) the old right-side reserve
   left ~500px for them. Let the card row run to the right edge, over the filter column's width. */
@media(min-width:1281px){
  .con-head{padding-right:0}
  .con-head .toprail{max-width:none;flex:1 1 auto}
  .toprail .tile h3 br{display:none}
}
.jl-end{display:flex;justify-content:center;padding:18px 0 6px}.jl-more{min-width:220px}
/* phones: one Apply only, the sticky bottom bar (owner 2026-10-18) */
@media(max-width:760px){.jv-pay .jd-actions{display:none}}

/* Mobile burger menu (owner 2026-10-20): replaces the pill row below 1100px; desktop unchanged */
.mnav{display:none;position:relative}
.mnav>summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:var(--surface,#fff);border:1px solid var(--line,#e1e4e7);color:#0a0b0f}
.mnav>summary::-webkit-details-marker{display:none}
.mnav[open]>summary{background:#0a0b0f;color:#fff;border-color:#0a0b0f}
.mnav-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:80;min-width:230px;display:flex;flex-direction:column;padding:8px;background:#fff;border:1px solid var(--line,#e1e4e7);border-radius:14px;box-shadow:0 14px 36px rgba(10,11,15,.16)}
.mnav-panel a{padding:12px 14px;border-radius:10px;color:#0a0b0f;font-size:15px;font-weight:500;text-decoration:none}
.mnav-panel a.on,.mnav-panel a:hover{background:#f1f4f6}
.mnav-panel hr{border:0;border-top:1px solid var(--line,#e1e4e7);margin:6px 4px}
.mnav-panel .btn-telegram{margin-top:6px;justify-content:center;color:#fff}
@media(max-width:1100px){.mnav{display:block}.subnav{display:none!important}}
@media(max-width:760px){.nav-actions .nav-post .price-chip{display:none}}
