/* Hire editors: visual editor cards with portfolio previews (public/directory.js). */
.egrid:has(.ecard.v2),.egrid:has(.ghost.v2){grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr));gap:16px}
.ecard.v2{cursor:pointer;padding:0;gap:0;overflow:hidden;border-radius:14px}
.ecard.v2.pri{background:var(--surface)}
.ehead{display:flex;gap:14px;align-items:flex-start;padding:16px 16px 14px;min-width:0}
.eav{display:block;position:relative;flex:none;background:none;border:0;padding:0;cursor:pointer;border-radius:50%;text-decoration:none;color:inherit}
.eav .mark{border-radius:50%}
.eav .sdot{position:absolute;right:1px;bottom:1px;width:13px;height:13px;border-radius:50%;border:2.5px solid var(--surface);background:var(--a1)}
.eav .sdot.g{background:var(--gold)}.eav .sdot.r{background:var(--danger)}
.eid{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ename{text-decoration:none;display:flex;align-items:center;gap:6px;min-width:0;max-width:100%;background:none;border:0;padding:0;cursor:pointer;color:inherit;text-align:left}
.ecard.v2 h3{font-size:18px;font-family:var(--f-display);font-weight:700;letter-spacing:-.01em}
.ename:hover h3{text-decoration:underline;text-underline-offset:3px}
.pstar{flex:none;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--gold);color:var(--surface);font-size:11px}
.erole{font-size:13.5px;color:var(--muted);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.eloc{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);margin-top:4px;min-width:0}
.eloc>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eact{display:flex;gap:6px;flex:none}
.eact .star{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:6px 11px;color:var(--ink)}
.eact .star.on{color:var(--gold)}

