/* ============================================================
   Digital PR — "Obsidian & Signal"
   Dark by default. Sharp geometry, hairline rules, no drop shadows.
   Data is set in mono so metrics read like instrument output.
   ============================================================ */

:root{
  /* --- jade: the trust signal (actions, verified, positive data) --- */
  --signal:#1fb98a;
  --signal-dim:#17a077;
  --signal-deep:#0e5f47;
  --signal-wash:rgba(31,185,138,.11);
  --signal-glow:rgba(31,185,138,.22);

  /* --- champagne: the premium register (ratings, tiers, emphasis) --- */
  --gold:#d4af6a;
  --gold-dim:#b8945a;
  --gold-wash:rgba(212,175,106,.10);

  /* --- coral: attention, never decoration --- */
  --coral:#e2725b;
  --coral-wash:rgba(226,114,91,.12);
  --violet:#8b93c9;

  /* --- graphite canvas --- */
  --bg:#0a0b0d;
  --bg-2:#0f1113;
  --surface:#14161a;
  --surface-2:#1a1d22;
  --surface-3:#22262d;

  /* --- hairlines --- */
  --line:#24282f;
  --line-2:#333941;
  --line-bright:#454d59;

  /* --- type --- */
  --ink:#f2f4f7;
  --ink-2:#8b919c;
  --ink-3:#5d636e;
  --on-signal:#0a0b0d;

  --ok:#4ade80; --warn:#fbbf24; --bad:#ff6b4a;

  /* --- geometry: sharp, deliberate --- */
  --r:4px; --r-sm:2px; --r-lg:6px; --r-pill:2px;
  --hair:1px;
  --maxw:1280px; --gutter:20px; --header-h:68px;
  --ring:0 0 0 2px var(--bg), 0 0 0 4px var(--signal);

  --ff:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ff-display:"Space Grotesk","Inter",system-ui,sans-serif;
  --ff-num:"Space Grotesk","Inter",system-ui,sans-serif;   /* tabular figures */
  --ff-label:"Inter",system-ui,sans-serif;                 /* micro-labels */
}

/* Light theme: same structure, inverted canvas. The signal stays,
   but darkens so lime-on-white keeps its contrast. */
:root[data-theme="light"]{
  --signal:#0d7a5c; --signal-dim:#0a6349; --signal-deep:#a7d9c8;
  --signal-wash:rgba(13,122,92,.07); --signal-glow:rgba(13,122,92,.14);
  --gold:#9a7431; --gold-dim:#816027; --gold-wash:rgba(154,116,49,.08);
  --coral:#c04a33; --coral-wash:rgba(192,74,51,.09);
  --violet:#4c5389;

  --bg:#fafaf8; --bg-2:#f4f4f1; --surface:#ffffff;
  --surface-2:#f7f7f4; --surface-3:#eeeeea;
  --line:#e2e2dd; --line-2:#d0d0c9; --line-bright:#b5b5ad;
  --ink:#121417; --ink-2:#5a6069; --ink-3:#8a8f98;
  --on-signal:#ffffff;
  --ok:#15803d; --warn:#a16207; --bad:#c2410c;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--ff);font-size:15.5px;line-height:1.62;
  color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--ff-display);line-height:1.12;margin:0 0 .5em;letter-spacing:-.03em;font-weight:700}
h1{font-size:clamp(2.1rem,1.3rem + 3.2vw,3.6rem)}
h2{font-size:clamp(1.5rem,1.1rem + 1.9vw,2.35rem)}
h3{font-size:clamp(1.12rem,1rem + .6vw,1.4rem)}
p{margin:0 0 1em}
:focus-visible{outline:none;box-shadow:var(--ring)}
.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}
::selection{background:var(--signal);color:var(--on-signal)}

/* Numerals are data: one face, always tabular, so columns line up. */
.num,.metric__v,.price,.stat__n,.shs__n,.kv__v{font-family:var(--ff-num);
  font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1;letter-spacing:-.015em}

/* Micro-labels: uppercase, tracked out, quiet. */
.eyebrow,.metric__l,.kv__l,.stat__l,.shs__l,.dash-nav__group,.table th,.footer__col h4{
  font-family:var(--ff-label);font-size:.68rem;text-transform:uppercase;
  letter-spacing:.14em;font-weight:600;color:var(--ink-3)}

