/* =============================================================================
   iLoveSTL — sistema de design v2
   Referência atual: usestl.com — paleta, tipografia e densidade espelhadas a
   pedido. O respiro e a escala tipográfica vêm da passada anterior (Apple),
   que sobreviveu porque são estrutura, não identidade.

   O verde do neo3dprint continua restrito ao bloco de parceiro: este site é
   uma casa de ferramentas que INDICA a NEO, não uma extensão dela.

   Ordem do arquivo: tokens · reset · tipografia · layout · componentes ·
   blocos de página · movimento · responsivo.
   ========================================================================== */

/* ------------------------------------------------------------------ TOKENS */
:root{
  /* Paleta espelhada do usestl.com: fundo azulado quase preto, superfícies em
     degraus e acento menta. As bordas são sólidas, não alfa — é o que dá o
     contorno mais nítido do que o nosso desenho anterior. */
  --bg:#0b0e13;
  --bg-deep:#080b10;
  --bg-alt:#0f141b;
  --surface-1:#141a22;
  --surface-2:#1a212b;
  --surface-3:#232c38;
  --hairline:#222b37;
  --hairline-soft:#1a222d;
  --hairline-strong:#2f3a49;

  /* Texto — três níveis, nunca mais que isso */
  --text:#eef2f6;
  --text-2:#97a3b2;
  --text-3:#5d6b7a;

  /* Acento da casa */
  --accent:#14d3a6;
  --accent-hi:#22e6b6;
  --accent-dim:#0a9374;
  --accent-wash:rgba(20,211,166,.12);
  --on-accent:#04130f;

  /* Marca do parceiro (NEO 3D Print) — uso restrito ao bloco de parceiro */
  --neo:#00c94a;
  --neo-wash:rgba(0,201,74,.12);

  /* Âmbar marca o que é pago; azul, o que é consumo/energia. */
  --warn:#e8b15a;
  --warn-wash:rgba(232,177,90,.12);
  --energy:#5b8cff;
  --danger:#ff7a6e;
  --danger-wash:rgba(255,122,110,.12);

  /* Raios — os do usestl: 9 (campos), 11 (botão), 14–16 (cards) */
  --r-xs:6px;
  --r-sm:9px;
  --r-md:14px;
  --r-lg:16px;
  --r-xl:18px;
  --r-pill:999px;

  /* Fundo do viewer/ícones — um degrau abaixo da superfície */
  --viewport-bg:#10161e;

  /* Espaçamento — base 4 */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px; --s-16:64px;
  --s-20:80px; --s-24:96px; --s-30:120px; --s-40:160px;

  /* Larguras */
  --wrap:1200px;
  --wrap-narrow:760px;
  --gutter:22px;

  /* Elevação */
  --shadow-1:0 1px 2px rgba(0,0,0,.4);
  --shadow-2:0 8px 30px -12px rgba(0,0,0,.7);
  --shadow-3:0 30px 70px -30px rgba(0,0,0,.85);

  /* Movimento */
  --ease:cubic-bezier(.32,.72,0,1);
  --dur:.4s;
}

/* ------------------------------------------------------------------- RESET */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  font-feature-settings:'cv05' 1,'ss01' 1;
}
h1,h2,h3,h4,h5{margin:0;font-family:'Sora','IBM Plex Sans',sans-serif;font-weight:600;}
p{margin:0;}
ul,ol{margin:0;padding:0;list-style:none;}
a{color:inherit;text-decoration:none;}
img,svg,canvas{display:block;max-width:100%;}
button,input,textarea,select{font:inherit;color:inherit;}
button{background:none;border:none;padding:0;cursor:pointer;}
[hidden]{display:none !important;}
::selection{background:var(--accent);color:var(--on-accent);}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px;}
hr{border:none;border-top:1px solid var(--hairline);margin:0;}

/* -------------------------------------------------------------- TIPOGRAFIA */
/* Escala do usestl: título de página grande e pesado (800), títulos de seção
   pequenos (23px) — a hierarquia vem do peso, não do tamanho. */
.t-display{
  font-family:'Sora','IBM Plex Sans',sans-serif;font-weight:800;
  font-size:clamp(33px,5.2vw,56px);line-height:1.04;letter-spacing:-1.6px;
  text-wrap:balance;
}
.t-h1{
  font-family:'Sora','IBM Plex Sans',sans-serif;font-weight:800;
  font-size:clamp(28px,4vw,40px);line-height:1.1;letter-spacing:-1px;
  text-wrap:balance;
}
.t-h2{
  font-family:'Sora','IBM Plex Sans',sans-serif;font-weight:700;
  font-size:23px;line-height:1.25;letter-spacing:-.4px;
  text-wrap:balance;
}
.t-h3{
  font-family:'Sora','IBM Plex Sans',sans-serif;font-weight:600;
  font-size:16px;line-height:1.3;letter-spacing:-.2px;
}
.t-h4{font-weight:600;font-size:1rem;line-height:1.4;letter-spacing:-.01em;}
.t-lead{font-size:clamp(15px,2vw,18px);line-height:1.6;color:var(--text-2);text-wrap:pretty;}
.t-body{font-size:.95rem;line-height:1.62;color:var(--text-2);text-wrap:pretty;}
.t-caption{font-size:.84rem;line-height:1.55;color:var(--text-3);}
.t-micro{
  font-size:.7rem;font-weight:600;line-height:1.4;
  letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);
}
.t-mono{font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem;letter-spacing:-.01em;}
.t-accent{color:var(--accent);}
.t-strong{color:var(--text);font-weight:600;}
.t-center{text-align:center;}
.t-balance{text-wrap:balance;}

/* Pílula mono com ponto aceso — o "Parametric STL on demand" do usestl */
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  padding:6px 13px;border:1px solid var(--hairline-strong);border-radius:var(--r-pill);
  font:500 12px 'JetBrains Mono',ui-monospace,monospace;color:var(--text-2);
}
.eyebrow::before{
  content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 8px var(--accent);
}
.sec-head--center .eyebrow{align-self:center;}
.eyebrow--muted::before{background:var(--text-3);box-shadow:none;}

/* ------------------------------------------------------------------ LAYOUT */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter);}
.wrap-narrow{width:100%;max-width:var(--wrap-narrow);margin-inline:auto;padding-inline:var(--gutter);}
/* Ritmo do usestl: seções sem divisória, 24px em cima e 70px embaixo. */
.section{padding-block:var(--s-6) 70px;}
.section--tight{padding-block:var(--s-6) var(--s-10);}
.section--tall{padding-block:56px 70px;}
.section--alt{background:transparent;}
.section--hairline{border-top:none;}

