/* osnomes, identidade "cada nome é bordado".
   Cores são linhas de bordar; o anil é a cor da marca. */
@font-face{font-family:"Young Serif";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/young-serif-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Young Serif";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/young-serif-latin-ext-400.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Figtree";font-style:normal;font-weight:300 900;font-display:swap;src:url(/assets/fonts/figtree-latin-wght.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Figtree";font-style:normal;font-weight:300 900;font-display:swap;src:url(/assets/fonts/figtree-latin-ext-wght.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --bg:#ffffff; --algodao:#F4F5FB; --algodao-2:#EBEDF7; --ink:#1B1F3B; --muted:#5B6078; --line:#E2E4EE;
  --anil:#3446C8; --anil-escuro:#27369F; --anil-claro:#EEF0FC;
  --goiaba:#C2365F; --gema:#C27D00; --folha:#2E8656; --ceu:#2385C2; --terra:#8B5A3A;
  --menina:#C2365F; --menino:#3446C8; --unissex:#2E8656;
  --madeira:#D9B88A; --madeira-2:#C9A06C; --trava:#B98F5A;
  --radius:16px; --wrap:1120px; --head:68px;
  --display:"Young Serif",Georgia,"Times New Roman",serif;
  --font:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ponto:2.5 2.1;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#14162B; --algodao:#1D2038; --algodao-2:#262A47; --ink:#ECEDF6; --muted:#A6AAC4; --line:#2E3150;
    --anil:#8C9BFF; --anil-escuro:#A9B4FF; --anil-claro:#262B52; --goiaba:#FF8FB0; --gema:#F5C04A; --folha:#6FD39C; --ceu:#6CC4F5; --terra:#D9A47F;
    --menina:#FF8FB0; --menino:#9DABFF; --unissex:#6FD39C}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--head) + 12px)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:17.5px;line-height:1.6;font-feature-settings:"ss01"}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
a{color:var(--anil);text-underline-offset:3px;text-decoration-thickness:1px} a:hover{text-decoration-thickness:2px}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.12;margin:1.6em 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,5.2vw,3.2rem);margin-top:.5rem} h2{font-size:clamp(1.45rem,3vw,1.85rem)} h3{font-size:1.2rem}
.lead{font-size:1.12rem;color:var(--muted);max-width:66ch}
.small{font-size:.88rem} .muted{color:var(--muted)}
.sr,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed;top:8px;left:8px;background:var(--bg);padding:8px 12px;z-index:80}
:focus-visible{outline:3px solid var(--anil);outline-offset:2px;border-radius:6px}

/* ---------- logo: o "o" é um bastidor */
.logo{display:inline-flex;align-items:baseline;font-family:var(--display);font-size:1.7rem;text-decoration:none;color:var(--ink);letter-spacing:-.02em;line-height:1}
.logo-o{display:inline-block;width:.66em;height:.66em;margin:0 .03em 0 .02em;transform:translateY(.02em)}
.logo-o svg{width:100%;height:100%;display:block;overflow:visible}
.logo-o .r{fill:none;stroke:var(--anil);stroke-width:3.4}
.logo-o .p{fill:none;stroke:var(--anil);stroke-width:1.9;stroke-dasharray:2.4 2.2;stroke-linecap:round}
.logo-o .t{fill:var(--anil)}