/* ---------- layout ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(52px,6.5vw,96px)}
.section--soft{background:var(--bg-2);border-block:var(--hair) solid var(--line)}
.grid{display:grid;gap:1px}
.icon{width:19px;height:19px;flex:none;stroke-width:1.6}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;border-radius:var(--r);border:var(--hair) solid transparent;
  font-family:var(--ff-display);font-weight:600;font-size:.9rem;letter-spacing:-.01em;
  cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .08s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--signal);color:var(--on-signal);border-color:var(--signal)}
.btn--primary:hover{background:var(--signal-dim);border-color:var(--signal-dim)}
.btn--ghost{background:transparent;border-color:var(--line-2);color:var(--ink)}
.btn--ghost:hover{border-color:var(--signal);color:var(--signal);background:var(--signal-wash)}
.btn--accent{background:var(--coral);color:#180703;border-color:var(--coral)}
.btn--link{background:none;border:0;padding:0;color:var(--signal);font-size:.86rem}
.btn--link:hover{text-decoration:underline;text-underline-offset:3px}
.btn--sm{padding:7px 13px;font-size:.82rem}
.btn--lg{padding:14px 26px;font-size:1rem}
.btn--block{width:100%}
.btn[disabled],.btn.is-busy{opacity:.45;pointer-events:none}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(12px);border-bottom:var(--hair) solid var(--line)}
.header__bar{display:flex;align-items:center;gap:20px;min-height:var(--header-h)}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--ff-display);
  font-weight:700;font-size:1.14rem;letter-spacing:-.045em;min-width:0}
.brand__glyph{width:30px;height:30px;color:var(--signal);flex:none}
.brand>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:24ch}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.brand{flex:none}
.nav a{white-space:nowrap;padding:8px 13px;border-radius:var(--r-sm);font-size:.89rem;font-weight:500;color:var(--ink-2);transition:.14s}
.nav a:hover,.nav .current-menu-item>a{color:var(--signal);background:var(--signal-wash)}
.header__actions{display:flex;align-items:center;gap:8px}
.icon-btn{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--r);
  background:transparent;border:var(--hair) solid var(--line-2);cursor:pointer;color:var(--ink-2);transition:.14s}
.icon-btn:hover{color:var(--signal);border-color:var(--signal)}
/* The toggle shows the theme you would switch TO. */
.theme-toggle{position:relative}
.theme-toggle .icon{grid-area:1/1}
:root[data-theme="dark"] .icon--moon,
:root[data-theme="light"] .icon--sun{display:none}
.balance-chip{font-family:var(--ff-label);font-size:.82rem;font-weight:600;
  padding:8px 13px;border-radius:var(--r);border:var(--hair) solid var(--signal);
  color:var(--signal);background:var(--signal-wash);font-variant-numeric:tabular-nums}
.balance-chip:hover{background:var(--signal);color:var(--on-signal)}
.nav-toggle{display:none}
@media (max-width:1180px){
  .nav{position:fixed;inset:var(--header-h) 0 auto 0;flex-direction:column;align-items:stretch;
    background:var(--bg);border-bottom:var(--hair) solid var(--line);padding:8px var(--gutter) 20px;
    transform:translateY(-130%);transition:transform .26s cubic-bezier(.4,0,.2,1)}
  .nav.is-open{transform:none}
  .nav a{padding:13px 10px;font-size:.98rem;border-bottom:var(--hair) solid var(--line)}
  .nav-toggle{display:grid}
  .header__actions{margin-left:auto}
  .header__actions .btn--ghost{display:none}
}
@media (max-width:620px){
  :root{--header-h:60px;--gutter:16px}
  /* Sort control owns its own row rather than squeezing beside the count. */
  .market__head>label{margin-left:0 !important;width:100%}
  .market__head .select{width:100%}
  .brand{font-size:1rem}
  .brand>span{max-width:10ch}
  .brand__glyph{width:26px;height:26px}
  #theme-toggle{width:34px;height:34px}
  .header__actions{gap:6px}
  .header__actions .btn{padding:7px 11px;font-size:.8rem}
}
/* Below this the wordmark would only ever truncate, so the glyph stands alone. */
@media (max-width:400px){
  .brand>span{display:none}
  .balance-chip{padding:7px 10px;font-size:.78rem}
}
/* A separator is only a separator when something follows it on the same line. */
.card__meta .sep{color:var(--line-bright)}
@media (max-width:420px){.card__meta .sep{display:none}}