/* Cabeçalho de seção: h2 pequeno + subtítulo curto; ação opcional à direita */
.sec-head{max-width:640px;display:flex;flex-direction:column;gap:6px;margin-bottom:20px;}
.sec-head .t-lead{font-size:13.5px;line-height:1.5;}
.sec-head--center{margin-inline:auto;text-align:center;align-items:center;max-width:720px;margin-bottom:26px;}
.sec-head--center .t-lead{font-size:15px;}
.sec-head--wide{max-width:820px;}
.sec-head--row{max-width:none;flex-direction:row;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;}
.sec-head--row > div{display:flex;flex-direction:column;gap:6px;}

.stack{display:flex;flex-direction:column;}
.stack-2{gap:var(--s-2);} .stack-3{gap:var(--s-3);} .stack-4{gap:var(--s-4);}
.stack-6{gap:var(--s-6);} .stack-8{gap:var(--s-8);} .stack-12{gap:var(--s-12);}
.row{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;}
.row--between{justify-content:space-between;}
.row--center{justify-content:center;}

.grid{display:grid;gap:16px;}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr));}

/* --------------------------------------------------------------- ÍCONES SVG */
.ico{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.ico-sm{width:16px;height:16px;}
.ico-lg{width:24px;height:24px;}

/* ----------------------------------------------------------------- BOTÕES */
/* Botão do usestl: Sora 700, raio 11px, menta com brilho embaixo. `--light`
   continua existindo no HTML e virou o primário (antes era branco). */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 20px;border-radius:11px;
  font:700 15px 'Sora','IBM Plex Sans',sans-serif;letter-spacing:-.01em;white-space:nowrap;
  border:1px solid transparent;cursor:pointer;
  transition:filter .18s ease,border-color .18s ease,color .18s ease,background .18s ease,opacity .18s ease;
}
.btn--accent,.btn--light{background:var(--accent);color:var(--on-accent);box-shadow:0 8px 22px -10px #14d3a699;}
.btn--accent:hover,.btn--light:hover{filter:brightness(1.07);}
.btn--outline{background:transparent;border-color:var(--hairline-strong);color:var(--text);}
.btn--outline:hover{border-color:var(--accent);}
.btn--ghost{background:var(--surface-2);color:var(--text-2);}
.btn--ghost:hover{background:var(--surface-3);color:var(--text);}
.btn--sm{padding:8px 14px;font-size:13px;border-radius:9px;}
.btn--lg{padding:14px 24px;font-size:15px;}
.btn--block{width:100%;}
.btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;filter:none;}

/* Link com seta — o "Saiba mais ›" da Apple */
.lnk{
  display:inline-flex;align-items:center;gap:5px;
  color:var(--accent);font-size:.92rem;font-weight:500;
  transition:gap var(--dur) var(--ease);
}
.lnk:hover{gap:9px;}
.lnk .ico{width:15px;height:15px;stroke-width:2;}
.lnk--muted{color:var(--text-2);}
.lnk--muted:hover{color:var(--text);}

/* ------------------------------------------------------------------ CHIPS */
/* `.badge` do usestl: mono caixa-alta, menta para o que existe, âmbar para o
   que é pago ou ainda não chegou. */
.tag{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 8px;border-radius:var(--r-xs);
  font:600 10px 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.4px;text-transform:uppercase;
  border:1px solid var(--hairline);color:var(--text-3);
}
.tag--live{background:var(--accent-wash);border-color:rgba(20,211,166,.3);color:var(--accent);}
.tag--soon{background:var(--warn-wash);border-color:rgba(232,177,90,.3);color:var(--warn);}
.tag--neo{color:var(--neo);border-color:rgba(0,201,74,.35);}

.chip{
  display:inline-flex;align-items:center;
  padding:5px 11px;border-radius:var(--r-xs);
  background:var(--surface-1);border:1px solid var(--hairline-soft);
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.74rem;color:var(--text-3);
}
.chip-set{display:flex;flex-wrap:wrap;gap:6px;}

/* ------------------------------------------------------------------ CARDS */
.card{
  background:var(--surface-1);border:1px solid var(--hairline);
  border-radius:var(--r-lg);padding:18px;
}
.card--pad-lg{padding:22px 22px 20px;}
.card--link{
  display:flex;flex-direction:column;gap:var(--s-3);text-align:left;
  color:var(--text);min-height:180px;
  transition:border-color .18s ease,transform .18s ease;
}
.card--link:hover{border-color:var(--accent);transform:translateY(-3px);}
.card--link[aria-disabled="true"]{cursor:default;}
.card--link[aria-disabled="true"]:hover{border-color:var(--hairline-soft);background:var(--surface-1);transform:none;}
.card--link[aria-disabled="true"] .card-title,
.card--link[aria-disabled="true"] .card-ico{color:var(--text-3);}
.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3);}
.card-ico{color:var(--accent);}
.card-title{color:var(--text);}
.card-foot{margin-top:auto;padding-top:var(--s-3);}

/* Lista chave/valor — usada nas especificações de cada ferramenta */
.specs{
  display:grid;gap:1px;background:var(--hairline-soft);
  border:1px solid var(--hairline-soft);border-radius:var(--r-md);overflow:hidden;
}
.spec{display:grid;grid-template-columns:64px 1fr;gap:var(--s-4);background:var(--surface-1);padding:var(--s-4) var(--s-5);}
.spec-k{font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);padding-top:3px;}
.spec-v{font-size:.9rem;line-height:1.55;color:var(--text-2);}
.spec-v b{color:var(--text);font-weight:600;}

/* Métricas grandes (prova) */
.metrics{display:grid;gap:1px;background:var(--hairline-soft);border:1px solid var(--hairline-soft);border-radius:var(--r-md);overflow:hidden;}
.metric{background:var(--surface-1);padding:var(--s-6);text-align:center;}
.metric-n{font-family:'Sora','IBM Plex Sans',sans-serif;font-size:1.9rem;font-weight:600;letter-spacing:-.03em;line-height:1;}
.metric-l{margin-top:6px;font-size:.78rem;color:var(--text-3);}