/* ---------- cabeçalho */
.site-header{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.header-row{display:flex;align-items:center;gap:8px 18px;min-height:var(--head)}
.main-nav{display:flex;gap:2px;margin-left:10px}
.main-nav a{color:var(--ink);text-decoration:none;padding:8px 13px;border-radius:999px;font-weight:550;font-size:.98rem}
.main-nav a:hover{background:var(--algodao)} .main-nav a[aria-current]{background:var(--anil-claro);color:var(--anil)}
.search{position:relative;display:flex;gap:6px}
.search input{flex:1;min-width:0;font:inherit;padding:10px 16px;border:1.5px solid transparent;border-radius:999px;background:var(--algodao);color:var(--ink)}
.search input::placeholder{color:var(--muted)}
.search input:focus{background:var(--bg);border-color:var(--anil);outline:none;box-shadow:0 0 0 4px var(--anil-claro)}
.search-top{margin-left:auto;flex:0 1 270px}
.search-top input{padding-right:44px}
.search-top button{position:absolute;right:5px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--muted);padding:8px;cursor:pointer;border-radius:999px;display:flex}
.search-top button:hover{color:var(--anil)}
.fav-link{position:relative;display:flex;align-items:center;gap:6px;text-decoration:none;color:var(--ink);padding:8px 12px;border-radius:999px;font-weight:550;font-size:.98rem;white-space:nowrap}
.fav-link > span:first-child{color:var(--goiaba);font-size:1.25rem;line-height:1}
.fav-link:hover,.fav-link.on{background:var(--algodao)}
.hide-search .fav-link{margin-left:auto}
.fav-count{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--goiaba);color:#fff;font-size:.75rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.fav-count[hidden]{display:none}
.menu-toggle{display:none;border:0;background:transparent;width:44px;height:44px;border-radius:12px;cursor:pointer;padding:13px 11px;flex-direction:column;justify-content:space-between}
.menu-toggle span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s,opacity .2s}
.nav-open .menu-toggle span:nth-child(1){transform:translateY(8px) rotate(45deg)} .nav-open .menu-toggle span:nth-child(2){opacity:0} .nav-open .menu-toggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* botões */
.btn,.search-big button{font:inherit;font-weight:650;cursor:pointer;border:0;border-radius:999px;background:var(--anil);color:#fff;padding:12px 24px;text-decoration:none;display:inline-block;line-height:1.2}
.btn:hover,.search-big button:hover{background:var(--anil-escuro)}
@media (prefers-color-scheme:dark){.btn,.search-big button{color:#14162B}}
.btn-ghost{font:inherit;cursor:pointer;background:var(--bg);color:var(--ink);border:1.5px solid var(--line);border-radius:999px;padding:9px 18px;font-weight:600}
.btn-ghost:hover{border-color:var(--anil);color:var(--anil)}
.btn.btn-ghost{background:var(--bg);color:var(--ink)}

/* sugestões da busca */
.suggest{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:30;margin:0;padding:6px;list-style:none;background:var(--bg);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 40px rgba(27,31,59,.16)}
.suggest li{margin:0} .suggest a{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:9px 12px;text-decoration:none;color:var(--ink);border-radius:12px}
.suggest a span{font-family:var(--display);font-size:1.08rem} .suggest small{color:var(--muted);font-size:.82rem}
.suggest li[aria-selected="true"] a,.suggest a:hover{background:var(--algodao)}

.search-big{max-width:600px;margin:1.3rem 0}
.search-big input{font-size:1.1rem;padding:16px 22px;background:var(--bg);border-color:var(--line)}
.search-big button{padding:0 26px}

/* ---------- conteúdo */
main{padding-bottom:4rem;min-height:60vh}
.crumbs{font-size:.88rem;color:var(--muted);margin-top:1.2rem} .crumbs a{color:var(--muted);text-decoration:none} .crumbs a:hover{color:var(--anil);text-decoration:underline}
.tag{display:inline-block;background:var(--algodao-2);border-radius:999px;padding:1px 9px;font-size:.78rem;margin-right:6px;color:var(--muted);font-weight:600}
.notice{background:var(--algodao);border-left:3px dashed var(--goiaba);padding:12px 16px;border-radius:0 12px 12px 0}
.block{margin:3.6rem 0} .block > h2:first-child,.block-head h2{margin-top:0}
.block-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:.5rem}
.block-head h2{margin-bottom:.2rem}
.more{white-space:nowrap;font-weight:650;font-size:.97rem}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px 48px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:1rem 0}
.chips a{display:inline-block;padding:8px 16px;border-radius:999px;background:var(--algodao);color:var(--ink);text-decoration:none;font-size:.96rem;font-weight:600}
.chips a:hover{background:var(--anil-claro);color:var(--anil)}
.page-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px}
.page-head h1{margin-bottom:.3rem}