/* Square signal tile used for step / benefit icons. */
.tile-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r-sm);
  border:var(--hair) solid var(--line-2);background:var(--surface);color:var(--signal)}
.tile-icon svg{width:19px;height:19px}

/* ---------- hero ---------- */
.hero{position:relative;padding-block:clamp(56px,7vw,110px);overflow:hidden;border-bottom:var(--hair) solid var(--line)}
/* Faint signal grid — the terminal substrate. */
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--line) var(--hair),transparent var(--hair)),
                   linear-gradient(90deg,var(--line) var(--hair),transparent var(--hair));
  background-size:64px 64px;
  -webkit-mask:radial-gradient(760px 420px at 18% 8%,#000,transparent 72%);
  mask:radial-gradient(760px 420px at 18% 8%,#000,transparent 72%);opacity:.7}
.hero::after{content:"";position:absolute;top:-30%;right:-8%;width:52vw;height:52vw;max-width:680px;max-height:680px;
  pointer-events:none;border-radius:50%;
  background:radial-gradient(circle,var(--signal-wash),transparent 62%)}
.hero__inner{position:relative;display:grid;grid-template-columns:1.08fr .92fr;gap:54px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:5px 11px;border-radius:var(--r-sm);
  border:var(--hair) solid var(--line-2);color:var(--signal);background:var(--signal-wash)}
.eyebrow svg{width:14px;height:14px}
.hero h1{margin:20px 0 16px}
.hero h1 em{font-style:normal;color:var(--signal)}
.hero__lead{font-size:clamp(1rem,.95rem + .35vw,1.14rem);color:var(--ink-2);max-width:54ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.hero__trust{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:30px;padding-top:22px;border-top:var(--hair) solid var(--line)}
.trust__item{display:flex;align-items:center;gap:8px;font-size:.86rem;color:var(--ink-2)}
.trust__item svg{color:var(--signal);width:15px;height:15px}
@media (max-width:920px){.hero__inner{grid-template-columns:1fr;gap:40px}}

/* ---------- search ---------- */
.searchbar{display:flex;align-items:center;gap:10px;background:var(--surface);
  border:var(--hair) solid var(--line-2);border-radius:var(--r);padding:6px 6px 6px 16px;max-width:620px;transition:border-color .15s}
.searchbar:focus-within{border-color:var(--signal)}
.searchbar input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:.96rem;padding:10px 0}
.searchbar input::placeholder{color:var(--ink-3)}
.searchbar>svg{color:var(--ink-3);width:18px;height:18px}
@media (max-width:560px){.searchbar{flex-wrap:wrap;padding:12px}.searchbar .btn{width:100%}}

/* ---------- stats: hairline-joined cells, not floating cards ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--hair);
  background:var(--line);border:var(--hair) solid var(--line)}
.stat{background:var(--bg);padding:20px 18px}
.stat__n{font-size:clamp(1.65rem,1.2rem + 1.5vw,2.25rem);font-weight:600;letter-spacing:-.04em;color:var(--signal);line-height:1}
.stat__l{margin-top:7px}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}

/* ---------- listing card ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(288px,1fr));gap:var(--hair);
  background:var(--line);border:var(--hair) solid var(--line)}
.card{background:var(--bg);padding:20px;display:flex;flex-direction:column;gap:15px;
  position:relative;transition:background .15s}
.card::after{content:"";position:absolute;left:0;top:0;width:2px;height:100%;background:var(--signal);
  transform:scaleY(0);transform-origin:top;transition:transform .2s ease}
.card:hover{background:var(--surface)}
.card:hover::after{transform:scaleY(1)}
.card__top{display:flex;align-items:flex-start;gap:12px}
/* Listing identity: an uploaded logo, or a deterministic monogram.
   Both occupy the same box so cards never reflow. */
.card__logo,.card__monogram{width:38px;height:38px;flex:none;border-radius:var(--r-sm);
  border:var(--hair) solid var(--line-2);background:var(--surface-2);
  display:grid;place-items:center;overflow:hidden}
.card__logo{object-fit:cover}
.card__monogram{font-family:var(--ff-display);font-weight:700;font-size:1rem;
  color:hsl(var(--mono-hue,160) 52% 62%);
  background:hsl(var(--mono-hue,160) 38% 12%);
  border-color:hsl(var(--mono-hue,160) 34% 22%)}
:root[data-theme="light"] .card__monogram{
  color:hsl(var(--mono-hue,160) 58% 28%);
  background:hsl(var(--mono-hue,160) 44% 95%);
  border-color:hsl(var(--mono-hue,160) 34% 84%)}
/* Larger variant on the listing page. */
.listing .card__logo,.listing .card__monogram{width:54px;height:54px;font-size:1.4rem;border-radius:var(--r)}

.card__name{font-family:var(--ff-display);font-weight:600;font-size:1rem;line-height:1.28;
  letter-spacing:-.02em;word-break:break-word;margin:0}
.card__name a::after{content:"";position:absolute;inset:0}
.card:hover .card__name{color:var(--signal)}
.card__meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.78rem;color:var(--ink-3);margin-top:3px}

.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:var(--r-sm);
  font-family:var(--ff-label);font-size:.64rem;text-transform:uppercase;letter-spacing:.09em;font-weight:600;
  border:var(--hair) solid var(--line-2);color:var(--ink-2);background:transparent}