/* ------------------------------------------------------- BARRA + CABEÇALHO */
.banner{
  position:relative;background:var(--surface-1);border-bottom:1px solid var(--hairline-soft);
  font-size:.82rem;color:var(--text-2);
}
.banner-inner{
  max-width:var(--wrap);margin-inline:auto;padding:9px 48px 9px var(--gutter);
  display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;text-align:center;
}
.banner strong{color:var(--text);font-weight:600;}
.banner .lnk{font-size:.82rem;}
.banner-close{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  color:var(--text-3);display:grid;place-items:center;width:24px;height:24px;border-radius:var(--r-xs);
}
.banner-close:hover{color:var(--text);background:var(--surface-2);}

/* Barra do usestl: largura total, vidro sobre o fundo, links em cinza e o
   ativo em menta, controles à direita em caixinhas de 36px. */
.siteheader{
  position:sticky;top:0;z-index:100;
  background:color-mix(in srgb,var(--bg) 80%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hairline);
}
.siteheader-inner{
  padding:13px 22px;display:flex;align-items:center;gap:16px;
}
.brand{display:inline-flex;align-items:center;gap:10px;font:800 19px 'Sora','IBM Plex Sans',sans-serif;letter-spacing:-.5px;color:var(--text);}
.brand b{color:var(--accent);font-weight:800;}
.brand-mark{
  width:28px;height:28px;border-radius:8px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--accent-hi),var(--accent-dim));color:var(--on-accent);
  box-shadow:0 0 14px -2px rgba(20,211,166,.45);
}
.brand-mark .ico{width:15px;height:15px;stroke-width:2;}
.mainnav{display:flex;align-items:center;gap:2px;margin-left:12px;}
.mainnav a{
  padding:8px 13px;font:500 14px 'IBM Plex Sans',sans-serif;color:var(--text-2);
  transition:color .18s ease;
}
.mainnav a:hover{color:var(--text);}
.mainnav a[aria-current="page"]{color:var(--accent);font-weight:600;}
.nav-badge{
  display:inline-block;margin-left:6px;padding:2px 5px;border-radius:5px;
  background:var(--accent-wash);color:var(--accent);
  font:700 9px 'JetBrains Mono',monospace;letter-spacing:.06em;text-transform:uppercase;vertical-align:1.5px;
}
.header-end{margin-left:auto;display:flex;align-items:center;gap:11px;}
.header-tag,.langswitch{
  display:inline-flex;align-items:center;height:36px;padding:0 11px;
  background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--r-sm);
  font:500 11px 'JetBrains Mono',monospace;letter-spacing:.04em;color:var(--text-2);
}
.header-tag{text-transform:uppercase;color:var(--text-3);}
.langswitch{transition:color .18s ease,border-color .18s ease;}
.langswitch:hover{color:var(--text);border-color:var(--accent);}
.navtoggle{display:none;width:36px;height:36px;border-radius:var(--r-sm);border:1px solid var(--hairline-strong);background:var(--surface-1);color:var(--text-2);place-items:center;}
.navtoggle:hover{color:var(--text);border-color:var(--accent);}

/* -------------------------------------------------------- PAINEL DA FERRAMENTA */
.panel{
  background:var(--surface-1);border:1px solid var(--hairline);
  border-radius:var(--r-lg);padding:18px;
}
.panel-head{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  padding:0 var(--s-1) var(--s-4);border-bottom:1px solid var(--hairline-soft);margin-bottom:var(--s-5);
}
.panel-title{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);}
.panel-state{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;color:var(--text-3);}
.panel-state::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);}
.panel-state--soon::before{background:var(--warn);}

.dropzone{
  position:relative;display:grid;place-items:center;text-align:center;
  border:1px dashed var(--hairline-strong);border-radius:var(--r-md);
  background:var(--surface-2);padding:var(--s-12) var(--s-6);cursor:pointer;
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease);
}
.dropzone:hover,.dropzone.is-over{border-color:var(--accent);background:var(--accent-wash);}
.dropzone-ico{
  margin-inline:auto;
  width:52px;height:52px;border-radius:var(--r-md);display:grid;place-items:center;
  background:var(--surface-3);border:1px solid var(--hairline-soft);color:var(--accent);
  margin-bottom:var(--s-4);
}
.dropzone-ico .ico{width:22px;height:22px;}
.dropzone-title{font-family:'Sora','IBM Plex Sans',sans-serif;font-weight:600;font-size:1.05rem;letter-spacing:-.02em;}
.dropzone-sub{margin-top:5px;font-size:.85rem;color:var(--text-3);}
.dropzone-foot{margin-top:var(--s-4);display:inline-flex;align-items:center;gap:6px;font-size:.76rem;color:var(--text-3);}

.status{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:var(--s-4);font-size:.9rem;color:var(--text-2);}
.spinner{width:15px;height:15px;border-radius:50%;border:2px solid var(--hairline-strong);border-top-color:var(--accent);animation:spin .75s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

.alert{margin-top:var(--s-4);padding:11px 14px;border-radius:var(--r-sm);font-size:.86rem;line-height:1.5;}
.alert--error{background:var(--danger-wash);border:1px solid rgba(255,122,110,.28);color:var(--danger);}
.alert--warn{background:var(--warn-wash);border:1px solid rgba(255,194,71,.28);color:var(--warn);}

/* --------------------------------------------------------- RESULTADO / 3D */
.result{display:flex;flex-direction:column;gap:var(--s-4);}
.viewer{
  position:relative;height:300px;border-radius:var(--r-md);overflow:hidden;
  border:1px solid var(--hairline-soft);background:var(--surface-2);
  display:grid;place-items:center;
}
.viewer canvas{display:block;}
.viewer-loading{grid-area:1/1;font-size:.82rem;color:var(--text-3);}
.viewer-hint{
  position:absolute;left:12px;bottom:11px;z-index:2;pointer-events:none;
  padding:4px 9px;border-radius:var(--r-xs);
  background:rgba(8,9,10,.72);border:1px solid var(--hairline-soft);
  font-size:.7rem;color:var(--text-3);
}
.result-head{display:flex;align-items:center;gap:var(--s-3);}
.result-check{
  width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--accent);color:var(--on-accent);
}
.result-check .ico{width:14px;height:14px;stroke-width:2.5;}
.result-name{font-size:.92rem;font-weight:600;word-break:break-all;line-height:1.3;}
.result-sub{font-size:.78rem;color:var(--text-3);}
.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hairline-soft);border:1px solid var(--hairline-soft);border-radius:var(--r-sm);overflow:hidden;}
.statgrid > div{background:var(--surface-2);padding:11px 13px;}
.statgrid b{display:block;font-family:'Sora','IBM Plex Sans',sans-serif;font-size:.98rem;font-weight:600;letter-spacing:-.02em;}
.statgrid span{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);}
.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-2);}