/* ---------- bastidor (o elemento memorável) */
.bastidor{display:block;width:100%;height:auto;overflow:visible}
.bastidor .aro{stroke:var(--madeira)} .bastidor .aro2{stroke:var(--madeira-2)} .bastidor .trava{fill:var(--trava)}
.ponto{fill:none;stroke:var(--linha);stroke-width:2.2;stroke-dasharray:var(--ponto);stroke-linecap:round;stroke-linejoin:round}
.ponto .f{fill:var(--linha);fill-opacity:.15}
.ponto .k{fill:var(--linha);stroke:none}
.bastidor .ponto{stroke-width:1.55;stroke-dasharray:2.5 1.75}
.ponto .c1{stroke:#D23F6B} .ponto .c2{stroke:#C27D00} .ponto .c3{stroke:#2385C2}
.ponto.mono{font-family:var(--display);font-size:118px;stroke-width:3;stroke-dasharray:6 5;fill:var(--linha);fill-opacity:.13}
@media (prefers-color-scheme:dark){ .bastidor circle[fill="var(--tecido)"]{fill:color-mix(in srgb,var(--tecido) 12%,var(--algodao))} }
@media (prefers-reduced-motion:no-preference){
  .costura .risco > *{stroke-dasharray:1;stroke-dashoffset:1;animation:costura 1.5s cubic-bezier(.45,.05,.35,1) forwards}
  .costura .risco > :nth-child(2){animation-delay:.18s} .costura .risco > :nth-child(3){animation-delay:.36s}
  .costura .risco > :nth-child(4){animation-delay:.5s} .costura .risco > :nth-child(n+5){animation-delay:.62s}
  .costura .revela{opacity:0;animation:revela .5s ease 1.75s forwards}
  .costura .mono{animation:surge .9s ease .2s both}
}
@keyframes costura{to{stroke-dashoffset:0}}
@keyframes revela{to{opacity:1}}
@keyframes surge{from{opacity:0;transform:scale(.92);transform-origin:center}to{opacity:1;transform:none}}

/* mini bordado nos cards */
.mini{width:30px;height:30px;flex:none;color:var(--linha)}
.mini use{fill:none;stroke:var(--linha);stroke-width:2.6;stroke-dasharray:3 2.3;stroke-linecap:round;stroke-linejoin:round}
.mini .f{fill:var(--linha);fill-opacity:.15}

/* ---------- home */
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:20px 56px;align-items:center;padding:3.2rem 0 1.5rem}
.hero h1{font-size:clamp(2.6rem,6.4vw,4.4rem);line-height:1.02;margin:0 0 .9rem;max-width:12ch}
.hero-sub{color:var(--muted);font-size:1.2rem;margin:0;max-width:40ch}
.hero-try{color:var(--muted);font-size:.97rem;margin:0}
.hero-try a{font-weight:650}
.dia{margin:0;text-align:center}
.dia .bastidor{max-width:330px;margin:0 auto}
.dia figcaption{margin-top:.9rem;font-size:1rem;color:var(--muted)}
.dia figcaption strong{display:block;font-family:var(--display);font-weight:400;font-size:2rem;color:var(--ink);line-height:1.1;margin-bottom:.15rem}
.dia figcaption a{font-weight:650}