.badge--verified{border-color:var(--gold-dim);color:var(--gold);background:var(--gold-wash)}
.badge--hot{border-color:var(--coral);color:var(--coral);background:var(--coral-wash)}
.badge svg{width:12px;height:12px}

/* Metric strip: instrument readout, divided by hairlines. */
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--hair);
  background:var(--line);border:var(--hair) solid var(--line)}
.metric{background:var(--surface);padding:9px 6px;text-align:center}
.metric__v{font-size:1rem;font-weight:600;line-height:1.15;letter-spacing:-.02em;color:var(--ink)}
.metric__v.is-high{color:var(--signal)}
.metric__v.is-mid{color:var(--ink)}
.metric__v.is-low{color:var(--ink-3)}
.metric__v.is-unknown{color:var(--line-bright);font-weight:400}
.metric__l{margin-top:3px;font-size:.6rem;letter-spacing:.1em}

.card__tags{display:flex;flex-wrap:wrap;gap:5px}
.tag{font-size:.72rem;padding:2px 8px;border-radius:var(--r-sm);
  border:var(--hair) solid var(--line);color:var(--ink-2);background:var(--surface-2)}
.card__foot{margin-top:auto;padding-top:14px;border-top:var(--hair) solid var(--line);
  display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.price{font-size:1.28rem;font-weight:600;letter-spacing:-.035em;color:var(--ink)}
.price small{display:block;font-family:var(--ff);font-size:.72rem;font-weight:400;color:var(--ink-3);letter-spacing:0;margin-top:2px}

/* ---------- rating ---------- */
.stars{display:inline-flex;gap:1px;vertical-align:middle}
.star{width:12px;height:12px;background:var(--line-bright);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 3 6.6 7.2 1-5.2 5 1.2 7.1L12 18.3 5.8 21.7 7 14.6 1.8 9.6 9 8.6z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 3 6.6 7.2 1-5.2 5 1.2 7.1L12 18.3 5.8 21.7 7 14.6 1.8 9.6 9 8.6z'/%3E%3C/svg%3E") center/contain no-repeat}
.star--full{background:var(--gold)}
.star--half{background:linear-gradient(90deg,var(--gold) 50%,var(--line-bright) 50%)}
.stars__count{font-family:var(--ff-label);font-size:.74rem;color:var(--ink-2);margin-left:5px}
.stars__count span{color:var(--ink-3)}

/* ---------- marketplace ---------- */
.market{display:grid;grid-template-columns:272px 1fr;gap:26px;align-items:start}
.filters{position:sticky;top:calc(var(--header-h) + 14px);background:var(--bg-2);
  border:var(--hair) solid var(--line);border-radius:var(--r);padding:4px 18px 18px;
  max-height:calc(100vh - var(--header-h) - 28px);overflow-y:auto;scrollbar-width:thin}
.filter{padding-block:15px;border-bottom:var(--hair) solid var(--line)}
.filter:last-of-type{border-bottom:0}
.filter__h{display:flex;align-items:center;justify-content:space-between;width:100%;
  background:none;border:0;padding:0;cursor:pointer;color:var(--ink);
  font-family:var(--ff-label);font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;font-weight:600}
.filter__h:hover{color:var(--signal)}
.filter__h svg{width:14px;height:14px;transition:transform .18s;color:var(--ink-3)}
.filter__h[aria-expanded="true"] svg{transform:rotate(90deg)}
.filter__body{margin-top:11px;display:grid;gap:7px}
.filter__h[aria-expanded="false"]+.filter__body{display:none}
.range{display:flex;align-items:center;gap:6px}
.range input,.filter__body>input[type="search"]{width:100%;min-width:0;padding:8px 10px;
  border:var(--hair) solid var(--line-2);border-radius:var(--r-sm);background:var(--bg);
  outline:none;font-family:var(--ff-label);font-size:.82rem;transition:border-color .14s}
.range input:focus,.filter__body>input[type="search"]:focus{border-color:var(--signal)}
.range span{color:var(--ink-3);font-family:var(--ff-label)}
.check{display:flex;align-items:center;gap:9px;font-size:.86rem;color:var(--ink-2);cursor:pointer}
.check input{width:15px;height:15px;accent-color:var(--signal);cursor:pointer;flex:none}
.check:hover{color:var(--ink)}
.check span{flex:1;min-width:0}
.check__n{font-style:normal;font-family:var(--ff-num);font-size:.72rem;color:var(--ink-3);font-variant-numeric:tabular-nums}
.filter__body--scroll{max-height:236px;overflow-y:auto;padding-right:6px;scrollbar-width:thin}

.market__head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding-bottom:14px;margin-bottom:0;border-bottom:var(--hair) solid var(--line)}
.market__count{font-family:var(--ff-label);font-size:.8rem;color:var(--ink-3);letter-spacing:.02em}
.market__count b{color:var(--signal);font-weight:600}
.select{padding:8px 12px;border:var(--hair) solid var(--line-2);border-radius:var(--r-sm);
  background:var(--bg);color:var(--ink);cursor:pointer;outline:none;font-size:.85rem}
.select:focus{border-color:var(--signal)}
.filters-toggle{display:none}
.filters__close{display:none;position:absolute;top:12px;right:12px}
@media (max-width:1060px){
  .market{grid-template-columns:1fr}
  .filters{position:fixed;inset:0;z-index:80;max-height:100vh;border-radius:0;border:0;
    padding:56px 20px 28px;transform:translateX(-102%);transition:transform .28s cubic-bezier(.4,0,.2,1);background:var(--bg)}
  .filters.is-open{transform:none}
  .filters-toggle{display:inline-flex}
  .filters__close{display:grid}
}
.is-loading{opacity:.3;pointer-events:none;transition:opacity .15s}

/* ---------- panels ---------- */
.panel{background:var(--bg-2);border:var(--hair) solid var(--line);border-radius:var(--r);padding:24px}
.panel+.panel{margin-top:var(--hair)}
.listing{display:grid;grid-template-columns:1fr 364px;gap:26px;align-items:start}
.buybox{position:sticky;top:calc(var(--header-h) + 14px)}
@media (max-width:1000px){.listing{grid-template-columns:1fr}.buybox{position:static}}

.svc{display:block;position:relative;border:var(--hair) solid var(--line-2);border-radius:var(--r);
  padding:13px;cursor:pointer;transition:border-color .14s,background .14s}
.svc:hover{border-color:var(--line-bright)}
.svc input{position:absolute;opacity:0;pointer-events:none}
.svc:has(input:checked){border-color:var(--signal);background:var(--signal-wash)}
.svc__row{display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-family:var(--ff-display);font-weight:600;font-size:.92rem}
.svc__row strong{font-family:var(--ff-label);color:var(--signal);font-weight:600}
.svc__desc{display:block;font-size:.8rem;color:var(--ink-3);margin-top:4px;line-height:1.45}

.field{display:grid;gap:5px;margin-bottom:13px}
.field label{font-family:var(--ff-label);font-size:.68rem;text-transform:uppercase;
  letter-spacing:.11em;font-weight:600;color:var(--ink-3)}
.field input,.field textarea,.field select{width:100%;padding:10px 12px;
  border:var(--hair) solid var(--line-2);border-radius:var(--r-sm);background:var(--bg);
  outline:none;font-size:.9rem;transition:border-color .14s}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--signal)}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-3)}