/* Convite de impressão dentro do resultado — discreto, sem gritar */
.handoff{
  border:1px solid var(--hairline);border-radius:var(--r-md);
  background:var(--surface-2);padding:var(--s-5);
}
.handoff-top{display:flex;align-items:center;gap:8px;margin-bottom:var(--s-3);}
.handoff-dot{width:7px;height:7px;border-radius:50%;background:var(--neo);flex:none;}
.handoff-label{font-size:.66rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);}
.handoff p{font-size:.88rem;line-height:1.55;color:var(--text-2);margin-bottom:var(--s-4);}
.handoff p b{color:var(--text);font-weight:600;}

/* ------------------------------------------------------------- PARCEIRO */
.partner-note{font-size:.78rem;line-height:1.5;color:var(--text-3);text-align:center;}
.partner-note code{
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--neo);
  background:var(--neo-wash);border:1px dashed rgba(0,201,74,.35);
  padding:2px 7px;border-radius:var(--r-xs);
}
.disclosure{
  margin:22px auto 0;font-size:12px;line-height:1.6;color:var(--text-3);max-width:80ch;text-align:center;
}

/* Faixa de indicação em linha */
.handoff-bar{
  display:flex;align-items:center;gap:var(--s-4);
  border:1px solid var(--hairline-soft);border-left:2px solid var(--neo);
  border-radius:var(--r-md);background:var(--surface-1);padding:var(--s-5) var(--s-6);
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease);
}
a.handoff-bar:hover{background:var(--surface-2);border-color:var(--hairline);border-left-color:var(--neo);}
.handoff-bar p{font-size:.9rem;color:var(--text-2);}
.handoff-bar b{color:var(--text);font-weight:600;}
.handoff-bar .ico{color:var(--neo);}
.handoff-bar-end{margin-left:auto;color:var(--neo);}

/* ----------------------------------------------------------------- FAQ */
.faq{display:grid;gap:var(--s-2);}
.faq details{
  border:1px solid var(--hairline);border-radius:var(--r-md);
  background:var(--surface-1);transition:border-color var(--dur) var(--ease);
}
.faq details[open]{border-color:var(--hairline-strong);}
.faq summary{
  list-style:none;cursor:pointer;padding:var(--s-5) var(--s-6);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  font-size:.95rem;font-weight:550;letter-spacing:-.01em;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary .ico{color:var(--accent);transition:transform var(--dur) var(--ease);}
.faq details[open] summary .ico{transform:rotate(45deg);}
.faq-answer{padding:0 var(--s-6) var(--s-6);font-size:.9rem;line-height:1.65;color:var(--text-2);max-width:70ch;}

/* ------------------------------------------------------------- RODAPÉ */
/* Rodapé do usestl: uma linha só — marca, links, copyright em mono. */
.sitefooter{padding-block:0 var(--s-6);}
.footer-row{
  display:flex;align-items:center;gap:6px 22px;flex-wrap:wrap;
  padding-top:var(--s-6);border-top:1px solid var(--hairline);
}
.footer-row .brand{font-size:14px;font-weight:700;color:var(--text-2);gap:8px;}
.footer-row .brand-mark{width:20px;height:20px;border-radius:6px;box-shadow:none;}
.footer-row .brand-mark .ico{width:11px;height:11px;}
.footer-links{display:flex;flex-wrap:wrap;gap:6px 18px;}
.footer-links a{font-size:13px;color:var(--text-2);}
.footer-links a:hover{color:var(--text);}
.footer-copy{margin-left:auto;font:500 11.5px 'JetBrains Mono',monospace;color:var(--text-3);}

/* ------------------------------------------------------------- MODAL */
.modal{
  position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:var(--s-5);
  background:rgba(2,3,2,.78);backdrop-filter:blur(6px);
}
.modal-card{
  position:relative;width:100%;max-width:420px;
  background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--r-lg);
  padding:var(--s-8);box-shadow:var(--shadow-3);
}
.modal-close{position:absolute;top:14px;right:14px;width:28px;height:28px;border-radius:var(--r-xs);display:grid;place-items:center;color:var(--text-3);}
.modal-close:hover{color:var(--text);background:var(--surface-2);}
.modal-card h3{margin-bottom:var(--s-3);}
.modal-card p{font-size:.9rem;line-height:1.6;color:var(--text-2);}
.modal-actions{margin-top:var(--s-6);display:grid;gap:var(--s-2);}

/* --------------------------------------------------------- FORMULÁRIO */
.field{display:flex;flex-direction:column;gap:6px;}
.field-label{font-size:.68rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--text-3);}
.field input[type="number"],.field input[type="text"],.field select,.field textarea{
  width:100%;padding:11px 13px;border-radius:var(--r-sm);
  background:var(--surface-2);border:1px solid var(--hairline-soft);
  font-size:.94rem;font-weight:500;color:var(--text);
  transition:border-color var(--dur) var(--ease);
}
.field input:hover{border-color:var(--hairline);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash);}
.field textarea{resize:vertical;line-height:1.55;}
.field textarea:disabled{color:var(--text-3);cursor:not-allowed;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);}

.choice{display:flex;flex-direction:column;gap:8px;}
.choice-label{font-size:.68rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--text-3);}
.choice-opts{display:grid;gap:6px;}
.choice-opts label{display:flex;align-items:center;gap:8px;font-size:.87rem;color:var(--text-2);cursor:pointer;}
.choice-opts input[type="radio"]{accent-color:var(--accent);width:15px;height:15px;}
.choice-opts label:hover{color:var(--text);}