.estats{display:grid;grid-template-columns:repeat(3,1fr);margin:0 16px;border:1px solid var(--line);border-radius:10px;background:var(--sunk)}
.estats>div{padding:10px 8px;text-align:center;min-width:0}
.estats>div+div{border-left:1px solid var(--line)}
.estats b{display:block;font-family:var(--f-display);font-size:17px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.estats span{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.eport{margin:12px 16px 0;border:1px solid var(--line);border-radius:10px;padding:12px}
.eport-h{font-size:13px;font-weight:600;margin-bottom:10px}
.etags{padding:12px 16px 16px;flex-wrap:nowrap;overflow:hidden;mask-image:linear-gradient(90deg,#000 85%,transparent)}
.ecard.v2>.eport:last-child{margin-bottom:16px}

/* Work tiles: a real thumbnail when the platform gives one, otherwise a branded tile for that platform. */
.wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.wgrid.n1{grid-template-columns:1fr}.wgrid.n2{grid-template-columns:1fr 1fr}
.wgrid .wt{aspect-ratio:16/9}
.wgrid.n1 .wt{aspect-ratio:16/3}
.wgrid.n2 .wt{aspect-ratio:8/3}
.wgrid.n0{display:grid;place-items:center;height:84px;border:1px dashed var(--line);border-radius:8px;color:var(--muted);font-size:13px}
.wt{--h:220;position:relative;display:block;overflow:hidden;border-radius:8px;text-decoration:none;color:#fff;isolation:isolate;
  background:#232323;
  outline:1px solid rgba(255,255,255,.06);outline-offset:-1px;transition:transform .3s var(--ease,ease)}
.wt:hover{transform:scale(1.03)}
.wt:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.wt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;transition:transform .5s var(--ease,ease)}
.wt:hover img{transform:scale(1.06)}
.wt.has-img::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.35),transparent 40%,transparent 55%,rgba(0,0,0,.7))}
.wt-art{position:absolute;inset:0;display:grid;place-items:center;opacity:.9}
.wt-art svg{width:30%;max-width:44px;height:auto;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.wt.has-img .wt-art{display:none}
.wt-tag{position:absolute;left:6px;top:6px;display:inline-flex;align-items:center;gap:4px;max-width:calc(100% - 12px);padding:2px 7px 2px 5px;border-radius:999px;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);font-size:10.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wt-tag>span{overflow:hidden;text-overflow:ellipsis}
.wt-tag svg{width:12px;height:12px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wt-cap{position:absolute;left:7px;right:7px;bottom:5px;font-size:11.5px;font-weight:600;line-height:1.25;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.wt:not(.has-img) .wt-cap{color:rgba(255,255,255,.85)}
.wt-more{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.6);font-family:var(--f-display);font-size:20px;font-weight:700}
.k-yt{--h:355}.k-vm{--h:195}.k-tt{--h:320}.k-ig{--h:300}.k-xx{--h:220}.k-gd{--h:140}.k-be{--h:225}.k-fl{--h:260}.k-ws{--h:250}

/* Bigger grid in the profile modal. */
.wgrid.big{grid-template-columns:repeat(3,1fr)}
.wgrid.big .wt{aspect-ratio:16/9;height:auto}
.wgrid.big .wt-cap{font-size:12.5px}
@media (max-width:560px){.wgrid.big{grid-template-columns:1fr 1fr}}

.dirmore{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:22px}
.dircount{font-size:13px;color:var(--muted);margin:0 0 12px}

.ghost.v2{height:auto;border-radius:14px;gap:14px}
.ghost.v2 .row{gap:14px}
.ghost.v2 .gt{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ghost.v2 .gt i{height:auto;aspect-ratio:16/9;border-radius:8px}

@media (max-width:560px){
  .ehead{flex-wrap:wrap;padding:14px 14px 12px;gap:12px}
  .eact{width:100%}
  .eact .btn{flex:1;justify-content:center}
  .estats{margin:0 14px}.eport{margin:12px 14px 0;padding:10px}.etags{padding:12px 14px 14px}
  .estats b{font-size:15px}
  .wgrid:not(.big) .wt-tag{padding:3px}
  .wgrid:not(.big) .wt-tag>span{display:none}
  .wgrid:not(.big) .wt-cap{font-size:10.5px}
}
.ghost.v2 .gt i{background:#2b2b2b}
/* Pictures found later for tiles without a thumbnail (embeds.js fillTile): a channel avatar sits as a circle. */
.wt img.wt-av{inset:auto;left:50%;top:46%;width:auto;height:56%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;z-index:0;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 8px 24px rgba(0,0,0,.4)}
.wt:hover img.wt-av{transform:translate(-50%,-50%) scale(1.06)}
.wt.av::after{display:none}
.wt.has-img img:not(.wt-av){animation:wtFade .4s ease both}
@keyframes wtFade{from{opacity:0}}
/* Hire editors while the list loads: the card skeletons, gently pulsing */
.dirload .ghost i{animation:dirPulse 1.2s ease-in-out infinite alternate}
@keyframes dirPulse{from{opacity:1}to{opacity:.45}}
@media (prefers-reduced-motion:reduce){.dirload .ghost i{animation:none}}
/* Free plan: the Recruiter Pro card in the 6th slot, sized like an editor card. */
.ecard.v2.procta{cursor:default;background:var(--sunk);border-style:dashed}
.procta-in{flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:22px}
.procta-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.procta-avs{display:flex;align-items:center}
.procta-avs i,.procta-avs b{width:30px;height:30px;border-radius:50%;border:2px solid var(--sunk);margin-left:-8px;background:linear-gradient(135deg,#d9d6cf,#bdb9b0);filter:blur(1.5px)}
.procta-avs i:nth-child(2){background:linear-gradient(135deg,#cfd6d2,#a9b5ae)}
.procta-avs i:nth-child(3){background:linear-gradient(135deg,#d6cfd9,#b2a9b8)}
.procta-avs b{filter:none;width:auto;min-width:30px;padding:0 8px;display:grid;place-items:center;background:var(--ink);color:var(--surface);border-radius:999px;font-size:11.5px;font-weight:700}
.procta h3{font-size:21px;font-family:var(--f-display);font-weight:700;letter-spacing:-.01em;margin-top:4px}
.procta p{font-size:14px}
.procta-list{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:7px;font-size:14px}
.procta-list li{display:flex;align-items:center;gap:8px}
.procta-list svg{flex:none;color:var(--a1)}
.procta-btns{padding-top:10px;display:flex;flex-wrap:wrap;gap:8px}
@media (max-width:560px){.procta-in{padding:16px 14px}.procta-btns .btn{flex:1;justify-content:center}}
/* Free plan on the job board: the Premium prompt, the row after today's jobs. */
.job.prorow{cursor:default;background:var(--sunk);grid-template-columns:auto 1fr auto}
.job.prorow:hover{transform:none}
.job .promark{display:grid;place-items:center;background:var(--gold);color:var(--surface);font-size:18px}
.job.prorow .meta a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.job.prorow .meta b{color:var(--ink);font-weight:600}
@media (max-width:640px){.job.prorow{grid-template-columns:auto 1fr}.job.prorow .side .btn{width:100%;justify-content:center}}