.field textarea{min-height:98px;resize:vertical}
.field select[multiple]{padding:6px}

.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--hair);
  background:var(--line);border:var(--hair) solid var(--line)}
.kv__item{background:var(--bg);padding:13px 14px}
.kv__v{font-size:1.05rem;font-weight:600;margin-top:4px;letter-spacing:-.02em}
/* Inside a form, .kv is a plain grid, not a hairline table. */
form .kv{background:none;border:0;gap:14px}
form .kv .field{background:none;padding:0}

/* ---------- seller profile ---------- */
.seller-hero{position:relative;overflow:hidden;background:var(--bg-2);
  border:var(--hair) solid var(--line);border-radius:var(--r);padding:30px;
  display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.seller-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(90deg,var(--line) var(--hair),transparent var(--hair));
  background-size:48px 48px;
  -webkit-mask:linear-gradient(90deg,transparent 40%,#000);mask:linear-gradient(90deg,transparent 40%,#000);opacity:.6}
.seller-hero>*{position:relative}
.seller-hero__avatar{width:92px;height:92px;border-radius:var(--r);border:var(--hair) solid var(--line-2);
  flex:none;overflow:hidden;background:var(--surface)}
.seller-hero__avatar img{width:100%;height:100%;object-fit:cover}
.seller-hero__body{flex:1;min-width:230px}
.seller-hero__stats{display:flex;gap:28px;flex-wrap:wrap;margin-top:16px;padding-top:16px;border-top:var(--hair) solid var(--line)}
.shs__n{font-size:1.24rem;font-weight:600;color:var(--signal);letter-spacing:-.03em}
.shs__l{margin-top:2px}

/* ---------- dashboard ---------- */
.dash{display:grid;grid-template-columns:232px 1fr;gap:24px;align-items:start}
.dash-nav{background:var(--bg-2);border:var(--hair) solid var(--line);border-radius:var(--r);
  padding:6px;position:sticky;top:calc(var(--header-h) + 14px)}
.dash-nav__group{padding:14px 11px 6px}
.dash-nav a{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:var(--r-sm);
  color:var(--ink-2);font-size:.88rem;font-weight:500;transition:.14s;position:relative}
.dash-nav a:hover{background:var(--surface);color:var(--ink)}
.dash-nav a.is-active{background:var(--signal-wash);color:var(--signal)}
.dash-nav a.is-active::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:2px;background:var(--signal)}
.dash-nav svg{width:16px;height:16px;color:currentColor;opacity:.8}
@media (max-width:920px){
  .dash{grid-template-columns:1fr}
  .dash-nav{position:static;display:flex;gap:4px;overflow-x:auto;padding:6px;scrollbar-width:none}
  .dash-nav::-webkit-scrollbar{display:none}
  .dash-nav__group{display:none}
  .dash-nav a{white-space:nowrap}
  .dash-nav a.is-active::before{inset:auto 6px 0 6px;width:auto;height:2px;top:auto}
}

/* ---------- tables ---------- */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table{width:100%;border-collapse:collapse;min-width:660px}
.table th{text-align:left;padding:10px 14px;border-bottom:var(--hair) solid var(--line-2);white-space:nowrap}
.table td{padding:13px 14px;border-bottom:var(--hair) solid var(--line);font-size:.88rem;vertical-align:middle}
.table tr:last-child td{border-bottom:0}
.table tbody tr:hover{background:var(--surface)}
.table td strong{font-weight:600}

.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:var(--r-sm);
  font-family:var(--ff-label);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;
  font-weight:600;border:var(--hair) solid currentColor}