.box-viewer{
  --viewer-accent:#d2ff4a;
  height:260px;border-radius:var(--r-md);overflow:hidden;
  border:1px solid var(--hairline-soft);background:var(--surface-2);
  display:grid;place-items:center;font-size:.82rem;color:var(--text-3);
}
.box-viewer canvas{display:block;}
.box-out{display:grid;gap:var(--s-3);margin-top:var(--s-5);}
.box-out img{border:1px solid var(--hairline-soft);border-radius:var(--r-sm);background:#fff;padding:12px;max-height:300px;object-fit:contain;width:100%;}

/* ----------------------------------------------------------- MOVIMENTO */
.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.js .reveal.is-in{opacity:1;transform:none;}

/* ---------------------------------------------------------- RESPONSIVO */
@media (max-width:900px){
  :root{--gutter:20px;}
  .section{padding-block:var(--s-16);}
  .section--tall{padding-block:var(--s-20);}
  .grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mainnav{
    display:none;position:absolute;top:56px;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:2px;
    background:var(--bg);border-bottom:1px solid var(--hairline);padding:var(--s-3) var(--gutter) var(--s-5);
  }
  .mainnav.is-open{display:flex;}
  .mainnav a{padding:11px 12px;font-size:.95rem;}
  .navtoggle{display:grid;}
  .header-end{gap:var(--s-2);}
  .header-tag{display:none;}
}
@media (max-width:640px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
  .field-row{grid-template-columns:1fr;}
  .result-actions{grid-template-columns:1fr;}
  .statgrid{grid-template-columns:1fr 1fr;}
  .footer-copy{margin-left:0;}
  .spec{grid-template-columns:52px 1fr;gap:var(--s-3);padding:var(--s-4);}
  .handoff-bar{flex-direction:column;align-items:flex-start;gap:var(--s-3);}
  .handoff-bar-end{margin-left:0;}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;}
  html{scroll-behavior:auto;}
  .js .reveal{opacity:1;transform:none;}
}

/* ===================== BLOCOS DE PÁGINA ===================================
   Componentes que só existem no corpo das páginas — mantidos no fim para o
   topo do arquivo continuar sendo só tokens e primitivos.
   ========================================================================== */

/* Coluna central onde mora a ferramenta: mesma largura em todas as páginas,
   para o painel não "pular" de tamanho ao trocar de ferramenta. */
.tool-column{width:100%;max-width:760px;margin-inline:auto;}

/* Faixa de garantias sob o painel */
.trust-strip{
  display:grid;grid-template-columns:repeat(3,1fr);
  margin-top:var(--s-6);border:1px solid var(--hairline-soft);border-radius:var(--r-md);
  overflow:hidden;background:var(--surface-1);
}
.trust-strip li{
  display:flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 16px;font-size:.82rem;color:var(--text-3);text-align:center;
}
.trust-strip li + li{border-left:1px solid var(--hairline-soft);}
.trust-strip .ico{color:var(--accent);}

/* Passos numerados */
.step{
  border-top:1px solid var(--hairline);padding-top:var(--s-5);
  display:flex;flex-direction:column;gap:var(--s-2);
}
.step-n{
  font-family:'Sora','IBM Plex Sans',sans-serif;font-size:.78rem;font-weight:600;
  letter-spacing:.1em;color:var(--accent);
}

/* Chip clicável (atalho de formato) */
.chip--link{transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease),background var(--dur) var(--ease);}
.chip--link:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-wash);}

/* Cartão de formato */
.format-card{display:flex;flex-direction:column;scroll-margin-top:88px;}
.format-card .card-foot{margin-top:auto;}

/* Métricas do parceiro */
.metrics{grid-template-columns:repeat(3,minmax(0,1fr));}

@media (max-width:640px){
  .trust-strip{grid-template-columns:1fr;}
  .trust-strip li + li{border-left:none;border-top:1px solid var(--hairline-soft);}
  .step{padding-top:var(--s-4);}
}

/* Link de pulo: invisível até receber foco pelo teclado. */
.skiplink{
  position:absolute;left:-9999px;top:0;z-index:400;
  background:var(--accent);color:var(--on-accent);
  padding:10px 18px;border-radius:0 0 var(--r-sm) 0;font-size:.88rem;font-weight:600;
}
.skiplink:focus{left:0;}

/* Trilha das páginas de formato */
.crumbs{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding-top:var(--s-6);font-size:.8rem;color:var(--text-3);
}
.crumbs a:hover{color:var(--text);}
.crumbs span[aria-current]{color:var(--text-2);}

/* ===================== GERADOR DE PEÇAS ===================================
   Abas de molde + formulário montado a partir do schema do servidor.
   ========================================================================== */
/* Miniatura renderizada do molde no card (a grade de modelos) */
.model-thumb--img{height:190px;overflow:hidden;}
/* O PNG sai com margem larga (serve a qualquer proporção de peça); a escala
   aproxima sem precisar renderizar de novo. Categoria e selo ficam por cima. */
.model-thumb--img img{width:100%;height:100%;object-fit:contain;padding:10px 0 4px;transform:scale(1.12);filter:drop-shadow(0 14px 18px rgba(0,0,0,.45));}
.model-thumb--img .model-cat,.model-thumb--img .tag{z-index:1;}
.molde-voltar{display:inline-flex;margin-bottom:var(--s-3);font-size:13px;color:var(--text-2);}
.molde-voltar:hover{color:var(--accent);}
.molde-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--s-5);}
.molde-tab{
  padding:8px 15px;border-radius:var(--r-pill);
  border:1px solid var(--hairline);background:var(--surface-2);
  font-size:.83rem;font-weight:500;color:var(--text-2);
  transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease),background var(--dur) var(--ease);
}
.molde-tab:hover{color:var(--text);border-color:var(--hairline-strong);}
.molde-tab.is-active{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600;}

.molde-resumo{font-size:.88rem;line-height:1.55;color:var(--text-3);margin-bottom:var(--s-5);}

.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);margin-bottom:var(--s-5);}
.field-help{font-size:.75rem;line-height:1.45;color:var(--text-3);text-transform:none;letter-spacing:0;font-weight:400;}

@media (max-width:640px){
  .field-grid{grid-template-columns:1fr;}
}

/* ===================== BLOCOS DO USESTL ===================================
   Peças espelhadas do usestl.com. Medidas tiradas do CSS deles — cópia em
   docs/usestl-ref/usestl-index.css, mapa em docs/usestl-ref/LAYOUT.md.
   ========================================================================== */

/* Hero alinhado à esquerda */
.hero{max-width:var(--wrap);margin:0 auto;padding:56px var(--gutter) 14px;display:flex;flex-direction:column;}
.hero .eyebrow{margin-bottom:22px;}
.hero h1{max-width:780px;margin-bottom:18px;}
.hero .t-lead{max-width:580px;margin-bottom:28px;}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:38px;}