.shortcuts{list-style:none;padding:0;margin:1.8rem 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.shortcuts a{display:flex;gap:14px;align-items:center;height:100%;text-decoration:none;color:var(--ink);background:var(--algodao);border-radius:var(--radius);padding:16px 18px;outline:2px dashed transparent;outline-offset:-7px;transition:outline-color .15s,background .15s}
.shortcuts a:hover{outline-color:var(--anil);background:var(--anil-claro)}
.shortcuts .mini{width:40px;height:40px}
.shortcuts strong{display:block;font-family:var(--display);font-weight:400;font-size:1.15rem;line-height:1.2} .shortcuts small{color:var(--muted);font-size:.9rem}

.cta-gen{display:grid;grid-template-columns:1.1fr 1fr;gap:20px 40px;align-items:center;background:var(--anil);color:#fff;border-radius:28px;padding:34px 38px;position:relative;overflow:hidden}
.cta-gen::before{content:"";position:absolute;inset:10px;border:2px dashed rgba(255,255,255,.35);border-radius:20px;pointer-events:none}
.cta-gen h2{margin:0 0 .4rem;color:#fff} .cta-gen p{margin:0;color:rgba(255,255,255,.85)}
.quick-gen{display:flex;flex-wrap:wrap;gap:10px;align-items:center;position:relative}
.quick-gen select{font:inherit;padding:11px 16px;border:0;border-radius:999px;background:#fff;color:#1B1F3B;flex:1 1 160px}
.cta-gen .btn{background:#fff;color:var(--anil)} .cta-gen .btn:hover{background:var(--anil-claro)}
.cta-gen .seg{background:rgba(255,255,255,.16)} .cta-gen .seg-radio label{color:rgba(255,255,255,.85)}
.cta-gen .seg-radio label:has(input:checked){background:#fff;color:var(--anil)}
@media (prefers-color-scheme:dark){.cta-gen{background:#262B52}}

.rank-list{margin:0;padding:0;list-style:none;counter-reset:r;columns:2;column-gap:28px}
.rank-list li{counter-increment:r;padding:8px 0;border-bottom:1px dashed var(--line);break-inside:avoid;display:flex;gap:12px;align-items:baseline}
.rank-list li::before{content:counter(r);color:var(--muted);font-size:.85rem;min-width:1.4em;text-align:right;font-variant-numeric:tabular-nums}
.rank-list a{text-decoration:none;color:var(--ink);font-family:var(--display);font-size:1.12rem} .rank-list a:hover{color:var(--anil)}

.letter-rows{display:grid;gap:12px}
.letter-rows > div{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.row-label{min-width:72px;font-family:var(--display);font-size:1.15rem;color:var(--ink);text-decoration:none}
.letter-rows .letters{margin:0}

/* letras e segmentos */
.letters{display:flex;flex-wrap:wrap;gap:6px;margin:1rem 0}
.letters a{min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;text-decoration:none;background:var(--algodao);color:var(--ink);font-family:var(--display);font-size:1.02rem}
.letters a:hover{background:var(--anil-claro);color:var(--anil)}
.letters a[aria-current]{background:var(--anil);color:#fff}
.letters-sticky{position:sticky;top:var(--head);z-index:5;background:var(--bg);padding:8px 0;margin:0}
.seg{display:inline-flex;background:var(--algodao);border-radius:999px;padding:4px;gap:2px;border:0;margin:0}
.seg a,.seg button,.seg-radio label{font:inherit;border:0;background:transparent;color:var(--muted);padding:7px 18px;border-radius:999px;text-decoration:none;font-weight:650;font-size:.96rem;cursor:pointer;display:inline-flex;align-items:center}
.seg a[aria-current],.seg button[aria-pressed="true"],.seg-radio label:has(input:checked){background:var(--bg);color:var(--ink);box-shadow:0 1px 3px rgba(27,31,59,.12)}
.seg-radio input{position:absolute;opacity:0;pointer-events:none}
.seg-radio label:has(input:focus-visible){outline:3px solid var(--anil)}

.list-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin:.6rem 0}
.list-tools label{display:flex;align-items:center;gap:8px;font-size:.94rem;color:var(--muted)}
.list-tools select{font:inherit;font-size:.94rem;padding:6px 12px;border:1.5px solid var(--line);border-radius:999px;background:var(--bg);color:var(--ink)}
.check input{width:18px;height:18px;accent-color:var(--anil)}
.list-tools[hidden],[data-filter-gender][hidden]{display:none}

/* ---------- cards de nome: etiquetas; ao passar o mouse, a borda vira costura */
.grid{list-style:none;margin:1rem 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.grid-sm{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.name-card{min-width:0;position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-content:start;background:var(--algodao);border-radius:var(--radius);padding:15px 46px 13px 16px;outline:2px dashed transparent;outline-offset:-6px;transition:outline-color .15s,background .15s}
.name-card > :not(.mini){grid-column:2}
.name-card:not(:has(.mini)){grid-template-columns:1fr} .name-card:not(:has(.mini)) > *{grid-column:1}
.name-card .mini{grid-row:1/4;margin-top:1px}
.name-card:hover{outline-color:var(--anil);background:var(--anil-claro)}
.name-card.g-F:hover{outline-color:var(--menina)} .name-card.g-U:hover{outline-color:var(--unissex)}
.name-card:has(.name-link:focus-visible){outline:3px solid var(--anil);outline-offset:2px}
.name-card[hidden]{display:none}
.name-link{overflow-wrap:anywhere;font-family:var(--display);font-size:1.32rem;line-height:1.15;text-decoration:none;color:var(--ink)}
.name-link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.name-link:focus-visible{outline:none}
.g-F .name-link{color:var(--menina)} .g-M .name-link{color:var(--menino)} .g-U .name-link{color:var(--unissex)}
.snip{margin:.3rem 0 0;font-size:.9rem;color:var(--muted);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{margin:.35rem 0 0;font-size:.82rem;color:var(--muted)}
.card-meta:empty{display:none}
.fav{position:absolute;z-index:2;top:8px;right:8px;border:0;background:transparent;font-size:1.3rem;cursor:pointer;color:var(--goiaba);width:36px;height:36px;border-radius:999px;line-height:1;display:flex;align-items:center;justify-content:center}
.fav:hover{background:var(--bg)}
.fav-lg{position:static;width:auto;height:auto;font-size:.98rem;border:1.5px solid var(--line);border-radius:999px;padding:9px 18px;color:var(--goiaba);background:var(--bg);font-weight:650}
.fav-lg:hover{border-color:var(--goiaba);background:var(--bg)}
.fav-lg[aria-pressed="true"]{background:var(--goiaba);border-color:var(--goiaba);color:#fff}
.ranked{counter-reset:r}
.ranked .name-card{counter-increment:r;padding-left:50px}
.ranked .name-card::before{content:counter(r);position:absolute;left:12px;top:17px;width:28px;text-align:center;font-size:.86rem;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.ranked.ranked-off .name-card{padding-left:16px} .ranked.ranked-off .name-card::before{display:none}

.pager{display:flex;justify-content:space-between;margin:2rem 0 0;font-weight:650}
.pager a{text-decoration:none}

/* ---------- página de nome */
.name-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,320px);gap:16px 48px;align-items:center;margin:.8rem 0 .5rem;padding:8px 0 4px}
.nh-pre{display:block;font-family:var(--font);font-size:1.02rem;font-weight:600;color:var(--muted);margin-bottom:.2rem}
.name-hero h1{margin:0;font-size:clamp(3rem,10vw,5.6rem);line-height:.98;letter-spacing:-.025em}
.name-hero.g-F h1{color:var(--menina)} .name-hero.g-M h1{color:var(--menino)} .name-hero.g-U h1{color:var(--unissex)}
.nh-lead{font-size:1.24rem;line-height:1.5;margin:1rem 0 0;max-width:46ch}
.nh-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:1.3rem}
.nh-art{margin:0;text-align:center}
.nh-art .bastidor{max-width:300px;margin:0 auto}
.nh-art figcaption{font-size:.9rem;color:var(--muted);margin-top:.6rem;max-width:34ch;margin-left:auto;margin-right:auto}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:0;margin:1.8rem 0 0;border-top:1.5px dashed var(--line);border-bottom:1.5px dashed var(--line)}
.facts div{padding:14px 16px 14px 0}
.facts div + div{padding-left:16px;border-left:1.5px dashed var(--line)}
.facts dt{font-size:.88rem;color:var(--muted)}
.facts dd{margin:2px 0 0;font-family:var(--display);font-size:1.3rem;line-height:1.2}
.jump{display:flex;gap:4px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;white-space:nowrap;margin:1.2rem 0 .5rem;position:sticky;top:var(--head);z-index:5;background:var(--bg);padding:8px 0}
.jump a{padding:6px 14px;border-radius:999px;text-decoration:none;color:var(--muted);font-weight:650;font-size:.94rem}
.jump a:hover{background:var(--algodao);color:var(--ink)}
.sec{margin:2.6rem 0;max-width:780px}
.sec h2{margin-top:0}
#parecidos,#mais{max-width:none}
.conf{border-left:3px dashed var(--line);padding:2px 0 2px 14px;font-size:.96rem;color:var(--muted)}
.conf-A{border-color:var(--folha)} .conf-B{border-color:var(--gema)} .conf-C{border-color:var(--goiaba)}
.bars{list-style:none;padding:0;margin:.6rem 0}
.bars li{display:grid;grid-template-columns:110px 1fr auto;gap:14px;align-items:center;margin:.55rem 0;font-size:.97rem}
.bar{display:block;background:var(--algodao);border-radius:999px;height:12px;overflow:hidden} .bar i{display:block;height:100%;background:var(--anil);border-radius:999px}
.g-F-page .bar i{background:var(--menina)}
.bar-val small{color:var(--muted)}
.next-step{background:var(--algodao);border-radius:28px;padding:28px 32px;max-width:none;position:relative}
.next-step::before{content:"";position:absolute;inset:9px;border:2px dashed var(--line);border-radius:21px;pointer-events:none}
.next-step > *{position:relative}
.next-step .search-big{margin:.6rem 0 0}
.next-step .chips a{background:var(--bg)}
.srcs-box summary{cursor:pointer;font-weight:650;color:var(--muted)}
.srcs{padding-left:1.1rem;font-size:.93rem} .srcs li{margin:.3rem 0}

/* guia */
.steps{list-style:none;padding:0;margin:1.6rem 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;counter-reset:s}
.steps a{display:block;height:100%;background:var(--algodao);border-radius:var(--radius);padding:18px;text-decoration:none;color:var(--ink);counter-increment:s;outline:2px dashed transparent;outline-offset:-7px}
.steps a::before{content:counter(s);display:inline-flex;width:30px;height:30px;border-radius:999px;background:var(--anil);color:#fff;align-items:center;justify-content:center;font-family:var(--display);margin-bottom:10px}
.steps a:hover{outline-color:var(--anil)}
.steps strong{display:block;font-family:var(--display);font-weight:400;font-size:1.15rem} .steps span{color:var(--muted);font-size:.93rem}

/* gerador */
.gen-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 18px;align-items:end;background:var(--algodao);border-radius:24px;padding:22px}
.gen-form > label{display:flex;flex-direction:column;gap:5px;font-size:.92rem;font-weight:650;color:var(--muted)}
.gen-form select{font:inherit;font-weight:400;padding:11px 16px;border:1.5px solid var(--line);border-radius:999px;background:var(--bg);color:var(--ink)}
.gen-form .seg{background:var(--bg);grid-column:1/-1;justify-self:start}
.gen-form .seg-radio label:has(input:checked){background:var(--anil);color:#fff}
.gen-form label.check{flex-direction:row;align-items:center;gap:8px;padding-bottom:12px}
.gen-more{display:flex;gap:16px;align-items:center}
.empty{background:var(--algodao);border-radius:var(--radius);padding:18px 20px}
.empty .chips a{background:var(--bg)}

.table-wrap{overflow-x:auto}
.data{width:100%;border-collapse:collapse;font-size:.97rem} .data th,.data td{padding:11px 12px;border-bottom:1px dashed var(--line);text-align:left} .data th{font-size:.88rem;color:var(--muted);font-weight:600}
.data td a{font-family:var(--display);font-size:1.08rem;text-decoration:none}
.prose{max-width:720px} .prose table{border-collapse:collapse;width:100%;font-size:.94rem} .prose th,.prose td{border:1px solid var(--line);padding:7px 9px;text-align:left}

/* ---------- rodapé */
.site-footer{background:var(--algodao);padding:44px 0 30px;color:var(--muted);margin-top:2rem;border-top:2px dashed var(--line)}
.foot-cols{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:24px}
.foot-cols h2{font-family:var(--font);font-size:.95rem;font-weight:700;margin:0 0 .6rem;color:var(--ink);letter-spacing:0}
.foot-cols nav a{display:block;color:var(--muted);text-decoration:none;padding:3px 0;font-size:.96rem} .foot-cols nav a:hover{color:var(--anil)}
.foot-brand-col p{margin:.5rem 0 0;font-size:.96rem;max-width:26ch}
.foot-note{margin:2rem 0 0;padding-top:1rem;border-top:1px dashed var(--line)}
.linklike{font:inherit;background:none;border:0;padding:3px 0;color:var(--muted);cursor:pointer;text-align:left;font-size:.96rem;display:block}
.linklike:hover{color:var(--anil)}

/* aviso de cookies */
.cookie-banner{position:fixed;left:12px;right:12px;bottom:12px;z-index:70;max-width:680px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:20px;box-shadow:0 18px 40px rgba(27,31,59,.18);padding:14px 16px 14px 20px}
.cookie-banner p{margin:0;flex:1 1 300px;font-size:.94rem;line-height:1.5}
.cookie-actions{display:flex;gap:8px;margin-left:auto}
.cookie-actions button{border-color:var(--anil);color:var(--anil);font-weight:650}
.cookie-actions button[data-c="sim"]{background:var(--anil);color:#fff}

/* ---------- celular e tablet */
@media (max-width:960px){
  .menu-toggle{display:flex}
  .header-row{flex-wrap:wrap;gap:6px 8px;padding-top:8px;padding-bottom:8px}
  .logo{margin-right:auto}
  .fav-txt{display:none}
  .main-nav{display:none;order:5;flex-basis:100%;flex-direction:column;padding:6px 0 10px;margin-left:0}
  .main-nav a{padding:12px 14px;font-size:1.08rem;border-radius:12px}
  .nav-open .main-nav{display:flex}
  .search-top{order:4;flex-basis:100%;margin:0 0 6px}
  .letters-sticky,.jump{top:var(--head-h,118px)}
  html{scroll-padding-top:172px}
  .foot-cols{grid-template-columns:1fr 1fr}
  .foot-brand-col{grid-column:1/-1}
  .cta-gen{grid-template-columns:1fr;padding:28px}
  .hero{grid-template-columns:1fr;padding-top:2rem}
  .dia{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center;text-align:left}
  .dia .bastidor{max-width:120px;margin:0}
  .dia figcaption{margin:0}
  .dia figcaption strong{font-size:1.6rem}
  .name-hero{grid-template-columns:minmax(0,1fr) 150px;gap:12px 20px}
}
@media (max-width:640px){
  body{font-size:16.5px}
  .wrap{padding:0 16px}
  .hero h1{font-size:2.5rem}
  .search-big input{padding:14px 16px}
  .search-big button{padding:0 18px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .grid .name-card{padding:12px 36px 10px 12px;grid-template-columns:1fr}
  .grid .name-card > *{grid-column:1}
  .grid .name-card .mini{grid-row:auto;width:24px;height:24px;margin-bottom:4px}
  .ranked .name-card{padding-left:36px} .ranked .name-card::before{left:6px;top:14px}
  .name-link{font-size:1.15rem}
  .snip{font-size:.85rem}
  .fav{top:3px;right:1px}
  .name-hero{grid-template-columns:1fr}
  .nh-art{order:-1;display:flex;align-items:center;gap:14px;text-align:left}
  .nh-art .bastidor{max-width:118px;margin:0;flex:none}
  .nh-art figcaption{margin:0;text-align:left}
  .name-hero h1{font-size:3.1rem}
  .nh-lead{font-size:1.12rem}
  .facts{grid-template-columns:1fr 1fr}
  .facts div:nth-child(3){padding-left:0;border-left:0}
  .facts div:nth-child(n+3){border-top:1.5px dashed var(--line)}
  .bars li{grid-template-columns:96px 1fr auto;gap:10px}
  .rank-list{columns:1}
  .next-step{padding:22px 20px}
  .letters a{min-width:34px;height:34px}
  .cta-gen{padding:24px 22px;border-radius:24px}
}
@media (max-width:360px){ .grid{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){ *{transition:none!important} }

/* listas temáticas */
.chips{margin:.8rem 0}
.letter-rows .chips{margin:0}
.criterio{max-width:72ch;margin-top:1.2rem}
.comp-nome{font-family:var(--display);font-size:1.12rem}
.comp-nome a{text-decoration:none}
.comp td:first-child{color:var(--muted);font-variant-numeric:tabular-nums;width:2.5em}
.comp td:nth-child(n+3){font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- ajustes de navegação no celular (pente fino) */
.hero-try a{display:inline-block;padding:6px 0}
@media (max-width:960px){
  .site-header{transition:transform .25s ease}
  .head-hide .site-header{transform:translateY(-100%)}
  .jump,.letters-sticky{transition:top .25s ease}
  .head-hide .jump,.head-hide .letters-sticky{top:0}
  .letters-sticky{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:8px 0 10px}
  .letters-sticky::-webkit-scrollbar,.jump::-webkit-scrollbar{display:none}
  .letters-sticky a{flex:none}
}
@media (max-width:640px){
  input,select,textarea{font-size:16px!important}
  .header-row{gap:4px 6px;min-height:56px}
  .logo{font-size:1.55rem}
  .search-top input{padding-top:9px;padding-bottom:9px}
  .cookie-banner{left:8px;right:8px;bottom:8px;flex-wrap:nowrap;gap:10px;padding:10px 10px 10px 14px;border-radius:16px}
  .cookie-banner p{flex:1 1 auto;font-size:.84rem;line-height:1.4}
  .cookie-actions{margin:0}
  .cookie-actions button{padding:9px 16px}
  .facts div:nth-child(3):last-child{grid-column:1/-1}
  .comp th,.comp td{padding:10px 6px;font-size:.92rem}
  .comp th:last-child,.comp td:last-child{display:none}
  .comp-nome{font-size:1.02rem}
  .page-head{gap:4px 12px}
  .page-head h1{font-size:2.15rem}
  .list-tools{gap:8px 16px}
  .block{margin:2.6rem 0}
  .chips a{padding:9px 15px}
  .jump a{padding:8px 12px}
  .next-step .chips a{padding:9px 14px}
  .gen-form{padding:16px;gap:12px}
}
@media (max-width:960px){ .site-header{background:var(--bg);backdrop-filter:none} }

/* SEO: rótulo dentro do h1 */
.hero-pre{display:block;font-family:var(--font);font-size:1rem;font-weight:600;letter-spacing:.02em;color:var(--muted);margin-bottom:.35rem}
.nh-pre{letter-spacing:0;line-height:1.3}

/* gerador por significado */
.gen-tabs{margin:.4rem 0 1.2rem}
.gen-tabs button{padding:9px 20px}
.gen-word{display:flex;flex-direction:column;align-items:stretch;gap:14px}
.gen-q{display:flex;flex-direction:column;gap:8px;font-weight:650;font-size:1.05rem}
.gen-q-row{display:flex;gap:8px}
.gen-q-row input{flex:1;min-width:0;font:inherit;font-weight:400;font-size:1.05rem;padding:12px 18px;border-radius:999px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink)}
.gen-q-row input:focus{outline:3px solid var(--anil-claro);border-color:var(--anil)}
.gen-word .seg{align-self:flex-start}
.gen-ideias{margin-top:.8rem}
.gen-ideias a{font-weight:600}
.gen-h{font-size:1.25rem;margin:1.8rem 0 .7rem}
.gen-h small{font-family:var(--font);font-size:.9rem;font-weight:600;color:var(--muted);margin-left:.3rem}
.gen-res{margin:1rem 0 0}
.gen-vazio{margin:1.2rem 0 .2rem;font-size:1.05rem}
.tag-deb{border:1px dashed var(--line)}
/* destaques das páginas de letra */
.destaques{display:grid;gap:1.2rem 2rem;margin:1.6rem 0 2.4rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.destaque h2{font-size:1.05rem;margin:0 0 .2rem}
.destaque h2 small{display:block;font-weight:400;font-size:.85rem;color:var(--muted)}
.destaque .chips{margin:.5rem 0 0;gap:6px}
.destaque .chips a{padding:5px 12px;font-size:.9rem}
.all-head{font-size:1.15rem;margin:1rem 0 .4rem}
/* perguntas frequentes da página de nome */
.faq dt{font-weight:700;margin-top:1rem}
.faq dd{margin:.25rem 0 0}