.pill::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.pill--pending{color:var(--warn)}
.pill--accepted,.pill--delivered{color:var(--violet)}
.pill--completed{color:var(--signal)}
.pill--revision{color:var(--warn)}
.pill--cancelled,.pill--disputed{color:var(--bad)}

/* ---------- content pages ---------- */
.steps{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:var(--hair);background:var(--line);border:var(--hair) solid var(--line)}
.step{display:grid;grid-template-columns:auto auto 1fr;gap:18px;align-items:start;background:var(--bg);padding:22px}
.section--soft .step{background:var(--bg-2)}
.step__n{font-size:.85rem;color:var(--ink-3);padding-top:10px;min-width:2ch}
.step h3{font-size:1.08rem;margin:6px 0 4px}
.step p{margin:0;color:var(--ink-2);max-width:64ch}
@media (max-width:560px){.step{grid-template-columns:auto 1fr}.step__n{display:none}}

.faq{border-top:var(--hair) solid var(--line);margin-top:20px}
.faq details{border-bottom:var(--hair) solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 34px 18px 0;position:relative;
  font-family:var(--ff-display);font-weight:600;font-size:1.02rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:14px;font-size:1.4rem;color:var(--signal);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 18px;color:var(--ink-2);max-width:68ch}

.plans{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--hair);background:var(--line);border:var(--hair) solid var(--line);max-width:900px}
.plan{background:var(--bg);padding:32px;display:flex;flex-direction:column}
.plan--featured{background:var(--bg-2);box-shadow:inset 0 2px 0 var(--signal)}
.plan__price{font-size:clamp(2.6rem,2rem + 2vw,3.6rem);font-weight:700;letter-spacing:-.05em;color:var(--signal);line-height:1;margin-top:14px}
.plan__sub{color:var(--ink-2);margin:6px 0 22px}
.plan__list{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:11px;flex:1}
.plan__list li{display:flex;gap:10px;align-items:flex-start;color:var(--ink-2);font-size:.93rem}
.plan__list svg{width:16px;height:16px;color:var(--signal);margin-top:3px}
.plans__note{margin-top:22px;color:var(--ink-3);font-size:.9rem}
@media (max-width:720px){.plans{grid-template-columns:1fr}}