/* Ferramenta à esquerda, apoio à direita — o layout da página de modelo */
.tool-split{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:22px;align-items:start;}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;}
.card-head h3{font:600 15px 'Sora',sans-serif;margin:0;}
.card-head .t-mono{font-size:11px;color:var(--text-3);}
.mini-steps{display:grid;gap:14px;counter-reset:passo;}
.mini-steps li{display:grid;grid-template-columns:26px 1fr;gap:12px;}
.mini-steps li::before{
  counter-increment:passo;content:counter(passo);
  width:26px;height:26px;border-radius:8px;display:grid;place-items:center;
  background:var(--viewport-bg);color:var(--accent);font:600 12px 'JetBrains Mono',monospace;
}
.mini-steps b{display:block;font:600 13.5px 'Sora',sans-serif;color:var(--text);margin-bottom:2px;}
.mini-steps span{font-size:12.5px;line-height:1.5;color:var(--text-2);}
.check-list{display:grid;gap:9px;}
.check-list li{display:grid;grid-template-columns:16px 1fr;gap:10px;font-size:13px;line-height:1.5;color:var(--text-2);}
.check-list .ico{width:14px;height:14px;color:var(--accent);stroke-width:2.2;margin-top:3px;}
.check-list b{color:var(--text);font-weight:600;}
.card-sep{border-top:1px solid var(--hairline);margin:18px 0;}

/* Tiles de categoria (aqui: formatos) */
/* 10 formatos: 5 por linha fecha em duas linhas cheias */
.cat-tiles{display:grid;gap:12px;grid-template-columns:repeat(5,minmax(0,1fr));}
.cat-tile{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  min-height:132px;padding:16px 8px 14px;text-align:center;
  border:1px solid var(--hairline);border-radius:var(--r-md);background:var(--surface-1);color:var(--text);
  transition:border-color .18s ease,transform .18s ease;
}
.cat-tile:hover{border-color:var(--accent);transform:translateY(-3px);}
.cat-tile-icon{
  display:grid;place-items:center;width:58px;height:58px;border-radius:var(--r-md);
  background:var(--viewport-bg);color:var(--accent);font:600 13px 'JetBrains Mono',monospace;
}
.cat-tile-name{font:600 13.5px 'Sora',sans-serif;letter-spacing:-.2px;line-height:1.25;}
.cat-tile-count{font:500 11.5px 'JetBrains Mono',monospace;color:var(--text-3);}

/* Card de modelo: thumb escuro com brilho, categoria e badge por cima */
.model-card{
  display:flex;flex-direction:column;
  background:var(--surface-1);border:1px solid var(--hairline);border-radius:15px;overflow:hidden;color:var(--text);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
a.model-card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 16px 36px -16px #000000b3;}
.model-thumb{
  position:relative;height:150px;display:grid;place-items:center;
  background:radial-gradient(60% 55% at 50% 72%,rgba(20,211,166,.14),transparent 70%),var(--viewport-bg);
  border-bottom:1px solid var(--hairline);
}
.model-thumb > .ico{width:56px;height:56px;stroke-width:1.2;color:#8fd8c4;filter:drop-shadow(0 10px 18px rgba(0,0,0,.6));}
.model-card[aria-disabled="true"] .model-thumb > .ico{color:var(--text-3);}
.model-cat{position:absolute;left:12px;top:11px;font:500 10.5px 'JetBrains Mono',monospace;letter-spacing:.4px;text-transform:uppercase;color:var(--text-2);}
.model-thumb .tag{position:absolute;right:11px;top:10px;}
.model-body{display:flex;flex-direction:column;flex:1;padding:14px 15px 15px;}
.model-body h3{font:600 16px 'Sora',sans-serif;margin:0 0 5px;letter-spacing:-.2px;}
.model-desc{color:var(--text-2);font-size:12.5px;line-height:1.5;margin:0 0 13px;min-height:38px;}
.model-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:11px;border-top:1px solid var(--hairline);}
.model-price{font:600 13px 'JetBrains Mono',monospace;color:var(--accent);}
.model-card[aria-disabled="true"] .model-price{color:var(--text-3);}
.model-open{font:500 12px 'IBM Plex Sans',sans-serif;color:var(--text-2);}

/* Teaser de dois cards (no usestl, grátis × assinatura; aqui, ferramenta × impressão) */
.teaser-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:860px;margin:0 auto;}
.teaser-card{background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:22px 22px 20px;}
.teaser-card h3{font:700 16px 'Sora',sans-serif;letter-spacing:-.2px;margin:0 0 10px;}
.teaser-card--paid{border-color:color-mix(in srgb,var(--warn) 45%,var(--hairline));}
.teaser-stat{display:flex;align-items:baseline;gap:8px;margin:0 0 14px;font:700 24px 'JetBrains Mono',monospace;color:var(--accent);white-space:nowrap;}
.teaser-stat small{font:500 12px 'IBM Plex Sans',sans-serif;color:var(--text-2);white-space:normal;}
.teaser-card--paid .teaser-stat{color:var(--warn);}
.teaser-card--paid .check-list .ico{color:var(--warn);}
.teaser-cta{display:flex;justify-content:center;gap:10px;margin-top:24px;flex-wrap:wrap;}

@media (max-width:1080px){
  .cat-tiles{grid-template-columns:repeat(5,minmax(0,1fr));}
  .tool-split{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .cat-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .cat-tile{min-height:116px;padding:12px 8px 10px;}
  .cat-tile-icon{width:48px;height:48px;}
  .teaser-grid{grid-template-columns:1fr;}
  .hero{padding-top:36px;}
  .model-thumb--img img{transform:none;}
}

/* ===================== PÁGINA DO MOLDE ====================================
   Como a página de modelo do usestl, com os lados trocados: parâmetros à
   esquerda, prévia à direita. No celular a prévia sobe para o topo.
   ========================================================================== */
.molde-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px;}
.molde-trilha{display:flex;align-items:center;gap:12px;min-width:0;}
.molde-trilha a{font:500 15px 'IBM Plex Sans',sans-serif;color:var(--accent);white-space:nowrap;}
.molde-trilha span{color:var(--text-3);}
.molde-nome{font:600 17px 'Sora',sans-serif;letter-spacing:-.2px;margin:0;}
#moldePainel .molde-resumo{font-size:14px;color:var(--text-2);max-width:78ch;margin-bottom:20px;}

/* Mesma altura nas duas caixas: quem manda é a prévia. `contain:size` tira
   os parâmetros do cálculo da linha do grid (senão a lista longa esticava a
   linha), e a caixa estica até a altura da prévia com a lista rolando dentro. */
.molde-split{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(0,1.45fr);gap:22px;align-items:stretch;}
.molde-params{contain:size;display:flex;flex-direction:column;padding:20px 8px 12px 20px;overflow:hidden;}
.molde-params .card-head{padding-right:12px;flex:none;}
.molde-params form{flex:1;min-height:0;overflow-y:auto;padding-right:12px;scrollbar-width:thin;scrollbar-color:var(--hairline-strong) transparent;}
.molde-params .card-head h3{font-size:17px;}

