/* Catshroom Hub · tema Neo-Pop (padrão). Soma por cima do app.css, só com html[data-estilo="neo"].
   Volta ao visual antigo com ?estilo=classic (fica salvo em localStorage.hubEstilo). Mesma paleta da loja (loja/ds/neo-tokens.json). */
@font-face { font-family: "Archivo Black"; src: url("fonts/archivo-black-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Sora"; src: url("fonts/sora-400-800.woff2") format("woff2"); font-weight: 400 800; font-display: swap; }
html[data-estilo="neo"] {
  --bg: #FFF0E4; --surface: #FFFFFF; --bar: #FFF7EF; --fg: #171717; --muted: #4A4238;
  --line: #171717; --hover: #FFF1B8; --accent: #6A3FD0; --accent-fg: #FFFFFF;
  --danger: #B3261E; --ok: #0B6B2C;
  --neo-amarelo: #FFD52A; --neo-lilas: #B6A0F5; --neo-rosa: #F65AA8; --neo-menta: #73E5B5;
  --neo-sombra: 4px 4px 0 #171717; --neo-sombra-p: 2px 2px 0 #171717; --neo-raio: 14px;
  --font: "Sora", "Segoe UI", system-ui, sans-serif; --font-d: "Archivo Black", "Sora", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  html[data-estilo="neo"]:not([data-theme="light"]) {
    --bg: #1A1226; --surface: #271B3A; --bar: #20172F; --fg: #FFF0E4; --muted: #CDBFB0;
    --line: #FFF0E4; --hover: #362852; --accent: #B6A0F5; --accent-fg: #171717;
    --danger: #FF8A7A; --ok: #73E5B5; --neo-sombra: 4px 4px 0 #000; --neo-sombra-p: 2px 2px 0 #000;
  }
}
html[data-estilo="neo"][data-theme="dark"] {
  --bg: #1A1226; --surface: #271B3A; --bar: #20172F; --fg: #FFF0E4; --muted: #CDBFB0;
  --line: #FFF0E4; --hover: #362852; --accent: #B6A0F5; --accent-fg: #171717;
  --danger: #FF8A7A; --ok: #73E5B5; --neo-sombra: 4px 4px 0 #000; --neo-sombra-p: 2px 2px 0 #000;
}
/* fundo de bolinhas, igual ao da loja (loja/ds/neo.css) */
html[data-estilo="neo"] body { background-color: var(--bg); background-image: radial-gradient(rgba(26,26,26,.07) 1.5px, transparent 1.5px); background-size: 24px 24px; }
html[data-estilo="neo"][data-theme="dark"] body { background-image: radial-gradient(rgba(255,240,228,.07) 1.5px, transparent 1.5px); }
@media (prefers-color-scheme: dark) { html[data-estilo="neo"]:not([data-theme="light"]) body { background-image: radial-gradient(rgba(255,240,228,.07) 1.5px, transparent 1.5px); } }
html[data-estilo="neo"] h1, html[data-estilo="neo"] h2, html[data-estilo="neo"] .top h1 { font-family: var(--font-d); font-weight: 400; letter-spacing: .01em; }
/* barra de cima: faixa lilás com borda grossa */
html[data-estilo="neo"] .top { background: var(--neo-lilas); color: #171717; border-bottom: 2px solid #171717; }
html[data-estilo="neo"] .top .tools { border-top: 2px solid #171717; }
html[data-estilo="neo"] .top .muted, html[data-estilo="neo"] .top label { color: #171717; }
/* barra de cima em uma linha só: sem contorno em volta do menu, botões compactos; abaixo de 1700px quebra em duas linhas */
html[data-estilo="neo"] .top { gap: 8px 10px; padding: 8px 14px; }
html[data-estilo="neo"] .top img { height: 30px; }
html[data-estilo="neo"] .top h1 { font-size: .95rem; white-space: nowrap; }
html[data-estilo="neo"] .nav { border: 0; border-radius: 0; overflow: visible; display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 auto; min-width: 0; }
/* grupos de filtro (Pagos / Aguardando…): sem a moldura fina ao redor, cada botão já tem o contorno do estilo */
html[data-estilo="neo"] .filters { border: 0; border-radius: 0; overflow: visible; display: flex; flex-wrap: wrap; gap: 6px; }
html[data-estilo="neo"] .filters .btn { border-radius: 12px; }
html[data-estilo="neo"] .nav .btn, html[data-estilo="neo"] .top .btn { padding: 5px 10px; font-size: .82rem; white-space: nowrap; border-radius: 12px; }
html[data-estilo="neo"] .top .sp { display: none; }
html[data-estilo="neo"] .top .regbusca { flex: 0 1 190px; min-width: 130px; }
html[data-estilo="neo"] .top .regbusca #reg-busca { width: 100%; border: 2px solid var(--line); border-radius: 12px; padding: 5px 10px; font-size: .82rem; }
@media (min-width: 1700px) {
  html[data-estilo="neo"] .top .regbusca { flex: 0 0 150px; min-width: 0; }
}
@media (min-width: 1700px) and (max-width: 2099px) { html[data-estilo="neo"] body[data-page] .top h1 { display: none; } }
/* Backlog: o aviso de status ocupa o espaço do meio e corta com reticências; botões da barra com a mesma altura, sempre alinhados à direita */
html[data-estilo="neo"] .top #st { flex: 1 1 0; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-estilo="neo"] .top > .btn, html[data-estilo="neo"] .top > details > summary.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; flex: 0 0 auto; }
html[data-estilo="neo"] .top { align-items: center; }
/* botões: borda 2px, sombra sólida que "afunda" ao apertar; principal = amarelo */
html[data-estilo="neo"] .btn { border: 2px solid var(--line); border-radius: var(--neo-raio); background: var(--surface); color: var(--fg); box-shadow: var(--neo-sombra-p); font-weight: 700; transition: transform .1s, box-shadow .1s, background .1s; }
html[data-estilo="neo"] .btn:hover { background: var(--hover); transform: translate(-1px, -1px); box-shadow: 3px 3px 0 var(--line); }
html[data-estilo="neo"] .btn:active { transform: translate(2px, 2px); box-shadow: none; }
html[data-estilo="neo"] .btn.primary { background: var(--neo-amarelo); border-color: #171717; color: #171717; box-shadow: 2px 2px 0 #171717; }
html[data-estilo="neo"] .btn.primary:hover { filter: none; background: #FFE056; }
html[data-estilo="neo"] .btn[disabled] { box-shadow: none; transform: none; }
html[data-estilo="neo"] .btn:focus-visible, html[data-estilo="neo"] input:focus-visible, html[data-estilo="neo"] textarea:focus-visible, html[data-estilo="neo"] select:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
html[data-estilo="neo"] .bl-bar .btn[aria-pressed="true"] { background: var(--neo-lilas); border-color: #171717; color: #171717; }
html[data-estilo="neo"] .btn[aria-pressed="true"], html[data-estilo="neo"] .btn[aria-pressed="true"]:hover, html[data-estilo="neo"] .btn[aria-current="page"]:hover { background: var(--accent); color: var(--accent-fg); border-color: #171717; }
html[data-estilo="neo"] .bl-bar .btn[aria-pressed="true"]:hover { background: var(--neo-lilas); color: #171717; }
/* campos */
html[data-estilo="neo"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-estilo="neo"] textarea, html[data-estilo="neo"] select { border-width: 2px; border-color: var(--line); border-radius: 12px; }
/* painéis, colunas, cartões */
html[data-estilo="neo"] .side { background: var(--bar); border-right: 2px solid var(--line); }
html[data-estilo="neo"] .bl-col { background: var(--bar); border: 2px solid var(--line); border-radius: 18px; box-shadow: var(--neo-sombra); }
html[data-estilo="neo"] .bl-col h2 { font-family: var(--font-d); font-weight: 400; }
html[data-estilo="neo"] .bl-col.over { outline: 3px dashed var(--accent); background: var(--hover); }
html[data-estilo="neo"] .bl-n { background: var(--neo-amarelo); color: #171717; border: 2px solid #171717; font-weight: 700; }
html[data-estilo="neo"] .bl-card { border: 2px solid var(--line); border-left-width: 6px; border-radius: 14px; box-shadow: var(--neo-sombra-p); transition: transform .1s, box-shadow .1s; }
html[data-estilo="neo"] .bl-card:hover { border-color: var(--line); transform: translate(-1px, -1px); box-shadow: 4px 4px 0 var(--line); }
html[data-estilo="neo"] .bl-card.media { border-left-color: var(--neo-lilas); }
html[data-estilo="neo"] .bl-card.alta { border-left-color: #F04A37; }
html[data-estilo="neo"] .bl-tag { border: 2px solid var(--line); font-weight: 700; }
/* chave liga/desliga: 40x22 com borda 2px (miolo 36x18); a bolinha é de tinta, centralizada, e anda 18px */
html[data-estilo="neo"] .bl-sw { width: 40px; height: 22px; border: 2px solid var(--line); background: var(--bar); box-shadow: var(--neo-sombra-p); }
html[data-estilo="neo"] .bl-sw::after { top: 2px; left: 2px; width: 14px; height: 14px; background: var(--line); }
html[data-estilo="neo"] .bl-sw:checked { background: var(--neo-menta); }
html[data-estilo="neo"] .bl-sw:checked::after { transform: translateX(18px); background: #171717; }
/* cartões e painéis do Hub: borda 2px, canto grande, sombra sólida */
html[data-estilo="neo"] .tile, html[data-estilo="neo"] .shortcut, html[data-estilo="neo"] .panel, html[data-estilo="neo"] .entcard, html[data-estilo="neo"] .entpg, html[data-estilo="neo"] .cal, html[data-estilo="neo"] .kcol, html[data-estilo="neo"] .kcard, html[data-estilo="neo"] .pgroup, html[data-estilo="neo"] #gate .gcard, html[data-estilo="neo"] .carr-box, html[data-estilo="neo"] .ljrow, html[data-estilo="neo"] .lj-cfg .cfg-sec, html[data-estilo="neo"] .bl-login, html[data-estilo="neo"] .fl, html[data-estilo="neo"] .bl-bot { border: 2px solid var(--line); border-radius: 18px; box-shadow: var(--neo-sombra); }
html[data-estilo="neo"] .shortcut, html[data-estilo="neo"] .tile { transition: transform .1s, box-shadow .1s; }
html[data-estilo="neo"] .shortcut:hover { transform: translate(-1px, -1px); box-shadow: 6px 6px 0 var(--line); }
html[data-estilo="neo"] .kcard, html[data-estilo="neo"] .ljrow { border-radius: 14px; box-shadow: var(--neo-sombra-p); }
html[data-estilo="neo"] .ptab { border: 2px solid var(--line); }
html[data-estilo="neo"] .bl-lista table { border: 2px solid var(--line); border-radius: 14px; }
html[data-estilo="neo"] dialog.cat-dlg, html[data-estilo="neo"] dialog.bl-dlg { border: 2px solid var(--line); border-radius: 20px; box-shadow: 8px 8px 0 var(--line); }
/* janelas e menus */
html[data-estilo="neo"] dialog, html[data-estilo="neo"] .modal, html[data-estilo="neo"] .pa-menu-l, html[data-estilo="neo"] details[open] > .pa-menu { border: 2px solid var(--line); border-radius: 18px; box-shadow: 6px 6px 0 var(--line); }
html[data-estilo="neo"] ::selection { background: var(--neo-amarelo); color: #171717; }
@media (prefers-reduced-motion: reduce) {
  html[data-estilo="neo"] .btn, html[data-estilo="neo"] .bl-card, html[data-estilo="neo"] .shortcut, html[data-estilo="neo"] .tile { transition: none; }
  html[data-estilo="neo"] .btn:hover, html[data-estilo="neo"] .btn:active, html[data-estilo="neo"] .bl-card:hover, html[data-estilo="neo"] .shortcut:hover { transform: none; }
}

/* Editor CAD (27-editor-cad.js · vendor/cad/cad-cena.js): troca os tokens --cad-* (o visor 3D lê estes tokens ao abrir) e dá borda grossa, sombra sólida e destaque lilás/amarelo */
html[data-estilo="neo"] .cad-lab {
  --cad-fundo: #FFF7EF; --cad-fundo-2: #FFFFFF; --cad-linha: #171717; --cad-tinta: #171717; --cad-mudo: #4A4238;
  --cad-ciano: #6A3FD0; --cad-verde: #0B6B2C; --cad-sobre: #FFFFFF; --cad-fundo-3d: #FFF0E4; --cad-objeto: #9B7AF0; --cad-previa: #0B9B4C; --cad-face: #FFB300; --cad-textura: #F65AA8;
  --cad-grade: #E6D5C2; --cad-grade-forte: #B8A58F; --cad-eixo-x: #E5322A; --cad-eixo-y: #0B9B4C; --cad-eixo-z: #2F5BFF;
  --cad-rec-base: #2F5BFF; --cad-rec-botao: #FFB300; --cad-rec-suporte: #F65AA8;
  --cad-realce: var(--neo-lilas); --cad-realce-fg: #171717;
  --cad-fonte-mono: "Sora", ui-monospace, "Cascadia Mono", Consolas, monospace;
  border: 2px solid #171717; border-radius: 16px; box-shadow: var(--neo-sombra); background: var(--neo-lilas);
}
@media (prefers-color-scheme: dark) {
  html[data-estilo="neo"]:not([data-theme="light"]) .cad-lab {
    --cad-fundo: #1D1A1A; --cad-fundo-2: #232020; --cad-linha: #FFF0E4; --cad-tinta: #FFF0E4; --cad-mudo: #CDBFB0;
    --cad-ciano: #B6A0F5; --cad-verde: #73E5B5; --cad-sobre: #171717; --cad-fundo-3d: #171717; --cad-objeto: #B6A0F5; --cad-previa: #73E5B5; --cad-face: #FFD52A; --cad-textura: #F65AA8;
    --cad-grade: #3A3430; --cad-grade-forte: #5A5048; --cad-eixo-x: #FF8A7A; --cad-eixo-y: #73E5B5; --cad-eixo-z: #8FB4FF;
    --cad-rec-base: #8FB4FF; --cad-rec-botao: #FFD52A; --cad-rec-suporte: #F65AA8;
    --cad-realce: #6A3FD0; --cad-realce-fg: #FFFFFF;
    box-shadow: var(--neo-sombra); background: #2A2342;
  }
}
html[data-estilo="neo"][data-theme="dark"] .cad-lab {
  --cad-fundo: #1D1A1A; --cad-fundo-2: #232020; --cad-linha: #FFF0E4; --cad-tinta: #FFF0E4; --cad-mudo: #CDBFB0;
  --cad-ciano: #B6A0F5; --cad-verde: #73E5B5; --cad-sobre: #171717; --cad-fundo-3d: #171717; --cad-objeto: #B6A0F5; --cad-previa: #73E5B5; --cad-face: #FFD52A; --cad-textura: #F65AA8;
  --cad-grade: #3A3430; --cad-grade-forte: #5A5048; --cad-eixo-x: #FF8A7A; --cad-eixo-y: #73E5B5; --cad-eixo-z: #8FB4FF;
  --cad-rec-base: #8FB4FF; --cad-rec-botao: #FFD52A; --cad-rec-suporte: #F65AA8;
  --cad-realce: #6A3FD0; --cad-realce-fg: #FFFFFF;
  box-shadow: var(--neo-sombra); background: #2A2342;
}
html[data-estilo="neo"] .cad-cab h2 { font-family: var(--font-d); font-weight: 400; color: #171717; }
html[data-estilo="neo"][data-theme="dark"] .cad-cab h2 { color: #FFF0E4; }
@media (prefers-color-scheme: dark) { html[data-estilo="neo"]:not([data-theme="light"]) .cad-cab h2 { color: #FFF0E4; } }
html[data-estilo="neo"] .cad-cab .cad-rot { color: #171717; background: var(--neo-amarelo); border: 2px solid #171717; border-radius: 999px; padding: 2px 10px; }
html[data-estilo="neo"] .cad-cab .cad-status { color: var(--cad-tinta); }
html[data-estilo="neo"] .cad-barra, html[data-estilo="neo"] .cad-lateral, html[data-estilo="neo"] .cad-visor { border: 2px solid var(--cad-linha); border-radius: 14px; }
html[data-estilo="neo"] .cad-lateral, html[data-estilo="neo"] .cad-barra { box-shadow: var(--neo-sombra-p); }
html[data-estilo="neo"] .cad-sep { width: 2px; }
html[data-estilo="neo"] .cad-transf, html[data-estilo="neo"] .cad-bool { border-top-width: 2px; }
html[data-estilo="neo"] .cad-lat-cab h3, html[data-estilo="neo"] .cad-grupo legend { font-family: var(--font-d); font-weight: 400; letter-spacing: .04em; color: var(--cad-tinta); }
html[data-estilo="neo"] .cad-lab .iconbtn.cad-ferr, html[data-estilo="neo"] .cad-lab .cad-vista { border: 2px solid var(--cad-linha); border-radius: 12px; background: var(--cad-fundo-2); color: var(--cad-tinta); box-shadow: var(--neo-sombra-p); transition: transform .1s, box-shadow .1s, background .1s; }
html[data-estilo="neo"] .cad-lab .iconbtn.cad-ferr:hover, html[data-estilo="neo"] .cad-lab .cad-vista:hover { background: var(--hover); border-color: var(--cad-linha); transform: translate(-1px, -1px); box-shadow: 3px 3px 0 var(--cad-linha); }
html[data-estilo="neo"] .cad-lab .iconbtn.cad-ferr:active, html[data-estilo="neo"] .cad-lab .cad-vista:active { transform: translate(2px, 2px); box-shadow: none; }
html[data-estilo="neo"] .cad-lab .iconbtn.cad-ferr[aria-disabled="true"] { box-shadow: none; transform: none; }
/* selecionado: lilás cheio com texto escuro (no escuro, roxo com texto claro) */
html[data-estilo="neo"] .cad-lab .btn[aria-pressed="true"], html[data-estilo="neo"] .cad-lab .btn[aria-pressed="true"]:hover,
html[data-estilo="neo"] .cad-lab .iconbtn.cad-ferr[aria-pressed="true"], html[data-estilo="neo"] .cad-lab .cad-vista[aria-pressed="true"], html[data-estilo="neo"] .cad-lab .cad-quad-btn[aria-pressed="true"] { background: var(--cad-realce); color: var(--cad-realce-fg); border-color: var(--cad-linha); }
html[data-estilo="neo"] .cad-item { border-radius: 10px; }
html[data-estilo="neo"] .cad-item:hover { background: var(--hover); border-color: var(--cad-linha); }
html[data-estilo="neo"] .cad-item[aria-pressed="true"], html[data-estilo="neo"] .cad-item[aria-pressed="true"][data-marcado="true"] { background: var(--cad-realce); color: var(--cad-realce-fg); border-color: var(--cad-linha); box-shadow: var(--neo-sombra-p); }
html[data-estilo="neo"] .cad-item[aria-pressed="true"] .cad-item-tipo { color: inherit; }
html[data-estilo="neo"] .cad-item[data-marcado="true"] { background: var(--hover); }
html[data-estilo="neo"] .cad-campo input[type="text"], html[data-estilo="neo"] .cad-campo select { border: 2px solid var(--cad-linha); border-radius: 10px; }
html[data-estilo="neo"] #cad-bool-ok:not([aria-disabled="true"]) { background: var(--neo-menta); border-color: #171717; color: #171717; }
html[data-estilo="neo"] .cad-transf-msg:not(:empty), html[data-estilo="neo"] .cad-bool-msg:not(:empty) { border-width: 2px; border-radius: 10px; background: color-mix(in srgb, var(--cad-eixo-x) 14%, var(--cad-fundo-2)); }
html[data-estilo="neo"] .cad-msg { font-weight: 600; color: var(--cad-tinta); }