.contact{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media (max-width:860px){.contact{grid-template-columns:1fr;gap:28px}}

/* ---------- top publishers leaderboard ---------- */
.leaderboard{border:var(--hair) solid var(--line);background:var(--line);display:grid;gap:var(--hair)}
.lb-row{display:grid;grid-template-columns:44px minmax(180px,1.6fr) repeat(4,minmax(90px,1fr)) 120px 128px;
  align-items:center;gap:12px;background:var(--bg);padding:14px 18px;transition:background .15s}
.lb-row:not(.lb-head):hover{background:var(--surface)}
.lb-head{background:var(--bg-2);padding-block:12px}
.lb-head span{font-family:var(--ff-label);font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;font-weight:600;color:var(--ink-3)}
.lb-rank{color:var(--ink-3);font-size:.85rem}
.lb-row:nth-child(2) .lb-rank,.lb-row:nth-child(3) .lb-rank,.lb-row:nth-child(4) .lb-rank{color:var(--gold);font-weight:700}
.lb-name{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.lb-name a{font-family:var(--ff-display);font-weight:600;font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-name a:hover{color:var(--signal)}
.lb-save{flex:none;width:30px;height:30px;display:grid;place-items:center;border:0;background:none;cursor:pointer;border-radius:var(--r-sm)}
.lb-save svg{width:18px;height:18px;fill:none;stroke:var(--coral);stroke-width:1.8;transition:fill .15s,transform .15s}
.lb-save:hover svg{transform:scale(1.12)}
.lb-save.is-saved svg{fill:var(--coral)}
.lb-cell{font-size:1rem;color:var(--ink)}
.lb-strong{font-weight:700;color:var(--signal)}
.lb-rate{position:relative;color:var(--gold);font-weight:600;padding-bottom:6px}
.lb-rate small{font-size:.75em;margin-left:1px}
.lb-bar{position:absolute;left:0;bottom:0;height:2px;width:56px;background:var(--line-2)}
.lb-bar::after{content:"";position:absolute;inset:0;width:var(--p);background:var(--gold)}
.lb-date{font-size:.86rem;color:var(--ink-2)}
.lb-action{text-align:right}
@media (max-width:1060px){
  .leaderboard{background:none;border:0;gap:10px}
  .lb-head{display:none}
  .lb-row{grid-template-columns:repeat(3,1fr);gap:14px 12px;border:var(--hair) solid var(--line);border-radius:var(--r);padding:16px}
  .lb-rank{position:absolute;opacity:0;pointer-events:none}
  .lb-name{grid-column:1/-1;padding-bottom:12px;border-bottom:var(--hair) solid var(--line)}
  .lb-cell{display:flex;flex-direction:column;gap:3px}
  .lb-cell::before{content:attr(data-label);font-family:var(--ff-label);font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);font-weight:600}
  .lb-rate{padding-bottom:0}.lb-bar{display:none}
  .lb-action{grid-column:1/-1;text-align:left}
  .lb-action .btn{width:100%}
}

/* ---------- order row controls ---------- */
.order-actions,.review-form{display:grid;gap:6px;min-width:220px}
.order-buttons{display:flex;gap:6px;flex-wrap:wrap}
.order-input{width:100%;padding:7px 10px;border:var(--hair) solid var(--line-2);border-radius:var(--r-sm);
  background:var(--bg);font-size:.8rem;outline:none}
.order-input:focus{border-color:var(--signal)}
.order-input.is-invalid{border-color:var(--bad);box-shadow:0 0 0 2px var(--coral-wash)}
.order-live{display:inline-flex;align-items:center;gap:5px;margin-top:5px;font-size:.78rem;color:var(--signal)}
.order-live .icon{width:13px;height:13px}
.order-live:hover{text-decoration:underline}
.order-note{margin-top:5px;padding:6px 8px;font-size:.76rem;color:var(--warn);background:var(--coral-wash);border-left:2px solid var(--warn)}

/* ---------- misc ---------- */
.notice{padding:11px 14px;border-radius:var(--r-sm);font-size:.88rem;margin-bottom:14px;
  display:none;border:var(--hair) solid currentColor}
.notice.is-visible{display:block}
.notice--ok{color:var(--signal);background:var(--signal-wash)}
.notice--err{color:var(--bad);background:var(--coral-wash)}

.empty{grid-column:1/-1;text-align:center;padding:64px 20px;color:var(--ink-2);background:var(--bg)}
.empty svg{width:40px;height:40px;color:var(--ink-3);margin:0 auto 14px;stroke-width:1.3}
.empty h2,.empty h3{color:var(--ink)}

.pagination{display:flex;justify-content:center;gap:var(--hair);margin-top:28px;flex-wrap:wrap}
.pagination a,.pagination span{min-width:38px;height:38px;display:grid;place-items:center;padding:0 11px;
  border:var(--hair) solid var(--line);background:var(--bg-2);
  font-family:var(--ff-label);font-size:.82rem;color:var(--ink-2)}
.pagination a:hover{border-color:var(--signal);color:var(--signal)}
.pagination .current{background:var(--signal);color:var(--on-signal);border-color:var(--signal)}

/* Breadcrumb */
.crumbs{font-family:var(--ff-label);font-size:.74rem;color:var(--ink-3);margin-bottom:18px;letter-spacing:.02em}
.crumbs a:hover{color:var(--signal)}

/* ---------- footer ---------- */
.site-footer{background:var(--bg-2);border-top:var(--hair) solid var(--line);padding-block:52px 24px;margin-top:64px}
.footer__grid{display:grid;grid-template-columns:1.7fr repeat(3,1fr);gap:34px}
.footer__col h4{margin-bottom:14px}
.footer__col a{display:block;padding:4px 0;color:var(--ink-2);font-size:.88rem}
.footer__col a:hover{color:var(--signal)}
.footer__bottom{margin-top:36px;padding-top:20px;border-top:var(--hair) solid var(--line);
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  font-family:var(--ff-label);font-size:.74rem;color:var(--ink-3);letter-spacing:.02em}
@media (max-width:840px){.footer__grid{grid-template-columns:repeat(2,1fr);gap:26px}}
@media (max-width:470px){.footer__grid{grid-template-columns:1fr}}

/* ---------- login form (wp_login_form) ---------- */
#loginform p{display:grid;gap:5px;margin-bottom:13px}
#loginform label{font-family:var(--ff-label);font-size:.68rem;text-transform:uppercase;
  letter-spacing:.11em;font-weight:600;color:var(--ink-3)}
#loginform input[type=text],#loginform input[type=password]{width:100%;padding:10px 12px;
  border:var(--hair) solid var(--line-2);border-radius:var(--r-sm);background:var(--bg);outline:none}
#loginform input[type=text]:focus,#loginform input[type=password]:focus{border-color:var(--signal)}
#loginform .login-remember label{display:flex;align-items:center;gap:8px;
  font-family:var(--ff);text-transform:none;letter-spacing:0;font-size:.86rem;color:var(--ink-2)}
#loginform .submit input{width:100%;padding:12px;border:0;border-radius:var(--r);cursor:pointer;
  font-family:var(--ff-display);font-weight:600;background:var(--signal);color:var(--on-signal)}
#loginform .submit input:hover{background:var(--signal-dim)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
