body{padding-top:0}
.mokbar{background:#b08d57;color:#fff;font-size:.74rem;letter-spacing:.08em;padding:7px 18px;text-align:center;font-weight:600}
.mokbar a{color:#fff;text-decoration:underline}
.pick{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-radius:8px;padding:26px 28px;box-shadow:0 16px 40px rgba(32,36,42,.10);margin-top:-56px;position:relative;z-index:5}
.pick h3{font-size:1.02rem;margin-bottom:4px}
.pick p.hint{font-size:.85rem;color:var(--v3-muted,#5b6470);margin-bottom:16px}
.pickrow{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:end}
.pickrow label{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--v3-gold,#b08d57);margin-bottom:6px}
select.sel3,input.sel3{width:100%;padding:13px 14px;border:1px solid var(--v3-line,#e5ded2);border-radius:4px;font-family:inherit;font-size:.92rem;color:var(--v3-ink,#2b2f33);background:#fff}
select.sel3:focus,input.sel3:focus{outline:2px solid #c9a468;outline-offset:1px}
.pickrow .btn3{height:46px}
@media(max-width:760px){.pickrow{grid-template-columns:1fr}}
.statstrip{display:flex;gap:38px;flex-wrap:wrap;justify-content:center;background:#20242a;color:#fff;padding:22px 18px}
.statstrip div{text-align:center}
.statstrip b{display:block;font-family:var(--v3-serif,'Playfair Display',serif);font-size:1.55rem;color:#e2c58f;line-height:1.1}
.statstrip span{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#9aa4ad;font-weight:700}
.grid3{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.grid2{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
.grid4{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

.pcard{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-radius:10px;padding:30px 28px;position:relative;box-shadow:0 4px 18px rgba(32,36,42,.06);display:flex;flex-direction:column;gap:12px}
.pcard--hero{border:2px solid #b08d57;box-shadow:0 18px 44px rgba(176,141,87,.20)}
.pcard .ic{width:44px;height:44px;border-radius:8px;background:#f3ece0;display:flex;align-items:center;justify-content:center;font-size:1.3rem}
.pcard h3{font-size:1.16rem}
.pcard h2{font-size:1.16rem;margin-block:1em;font-weight:700}
.pcard p{font-size:.92rem;color:#5b6570;line-height:1.7;flex:1}
.pcard ul{list-style:none;display:flex;flex-direction:column;gap:6px;font-size:.86rem;color:#4b5563}
.pcard ul li:before{content:"— ";color:#b08d57;font-weight:800}
.pcard .tag{position:absolute;top:-11px;left:26px;background:#b08d57;color:#fff;font-size:.6rem;letter-spacing:.16em;font-weight:800;text-transform:uppercase;padding:5px 12px;border-radius:2px}
.pcard .go{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:#b08d57}

.stgrid{display:grid;gap:16px;grid-template-columns:repeat(4,1fr)}@media(max-width:900px){.stgrid{grid-template-columns:repeat(2,1fr)}}
.stcard{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-radius:8px;padding:26px 22px;text-decoration:none;color:inherit;transition:.2s;display:block}
.stcard:hover{border-color:#b08d57;transform:translateY(-3px);box-shadow:0 12px 26px rgba(32,36,42,.10)}
.stcard b{display:block;font-size:.95rem;color:#2b2f33}
.stcard span{display:block;font-size:.76rem;color:#5b6470;margin-top:4px}
.stcard em{display:block;font-family:'Playfair Display','Playfair Fallback',serif;font-style:normal;font-size:1.25rem;color:#b08d57;margin-top:8px}

.segrid{display:grid;gap:16px;grid-template-columns:repeat(4,1fr)}@media(max-width:1000px){.segrid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.segrid{grid-template-columns:1fr}}
.secard{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-left:3px solid #b08d57;border-radius:4px;padding:24px 22px;text-decoration:none;color:inherit;transition:.2s}
.secard:hover{background:#fdfaf4;transform:translateX(3px)}
.secard b{display:block;font-size:.92rem}
.secard span{font-size:.76rem;color:#5b6470}

.hubtabs{position:sticky;top:64px;z-index:40;background:#fff;border-bottom:1px solid var(--v3-line,#e5ded2);padding:0 18px}
.hubtabs .in{max-width:1200px;margin:0 auto;display:flex;gap:6px;overflow-x:auto}
.hubtabs a{padding:15px 18px;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:#5b6470;text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap}
.hubtabs a:hover{color:#b08d57}
.hubtabs a.on{color:#2b2f33;border-bottom-color:#b08d57}
.hero3--hub{min-height:0;padding:64px 0 54px;background:linear-gradient(140deg,#20242a,#2f353c 60%,#3a342c)}
.hero3--hub h1{font-size:clamp(1.9rem,4vw,3rem)}
.hero3--hub p{max-width:64ch}
.secline{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.chip{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:999px;padding:7px 15px;font-size:.78rem;text-decoration:none}
.chip:hover{background:rgba(201,164,104,.35);border-color:#c9a468}
.chip.on{background:#b08d57;border-color:#b08d57;font-weight:800}

table.rt{width:100%;border-collapse:collapse;font-size:.9rem;background:#fff}
table.rt th,table.rt td{padding:12px 14px;border-bottom:1px solid #eee6d9;text-align:left}
table.rt thead th{background:#20242a;color:#fff;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}
table.rt td.num{font-variant-numeric:tabular-nums;font-weight:700;color:#2b2f33}
table.rt tbody tr:nth-child(even){background:#fbf8f2}
table.rt a{color:#7a5f33;font-weight:700}

.filterbar{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-radius:8px;padding:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;align-items:end}
.filterbar .lab{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:#b08d57;margin-bottom:5px;display:block}
.resbar{display:flex;justify-content:space-between;align-items:center;padding:18px 2px;font-size:.86rem;color:#5b6470;flex-wrap:wrap;gap:10px}
.dlist{display:flex;flex-direction:column;gap:12px}
.dcard{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-radius:8px;padding:20px 22px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;transition:.2s}
.dcard:hover{border-color:#c9a468;box-shadow:0 10px 26px rgba(32,36,42,.08)}
.dcard h4{font-size:1.02rem;margin-bottom:4px;color:#2b2f33}
.dcard .meta{font-size:.82rem;color:#5b6470;display:flex;gap:14px;flex-wrap:wrap}
.dcard .meta b{color:#4b5563;font-weight:600}
.dcard .acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.mini{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;font-weight:800;padding:8px 14px;border-radius:3px;text-decoration:none;border:1px solid #2b2f33;color:#2b2f33;white-space:nowrap}
.mini:hover{background:#2b2f33;color:#fff}
.mini--gold{background:#b08d57;border-color:#b08d57;color:#fff}
.mini--gold:hover{background:#2b2f33;border-color:#2b2f33}
.mini--off{border-color:#ddd5c6;color:#a8a29a;cursor:not-allowed}
.dcard--spon{border:2px solid #b08d57;background:linear-gradient(180deg,#fffdf8,#fff);box-shadow:0 14px 34px rgba(176,141,87,.16)}
.bd{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;padding:4px 9px;border-radius:2px;vertical-align:middle;margin-left:8px}
.bd--spon{background:#b08d57;color:#fff}
.bd--ver{background:#e8f2e8;color:#3d7a45}
.bd--type{background:#f1ede4;color:#6b6255}
.sectors{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.sectors span{font-size:.66rem;background:#f5f1e8;color:#6b6255;padding:3px 8px;border-radius:2px;letter-spacing:.04em}
.pager{display:flex;gap:6px;justify-content:center;padding:26px 0}
.pager a{padding:9px 14px;border:1px solid #e5ded2;border-radius:3px;font-size:.82rem;color:#5b6470;text-decoration:none}
.pager a.on{background:#20242a;color:#fff;border-color:#20242a}

.path{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:10px}
.path .no{font-family:'Playfair Display','Playfair Fallback',serif;font-size:1.6rem;color:#c9a468;line-height:1}
.path h3{font-size:1.05rem}
.path p{font-size:.88rem;color:#5b6570;flex:1}
.path .when{font-size:.76rem;color:#4b5563;background:#fbf7ef;border-left:2px solid #b08d57;padding:9px 12px}
.tl{display:grid;gap:0;margin-top:8px}
.tl .step{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:0 0 26px}
.tl .step .n{width:38px;height:38px;border-radius:50%;background:#20242a;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem}
.tl .step h4{font-size:.98rem;margin-bottom:4px}
.tl .step p{font-size:.88rem;color:#5b6570}
.tl .step .dur{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:#b08d57}

.tip{background:#fff;border:1px solid var(--v3-line,#e5ded2);border-radius:6px;padding:18px 20px;display:grid;grid-template-columns:26px 1fr;gap:14px}
.tip .n{font-family:'Playfair Display','Playfair Fallback',serif;color:#c9a468;font-size:1.1rem;font-weight:600}
.tip b{display:block;font-size:.94rem;margin-bottom:3px}
.tip p{font-size:.85rem;color:#5b6570;line-height:1.65}
.artwrap{display:grid;grid-template-columns:250px 1fr;gap:44px;align-items:start}
.toc{position:sticky;top:96px;border-left:2px solid #eee6d9;padding-left:18px}
.toc b{display:block;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#b08d57;margin-bottom:10px}
.toc a{display:block;font-size:.84rem;color:#5b6470;text-decoration:none;padding:5px 0}
.toc a:hover{color:#2b2f33}
.prose h2{font-size:1.35rem;margin:34px 0 12px}
.prose h3{font-size:1.08rem;margin:24px 0 8px}
.prose p{font-size:.96rem;line-height:1.8;color:#3f4750;margin-bottom:14px}
.prose ul{margin:0 0 16px 20px}
.prose li{font-size:.94rem;line-height:1.75;color:#3f4750;margin-bottom:6px}
.callout{background:#fbf7ef;border-left:3px solid #b08d57;padding:16px 20px;border-radius:0 6px 6px 0;margin:20px 0;font-size:.92rem;color:#3f4750}
.callout strong{color:#2b2f33}
.warn{background:#fdf2ee;border-left-color:#b4553a}
@media(max-width:820px){.artwrap{grid-template-columns:1fr}.toc{position:static;border-left:none;border-top:1px solid #eee6d9;padding:14px 0 0}}
@media(max-width:700px){.dcard{grid-template-columns:1fr}.dcard .acts{justify-content:flex-start}}
.note-bar{background:#f1ede4;border:1px dashed #cbbf9f;border-radius:6px;padding:14px 18px;font-size:.84rem;color:#5b5346}
.qhidden{display:none}
.moklabel{position:fixed;right:14px;bottom:14px;background:#20242a;color:#e2c58f;font-size:.68rem;letter-spacing:.1em;padding:8px 14px;border-radius:4px;z-index:99;font-weight:700}
.dcard-gold, .dcard--silver { position: relative; }
.site-corner { position: absolute; top: 14px; right: 14px; z-index: 3; background: #0e2a47; color: #fff; font-size: 12px; font-weight: 600; padding: 7px 12px; border-radius: 999px; text-decoration: none; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.site-corner:hover { background: #c9a227; color: #10233b; }
.dcard-gold .site-corner { background: #c9a227; color: #10233b; }
.dcard-gold .site-corner:hover { background: #b08d1e; color: #fff; }
.ph--real { padding: 0; overflow: hidden; }
.ph--real img { display: block; width: 100%; height: 210px; object-fit: cover; }
.gold-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 12px 0; }
.ph--sm img { display: block; width: 100%; height: 150px; object-fit: cover; border-radius: 10px; }
@media (max-width: 720px) { .ph--real img, .gold-gallery .ph--real img { height: 150px; } .ph--sm img { height: 120px; } }
.lg{flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-weight:800;letter-spacing:.06em;
    background:#20242a;color:#fff;border-radius:8px}
.lg--gold{width:56px;height:56px;font-size:1.12rem;background:#b08d57}
.lg--silver{width:44px;height:44px;font-size:.92rem;background:#7d8790}
.dcard-gold{display:grid;grid-template-columns:minmax(340px,48%) 1fr;gap:0;padding:0;
  background:linear-gradient(180deg,#fffdf8,#fff);border:2px solid #b08d57;border-radius:10px;
  overflow:hidden;box-shadow:0 14px 34px rgba(176,141,87,.16);position:relative}
.gold-hero{position:relative;background:#efe9dc;min-height:100%}
.gold-hero img{display:block;width:100%;height:100%;min-height:380px;max-height:520px;object-fit:cover}
.gold-hero .ph-empty{display:flex;align-items:center;justify-content:center;height:100%;min-height:380px;
  color:#a89f8c;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.gold-info{padding:20px 22px 18px;display:flex;flex-direction:column;gap:10px}
.gold-id{display:flex;align-items:flex-start;gap:12px}
.gold-nm{flex:1;min-width:0}
.gold-nm h4{font-size:1.12rem;line-height:1.28;margin:0 0 5px;color:#2b2f33}
.gold-id .meta{font-size:.79rem;color:#5b6470;display:flex;gap:12px;flex-wrap:wrap}
.bd--gold{background:#b08d57;color:#fff}
.bd--silver{background:#7d8790;color:#fff}
.site-pill{flex:0 0 auto;margin-left:auto;background:#c9a227;color:#10233b;font-size:.66rem;font-weight:800;
  letter-spacing:.1em;text-transform:uppercase;padding:8px 13px;border-radius:999px;text-decoration:none;
  white-space:nowrap;line-height:1}
.site-pill:hover{background:#20242a;color:#fff}
.gold-types{display:flex;gap:6px;flex-wrap:wrap}
.gold-types .bd{margin-left:0}
.gold-blurb{font-size:.85rem;color:#5b6570;line-height:1.6;margin:0}
.gold-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}
.gold-thumbs .ph--real{border-radius:6px}
.gold-thumbs img{display:block;width:100%;height:112px;object-fit:cover}
.dcard-gold .acts{justify-content:flex-start;margin-top:2px}
.dcard--silver{position:relative;align-items:stretch;grid-template-columns:1fr}
.silver-body{display:grid;grid-template-columns:auto 1fr 200px;gap:14px;align-items:center;width:100%}
.silver-body .lg--silver{align-self:start}
.silver-txt{min-width:0}
.silver-txt h4{font-size:1.02rem;margin:0 0 4px;color:#2b2f33;line-height:1.3}
.silver-txt .bd{margin-left:6px}
.silver-txt .meta{font-size:.79rem;color:#5b6470;display:flex;gap:12px;flex-wrap:wrap}
.silver-blurb{font-size:.82rem;color:#5b6570;line-height:1.55;margin:6px 0 0}
.dcard--silver .ph--sm{padding:0;overflow:hidden;border-radius:8px}
.dcard--silver .ph--sm img{display:block;width:100%;height:140px;object-fit:cover;border-radius:8px}
.ph-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
 height:140px;border-radius:8px;background:linear-gradient(145deg,#0e2a47,#1d4668);color:#fff}
.ph-tile b{font-family:'Playfair Display',serif;font-size:1.5rem;letter-spacing:.06em;opacity:.92}
.ph-tile span{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;opacity:.72}
.dcard--silver{padding:14px 16px}
.dcard--silver .site-pill{position:absolute;top:14px;right:14px;z-index:3;background:#0e2a47;color:#fff;margin-left:0}
.dcard--silver .site-pill:hover{background:#c9a227;color:#10233b}
.silver-acts{display:flex;flex-direction:column;gap:8px;align-items:flex-end;justify-self:end}
.silver-acts .acts{flex-direction:column;align-items:flex-end}

@media(max-width:980px){
  .silver-body{grid-template-columns:auto 1fr;grid-template-areas:"lg txt" "ph ph";row-gap:12px}
  .silver-body .lg--silver{grid-area:lg}.silver-txt{grid-area:txt}.dcard--silver .ph--sm{grid-area:ph}.silver-acts{flex-direction:row;align-items:center;justify-self:start;grid-column:1/-1}
}
@media(max-width:820px){
  .dcard-gold{grid-template-columns:1fr}
  .gold-hero img{min-height:240px;max-height:300px}
  .gold-info{padding:16px}
  .silver-body{grid-template-columns:auto 1fr}
  .dcard--silver .ph--sm img{height:120px}
}
.site-pill--paid{background:#0e7a4b;color:#fff;border-color:#0e7a4b;}
.site-pill--paid:hover{background:#0c6840;}
.site-pill--free{background:#fff;color:#0e2a47;border:1px solid #c9d3de;font-weight:800}
.site-pill--free:hover{background:#0e2a47;color:#fff;border-color:#0e2a47}
.dcard .site-pill--free{min-height:34px;display:inline-flex;align-items:center;padding:0 14px;border-radius:999px;text-decoration:none;font-size:.72rem}
.free-url{background:#f3f4f6;border:1px dashed #cbd5e1;border-radius:6px;padding:3px 8px;font-size:12px;color:#475569;font-family:ui-monospace,monospace;}
/* W5.1b 360px gate — MEASURED offenders (data/w51_offender_dump.json), not guessed:
   span.mini.free-url carries .mini's white-space:nowrap and the .dcard grid item has
   min-width:auto, so one long free-tier URL (472px measured) forced a 472px column and
   blew the 360px viewport to 513px (153px overflow). Free URLs are copy-paste TEXT, not
   links/buttons — let them wrap; keep the nowrap behaviour on actual .mini buttons. */
.dcard>div{min-width:0}
.dlist>.dcard{min-width:0}
.dcard .acts{min-width:0;max-width:100%}
.dcard .acts>.free-url{white-space:normal;overflow-wrap:anywhere;word-break:break-word;max-width:100%;min-width:0;letter-spacing:0}
.copyurl{background:#fff;border:1px solid #cbd5e1;border-radius:6px;font-size:11px;padding:3px 9px;cursor:pointer;color:#334155;font-weight:600;}
.copyurl:hover{background:#f1f5f9;border-color:#94a3b8;}
.copyurl:active{transform:translateY(1px);}
.copynote{font-size:10px;color:#94a3b8;}
img.lg{object-fit:contain;background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:4px;}
.lg--gold{width:56px;height:56px;}
.lg--silver{width:40px;height:40px;}
div.shell > div.grid2 > div.tip > div.n{color:#936f34} 
footer.foot3 > div.shell > div.foot3-low > span{color:#7c8791} 
div.shell > div.grid3 > div.pcard > a.go{color:#8e7043} 
div.nav3-in > a.brand3 > b > i{color:#886b3f} 
header.nav3 > div.nav3-in > span.nav3-cta > a.btn3{background-color:#8f7042} 
div.shell > div.filterbar > div > span.lab{color:#8e7043} 
div.dcard > div > h4 > span.bd{color:#3c7844} 
div.shell > div.stgrid > a.stcard > em{color:#8e7043} 
div#dl > div.dcard > div.acts > span.mini{color:#7c746a} 
div.shell > div.segrid > a.secard > div{color:#8e7043} 
div.shell > div.grid3 > div.path > div.no{color:#936f34} 
section#get-3-quotes > div.eq-in > div.btnrow3 > button.btn3{background-color:#8f7042} 
section#get-3-quotes > div.eq-in > p.eq-fine{color:#97a2ad} 
section.sec > div.shell > div.kicker{color:#80653d} 
tbody > tr > td > a{color:#8d7043} 
table.rt > tbody > tr > td.num{color:#8d7043} 
div.shell > div.resbar > p#hub-list-legend > span.lg-i{color:#646a78} 
div.silver-body > div.silver-txt > h4 > span.bd{background-color:#6d767f} 
div.silver-body > div.silver-txt > h4 > span.bd{color:#3c7844} 
div#hub-list > div.dcard > div.acts > span.mini{color:#7c746a} 
section.hero3 > div.hero3-in > p.scope-note{color:#5f7388} 
section.hero3 > div.hero3-in > p.scope-note > strong{color:#5f7388} 
section.sec > div.shell > p.sub{color:#6a707b} 
div.shell > div.grid3 > div.pcard > span.tag{background-color:#8e7043} 
section.sec > div.shell > div.kicker{color:#876b40} 
div.shell > div.resbar > p#dl-legend > span.lg-i{color:#6a707e} 
tbody > tr > td > a{color:#886c41} 
table.rt > tbody > tr > td.num{color:#886c41} 
section.sec > div.shell > div.eyebrow{color:#886b3f} 
section.sec > div.shell > p.sub{color:#646a74} 
div.shell > div.foot3-grid > div > h3{color:#7c8792} 
div.grid3 > a.card3 > div.card3-body > div.card3-foot{color:#8f7042} 
div#dl > div.dcard > div.acts > span.copynote{color:#627693} 
section.hero3 > div.hero3-in > div.secline > a.chip{background-color:#8e7043} 
div.gold-id > div.gold-nm > h4 > span.bd{background-color:#8e7043} 
div#hub-list > div.dcard > div.acts > span.copynote{color:#627693} 
section.hero3 > div.hero3-in > div.btnrow3 > a.btn3{background-color:#8f7042} 
section.sec > div.shell > div.eyebrow{color:#82653c} 
div.pick > div.pickrow > div > label{color:#8f7042} 
section.sec > div.shell > div.pcard > a.go{color:#8e7043} 
div.wrap > div.crumbs > a{color:#6a707e} 
section#cost > div.shell > div.kicker{color:#876b40} 
section#cost > div.shell > p.sub{color:#6a707b} 
section#cost > div.shell > div > a.btn3{background-color:#8f7042} 
section#directory > div.shell > div.kicker{color:#80653d} 
section#directory > div.shell > p.sub{color:#646a74} 
section#directory > div.shell > div.resbar > div#hub-list-count{color:#646a78} 
div.shell > div.resbar > div#hub-list-count > b{color:#646a78} 
div.shell > div.resbar > div#hub-list-count > span#cmpHint{color:#70695f} 
div.shell > div.resbar > p#hub-list-legend > b{color:#3b7643} 
div.resbar > p#hub-list-legend > span.lg-i > b.bd{color:#3c7844} 
section#directory > div.shell > div.resbar > div{color:#646a78} 
div#hub-list > div.dcard-gold > div.gold-hero > span.ph-empty{color:#706755} 
section#directory > div.shell > div#hub-list-pager > span{color:#646a78} 
section#directory > div.shell > div.note-bar > a{color:#82653c} 
section#approvals > div.shell > div.kicker{color:#876b40} 
section#approvals > div.shell > p.sub{color:#6a707b} 
section#tips > div.shell > div.kicker{color:#80653d} 
section#tips > div.shell > p.sub{color:#646a74} 
section#faq > div.shell > div.kicker{color:#876b40} 
section.sec > div.shell > p{color:#646a74} 
section.sec > div.shell > p > a{color:#82653c} 
section.sec > div.shell > p.sub > a{color:#886b3f} 
section.sec > div.shell > p{color:#6a707b} 
div.shell > div.split > div.split-body > h2.h2x{color:#818d99} 
div.split > div.split-body > div.btnrow3 > a.btn3{background-color:#8f7042} 
main > div.wrap > div.step > p#ptypenote{color:#5f7285} 
section.sec > div.shell > div.pcard > span.tag{background-color:#8e7043} 
section#costs > div.shell > div.kicker{color:#876b40} 
section#costs > div.shell > p.sub{color:#6a707b} 
section#approvals-answer > div.shell > div.kicker{color:#80653d} 
section#approvals-answer > div.shell > p.sub{color:#646a74} 
div.pick > div.pickrow > div > a.btn3{background-color:#8f7042} 
section.sec > div.shell > div > a.btn3{background-color:#8f7042} 
section.sec > div.shell > div.resbar > div#dl-count{color:#6a707e} 
div.shell > div.resbar > div#dl-count > b{color:#6a707e} 
div.shell > div.resbar > div#dl-count > span#cmpHint{color:#766f64} 
div.resbar > p#dl-legend > span.lg-i > b.bd{color:#3c7844} 
section.sec > div.shell > div#dl-pager > span{color:#6a707e} 
div.wrap > div.crumbs{color:#6a707e} 
div.wrap > div.card2 > div.notice{color:#686f7d} 
div.wrap > div.cta > a.btn{background-color:#8e7043} 
div.wrap > div.cta > a.btn{color:#8d7043} 
div.wrap > a.back{color:#886b40} 

.sec p a,.shell p a,p.sub a,.tip p a,.crumbs a{text-decoration:underline;text-underline-offset:2px}

.dcard h3{font-size:1.02rem;margin-bottom:4px;color:#2b2f33}
.gold-nm h3{font-size:1.12rem;line-height:1.28;margin:0 0 5px;color:#2b2f33}
.silver-txt h3{font-size:1.02rem;margin:0 0 4px;color:#2b2f33;line-height:1.3}
.tl .step h3{font-size:.98rem;margin-bottom:4px}
section.sec > div.shell > div.kicker,
section#cost > div.shell > div.kicker,
section#approvals > div.shell > div.kicker,
section#faq > div.shell > div.kicker,
section#costs > div.shell > div.kicker,
section#directory > div.shell > div.kicker,
section#tips > div.shell > div.kicker,
section#approvals-answer > div.shell > div.kicker{color:#7a5f33}

.dcard h2{font-size:1.02rem;margin:0 0 4px;color:#2b2f33;font-weight:700;line-height:1.25}
div.shell > div.segrid > a.secard > div{color:#7a5f33 !important}
.dcard span.bd:not(.bd--gold),
a.dcard span.bd--silver,
a.dcard span.bd--type,
a.dcard span.bd--ver{background-color:#5f6a73 !important;color:#fff !important;border-color:#5f6a73 !important}

.gold-nm h2{font-size:1.12rem;line-height:1.28;margin:0 0 5px;color:#2b2f33;font-weight:700}
.silver-txt h2{font-size:1.02rem;margin:0 0 4px;color:#2b2f33;line-height:1.3;font-weight:700}
.gold-nm h2 span.bd--gold{background-color:#8e7043 !important;color:#fff !important}

span.free-url{color:#475569 !important}

/* ===== W5.2 MOBILE TAP TARGETS (>=44x44) — 360px gate, mobile only =====
   Measured 2026-11-02 at 360px on live: 260 offenders / 17 classes.
   Every rule below is INSIDE a max-width:700px query => desktop layout is
   byte-for-byte unchanged (proof: 1280px box parity diff).
   Only min-height/min-width/flex-alignment is touched; no colours, no sizes of
   text, no re-ordering. Sizes came from data/w52_triage_LIVE_20261102.json. */
@media (max-width:700px){
  /* footer link list: 324x33 -> 44 tall */
  .foot3 a{padding:0;display:flex;align-items:center;min-height:44px}
  .foot3 a.brand3{flex-direction:column;align-items:flex-start;justify-content:center}
  /* pager: 37x72 -> 44x44 ; wrap so extra pages never overflow */
  .pager{flex-wrap:wrap}
  .pager a{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  /* directory card actions */
  .cmp-btn{min-height:44px;padding-top:0;padding-bottom:0}
  .copyurl{min-height:44px;min-width:44px}
  .site-pill{min-height:44px;display:inline-flex;align-items:center}
  /* card CTA text link: 264x20 -> 44 tall */
  .pcard .go{min-height:44px;display:flex;align-items:center}
  /* header wordmark: 81x18 -> 44 tall */
  .nav3-in>a.brand3{min-height:44px;justify-content:center}
  /* state chips: 49-65x37 -> 44 tall */
  .chip{min-height:44px;display:inline-flex;align-items:center}
  /* CTA buttons: 232x43 -> 44 */
  .btn3{min-height:44px}
  /* directory "only with a website" checkbox: label is the target (13x13 input) */
  .filterbar label{min-height:44px}
  /* state-page cost table row links: 81x42.5 -> 44 tall */
  table.rt td>a{display:inline-flex;align-items:center;min-height:44px}
}

/* ===== s17c013 (Boss 2026-11-02): sponsor photo cells = full-bleed squares,
   website button sits on the photo ===================================== */
.dcard-gold .gold-hero{position:relative;overflow:hidden;border-radius:8px}
.dcard-gold .gold-hero img{display:block;width:100%;aspect-ratio:4/3;height:auto;object-fit:cover}
.dcard-gold .gold-hero .site-pill--paid{position:absolute;top:10px;right:10px;z-index:3}
.gold-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}
.gold-thumbs .ph--real{border-radius:6px;position:relative;overflow:hidden}
.gold-thumbs img{display:block;width:100%;aspect-ratio:1/1;height:auto;object-fit:cover}
.dcard--silver .ph--sm{position:relative;overflow:hidden;border-radius:8px;padding:0}
.dcard--silver .ph--sm img{display:block;width:100%;aspect-ratio:4/3;height:auto;object-fit:cover;border-radius:8px}
.dcard--silver .ph--sm .site-pill--paid{position:absolute;top:8px;right:8px;z-index:3}
.dcard--silver .ph--sm .ph-tile{min-height:100%;aspect-ratio:4/3}
@media (max-width:720px){
  .dcard-gold .gold-hero img{aspect-ratio:4/3}
  .gold-thumbs img{aspect-ratio:1/1}
  .dcard--silver .ph--sm img{aspect-ratio:4/3}
}


/* ================= S17c-014 — unified square sponsor tiles =================
   The list container becomes a wrapping row so paid tiles sit 3-up like a grid
   while free listings keep their full-width row layout. */
.dlist{display:flex;flex-direction:row;flex-wrap:wrap;gap:14px;align-items:stretch}
.dlist>.dcard{width:100%}
.dlist>.sp-card{width:calc((100% - 28px)/3)}
@media(max-width:980px){.dlist>.sp-card{width:calc((100% - 14px)/2)}}
@media(max-width:640px){.dlist>.sp-card{width:100%}}

.sp-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--v3-line,#e5ded2);
  border-radius:14px;overflow:hidden;transition:box-shadow .2s,transform .2s;min-width:0}
.sp-card:hover{box-shadow:0 14px 34px rgba(32,36,42,.12);transform:translateY(-2px)}
.sp-card--gold{border:2px solid #c9a227}
.sp-card--silver{border:1px solid #cfd6dd}

.sp-ph{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:#efe9dc;text-decoration:none}
.sp-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.sp-card:hover .sp-ph img{transform:scale(1.045)}
.sp-ini{display:flex;align-items:center;justify-content:center;width:100%;height:100%;
  font-family:'Playfair Display',serif;font-size:2rem;letter-spacing:.08em;color:#8a7f6c}

.sp-tier{position:absolute;top:10px;left:10px;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;font-weight:700;line-height:1}
.sp-tier--gold{background:#c9a227;color:#10233b}
.sp-tier--silver{background:rgba(255,255,255,.94);color:#3c4a58;border:1px solid #cfd6dd}

.sp-wsite{position:absolute;left:10px;right:10px;bottom:10px;text-align:center;
  background:rgba(14,42,71,.93);color:#fff;font-size:.74rem;letter-spacing:.02em;
  padding:9px 12px;border-radius:999px;line-height:1}
.sp-ph:hover .sp-wsite{background:#c9a227;color:#10233b}

.sp-body{padding:12px 14px 14px;display:flex;gap:10px;align-items:flex-start;min-width:0}
.sp-lg{width:34px;height:34px;object-fit:contain;border-radius:6px;flex:0 0 auto;background:#fff}
.sp-nm{min-width:0;flex:1}
.sp-nm h2{font-size:.95rem;line-height:1.25;margin:0 0 5px}
.sp-nm .meta{font-size:.72rem;color:#5b6470;display:flex;gap:8px;flex-wrap:wrap}
.sp-blurb{font-size:.74rem;line-height:1.4;color:#5b6470;margin:6px 0 0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ===== S17c-017 — Gold and Silver are DIFFERENT layouts (Boss 2026-11-02) =====
   Gold: one full-width row — big photo left, 2x2 photo grid, info column right.
   Silver: compact card — text left, ONE small photo on the right.
   Must come AFTER .dlist>.sp-card so the tier widths win the cascade. */
.dlist>.sp-card--gold{width:100%}
.dlist>.sp-card--silver{width:calc((100% - 28px)/3)}
@media(max-width:980px){.dlist>.sp-card--silver{width:calc((100% - 14px)/2)}}
@media(max-width:640px){.dlist>.sp-card--gold,.dlist>.sp-card--silver{width:100%}}

.sp-card--gold{flex-direction:row;align-items:stretch}
.g-hero{position:relative;display:block;flex:0 0 32%;overflow:hidden;background:#efe9dc;min-height:240px;text-decoration:none}
.g-hero img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.sp-card--gold:hover .g-hero img{transform:scale(1.04)}
.g-hero .sp-ini{position:absolute;inset:0;font-size:2.2rem}
.g-thumbs{flex:0 0 19%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:4px;padding:4px;background:#faf7f1}
.g-th{display:block;overflow:hidden;background:#efe9dc;text-decoration:none;position:relative;min-height:56px}
.g-th img{width:100%;height:100%;object-fit:cover;display:block}
.g-th span{display:flex;align-items:center;justify-content:center;width:100%;height:100%;
  font-family:'Playfair Display',serif;font-size:.95rem;letter-spacing:.06em;color:#c2b7a3}
.g-body{flex:1 1 auto;padding:16px 18px;display:flex;flex-direction:column;gap:9px;min-width:0}
.g-head{display:flex;gap:10px;align-items:flex-start;min-width:0}
.g-body .sp-nm h2{font-size:1.12rem}
.g-body .sp-blurb{-webkit-line-clamp:4;font-size:.8rem}
.g-site,.s-site{align-self:flex-start;margin-top:auto;display:inline-block;background:#10233b;color:#fff;
  font-size:.78rem;padding:9px 16px;border-radius:999px;text-decoration:none;line-height:1;white-space:nowrap}
.g-site:hover,.s-site:hover{background:#c9a227;color:#10233b}

.sp-card--silver{flex-direction:row;align-items:stretch}
.s-body{flex:1 1 auto;padding:13px 14px;display:flex;flex-direction:column;gap:7px;min-width:0}
.s-photo{position:relative;flex:0 0 128px;display:block;overflow:hidden;background:#efe9dc;text-decoration:none}
.s-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.sp-card--silver:hover .s-photo img{transform:scale(1.05)}
.s-photo .sp-ini{position:absolute;inset:0;font-size:1.15rem}
.s-photo .sp-tier{top:8px;left:8px;font-size:.55rem;padding:4px 8px}

@media(max-width:900px){
  .sp-card--gold{flex-direction:column}
  .g-hero{flex:0 0 auto;width:100%;aspect-ratio:16/10;min-height:0}
  .g-thumbs{flex:0 0 auto;width:100%;grid-template-columns:repeat(4,1fr);grid-template-rows:1fr;height:88px}
}
@media(max-width:520px){.sp-card--silver{flex-direction:column-reverse}.s-photo{flex:0 0 auto;width:100%;height:150px}}

/* ===== s17c019b (Boss 2026-11-02): FIXED photo cells. Real container = .sp-card--gold / --silver ===== */
/* hero: one fixed 4:3 box */
.sp-card--gold .g-hero{position:relative;display:block;overflow:hidden;aspect-ratio:4/3 !important;border-radius:8px}
.sp-card--gold .g-hero img{display:block !important;width:100% !important;height:100% !important;aspect-ratio:4/3 !important;object-fit:cover !important}
/* thumbs: every cell identical 1:1 square, never content-sized */
.sp-card--gold .g-thumbs{display:grid !important;grid-template-columns:repeat(2,1fr) !important;gap:6px !important}
.sp-card--gold .g-thumbs > *{position:relative;overflow:hidden;border-radius:6px;aspect-ratio:1/1 !important;width:100% !important;height:auto !important;min-height:0 !important}
.sp-card--gold .g-thumbs img{display:block !important;width:100% !important;height:100% !important;aspect-ratio:1/1 !important;object-fit:cover !important}
/* silver: single fixed portrait thumb */
.sp-card--silver .s-photo,.sp-card--silver .g-hero{aspect-ratio:3/4 !important;overflow:hidden}
.sp-card--silver .s-photo img,.sp-card--silver .g-hero img{width:100% !important;height:100% !important;object-fit:cover !important;aspect-ratio:3/4 !important}
@media (max-width:700px){.sp-card--gold .g-thumbs{grid-template-columns:repeat(4,1fr) !important}}