.param{padding:12px 0;border-top:1px solid var(--hairline-soft);}
.param:first-child{border-top:none;padding-top:0;}
.param-topo{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.param-label{font-size:13.5px;font-weight:500;color:var(--text);}
.param-valor{font:500 12.5px 'JetBrains Mono',monospace;color:var(--accent);max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.param-input{width:100%;padding:11px 13px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--hairline-strong);font:500 14px 'JetBrains Mono',monospace;color:var(--text);}
.param-input:focus,.param-num:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash);}
.molde-tipos{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px;}
.molde-tipo{display:flex;gap:12px;align-items:flex-start;text-align:left;padding:14px 16px;border-radius:var(--r-md,14px);background:var(--surface,#141a22);border:1px solid var(--hairline-strong);color:var(--text);cursor:pointer;}
.molde-tipo .ico{flex:none;width:22px;height:22px;margin-top:2px;color:var(--text-2);}
.molde-tipo b{display:block;font:600 15px 'Sora',sans-serif;}
.molde-tipo small{display:block;margin-top:3px;font-size:12.5px;line-height:1.45;color:var(--text-2);}
.molde-tipo:hover{border-color:var(--text-3);}
.molde-tipo.is-active{border-color:var(--accent);background:var(--accent-wash);}
.molde-tipo.is-active .ico{color:var(--accent);}
.dropzone--fina{display:flex;align-items:center;gap:14px;min-height:0;padding:14px 18px;margin-bottom:18px;text-align:left;}
.dropzone--fina .ico{flex:none;width:22px;height:22px;color:var(--accent);}
.dropzone--fina p{margin:0;flex:1;}
.dropzone--fina p b{display:block;font:600 14.5px 'Sora',sans-serif;}
.dropzone--fina p span{font-size:12.5px;color:var(--text-2);}
.dropzone-demo{flex:none;font:500 11.5px 'JetBrains Mono',monospace;color:var(--warn,#e8b15a);}
.molde-presets{display:flex;flex-wrap:wrap;gap:6px;padding:4px 0 12px;}
.molde-preset{padding:6px 11px;border-radius:999px;background:var(--bg);border:1px solid var(--hairline-strong);font:500 12.5px 'IBM Plex Sans',sans-serif;color:var(--text-2);cursor:pointer;}
.molde-preset:hover{color:var(--text);border-color:var(--text-3);}
.molde-preset.is-active{color:var(--accent);border-color:var(--accent);background:var(--accent-wash);}
@media (max-width:820px){.molde-tipos{grid-template-columns:1fr;}.dropzone-demo{display:none;}}
.reparo-veredito{margin:0 0 12px;padding:10px 12px;border-radius:10px;font:600 14px 'Sora',sans-serif;background:var(--accent-wash);color:var(--accent);}
.reparo-veredito[data-ok="nao"]{background:rgba(232,177,90,.12);color:var(--warn,#e8b15a);}
.reparo-tabela{width:100%;border-collapse:collapse;font:500 13px 'JetBrains Mono',monospace;}
.reparo-tabela th{font-weight:500;color:var(--text-3);text-align:right;padding:4px 0;}
.reparo-tabela td{padding:6px 0;border-top:1px solid var(--hairline,#222b37);text-align:right;color:var(--text);}
.reparo-tabela td:first-child{text-align:left;color:var(--text-2);font-family:'IBM Plex Sans',sans-serif;}
.reparo-tabela td[data-ruim]{color:var(--warn,#e8b15a);}
.reparo-tabela td[data-bom]{color:var(--accent);}
.reparo-opcao{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:var(--text);cursor:pointer;}
.reparo-opcao input{margin-top:3px;accent-color:var(--accent);}
.molde-giro{display:flex;align-items:center;gap:6px;}
.molde-giro .btn{padding:5px 8px;font:500 11px 'JetBrains Mono',monospace;}
.param-arquivo{font:500 12px 'JetBrains Mono',monospace;color:var(--text-2,#97a3b2);cursor:pointer;}
.param-tirar{margin-left:8px;padding:0;background:none;border:none;font:500 12px 'JetBrains Mono',monospace;color:var(--accent);cursor:pointer;text-decoration:underline;}
.param-cor{width:52px;height:30px;padding:2px;border-radius:7px;background:var(--bg);border:1px solid var(--hairline-strong);cursor:pointer;}
.param-cor::-webkit-color-swatch-wrapper{padding:0;}
.param-cor::-webkit-color-swatch{border:none;border-radius:5px;}
.param-num{width:78px;padding:5px 8px;border-radius:7px;background:var(--bg);border:1px solid var(--hairline-strong);font:500 13px 'JetBrains Mono',monospace;color:var(--accent);text-align:right;}
.param-slider{width:100%;accent-color:var(--accent);margin:2px 0 0;}
.param .field-help{margin-top:6px;}

.molde-preview{padding:0;overflow:hidden;}
.preview-head{display:flex;align-items:baseline;gap:12px;padding:16px 20px;border-bottom:1px solid var(--hairline);}
.preview-head h3{font:600 17px 'Sora',sans-serif;margin:0;}
.preview-estado{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font:600 11px 'JetBrains Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);}
.preview-estado::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;}
.preview-estado[data-tipo="gerando"]{color:var(--warn);}
.preview-estado[data-tipo="gerando"]::before{animation:pulso 1s ease-in-out infinite;}
.preview-estado[data-tipo="erro"]{color:var(--danger);}
@keyframes pulso{50%{opacity:.25;}}

.molde-viewer{height:min(62vh,560px);border:none;border-radius:0;
  background:radial-gradient(70% 60% at 50% 95%,rgba(20,211,166,.1),transparent 70%),var(--viewport-bg);}
.vista-pills{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:2;display:flex;gap:2px;padding:3px;border-radius:10px;
  background:rgba(11,14,19,.8);border:1px solid var(--hairline);}
.vista-pills button{padding:6px 12px;border-radius:7px;font:500 12px 'JetBrains Mono',monospace;color:var(--text-2);white-space:nowrap;}
.vista-pills button:hover{color:var(--text);}
.vista-pills button.is-active{background:var(--accent-wash);color:var(--accent);}
.molde-preview .alert{margin:0;border-radius:0;}

.preview-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:14px 20px;border-top:1px solid var(--hairline);}
.preview-arquivo p.t-mono{font-size:14px;color:var(--text);}
.preview-acoes{display:flex;gap:8px;align-items:center;}
.molde-parceiro{margin-top:18px;}

@media (max-width:900px){
  .molde-split{grid-template-columns:1fr;}
  .molde-preview{order:-1;}
  .molde-params{contain:none;}
  .molde-params form{overflow:visible;}
  .molde-viewer{height:340px;}
  .vista-pills{max-width:calc(100% - 20px);overflow-x:auto;}
}

/* Carregando da prévia: uma impressora desenhando a peça. Seis camadas sobem
   uma a uma enquanto o bico varre cada uma; o ciclo some e recomeça. Cada
   camada tem o próprio @keyframes porque o momento de começar e o de sumir
   são diferentes por camada, e animation-delay deslocaria também o sumiço. */
.imprimindo{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  background:rgba(11,14,19,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s;}
.imprimindo.is-on{opacity:1;visibility:visible;}
.imprimindo p{font:500 12px 'JetBrains Mono',monospace;letter-spacing:.04em;color:var(--text-2);}
.reticencias::after{content:'';display:inline-block;width:1.5em;text-align:left;animation:reticencias 1.2s steps(4) infinite;}
@keyframes reticencias{0%{content:'';}25%{content:'.';}50%{content:'..';}75%{content:'...';}}
.imprimindo-mesa{position:relative;width:76px;height:64px;border-bottom:2px solid var(--hairline-strong);animation:mesa 3.2s linear infinite;}
.camada{position:absolute;left:4px;right:4px;height:6px;border-radius:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;
  box-shadow:0 0 10px -2px rgba(20,211,166,.7);}
.bico{position:absolute;left:0;width:10px;height:12px;background:var(--text-2);clip-path:polygon(0 0,100% 0,65% 100%,35% 100%);
  animation:bico-x 0.4s linear 0.15s infinite,bico-y 3.2s steps(1) infinite;}
@keyframes mesa{0%,86%{opacity:1;}96%,100%{opacity:0;}}
@keyframes bico-x{0%{transform:translateX(0);}100%{transform:translateX(66px);}}

.camada:nth-of-type(1){bottom:2px;animation:camada1 3.2s linear infinite;}
@keyframes camada1{0%,4.7%{transform:scaleX(0);}15.9%,100%{transform:scaleX(1);}}
.camada:nth-of-type(2){bottom:10px;animation:camada2 3.2s linear infinite;}
@keyframes camada2{0%,17.2%{transform:scaleX(0);}28.4%,100%{transform:scaleX(1);}}
.camada:nth-of-type(3){bottom:18px;animation:camada3 3.2s linear infinite;}
@keyframes camada3{0%,29.7%{transform:scaleX(0);}40.9%,100%{transform:scaleX(1);}}
.camada:nth-of-type(4){bottom:26px;animation:camada4 3.2s linear infinite;}
@keyframes camada4{0%,42.2%{transform:scaleX(0);}53.4%,100%{transform:scaleX(1);}}
.camada:nth-of-type(5){bottom:34px;animation:camada5 3.2s linear infinite;}
@keyframes camada5{0%,54.7%{transform:scaleX(0);}65.9%,100%{transform:scaleX(1);}}
.camada:nth-of-type(6){bottom:42px;animation:camada6 3.2s linear infinite;}
@keyframes camada6{0%,67.2%{transform:scaleX(0);}78.4%,100%{transform:scaleX(1);}}
@keyframes bico-y{0%{bottom:9px;}4.7%{bottom:9px;}17.2%{bottom:17px;}29.7%{bottom:25px;}42.2%{bottom:33px;}54.7%{bottom:41px;}67.2%{bottom:49px;}}
@media (prefers-reduced-motion:reduce){.imprimindo-mesa,.bico,.camada{animation:none;}.camada{transform:scaleX(1);}}

/* Seletor de fonte: cada opção desenhada na própria fonte, com o texto digitado */
.fonte-select{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;}
.fonte-picker{position:relative;}
.fonte-atual{width:100%;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px;text-align:left;
  padding:10px 13px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--hairline-strong);color:var(--text);}
.fonte-atual:hover,.fonte-atual[aria-expanded="true"]{border-color:var(--accent);}
.fonte-atual .fonte-amostra{font-size:24px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fonte-atual .fonte-rotulo{grid-column:1;font:500 11px 'JetBrains Mono',monospace;color:var(--text-3);}
.fonte-seta{grid-column:2;grid-row:1 / span 2;color:var(--text-3);}
.fonte-grade{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:6px;padding:6px;max-height:320px;overflow-y:auto;
  border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--hairline-strong);}
.fonte-opcao{display:flex;flex-direction:column;gap:2px;text-align:left;padding:9px 10px;border-radius:8px;border:1px solid transparent;color:var(--text);}
.fonte-opcao:hover{background:var(--surface-2);}
.fonte-opcao[aria-selected="true"]{border-color:var(--accent);background:var(--accent-wash);}
.fonte-opcao .fonte-amostra{font-size:20px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fonte-opcao .fonte-rotulo{font:500 10px 'JetBrains Mono',monospace;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* Cortador de STL: o painel de upload aparece sozinho no meio da página (na
   home ele divide a linha com o card "Como funciona"), e a lista mostra a cor
   de cada parte — a mesma que o viewer pinta na malha (ver corDaParte). */
.panel--solo{max-width:560px;margin:0 auto;}
.corte-lista{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;}
.corte-item{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-2);}
.corte-cor{width:12px;height:12px;border-radius:3px;flex:none;}
.corte-nome{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.corte-cota{font-size:11px;color:var(--text-3);}
#cortePainel .status{margin:0;padding:12px 20px;border-top:1px solid var(--hairline);}

/* Redutor de polígonos, dentro do resultado da conversão. */
.reduzir{padding:14px 16px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--hairline-soft);}
.reduzir-topo{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.reduzir-titulo{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:500;color:var(--text);}
.reduzir-topo .t-mono{font-size:12.5px;color:var(--accent);}
.reduzir-acoes{display:flex;align-items:center;gap:8px;margin-top:10px;}
.reduzir-acoes .field-help{flex:1;margin:0;}

/* separar 3MF por cor */
.sep-lista{grid-template-columns:1fr;}
.sep-item{gap:10px;}
.sep-escolha{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-3);cursor:pointer;white-space:nowrap;}
.sep-escolha input{accent-color:var(--accent);}
.sep-pecas-cab{font-size:13px;color:var(--text-2);margin:2px 0 6px;}
