
  :root{
    --paper:#F3F0E8;
    --card:#FFFFFF;
    --ink:#1E2A42;
    --ink-soft:#6B7080;
    --line:#E1E2E6;
    --accent:#E8590C;
    --accent-ink:#FFFFFF;
    --focus:#2E9FCB;
    --ok:#2F9E44;
    --ok-bg:#EAF7EC;
    --low:#F08C00;
    --low-bg:#FFF4E0;
    --out:#E03131;
    --out-bg:#FDECEC;
    --over:#9C36B5;
    --over-bg:#F6E9FA;
    --steel:#3D4A5C;
    --entrada:#2F9E44;
    --radius:10px;
  }
  *{box-sizing:border-box;}
  html,body{height:100%;}
  body{margin:0;padding:0;background:var(--paper);}
  .app{
    font-family:'Oswald',system-ui,sans-serif;
    background:var(--paper);
    color:var(--ink);
    min-height:100%;
    padding:18px 32px 40px;
    max-width:1600px;
    margin:0 auto;
  }
  .header{
    display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:8px 16px;
    border-bottom:3px solid var(--ink);
    padding-bottom:10px; margin-bottom:13px;
  }
  .header .title-block{ display:flex; align-items:center; gap:14px; }
  .header .logo{ height:56px; width:auto; flex-shrink:0; display:block; }
  .header .divider{ width:1px; align-self:stretch; background:var(--line); flex-shrink:0; }
  .header h1{
    font-family:'Bebas Neue', 'Oswald', sans-serif;
    font-size:30px; letter-spacing:0.5px; margin:0; line-height:1;
  }
  .header .sub{
    font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--ink-soft);
    margin-top:4px;
  }
  .stats{ text-align:right; font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--ink-soft);}
  .stats b{ color:var(--ink); font-size:13px; }

  .obra-bar{
    display:flex; align-items:center; gap:8px; margin-bottom:8px;
    background:var(--ink); border-radius:8px; padding:8px 10px; flex-wrap:wrap;
  }
  .obra-bar label{ font-family:'JetBrains Mono',monospace; font-size:10px; color:#B7C2D6; text-transform:uppercase; flex-shrink:0; }
  .obra-bar .topbar-inline{
    margin-left:auto; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:#B7C2D6; text-align:right;
  }
  .obra-bar .link-btn{ color:#B7C2D6; text-decoration:underline; cursor:pointer; }
  .obra-select{
    flex:1; padding:7px 8px; border-radius:6px; border:none; font-family:'Oswald',sans-serif;
    font-weight:600; font-size:13.5px; background:#16213A; color:#fff;
  }
  .obra-btn{
    background:none; border:1px solid #3A4A66; color:#B7C2D6; border-radius:6px; padding:6px 9px;
    font-size:14px; cursor:pointer; flex-shrink:0;
  }
  .obra-btn:active{ background:#22314F; }

  .obra-info{
    display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:14px;
    font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--ink-soft);
  }
  .obra-info .obra-info-empty{ color:var(--ink-soft); font-style:italic; }
  .badge.pausada{ background:var(--low-bg); color:var(--low); }
  .badge.concluida{ background:#E3F3FA; color:var(--focus); }
  .badge.em_andamento{ background:var(--ok-bg); color:var(--ok); }

  .tabs{ display:flex; gap:6px; margin-bottom:8px; flex-wrap:wrap; }
  .subtabs{
    display:flex; gap:6px; margin-bottom:14px; padding-top:8px; flex-wrap:wrap;
    border-top:1px dashed var(--line);
  }
  .tab-btn{
    flex:1; padding:10px 8px; border:2px solid var(--ink); background:var(--card);
    color:var(--ink); font-family:'Oswald',sans-serif; font-weight:600; font-size:13px;
    letter-spacing:0.5px; text-transform:uppercase; cursor:pointer; border-radius:8px;
  }
  .tab-btn.active{ background:var(--ink); color:var(--paper); }
  .subtabs .tab-btn{ font-size:12px; }

  .search{
    width:100%; padding:12px 14px; margin-bottom:14px; border:2px solid var(--line);
    border-radius:8px; font-family:'Oswald',sans-serif; font-size:15px; background:var(--card);
    color:var(--ink);
  }
  .search:focus{ outline:none; border-color:var(--focus); }

  .list{ display:flex; flex-direction:column; gap:10px; }

  .card{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    overflow:hidden; border-left:6px solid var(--ink-soft);
  }
  .card.ok{ border-left-color:var(--ok); }
  .card.low{ border-left-color:var(--low); }
  .card.out{ border-left-color:var(--out); }
  .card.over{ border-left-color:var(--over); }

  .card-main{
    display:flex; align-items:center; gap:12px; padding:12px 14px; cursor:pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .tag{
    font-family:'JetBrains Mono',monospace; font-weight:700; font-size:12px;
    background:var(--ink); color:var(--paper); border-radius:6px;
    min-width:26px; height:26px; display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
  }
  .icon{ font-size:26px; flex-shrink:0; width:38px; height:38px; text-align:center;
    display:flex; align-items:center; justify-content:center; border-radius:7px; overflow:hidden; background:#F5F3EC; }
  .icon img{ width:100%; height:100%; object-fit:cover; }
  .icon.photo-hit{ cursor:pointer; }
  .icon.photo-hit.no-photo{ border:1.5px dashed var(--focus); }
  .info{ flex:1; min-width:0; }
  .info .name{ font-size:14px; font-weight:500; line-height:1.25; }
  .info .meta{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); margin-top:3px; }
  .info .meta b{ color:var(--ink); }
  .info .meta .edit-hit{ cursor:pointer; border-bottom:1px dashed var(--ink-soft); }
  .info .meta input{
    width:52px; font-family:'JetBrains Mono',monospace; font-size:10.5px; padding:1px 3px;
    border:1px solid var(--focus); border-radius:3px;
  }
  .saldo-box{ text-align:right; flex-shrink:0; }
  .saldo-box .num{ font-family:'Bebas Neue',sans-serif; font-size:26px; line-height:1; }
  .saldo-box .unit{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft); text-transform:uppercase; }
  .card.ok .num{ color:var(--ok); }
  .card.low .num{ color:var(--low); }
  .card.out .num{ color:var(--out); }
  .card.over .num{ color:var(--over); }

  .badge{
    font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; letter-spacing:0.5px;
    padding:2px 6px; border-radius:4px; text-transform:uppercase; display:inline-block; margin-top:3px; margin-right:4px;
  }
  .badge.ok{ background:var(--ok-bg); color:var(--ok); }
  .badge.low{ background:var(--low-bg); color:var(--low); }
  .badge.out{ background:var(--out-bg); color:var(--out); }
  .badge.over{ background:var(--over-bg); color:var(--over); }
  /* pedido de material em andamento (aprovado/separado/entregue) */
  .card.andamento{ border-left-color:var(--focus); }
  .pedido-obs{ font-size:11.5px; color:var(--ink-soft); font-style:italic; margin-top:1px; }
  .pedido-draft-item .pedido-obs-item{ flex-basis:100%; margin-top:6px; font-size:12px; padding:6px 8px; border:1.5px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); }
  .pedido-tempo{ margin-top:8px; font-size:12px; }
  .pedido-tempo summary{ cursor:pointer; color:var(--focus); font-weight:600; }
  .pedido-tempo ol{ list-style:none; margin:6px 0 0; padding:0 0 0 12px; border-left:2px solid var(--line); }
  .pedido-tempo li{ position:relative; padding:3px 0 5px 8px; }
  .pedido-tempo li::before{ content:""; position:absolute; left:-18px; top:8px; width:9px; height:9px; border-radius:50%; background:var(--focus); }
  .pedido-tempo li.ev-cancelado::before{ background:var(--out); }
  .pedido-tempo li.ev-finalizado::before{ background:var(--ok); }
  .pedido-tempo b{ font-weight:600; }
  .pedido-tempo-obs{ color:var(--ink-soft); font-style:italic; }
  .badge.pendente{ background:#EEF0F3; color:var(--ink-soft); }
  .badge.andamento{ background:#E3F3FA; color:var(--focus); }

  .gantt-card{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    border-left:3px solid var(--ink-soft); overflow:hidden; margin-bottom:4px;
  }
  .gantt-card.concluido{ border-left-color:var(--ok); }
  .gantt-card.atrasado{ border-left-color:var(--out); }
  .gantt-card.em_andamento{ border-left-color:var(--focus); }
  .gantt-card.pendente{ border-left-color:var(--ink-soft); }
  .gantt-card-main{ padding:4px 8px; cursor:pointer; }
  .gantt-label{ display:flex; align-items:center; gap:5px; margin-bottom:2px; font-family:'Oswald',sans-serif; font-size:11px; color:var(--ink); }
  .gantt-tipo{ font-size:12px; flex-shrink:0; }
  .gantt-name{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .gantt-track{ position:relative; height:12px; background:#ECEDF1; border-radius:3px; }
  .gantt-bar{ position:absolute; top:0; height:100%; border-radius:4px; overflow:hidden; min-width:6px; }
  .gantt-bar.concluido{ background:var(--ok); }
  .gantt-bar.atrasado{ background:var(--out); }
  .gantt-bar.em_andamento{ background:var(--focus); }
  .gantt-bar.pendente{ background:var(--ink-soft); }
  .gantt-bar-fill{ height:100%; background:rgba(255,255,255,0.4); }
  .gantt-today-mark{ position:absolute; top:-3px; bottom:-3px; width:0; border-left:1.5px dashed var(--ink); z-index:2; }
  .gantt-axis{ text-align:center; font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--ink-soft); margin-top:2px; }

  /* ===== Cronograma: barra de filtros ===== */
  .crono-toolbar{
    display:flex; gap:10px; flex-wrap:wrap; align-items:center;
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    padding:10px 12px; margin-bottom:14px; box-shadow:0 1px 3px rgba(30,42,66,.06);
  }
  .crono-toolbar-title{
    font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; letter-spacing:1px;
    color:var(--ink-soft); text-transform:uppercase;
  }
  .crono-fbtn{
    position:relative; display:inline-flex; align-items:center; gap:8px;
    padding:7px 10px; border:1px solid var(--line); border-radius:8px; background:var(--card);
    color:var(--ink); cursor:pointer; min-width:130px; justify-content:space-between;
    font-family:'Oswald',sans-serif; font-size:12.5px; line-height:1.3;
  }
  .crono-fbtn:hover{ border-color:var(--focus); background:#F2FAFD; }
  .crono-fbtn .cf-name{ font-weight:600; }
  .crono-fbtn .cf-caret{ border-left:1px solid var(--line); padding-left:9px; color:var(--ink-soft); font-size:9px; }
  .crono-fbtn .cf-badge{
    position:absolute; top:-7px; right:-7px; background:var(--accent); color:#fff;
    border-radius:999px; font-family:'JetBrains Mono',monospace; font-size:9.5px; font-weight:700;
    padding:1px 5px; line-height:1.5; box-shadow:0 1px 2px rgba(30,42,66,.25);
  }
  .crono-sep{ width:1px; height:26px; background:var(--line); }
  .crono-btn{
    padding:7px 10px; border:1px solid var(--line); border-radius:8px; background:var(--card);
    color:var(--ink-soft); cursor:pointer; white-space:nowrap;
    font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700;
  }
  .crono-btn:hover{ border-color:var(--focus); color:var(--ink); background:#F2FAFD; }
  input[readonly],input[disabled],select[disabled]{ background:#F1F3F5; color:var(--ink-soft); cursor:not-allowed; opacity:.8; }
  .crono-btn.limpar:hover{ border-color:var(--out); color:var(--out); background:var(--out-bg); }

  /* ===== Cronograma: botões de ação ===== */
  .crono-acoes{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
  .acao-btn{
    display:inline-flex; align-items:center; gap:9px; padding:7px 13px 7px 7px;
    border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--ink);
    cursor:pointer; font-family:'Oswald',sans-serif; font-size:12.5px; font-weight:600;
    box-shadow:0 1px 2px rgba(30,42,66,.06); white-space:nowrap; transition:transform .12s ease, border-color .12s ease, background .12s ease;
  }
  .acao-btn:hover{ border-color:var(--focus); background:#F2FAFD; transform:translateY(-1px); }
  .acao-btn:active{ transform:translateY(0); }
  .acao-ic{
    display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px;
    border-radius:8px; background:#EEF0F3; font-size:14px; line-height:1; flex:none;
  }
  .acao-ic svg{ width:16px; height:16px; }
  .acao-btn.primary{ background:var(--ink); border-color:var(--ink); color:#fff; }
  .acao-btn.primary .acao-ic{ background:rgba(255,255,255,.16); }
  .acao-btn.primary:hover{ background:var(--steel); border-color:var(--steel); }
  .acao-btn.accent{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
  .acao-btn.accent .acao-ic{ background:rgba(255,255,255,.18); }
  .acao-btn.accent:hover{ background:#D14E09; border-color:#D14E09; }
  .acao-btn.ativo{ background:var(--steel); border-color:var(--steel); color:#fff; }
  .acao-btn.ativo .acao-ic{ background:rgba(255,255,255,.16); }

  .progress-track{
    height:5px; background:#EAE7DD; border-radius:3px; margin-top:6px; overflow:hidden; position:relative;
  }
  .progress-fill{ height:100%; border-radius:3px; background:var(--ok); }
  .progress-fill.over{ background:var(--over); }

  .panel{
    max-height:0; overflow:hidden; transition:max-height 0.25s ease;
    background:#FAF8F3; border-top:1px solid var(--line);
  }
  .panel.open{ max-height:340px; }
  .panel-inner{ padding:14px; }
  .panel-row{ display:flex; gap:8px; margin-bottom:10px; }
  .qty-input{
    flex:1; padding:12px; font-size:20px; font-family:'JetBrains Mono',monospace;
    border:2px solid var(--line); border-radius:8px; text-align:center; font-weight:700;
  }
  .qty-input:focus{ outline:none; border-color:var(--focus); }
  .quick-btns{ display:flex; gap:6px; margin-bottom:10px; flex-wrap:wrap; }
  .quick-btn{
    padding:8px 12px; border:1.5px solid var(--steel); background:var(--card); color:var(--steel);
    border-radius:6px; font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; cursor:pointer;
  }
  .quick-btn:active{ background:var(--steel); color:#fff; }
  .action-row{ display:flex; gap:8px; }
  .register-btn{
    flex:1; padding:13px; color:var(--accent-ink); border:none;
    border-radius:8px; font-family:'Oswald',sans-serif; font-weight:700; font-size:13px;
    text-transform:uppercase; letter-spacing:0.3px; cursor:pointer;
  }
  .register-btn.saida{ background:var(--accent); }
  .register-btn.entrada{ background:var(--entrada); }
  .register-btn:active{ opacity:0.85; }
  .undo-link{
    text-align:center; margin-top:8px; font-family:'JetBrains Mono',monospace; font-size:11px;
    color:var(--ink-soft); text-decoration:underline; cursor:pointer;
  }

  .toast{
    position:fixed; bottom:16px; left:50%; transform:translateX(-50%) translateY(20px);
    background:var(--ink); color:var(--paper); padding:10px 18px; border-radius:8px;
    font-family:'Oswald',sans-serif; font-size:13px; opacity:0; transition:all 0.25s ease;
    pointer-events:none; z-index:50; white-space:nowrap;
  }
  .toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

  .hist-item{
    background:var(--card); border:1px solid var(--line); border-radius:8px;
    padding:10px 14px; display:flex; align-items:center; gap:10px; margin-bottom:8px;
  }
  .hist-item .icon{ font-size:20px; width:26px; height:26px; }
  .hist-item .h-info{ flex:1; min-width:0; }
  .hist-item .h-name{ font-size:13px; font-weight:500; }
  .hist-item .h-date{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); }
  .hist-item .h-qty{ font-family:'JetBrains Mono',monospace; font-weight:700; font-size:15px; }
  .hist-item .h-qty.saida{ color:var(--out); }
  .hist-item .h-qty.entrada{ color:var(--entrada); }
  .hist-del{
    background:none; border:none; color:var(--ink-soft); font-size:16px; cursor:pointer; padding:4px 6px;
  }
  .empty{ text-align:center; padding:40px 20px; color:var(--ink-soft); font-family:'Oswald',sans-serif; }
  .loading{ text-align:center; padding:30px; color:var(--ink-soft); font-family:'JetBrains Mono',monospace; font-size:12px; }

  /* ---- Cabeamento: montagem do rack ----
     Cada linha é a carcaça 19" do equipamento desenhada na proporção
     real (SVG em mm, ver js/rede-desenho.js) + a legenda à direita. Como
     toda carcaça tem a mesma largura, todo U tem a mesma altura —
     ocupado ou livre, igual ao trilho de um rack de verdade. */
  .rack-elevacao{
    background:#fff; border-radius:6px; padding:10px 10px 10px 4px;
    border:2px solid var(--ink); display:flex; flex-direction:column; gap:1px;
  }
  .rack-u-bloco{ display:flex; flex-direction:column; }
  .rack-u-row{ display:flex; align-items:stretch; gap:8px; }
  .rack-u-row.arrastando{ opacity:0.35; }
  .rack-u-row.alvo-drop{ outline:2px dashed var(--focus); outline-offset:2px; }
  /* Régua de U igual à de um rack de verdade — numeração corrida de
     cima pra baixo, encostada na borda esquerda. */
  .rack-u-num{
    width:24px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    font-family:'Oswald',sans-serif; font-weight:700; font-size:12px; color:var(--ink);
    border-right:1px solid var(--line); cursor:grab;
  }
  .rack-u-vazio .rack-u-num{ color:var(--ink-soft); font-weight:500; cursor:default; }
  .rack-u-face{ flex:1; min-width:0; display:flex; align-items:center; }
  .faceplate{ display:block; width:100%; height:auto; }
  /* Legenda: um cartão por equipamento. O tipo vai escrito numa etiqueta
     escura ("SWITCH", "PATCH PANEL"...) — cor sozinha não se explicava.
     Texto em Oswald (mais legível que a mono em tamanho pequeno), escuro
     e com peso, pra ler de relance. */
  .rack-u-leg{
    width:230px; flex-shrink:0; display:flex; flex-direction:column; justify-content:center;
    gap:3px; overflow:hidden; padding:6px 10px; box-sizing:border-box;
    background:var(--paper); border-left:4px solid var(--ink); border-radius:0 6px 6px 0;
  }
  .rack-u-leg .nome{
    font-family:'Oswald',sans-serif; font-weight:700; font-size:17px; color:var(--ink); line-height:1.15;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:0.2px;
  }
  .rack-u-leg .info{
    font-family:'Oswald',sans-serif; font-weight:500; font-size:13px; color:var(--ink);
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; align-items:center; gap:6px;
  }
  .tipo-tag{
    flex-shrink:0; font-family:'Oswald',sans-serif; font-weight:600; font-size:10px; letter-spacing:0.6px;
    text-transform:uppercase; background:var(--ink); color:#fff; border-radius:3px; padding:1px 5px; line-height:1.4;
  }
  .rack-u-leg .uso{
    display:flex; align-items:center; gap:6px; font-family:'Oswald',sans-serif; font-weight:500;
    font-size:12.5px; color:var(--ink); white-space:nowrap;
  }
  .uso-barra{ flex:1; max-width:90px; height:5px; border-radius:3px; background:var(--line); overflow:hidden; }
  .uso-barra i{ display:block; height:100%; background:#2F9E44; }
  .rack-u-leg .acoes{ display:flex; flex-wrap:wrap; gap:4px; align-items:center; margin-top:5px; }
  .leg-btn{
    font-family:'JetBrains Mono',monospace; font-size:12px; line-height:1; min-width:28px; height:26px;
    padding:0 7px; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink);
    cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:4px;
  }
  .leg-btn:hover{ border-color:var(--ink); }
  .leg-btn:focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
  .leg-btn.ativo{ background:var(--ink); color:#fff; border-color:var(--ink); }
  .leg-btn.perigo:hover{ border-color:var(--out); background:#FFF0F0; }
  .leg-topo{ display:flex; align-items:center; gap:7px; min-width:0; }
  .leg-check{ width:18px; height:18px; flex-shrink:0; margin:0; cursor:pointer; accent-color:var(--ink); }
  .rack-u-row.selecionada .rack-u-leg{ background:#E3EEFF; border-left-color:var(--focus); }
  .rack-u-row.selecionada .rack-u-face{ outline:3px solid var(--focus); outline-offset:-1px; border-radius:3px; }
  .rack-sel-barra{
    position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:60;
    display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:center;
    background:var(--card); border:2px solid var(--ink); border-radius:10px; padding:8px 12px;
    box-shadow:0 6px 24px rgba(0,0,0,0.25); max-width:calc(100vw - 32px);
  }
  .rack-sel-barra b{ font-family:'Oswald',sans-serif; font-size:15px; margin-right:4px; }
  .rack-u-vazio .rack-u-leg{ background:transparent; border-left-color:transparent; }
  .rack-u-vazio .rack-u-leg .nome{ color:var(--ink-soft); font-style:italic; font-weight:500; font-size:14px; }
  @media (max-width: 700px){ .rack-u-leg{ width:120px; padding:4px 6px; } .rack-u-leg .uso-barra{ display:none; } }

  /* Porta clicável dentro da carcaça (SVG): o preenchimento vem da cor
     de estado; aqui só o contorno de hover/seleção/alvo de ligação. */
  .faceplate .pt[onclick]{ cursor:pointer; }
  .faceplate .pt[onclick]:hover .pt-corpo{ stroke:#4DABF7; stroke-width:0.8; }
  .faceplate .pt.ativa .pt-corpo{ stroke:#E8590C; stroke-width:1.1; }
  .faceplate .pt.alvo .pt-corpo{ stroke:#51CF66; stroke-dasharray:1.2 0.7; }

  /* Lista "📋" de pontos descritos/ligados de um painel, e a barra de
     edição da porta selecionada — abaixo da própria linha do painel. */
  .rack-u-extra{ margin:4px 0 8px 28px; }
  .pontos-lista{ display:flex; flex-wrap:wrap; gap:4px; }
  .ponto-chip{
    font-family:'JetBrains Mono',monospace; font-size:10px; background:var(--paper);
    border:1px solid var(--line); border-radius:4px; padding:2px 6px; cursor:pointer;
  }
  .ponto-chip:hover{ border-color:var(--focus); }
  .ponto-chip i{ color:var(--focus); font-style:normal; }
  .porta-barra{
    margin-top:6px;
    background:var(--steel); color:#fff; border-radius:var(--radius);
    padding:10px 12px; display:flex; gap:8px; flex-wrap:wrap; align-items:center;
  }
  .porta-barra .titulo{
    font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; white-space:nowrap;
  }
  .porta-barra input, .porta-barra select{
    padding:6px 8px; border:none; border-radius:6px; font-family:'Oswald',sans-serif;
    font-size:13px; background:#fff; color:var(--ink); min-width:110px; flex:1;
  }
  .porta-barra .quick-btn{ background:#fff; }
  /* Caminho SFP → DIO → fibra → DIO → SFP, numa linha só embaixo da barra. */
  .porta-caminho{
    flex-basis:100%; text-align:left; cursor:pointer; border:1px dashed rgba(255,255,255,0.5); border-radius:6px;
    background:rgba(255,255,255,0.08); color:#fff; padding:6px 10px; font-family:'JetBrains Mono',monospace; font-size:11.5px; line-height:1.4;
  }
  .porta-caminho:hover{ background:rgba(255,255,255,0.16); }

  .catalogo-mini{ width:220px; flex-shrink:0; }
  #catalogoFiltros select{
    padding:6px 9px; border:2px solid var(--line); border-radius:6px; background:var(--card);
    color:var(--ink); font-family:'Oswald',sans-serif; font-size:13px;
  }

  /* Legenda de cor de patch cord por obra. */
  .lc-chip{
    font-family:'Oswald',sans-serif; font-weight:600; font-size:10.5px; letter-spacing:0.3px;
    text-transform:uppercase; border-radius:4px; padding:3px 8px;
  }
  .lc-ajuda{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); margin-bottom:12px; line-height:1.5; }
  .lc-lista{ display:flex; flex-direction:column; gap:6px; max-height:52vh; overflow-y:auto; }
  .lc-linha{ display:flex; align-items:center; gap:8px; }
  .lc-cor{
    width:44px; height:34px; flex-shrink:0; cursor:pointer; border-radius:6px;
    border:2px solid var(--line); box-shadow:inset 0 0 0 3px var(--card);
  }
  .lc-cor:hover, .lc-cor.aberta{ border-color:var(--ink); }
  /* Paleta que abre embaixo da linha: cores já usadas + as de patch cord
     à venda, um clique aplica o tom exato. */
  .lc-paleta{
    margin:-2px 0 4px 0; padding:10px; border:2px solid var(--ink); border-radius:6px;
    background:var(--paper); display:flex; flex-direction:column; gap:6px;
  }
  .lc-paleta-titulo{ font-family:'JetBrains Mono',monospace; font-size:9.5px; text-transform:uppercase; letter-spacing:0.5px; color:var(--ink-soft); }
  .lc-amostras{ display:flex; flex-wrap:wrap; gap:6px; }
  .lc-amostra{
    width:28px; height:28px; border-radius:50%; cursor:pointer; padding:0;
    border:2px solid rgba(0,0,0,0.25);
  }
  .lc-amostra:hover{ transform:scale(1.12); }
  .lc-amostra.atual{ outline:3px solid var(--ink); outline-offset:2px; }
  .lc-outra{
    display:flex; align-items:center; gap:8px; margin-top:2px; cursor:pointer;
    font-family:'Oswald',sans-serif; font-size:13px; color:var(--ink);
  }
  .lc-outra input[type="color"]{ width:36px; height:26px; padding:1px; border:2px solid var(--line); border-radius:6px; cursor:pointer; }
  .lc-nome{
    flex:1; min-width:0; padding:6px 9px; border:2px solid var(--line); border-radius:6px;
    font-family:'Oswald',sans-serif; font-weight:600; font-size:14px; text-transform:uppercase;
    background:var(--card); color:var(--ink);
  }
  .lc-nome:focus{ outline:none; border-color:var(--focus); }
  /* Bolinha com a cor da categoria escolhida, ao lado do select da porta. */
  .lc-bolinha{ width:18px; height:18px; border-radius:50%; flex-shrink:0; border:2px solid #fff; }

  /* Prévia editável das etiquetas antes de mandar pra impressora. */
  .pv-lista{ display:flex; flex-direction:column; gap:6px; max-height:52vh; overflow-y:auto; }
  .pv-linha{
    display:flex; flex-direction:column; gap:6px; padding:8px; border:1px solid var(--line); border-radius:6px;
  }
  .pv-linha textarea{
    width:100%; resize:vertical; padding:8px 10px; border:2px solid var(--line); border-radius:6px;
    font-family:'JetBrains Mono',monospace; font-size:13px; line-height:1.4; background:var(--card); color:var(--ink);
    box-sizing:border-box;
  }
  .pv-linha textarea:focus{ outline:none; border-color:var(--focus); }
  .pv-acoes{ display:flex; gap:8px; }
  .pv-acoes button{ flex:1; }
  /* Equipamento em cima de uma bandeja do rack (fonte PoE…): recuado, sem número de U. */
  .na-bandeja{ margin:2px 0 8px 46px; padding:8px 10px; border-left:3px solid #626060; background:rgba(98,96,96,.08); border-radius:0 6px 6px 0; }
  .na-bandeja-titulo{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft); margin-bottom:6px; }
  .na-bandeja-item{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:4px; }
  .na-bandeja-face{ flex:0 0 220px; max-width:100%; }
  .pv-marca{ display:flex; align-items:center; gap:6px; font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--ink-soft); margin-bottom:4px; cursor:pointer; }
  .pv-linha.desmarcada textarea{ opacity:.45; }
  .pv-selecao{ display:flex; align-items:center; gap:8px; margin:8px 0; font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--ink-soft); }
  .pv-selecao span{ flex:1; }
  .pv-tamanho{ display:flex; align-items:center; gap:8px; margin-top:10px; font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--ink-soft); }
  .pv-tamanho b{ min-width:44px; text-align:center; color:var(--ink); }
  .pv-previa-img{ display:block; max-width:100%; margin-top:6px; border:2px solid var(--ink); border-radius:6px; background:#fff; image-rendering:pixelated; }

  /* Gerenciar modelos de etiqueta (.lbx). */
  /* 📓 Diário de obra (js/diario.js) */
  #diarioModal .modal-box{ max-height:94vh; overflow-y:auto; }
  .dia-titulo{ font-family:'Oswald',sans-serif; font-size:17px; font-weight:700; margin:0 0 8px; }
  .dia-sub{ font-size:11.5px; color:var(--ink-soft); font-weight:500; }
  .dia-rolagem{ overflow-x:auto; border:1px solid var(--line); border-radius:8px; background:var(--card); }
  .dia-tabela{ width:100%; border-collapse:collapse; font-size:13.5px; }
  .dia-tabela th{ text-align:left; font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; color:var(--ink-soft); padding:8px 10px; background:#F3F0E8; white-space:nowrap; }
  .dia-tabela td{ padding:9px 10px; border-top:1px solid var(--line); vertical-align:top; }
  .dia-linha{ cursor:pointer; } .dia-linha:hover td{ background:#F8F6F0; } .dia-atual td{ background:#EEF6FB; }
  .dia-resumo{ max-width:340px; color:var(--ink); font-weight:500; }
  .dia-chip{ display:inline-block; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; padding:2px 8px; border-radius:10px; white-space:nowrap; }
  .dia-ok{ background:var(--ok-bg); color:var(--ok); } .dia-atencao{ background:var(--low-bg); color:#B86E00; } .dia-ruim{ background:var(--out-bg); color:var(--out); } .dia-neutro{ background:#EEF0F3; color:var(--ink-soft); }
  .dia-barra{ width:70px; height:7px; border-radius:4px; background:#E1E2E6; overflow:hidden; display:inline-block; vertical-align:middle; margin-right:6px; } .dia-barra i{ display:block; height:100%; background:var(--focus); }
  .dia-acoes{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:8px 0; } .dia-acoes input[type=date]{ padding:6px 8px; border:2px solid var(--line); border-radius:6px; font-family:inherit; }
  .dia-falta{ cursor:pointer; text-decoration:underline; font-weight:700; margin-right:8px; }
  .dia-cab{ display:flex; gap:10px; align-items:flex-start; justify-content:space-between; } .dia-cab h3{ margin:0; }
  .dia-bloco{ margin-top:14px; } .dia-rotulo{ font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; color:var(--ink-soft); font-weight:700; margin-bottom:5px; }
  .dia-duas{ display:grid; grid-template-columns:1fr 1fr; gap:12px; } .dia-grade{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:10px; }
  .dia-campo{ width:100%; box-sizing:border-box; font-family:inherit; font-size:14px; padding:8px 10px; border:2px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); } .dia-campo:focus{ border-color:var(--focus); outline:none; } .dia-campo:disabled{ background:#F3F0E8; }
  .dia-horas{ width:70px; } .dia-equipe td{ padding:5px 6px; }
  .dia-climas{ display:flex; flex-wrap:wrap; gap:5px; margin-top:3px; } .dia-clima{ padding:7px 11px; border:1.5px solid var(--line); border-radius:8px; background:var(--card); font-size:13px; cursor:pointer; } .dia-clima.ativo{ background:var(--steel); border-color:var(--steel); color:#fff; } .dia-clima:disabled{ cursor:default; opacity:.85; }
  .dia-check{ display:flex; align-items:center; gap:7px; margin:10px 0 6px; font-size:13.5px; font-weight:600; }
  .dia-chips, #diaTecnicosSugeridos{ display:flex; flex-wrap:wrap; gap:5px; margin:0 0 6px; } .dia-chip-btn{ border:1.5px dashed var(--steel); background:none; border-radius:14px; padding:4px 10px; font-size:12px; cursor:pointer; color:var(--steel); } .dia-chip-btn:hover{ background:var(--steel); color:#fff; }
  .dia-auto{ border:1px solid var(--line); border-radius:8px; padding:9px 12px; font-size:13px; background:#FBFAF6; } .dia-auto ul{ margin:5px 0 0 16px; padding:0; }
  .dia-fotos{ display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:10px; margin-bottom:8px; } .dia-foto{ position:relative; border:1px solid var(--line); border-radius:8px; padding:6px; background:var(--card); }
  .dia-foto img{ width:100%; height:120px; object-fit:cover; border-radius:6px; cursor:zoom-in; display:block; margin-bottom:5px; } .dia-foto .hist-del{ position:absolute; top:8px; right:8px; background:#fff; border-radius:6px; }
  .dia-arquivo{ position:relative; overflow:hidden; cursor:pointer; } .dia-arquivo input{ position:absolute; inset:0; opacity:0; cursor:pointer; font-size:0; }
  .dia-lupa{ position:fixed; inset:0; z-index:9999; background:rgba(8,12,20,.88); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#fff; cursor:zoom-out; padding:16px; } .dia-lupa img{ max-width:96vw; max-height:84vh; border-radius:8px; }
  /* Diário: lista em cartões e tela própria */
  .dia-espera{ background:#E7F3FA; color:#1B6E94; }
  .dv-topo{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; margin-bottom:14px; }
  .dv-titulo{ font-family:'Oswald',sans-serif; font-size:24px; font-weight:700; line-height:1.15; }
  .dv-btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:40px; padding:8px 14px; border:1.5px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink); font:inherit; font-size:13.5px; font-weight:600; cursor:pointer; transition:background .15s, border-color .15s; }
  .dv-btn:hover{ border-color:var(--steel); background:#F8F6F0; }
  .dv-btn:focus-visible, .dv-cartao:focus-visible, .dv-tile:focus-visible, .dv-filtro:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; }
  .crono-seletor{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px; }
  .dv-primario{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
  .dv-primario:hover{ background:#CF4F0A; border-color:#CF4F0A; }
  .dv-aprovar{ background:var(--ok); border-color:var(--ok); color:#fff; }
  .dv-aprovar:hover{ background:#278539; border-color:#278539; }
  .dv-perigo{ color:var(--out); border-color:transparent; background:transparent; }
  .dv-perigo:hover{ background:var(--out-bg); border-color:transparent; }
  .dv-tiles{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
  .dv-tile{ display:flex; flex-direction:column; gap:2px; text-align:left; padding:12px 14px; background:var(--card); border:1.5px solid var(--line); border-left-width:5px; border-radius:10px; font:inherit; color:var(--ink); cursor:pointer; }
  .dv-tile b{ font-family:'Oswald',sans-serif; font-size:26px; line-height:1; } .dv-tile span{ font-size:12px; color:var(--ink-soft); font-weight:600; }
  .dv-tile.ativo{ background:#F8F6F0; border-color:var(--ink); }
  .dv-t-espera{ border-left-color:var(--focus); } .dv-t-atencao{ border-left-color:var(--low); } .dv-t-ok{ border-left-color:var(--ok); }
  .dv-faltam{ background:var(--low-bg); border-radius:8px; padding:6px 12px; font-size:12.5px; font-weight:600; margin-bottom:12px; } .dv-faltam summary{ cursor:pointer; }
  .dv-faltam-dias{ margin-top:6px; max-height:96px; overflow-y:auto; font-weight:500; }
  .dv-t-todos{ border-left-color:var(--ink); }
  .dv-filtros{ display:flex; flex-wrap:wrap; align-items:center; gap:4px; padding:6px 8px; margin-bottom:10px; background:var(--card); border:1px solid var(--line); border-radius:8px; }
  .dv-filtros select, .dv-filtros input, .dv-filtros button{ height:28px; box-sizing:border-box; padding:2px 4px; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); font:inherit; font-size:10.5px; font-weight:600; min-width:0; }
  .dv-filtros select{ flex:1 1 86px; max-width:112px; } .dv-filtros input[type=date]{ flex:0 0 94px; width:94px; } .dv-filtros input[type=search]{ flex:1 1 70px; width:70px; font-weight:500; }
  .dv-filtros button{ flex:none; padding:2px 7px; cursor:pointer; } .dv-filtros button:hover, .dv-filtros select:hover{ border-color:var(--steel); } .dv-filtros .dv-sentido{ min-width:26px; padding:0 5px; font-size:13px; }
  .dv-filtros :focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
  @media (min-width:1200px){ .dv-filtros{ flex-wrap:nowrap; } }
  .dv-campo-em-linha{ display:inline-flex; flex-wrap:wrap; align-items:center; gap:6px; } .dv-campo-em-linha input[type=date]{ min-height:40px; padding:6px 8px; border:1.5px solid var(--line); border-radius:8px; background:var(--card); font:inherit; font-size:13px; }
  .dv-lista{ display:grid; gap:3px; }
  .dv-lista{ overflow-x:auto; }
  .dv-cartao, .dv-cabecalho{ display:grid; grid-template-columns:100px 72px 104px minmax(120px,1.3fr) minmax(70px,.7fr) minmax(130px,2fr) minmax(80px,.8fr) minmax(80px,.8fr); align-items:center; gap:8px; min-width:860px; box-sizing:border-box; padding:3px 10px; }
  .dv-cartao{ width:100%; min-height:32px; text-align:left; background:var(--card); border:1px solid var(--line); border-radius:6px; font:inherit; font-size:12px; color:var(--ink); cursor:pointer; transition:border-color .15s, box-shadow .15s; }
  .dv-cabecalho{ font-family:'JetBrains Mono',monospace; font-size:9.5px; text-transform:uppercase; color:var(--ink-soft); }
  .dv-cartao.fo-linha, .dv-cabecalho.fo-linha{ grid-template-columns:minmax(150px,2fr) 118px minmax(80px,1fr) 104px minmax(100px,1.2fr) minmax(80px,1fr) minmax(70px,.8fr) 66px; }
  .dv-cartao.pd-linha, .dv-cabecalho.pd-linha{ grid-template-columns:72px 76px 90px 90px minmax(160px,2fr) minmax(90px,1fr) minmax(90px,1fr) minmax(90px,1fr); }
  #tabPedidos .dv-filtros input[type=search]{ flex:3 1 200px; width:auto; }
  .pd-add{ display:grid; grid-template-columns:minmax(0,1fr) 110px auto; gap:8px; align-items:start; } .pd-busca{ position:relative; }
  .pd-opcoes-busca{ display:none; position:absolute; z-index:20; top:100%; left:0; right:0; max-height:260px; overflow-y:auto; background:var(--card); border:1px solid var(--line); border-radius:8px; box-shadow:0 8px 24px rgba(30,42,66,.16); }
  .pd-produto{ display:block; width:100%; min-height:40px; padding:7px 10px; border:0; border-bottom:1px solid var(--line); background:none; color:var(--ink); font:inherit; font-size:13px; text-align:left; cursor:pointer; } .pd-produto:hover{ background:#F8F6F0; }
  .pd-item{ display:grid; gap:6px; padding:10px 12px; margin-bottom:8px; border:1px solid var(--line); border-left:4px solid var(--line); border-radius:8px; } .pd-tem-estoque{ border-left-color:var(--low); }
  .pd-item-topo{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; } .pd-item-topo b{ flex:1 1 200px; } .pd-qtd{ display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:600; } .pd-qtd input{ width:90px; }
  .pd-alerta{ display:grid; gap:7px; padding:8px 10px; border-radius:6px; background:var(--low-bg); font-size:12.5px; } .pd-opcoes{ margin:0; } .pd-sem{ margin-left:2px; }
  .pd-opcao{ min-height:36px; padding:5px 11px; border:1.5px solid #E3C48A; border-radius:7px; background:var(--card); color:var(--ink); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; } .pd-opcao.ativo{ background:var(--ink); border-color:var(--ink); color:#fff; } .pd-opcao:disabled{ opacity:.45; cursor:not-allowed; }
  .pd-opcao:focus-visible, .pd-produto:focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
  .pd-itens td{ vertical-align:top; } .pd-alerta-linha td{ background:var(--low-bg); }
  @media (max-width:640px){ .pd-add{ grid-template-columns:1fr; } }
  #pedidosTiles{ grid-template-columns:repeat(5,minmax(0,1fr)); } .dv-t-neutro{ border-left-color:var(--ink-soft); } .dv-b-atencao{ background:var(--low-bg); color:#7A4B00; } .pd-avisos{ margin:4px 0 0; padding-left:18px; }
  @media (max-width:640px){ #pedidosTiles{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
  .dv-cartao.cot-linha, .dv-cabecalho.cot-linha{ grid-template-columns:72px 72px 76px 90px 96px minmax(150px,2fr) 72px minmax(80px,1fr) minmax(80px,1fr); }
  #tabCotacao .dv-filtros input[type=search]{ flex:3 1 200px; width:auto; }
  .cot-pedido{ display:grid; grid-template-columns:72px minmax(0,1fr) auto auto; align-items:center; gap:10px; padding:5px 0; border-top:1px solid var(--line); font-size:13px; } .cot-pedido:first-child{ border-top:0; }
  .cot-propostas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:10px; margin-bottom:10px; } .cot-proposta{ display:grid; gap:8px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; }
  .cot-proposta-topo{ display:flex; align-items:center; gap:8px; } .cot-proposta-topo b{ flex:1 1 auto; min-width:0; } .cot-proposta-topo .dv-btn{ flex:none; white-space:nowrap; } .cot-proposta-topo .hist-del{ flex:none; } .cot-proposta-topo .dv-btn{ min-height:34px; padding:4px 10px; font-size:12px; }
  .cot-condicoes{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 8px; } .cot-condicoes .dia-campo{ padding:5px 8px; font-size:13px; }
  .cot-add{ max-width:560px; margin-bottom:12px; }
  .cot-ganhador{ flex:none; min-height:22px; padding:1px 6px; border:1.5px solid var(--ok); border-radius:6px; background:var(--card); color:var(--ok); font:inherit; font-size:10.5px; font-weight:700; text-transform:none; cursor:pointer; } .cot-ganhador:hover{ background:var(--ok-bg); } .cot-ganhador:focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
  .cot-depara{ margin-top:12px; padding:12px; border:1.5px solid var(--focus); border-radius:8px; } .cot-depara h4{ margin:0 0 2px; }
  .cot-resumo{ display:flex; flex-wrap:wrap; gap:8px 28px; margin-bottom:10px; } .cot-resumo b{ display:block; font-size:18px; font-family:'Oswald',sans-serif; }
  .cot-mapa{ font-size:11.5px; } .cot-mapa td, .cot-mapa th{ vertical-align:top; padding:5px 4px; } .cot-mapa th{ font-size:9.5px; white-space:nowrap; } .cot-mapa .cot-item{ min-width:90px; font-size:12px; } .cot-mapa .cot-qtd{ white-space:nowrap; }
  .cot-mapa .cot-preco, .cot-mapa .cot-forn{ border-left:2px solid var(--line); } .cot-mapa td.cot-preco{ width:58px; } .cot-mapa td.cot-desc{ width:100px; min-width:100px; } .cot-mapa td.cot-tot{ min-width:74px; white-space:nowrap; }
  .cot-mapa input[type=number], .cot-mapa select{ height:24px; box-sizing:border-box; padding:1px 3px; border:1px solid var(--line); border-radius:4px; background:var(--card); color:var(--ink); font:inherit; font-size:11.5px; min-width:0; } .cot-mapa .cot-input-preco{ width:58px; }
  .cot-desconto{ display:grid; grid-template-columns:minmax(0,1fr) 32px; gap:2px; } .cot-mapa .cot-desconto input{ width:100%; } .cot-mapa .cot-tipo{ width:32px; padding:0; appearance:none; -webkit-appearance:none; text-align:center; text-align-last:center; font-weight:700; cursor:pointer; }
  .cot-condicoes .cot-desconto{ grid-template-columns:minmax(0,1fr) 52px; gap:3px; } .cot-condicoes select.cot-tipo{ padding:3px 2px; font-size:11.5px; }
  .cot-mapa input[type=number]{ -moz-appearance:textfield; appearance:textfield; } .cot-mapa input[type=number]::-webkit-outer-spin-button, .cot-mapa input[type=number]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
  .cot-forn-topo{ display:flex; align-items:center; justify-content:space-between; gap:6px; } .cot-forn-nome{ max-width:130px; overflow:hidden; text-overflow:ellipsis; }
  .cot-melhor{ background:var(--ok-bg); } .cot-escolhida{ box-shadow:inset 0 2px 0 var(--ok), inset 0 -2px 0 var(--ok); } .cot-preco.cot-escolhida{ box-shadow:inset 2px 0 0 var(--ok), inset 0 2px 0 var(--ok), inset 0 -2px 0 var(--ok); } .cot-tot.cot-escolhida{ box-shadow:inset -2px 0 0 var(--ok), inset 0 2px 0 var(--ok), inset 0 -2px 0 var(--ok); }
  .cot-marca{ display:flex; align-items:center; gap:3px; margin-top:2px; font-size:10.5px; font-weight:600; cursor:pointer; } .cot-mapa .cot-rod{ border-left:2px solid var(--line); }
  .cot-melhor{ background:var(--ok-bg); } .cot-escolhida{ box-shadow:inset 0 0 0 2px var(--ok); } .cot-marca{ display:flex; align-items:center; gap:4px; margin-top:3px; font-size:11.5px; font-weight:600; cursor:pointer; }
  .cot-total td{ background:#F8F6F0; font-size:12.5px; }
  @media (max-width:640px){ .cot-pedido{ grid-template-columns:auto minmax(0,1fr); } .cot-pedido .dv-btn{ grid-column:1 / -1; } }
  .dv-cartao.oc-linha, .dv-cabecalho.oc-linha{ grid-template-columns:72px 76px 90px minmax(160px,2fr) 72px 96px 76px minmax(80px,1fr); }
  #tabOc .dv-filtros input[type=search]{ flex:3 1 200px; width:auto; }
  .oc-grupo-cot{ padding:8px 0; border-top:1px solid var(--line); } .oc-grupo-cot:first-of-type{ border-top:0; } .oc-grupo-topo{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:4px; } .oc-grupo-topo .dia-sub{ flex:1; }
  .oc-grupo{ display:grid; grid-template-columns:minmax(0,1fr) auto 110px auto; align-items:center; gap:10px; padding:4px 0; font-size:13px; }
  .oc-dados{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:8px 14px; font-size:13.5px; } .oc-dados .dia-rotulo{ display:block; }
  @media (max-width:640px){ .oc-grupo{ grid-template-columns:minmax(0,1fr) auto; } .oc-grupo .dv-btn{ grid-column:1 / -1; } }
  .dv-cartao.rec-linha, .dv-cabecalho.rec-linha{ grid-template-columns:72px 76px 100px 66px 70px minmax(120px,1.3fr) minmax(130px,1.7fr) minmax(80px,1fr); }
  #tabRecebimento .dv-filtros input[type=search]{ flex:3 1 200px; width:auto; }
  .rec-soltas{ display:grid; gap:6px; margin-top:6px; } .rec-solta{ display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,280px); align-items:center; gap:8px; }
  @media (max-width:640px){ .rec-solta{ grid-template-columns:1fr; } }
  .dv-cartao.sai-linha, .dv-cabecalho.sai-linha{ grid-template-columns:72px 76px 112px 92px minmax(130px,1.3fr) minmax(130px,1.7fr) minmax(80px,1fr); }
  @media (max-width:760px){ .dv-cartao.sai-linha, .dv-cabecalho.sai-linha{ grid-template-columns:1fr 1fr; } .dv-cabecalho.sai-linha{ display:none; } }
  .sai-resultados{ display:grid; gap:2px; margin-top:4px; } .sai-resultados button{ display:flex; justify-content:space-between; gap:10px; padding:7px 10px; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); font:inherit; text-align:left; cursor:pointer; } .sai-resultados button:hover{ border-color:var(--ink); }
  .rel-filas{ grid-template-columns:repeat(4,minmax(0,1fr)); } @media (max-width:640px){ .rel-filas{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
  .cod-prod{ font-family:'JetBrains Mono',monospace; font-size:10.5px; max-width:80px; overflow-wrap:anywhere; } .rec-item-estornado td{ opacity:.55; text-decoration:line-through; } .rec-item-estornado td:last-child{ text-decoration:none; opacity:1; }
  .cot-mapa .cod-prod{ max-width:48px; }
  .dv-cartao.prod-linha, .dv-cabecalho.prod-linha{ grid-template-columns:44px 64px minmax(200px,3fr) 70px minmax(100px,1fr) minmax(110px,1.2fr); } .prod-nome{ font-weight:600; }
  @media (max-width:760px){ .dv-cartao.prod-linha{ grid-template-columns:44px 1fr 1fr; } .dv-cabecalho.prod-linha{ display:none; } .dv-cartao.prod-linha .prod-nome{ grid-column:2 / -1; } }
  .prod-foto{ display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:6px; background:var(--bg, #F3F0E8); overflow:hidden; font-size:18px; } .prod-foto img{ width:100%; height:100%; object-fit:contain; background:#fff; } .prod-foto-grande{ width:100%; height:190px; margin:8px 0; font-size:52px; }
  .prod-form{ display:grid; grid-template-columns:240px minmax(0,1fr); gap:12px; align-items:start; } .prod-form-foto{ padding:14px; } .prod-form-foto .dia-acoes{ display:flex; flex-wrap:wrap; gap:6px; } .prod-form-foto input[type=file]{ display:none; } .prod-campo-largo{ grid-column:1 / -1; } .prod-maiuscula{ text-transform:uppercase; } .prod-grupo{ display:flex; gap:6px; } .prod-grupo select{ flex:1; min-width:0; }
  @media (max-width:760px){ .prod-form{ grid-template-columns:1fr; } }
  .est-tiles{ grid-template-columns:repeat(6,minmax(0,1fr)); } .est-ic{ width:14px; height:14px; vertical-align:-2px; }
  .dv-cartao.est-linha, .dv-cabecalho.est-linha{ grid-template-columns:44px 56px minmax(190px,3fr) minmax(90px,1fr) 78px 78px 86px 92px 112px; } .dv-cartao.est-linha{ cursor:default; } .est-num{ text-align:right; } .est-saldo{ text-align:right; font-family:'Oswald',sans-serif; font-size:16px; font-weight:700; } .est-saldo small{ font-family:inherit; font-size:10px; font-weight:400; color:var(--ink-soft); margin-left:2px; }
  .est-desc{ white-space:normal !important; overflow:visible; } .est-desc > b{ display:block; font-weight:600; } .est-sub{ display:block; font-size:10.5px; color:var(--ink-soft); } .est-falta{ color:var(--low); } .est-barra{ height:3px; margin-top:3px; border-radius:2px; background:var(--line); overflow:hidden; } .est-barra i{ display:block; height:100%; background:var(--ok); } .est-barra i.over{ background:var(--out); } .est-prev input{ width:64px; height:24px; box-sizing:border-box; } .est-prev .edit-hit{ cursor:pointer; text-decoration:underline dotted; }
  @media (max-width:900px){ .est-tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); } .dv-cabecalho.est-linha{ display:none; } .dv-cartao.est-linha{ grid-template-columns:44px minmax(0,1fr) auto; row-gap:4px; } .est-linha .est-desc{ grid-column:2 / -1; } .est-linha .est-cod, .est-linha .est-grupo{ display:none; } .est-linha .est-num{ text-align:left; } }
  .est-avulso{ display:inline-block; margin-top:2px; padding:1px 7px; border-radius:10px; background:var(--low-bg); color:#B86E00; font-size:10.5px; font-weight:600; }
  .dv-cartao.sai-com-item, .dv-cabecalho.sai-com-item{ grid-template-columns:72px 76px 112px 92px 50px minmax(120px,1.3fr) minmax(120px,1.6fr) minmax(80px,1fr); }
  .est-previsto-linha{ display:block; font-size:10.5px; color:var(--ink-soft); } .est-previsto-linha b{ color:var(--ink); } .est-desvio-alto{ color:var(--out) !important; } .est-pend{ display:block; font-size:10px; color:#B86E00; font-weight:600; } .est-prev-secao{ margin-bottom:10px; } .est-prev-secao > summary{ cursor:pointer; font-weight:600; padding:4px 2px; font-size:12.5px; } .est-prev-linha{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:6px 8px; background:var(--card); border:1px solid var(--line); border-radius:6px; margin-bottom:4px; font-size:11.5px; } .est-prev-linha .dv-grupo{ margin-left:auto; } .est-prev-linha .dv-btn{ min-height:26px; padding:2px 8px; }
  .dv-cartao.dv-fixo{ cursor:default; } .dv-cartao.dv-fixo:hover{ transform:none; } .dv-acoes-linha{ display:flex; justify-content:flex-end; gap:4px; overflow:visible !important; } .dv-tabela-fixa .dv-col b{ font-weight:600; }
  @media (max-width:760px){ .dv-cab-fixo{ display:none !important; } .dv-cartao.dv-fixo:not(.hist-linha){ grid-template-columns:1fr 1fr !important; } }
  .est-tiles-3{ grid-template-columns:repeat(3,minmax(0,1fr)); } .dv-cartao.hist-linha, .dv-cabecalho.hist-linha{ grid-template-columns:44px 124px 76px 56px minmax(180px,2.4fr) 96px minmax(150px,2fr); }
  @media (max-width:760px){ .dv-cabecalho.hist-linha{ display:none; } .dv-cartao.hist-linha{ grid-template-columns:44px 1fr 1fr; } .est-tiles-3{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
  .fer-forms{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px; } .fer-forms .dv-secao{ margin:0; } .fer-forms .dv-btn{ margin-top:8px; } .srv-info{ margin-bottom:10px; font-size:12.5px; }
  @media (max-width:760px){ .fer-forms{ grid-template-columns:1fr; } }
  .cad-com-form > :not(.cad-form-tela){ display:none !important; } .cad-marcar{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:6px; padding:8px; border:1px solid var(--line); border-radius:8px; max-height:280px; overflow:auto; } .cad-marcar label{ display:flex; gap:6px; align-items:center; font-size:12.5px; cursor:pointer; }
  .obras-tiles{ grid-template-columns:repeat(4,minmax(0,1fr)); } @media (max-width:640px){ .obras-tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
  .usr-form .login-field{ margin-bottom:12px; } .usr-form > label, .usr-form .login-field > label{ display:block; margin-bottom:5px; font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft); } .usr-form .login-field > label.checkbox-row{ font-family:inherit; font-size:13px; text-transform:none; letter-spacing:0; color:var(--ink); } .usr-form input:not([type=checkbox]):not([type=radio]), .usr-form select{ width:100%; box-sizing:border-box; padding:8px 10px; border:2px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); font-family:inherit; font-size:14px; } .usr-form input:focus, .usr-form select:focus{ outline:none; border-color:var(--focus); }
  .dv-cartao.dv-clicavel{ cursor:pointer; } .dv-cartao.dv-clicavel:hover{ border-color:var(--steel); } .epi-abas{ grid-template-columns:repeat(2,minmax(0,1fr)); } .epi-abas .dv-tile b, #adminSecaoMonitoramento .dv-tile b{ font-size:15px; } .dv-acoes-topo{ display:flex; justify-content:flex-end; gap:6px; margin-bottom:8px; } .dv-acoes-topo:empty{ display:none; } .dv-fixo .icon{ width:36px; height:36px; font-size:18px; } .dv-fixo .icon img{ width:100%; height:100%; object-fit:contain; } .dv-fixo .dv-btn{ min-height:26px; padding:2px 8px; font-size:11.5px; } .dv-fixo .est-saldo{ display:inline; } .ferr-acoes{ display:flex; flex-wrap:wrap; gap:8px; font-size:10.5px; font-weight:400; } .dv-fixo .dv-col{ white-space:normal; }
  .usr-form > .login-field:last-child{ margin-bottom:0; } .usr-form .checkbox-row{ font-family:inherit; font-size:13px; color:var(--ink); text-transform:none; letter-spacing:0; } #usuariosTela .login-error:empty{ display:none; }
  .perfis-abas .dv-tile b{ font-size:15px; } .perfil-tabela .perfil-grupo th{ font-weight:600; }
  .sai-campos.usr-dados{ grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); align-items:end; } .usr-dados .dia-campo{ height:41px; }
  .dia-campo.alertas-escopo{ width:auto; max-width:230px; padding:6px 8px; font-size:12.5px; }
  .gantt-contexto{ opacity:.62; } .crono-grupos .dv-lista{ background:var(--card); border:1px solid var(--line); border-radius:8px; padding:6px; } .crono-grupos .gantt-axis{ margin-top:6px; } #cronogramaModal #cronModalDependencias{ height:auto; } #cronogramaModal .sai-campos{ grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); }
  .sai-campos{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; } .sai-itens .dia-campo{ max-width:110px; }
  .oc-grupo.rec-ordem{ grid-template-columns:72px minmax(0,1fr) auto auto; } .rec-itens td{ vertical-align:top; } .rec-qtd{ width:110px; font-weight:700; }
  @media (max-width:640px){ .oc-grupo.rec-ordem{ grid-template-columns:auto minmax(0,1fr); } .oc-grupo.rec-ordem .dia-sub, .oc-grupo.rec-ordem .dv-btn{ grid-column:1 / -1; } }
  .fo-tiles{ grid-template-columns:repeat(3,minmax(0,1fr)); } .fo-grade{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; }
  #tabFornecedores .dv-filtros input[type=search]{ flex:3 1 200px; width:auto; }
  .dv-col{ min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .dv-etapa{ font-weight:600; }
  .dv-cartao:hover{ border-color:var(--steel); box-shadow:0 2px 8px rgba(30,42,66,.08); }
  .dv-codigo{ font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:700; color:var(--ink); white-space:nowrap; } .dv-codigo-grande{ font-size:13px; padding:2px 7px; border-radius:6px; background:var(--ink); color:#fff; vertical-align:middle; }
  .dv-grupo-visao{ margin-bottom:10px; } .dv-grupo-visao > summary{ cursor:pointer; padding:5px 2px; font-size:13.5px; } .dv-grupo-visao > summary b{ font-family:'Oswald',sans-serif; font-weight:600; font-size:14.5px; } .dv-grupo-visao .dv-lista{ margin-top:4px; }
  .dv-visao{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; } .dv-visao select{ width:auto; min-height:40px; font-weight:600; }
  .dv-devolvido{ color:var(--out); font-weight:600; }
  .dv-tela-topo{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:12px; } .dv-tela-titulo{ flex:1; min-width:180px; display:flex; flex-direction:column; }
  .dv-tela-titulo b{ font-family:'Oswald',sans-serif; font-size:22px; line-height:1.2; } .dv-tela-titulo .dia-sub::first-letter{ text-transform:uppercase; }
  .dv-passos{ display:flex; gap:6px; margin-bottom:12px; }
  .dv-passo{ flex:1; display:flex; align-items:center; gap:8px; min-width:0; padding:8px 10px; border-radius:8px; background:#ECEAE3; color:var(--ink-soft); font-size:12.5px; font-weight:600; }
  .dv-passo span{ flex:none; width:22px; height:22px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#fff; font-size:11.5px; }
  .dv-passo.atual{ background:var(--ink); color:#fff; } .dv-passo.atual span{ color:var(--ink); }
  .dv-passo.feito{ background:var(--ok-bg); color:var(--ok); }
  .dv-banner{ display:flex; gap:10px; padding:11px 14px; border-radius:8px; font-size:13.5px; margin-bottom:12px; }
  .dv-b-espera{ background:#E7F3FA; color:#174F69; } .dv-b-ok{ background:var(--ok-bg); color:#1F6E30; } .dv-b-ruim{ background:var(--out-bg); color:#A61E1E; }
  .dv-secao{ background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px; margin-bottom:12px; }
  .dv-secao > header{ display:flex; align-items:flex-start; gap:10px; margin-bottom:12px; } .dv-secao h4{ margin:0; font-family:'Oswald',sans-serif; font-size:17px; font-weight:600; }
  .dv-num{ flex:none; width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--ink); color:#fff; font-size:12.5px; font-weight:700; }
  .dv-margem{ margin-top:12px; }
  .dv-climas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:12px; }
  .dv-mais-topo{ display:flex; align-items:center; gap:12px; margin-bottom:14px; } .dv-mais-topo h3{ margin:0; font-family:'Oswald',sans-serif; font-size:20px; }
  .dv-mais-ic{ flex:none; width:38px; height:38px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--low-bg); color:#B86E00; font-size:20px; font-weight:800; }
  .dv-mais-lista{ display:grid; gap:6px; margin:4px 0 6px; }
  .dv-mais-item{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px; width:100%; min-height:44px; padding:8px 12px; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink); font:inherit; font-size:13.5px; text-align:left; cursor:pointer; }
  .dv-mais-item:hover{ border-color:var(--steel); background:#F8F6F0; }
  .dv-mais-botoes{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; margin-top:12px; }
  .dv-h-neutro .dv-h-motivo{ border-left-color:var(--low); background:var(--low-bg); }
  .dv-barra-acoes{ position:sticky; bottom:0; z-index:5; display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; padding:10px 12px; background:var(--card); border:1px solid var(--line); border-radius:12px; box-shadow:0 -4px 14px rgba(30,42,66,.1); }
  .dv-grupo{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
  .dv-m-barra{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; margin-bottom:10px; } .dv-m-busca{ flex:1 1 200px; max-width:320px; }
  .dv-filtro{ min-height:36px; padding:6px 12px; border:1.5px solid var(--line); border-radius:18px; background:var(--card); color:var(--ink); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; }
  .dv-filtro.ativo{ background:var(--ink); border-color:var(--ink); color:#fff; }
  .dv-m-tabela{ overflow-x:auto; border:1px solid var(--line); border-radius:8px; }
  .dv-medicao td, .dv-medicao th{ white-space:nowrap; } .dv-medicao td.dv-m-nome, .dv-medicao td.dv-m-pai{ white-space:normal; min-width:170px; } .dv-m-pai{ color:var(--ink-soft); font-size:12.5px; }
  .dv-ausente input.dia-campo{ opacity:.6; } .dv-m-bloqueada td{ background:#FAF7F2; } .dv-m-trava{ font-size:12px; font-weight:600; color:var(--out); white-space:normal; }
  .dv-historico{ list-style:none; margin:0; padding:0; } .dv-historico li{ display:flex; gap:10px; padding:8px 0; border-top:1px solid var(--line); font-size:13.5px; } .dv-historico li:first-child{ border-top:0; }
  .dv-h-ic{ flex:none; width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-weight:700; background:#ECEAE3; }
  .dv-h-espera .dv-h-ic{ background:#E7F3FA; color:#1B6E94; } .dv-h-ruim .dv-h-ic{ background:var(--out-bg); color:var(--out); } .dv-h-ok .dv-h-ic{ background:var(--ok-bg); color:var(--ok); } .dv-h-atencao .dv-h-ic{ background:var(--low-bg); color:#B86E00; }
  .dv-h-motivo{ margin:3px 0; padding:5px 9px; border-left:3px solid var(--out); background:var(--out-bg); border-radius:4px; }
  .dv-m-num{ font-variant-numeric:tabular-nums; } .dv-m-lanca{ min-width:120px; background:#FFF8F2; position:sticky; right:104px; box-shadow:-3px 0 6px rgba(30,42,66,.07); }
  .dv-m-fim{ width:104px; min-width:104px; box-sizing:border-box; background:#FFF8F2; position:sticky; right:0; white-space:normal !important; } .dv-m-fim-marca{ display:flex; align-items:center; gap:5px; font-size:12.5px; font-weight:600; cursor:pointer; }
  .dv-medicao th:last-child{ width:104px; min-width:104px; box-sizing:border-box; white-space:normal !important; position:sticky; right:0; background:#F3F0E8; } .dv-medicao th:nth-last-child(2){ position:sticky; right:104px; background:#F3F0E8; box-shadow:-3px 0 6px rgba(30,42,66,.07); }
  .dv-medicao tr.dv-m-motivo td{ white-space:normal; background:#FFF8F2; } .dv-m-motivo-in{ position:sticky; left:8px; width:min(640px, calc(100vw - 96px)); } .dv-m-motivo-in .dia-rotulo{ display:block; white-space:normal; } .dv-m-motivo-in .dia-campo{ display:block; width:100%; margin-top:3px; }
  .crono-saldo{ display:inline-block; padding:1px 7px; border-radius:9px; background:var(--low-bg); color:#B86E00; font-size:10.5px; font-weight:700; white-space:nowrap; }
  .aviso-versao{ position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:10000; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; max-width:calc(100vw - 32px); box-sizing:border-box; padding:10px 14px; border-radius:10px; background:var(--ink); color:#fff; font-size:13.5px; font-weight:600; box-shadow:0 6px 20px rgba(30,42,66,.35); }
  .aviso-versao button{ min-height:36px; padding:6px 14px; border:0; border-radius:7px; background:var(--accent); color:#fff; font:inherit; cursor:pointer; }
  .dv-medicao td, .dv-medicao th{ padding-left:8px; padding-right:8px; } .dv-m-input{ font-weight:700; min-height:40px; } .dv-passou{ color:var(--out); font-weight:600; }
  @media (max-width:820px){
    .dv-medicao thead{ display:none; } .dv-medicao, .dv-medicao tbody, .dv-medicao tr{ display:block; width:100%; }
    .dv-medicao tr{ display:grid; grid-template-columns:1fr 1fr; gap:6px 12px; padding:12px; border-top:1px solid var(--line); }
    .dv-medicao tr:first-child{ border-top:0; } .dv-m-tabela{ overflow:visible; }
    .dv-medicao td{ display:block; padding:0; border:0; white-space:normal; font-size:13px; } .dv-medicao td::before{ content:attr(data-l); display:block; font-size:10px; text-transform:uppercase; color:var(--ink-soft); }
    .dv-medicao td.dv-m-pai, .dv-medicao td.dv-m-nome, .dv-medicao td.dv-m-lanca, .dv-medicao td.dv-m-fim, .dv-medicao tr.dv-m-motivo td{ grid-column:1 / -1; min-width:0; width:auto; position:static; } .dv-medicao td.dv-m-lanca{ padding:8px; border-radius:6px; } .dv-m-lanca{ position:static; box-shadow:none; } .dv-medicao tr.dv-m-motivo{ border-top:0; padding-top:0; display:block; } .dv-m-motivo-in{ position:static; width:100%; }
    .dv-passo{ font-size:11px; padding:6px; gap:5px; }
  }
  @media (max-width:640px){ .dv-tiles{ gap:6px; grid-template-columns:repeat(2,minmax(0,1fr)); } .dv-tile{ padding:9px 10px; } .dv-tile b{ font-size:21px; } .dv-tile span{ font-size:11px; } .dv-barra-acoes .dv-grupo:last-child{ width:100%; } .dv-barra-acoes .dv-grupo:last-child .dv-btn{ flex:1; } .dv-secao{ padding:12px; } }
  @media (max-width:640px){ .dia-duas{ grid-template-columns:1fr; } .dia-acoes input[type=date]{ flex:1; } }
  /* 🤝 Entrega ao cliente (js/rede-entrega.js) */
  #entregaModal .modal-box{ max-height:94vh; overflow-y:auto; }
  .en-grade{ display:grid; grid-template-columns:1fr 1fr; gap:0 12px; margin-top:8px; }
  .en-area{ width:100%; box-sizing:border-box; font-family:Arial,sans-serif; font-size:13px; padding:8px 10px; border:2px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); }
  .en-checks{ display:grid; grid-template-columns:1fr 1fr; gap:4px 12px; }
  .fr-campo label.en-check{ font-size:12.5px; display:flex; align-items:center; gap:6px; font-family:'Oswald',sans-serif; text-transform:none; color:var(--ink); margin:0; }
  .fr-campo .en-check input{ width:auto; margin:0; flex:none; }
  .en-botoes{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; } .en-botoes .quick-btn{ padding:6px 10px; font-size:11px; }
  .en-acoes{ margin-top:10px; } .en-destaque{ background:var(--accent); color:#fff; border-color:var(--accent); } .en-destaque-suave{ border-color:var(--focus); color:var(--focus); }
  .en-historico{ display:flex; flex-direction:column; gap:8px; }
  .en-card{ border:1px solid var(--line); border-radius:8px; padding:10px 12px; } .en-card-topo{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
  .en-card-info{ font-size:12px; color:var(--ink-soft); margin:4px 0 8px; }
  .en-sel{ font-family:'JetBrains Mono',monospace; font-size:10px; padding:2px 7px; border-radius:10px; background:#EEF0F3; color:var(--ink-soft); }
  .en-sel.en-enviado{ background:var(--ok-bg); color:var(--ok); } .en-sel.en-na_fila{ background:var(--low-bg); color:var(--low); } .en-sel.en-aberto_no_email{ background:#E3F3FA; color:var(--focus); }
  @media (max-width:640px){ .en-grade, .en-checks{ grid-template-columns:1fr; } }
  /* Editor de modelos de etiqueta (js/etiquetas-editor.js) */
  #editorEtiquetaModal .modal-box{ max-height:94vh; overflow-y:auto; }
  .ee-topo{ display:grid; grid-template-columns: 2fr 1fr 1.4fr 1fr; gap:10px; align-items:end; margin-top:8px; }
  .ee-corpo{ display:grid; grid-template-columns: minmax(0,1fr) 300px; gap:14px; margin-top:6px; }
  .ee-barra, .ee-botoes{ display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
  .ee-barra .quick-btn, .ee-botoes .quick-btn{ padding:6px 9px; font-size:11px; }
  .ee-botoes .quick-btn.ativo{ background:var(--steel); color:#fff; }
  .ee-botoes .quick-btn.perigo{ color:var(--out); border-color:var(--out); }
  .ee-sep{ width:1px; height:22px; background:var(--line); margin:0 3px; }
  .ee-tela{ margin-top:8px; border:1px solid var(--line); border-radius:8px; background:#f7f7f9; padding:6px; overflow:auto; max-height:56vh; text-align:center; touch-action:none; }
  .ee-tela svg{ display:inline-block; user-select:none; }
  .ee-avisos{ font-size:12px; color:var(--out); margin-top:6px; display:flex; flex-direction:column; gap:3px; }
  .ee-grade{ display:grid; grid-template-columns:1fr 1fr; gap:0 10px; }
  .ee-previa{ border:1px dashed var(--line); border-radius:6px; padding:8px; background:#fff; text-align:center; overflow:auto; }
  .ee-rodape{ display:flex; gap:8px; align-items:center; margin-top:12px; border-top:1px solid var(--line); padding-top:12px; }
  @media (max-width:820px){ .ee-corpo{ grid-template-columns:1fr; } .ee-topo{ grid-template-columns:1fr 1fr; } }
  .me-lista{ display:flex; flex-direction:column; gap:6px; max-height:34vh; overflow-y:auto; margin-bottom:4px; }
  .me-linha{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:8px 10px; border:1px solid var(--line); border-radius:6px; }
  .me-info{ display:flex; flex-direction:column; gap:2px; }
  .me-info b{ font-family:'Oswald',sans-serif; font-size:14px; }
  .me-info span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); }

  /* "Adicionar ao rack" passo 2 — lista de modelos com miniatura (igual
     o Catálogo), clique na linha inteira escolhe. */
  .em-lista{ display:flex; flex-direction:column; gap:2px; max-height:56vh; overflow-y:auto; }
  .em-linha{
    display:flex; align-items:center; gap:12px; padding:8px; border-radius:8px; cursor:pointer;
    border:2px solid transparent;
  }
  .em-linha:hover{ background:var(--paper); border-color:var(--line); }
  .em-linha.ativo{ background:#E3EEFF; border-color:var(--focus); outline:2px solid var(--focus); outline-offset:-2px; }
  /* Dentro de formulário (trocar modelo): sem espaço, o nome desce pra
     baixo do desenho em vez de espremer uma letra por linha. */
  .fr-custom .em-linha{ flex-wrap:wrap; gap:6px 12px; }
  .fr-custom .em-lista{ overflow-x:hidden; }
  .fr-custom .catalogo-mini{ max-width:100%; }
  .em-nome{ font-family:'Oswald',sans-serif; font-weight:600; font-size:14px; }
  .em-specs{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); margin-top:2px; }

  /* Biblioteca de logos — grade de miniaturas pra escolher com um clique. */
  .el-grade{ display:grid; grid-template-columns:repeat(auto-fill, minmax(88px, 1fr)); gap:10px; max-height:44vh; overflow-y:auto; }
  .el-item{ display:flex; flex-direction:column; align-items:center; gap:4px; }
  .el-thumb{
    width:100%; aspect-ratio:1; padding:6px; border:2px solid var(--line); border-radius:8px;
    background:#14151A; cursor:pointer; display:flex; align-items:center; justify-content:center;
  }
  .el-thumb:hover{ border-color:var(--focus); }
  .el-thumb img{ max-width:100%; max-height:100%; object-fit:contain; }

  /* ---- Cabeamento → VLANs e IPs (js/rede-ip.js). Área escolhida pelo
     alternador Racks | VLANs e IPs: .so-racks / .so-ip somem na outra. ---- */
  #tabCabeamento:not([data-secao="racks"]) .so-racks,
  #tabCabeamento:not([data-secao="ip"]) .so-ip,
  #tabCabeamento:not([data-secao="portas"]) .so-portas,
  #tabCabeamento:not([data-secao="fibras"]) .so-fibras,
  #tabCabeamento:not([data-secao="roteadores"]) .so-roteadores,
  #tabCabeamento:not([data-secao="topologia"]) .so-topologia,
  #tabCabeamento:not([data-secao="plantas"]) .so-plantas,
  #tabCabeamento:not([data-secao="quadro"]) .so-quadro,
  #tabCabeamento[data-modo="simples"] .so-avancado{ display:none !important; }
  #redeSecaoRacksBtn.active, #redeSecaoIpBtn.active, #redeSecaoPortasBtn.active, #redeSecaoFibrasBtn.active, #redeSecaoRoteadoresBtn.active, #redeSecaoTopologiaBtn.active, #redeSecaoPlantasBtn.active, #redeSecaoQuadroBtn.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
  .rede-modo{ display:inline-flex; margin-left:auto; border:1.5px solid var(--steel); border-radius:6px; overflow:hidden; }
  .rede-modo button{ border:none; background:var(--card); color:var(--steel); font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:700; padding:7px 11px; cursor:pointer; }
  .rede-modo button + button{ border-left:1.5px solid var(--steel); }
  .rede-modo button.active{ background:var(--steel); color:#fff; }
  .rip-resumo{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--ink-soft); margin:4px 0 12px; }
  .rip-alerta{ display:flex; gap:10px; align-items:center; width:100%; text-align:left; border:none; padding:9px 12px; border-radius:8px; margin-bottom:8px; font-family:'Oswald',sans-serif; font-size:13.5px; cursor:pointer; }
  .rip-alerta.alta{ background:var(--low-bg); color:#8A5000; }
  .rip-alerta.critica, .rip-alerta.cheia{ background:var(--out-bg); color:var(--out); }
  .rip-scroll{ overflow-x:auto; }
  .rip-tabela{ width:100%; border-collapse:collapse; font-size:13.5px; }
  .rip-tabela th{ text-align:left; font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; color:var(--ink-soft); font-weight:700; padding:6px 8px; border-bottom:1.5px solid var(--line); white-space:nowrap; }
  .rip-tabela td{ padding:7px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
  .rip-tabela tr:last-child td{ border-bottom:none; }
  .rip-mono{ font-family:'JetBrains Mono',monospace; font-size:12.5px; font-variant-numeric:tabular-nums; white-space:nowrap; }
  .rip-suave{ color:var(--ink-soft); font-size:12.5px; }
  .rip-acoes{ white-space:nowrap; text-align:right; }
  .rip-acoes button{ border:none; background:none; cursor:pointer; font-size:15px; padding:2px 4px; }
  .rip-pill{ display:inline-block; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; text-transform:uppercase; padding:2px 7px; border-radius:4px; background:var(--line); color:var(--steel); white-space:nowrap; }
  .rip-pill.ativa, .rip-pill.ok{ background:var(--ok-bg); color:var(--ok); }
  .rip-pill.planejada, .rip-pill.alta{ background:var(--low-bg); color:#8A5000; }
  .rip-pill.critica, .rip-pill.cheia{ background:var(--out-bg); color:var(--out); }
  .rip-faixa{ border:1px solid var(--line); border-left:6px solid var(--ok); border-radius:var(--radius); padding:12px 14px; margin-bottom:10px; background:var(--card); }
  .rip-faixa.alta{ border-left-color:var(--low); }
  .rip-faixa.critica, .rip-faixa.cheia{ border-left-color:var(--out); }
  .rip-faixa-topo{ display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; }
  .rip-cidr{ font-family:'JetBrains Mono',monospace; font-size:17px; font-weight:700; }
  .rip-nome{ color:var(--ink-soft); font-size:13.5px; }
  .rip-uso{ display:flex; align-items:center; gap:8px; margin:10px 0; font-family:'JetBrains Mono',monospace; font-size:11.5px; }
  .rip-barra{ flex:1; height:8px; background:var(--line); border-radius:4px; overflow:hidden; max-width:320px; }
  .rip-barra i{ display:block; height:100%; background:var(--ok); }
  .rip-faixa.alta .rip-barra i{ background:var(--low); }
  .rip-faixa.critica .rip-barra i, .rip-faixa.cheia .rip-barra i{ background:var(--out); }
  .rip-numeros{ display:grid; grid-template-columns:repeat(auto-fill, minmax(118px, 1fr)); gap:6px 14px; margin-bottom:10px; }
  .rip-numeros div{ display:flex; flex-direction:column; }
  .rip-numeros span{ font-family:'JetBrains Mono',monospace; font-size:9.5px; text-transform:uppercase; color:var(--ink-soft); }
  .rip-numeros b{ font-family:'JetBrains Mono',monospace; font-size:12.5px; font-variant-numeric:tabular-nums; }
  .rip-botoes{ display:flex; gap:6px; flex-wrap:wrap; }
  .rip-botoes .quick-btn{ padding:6px 10px; font-size:11px; }
  .rip-ips{ margin-top:10px; border-top:1px dashed var(--line); padding-top:8px; }
  .rip-impacto{ table-layout:fixed; }
  .rip-impacto th:first-child, .rip-impacto td:first-child{ width:30%; }
  .rip-impacto td:first-child{ color:var(--ink-soft); font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; }
  .rip-impacto .rip-mono{ white-space:normal; overflow-wrap:anywhere; font-size:12px; }
  .rip-lista-erro, .rip-lista-aviso{ margin:8px 0; padding-left:18px; font-family:'Oswald',sans-serif; font-size:13px; line-height:1.4; }
  .rip-lista-erro{ color:var(--out); }
  .rip-lista-aviso{ color:#8A5000; }

  /* ---- Cabeamento → Portas dos switches (js/rede-portas.js). Cor = situação
     da configuração; ponto no canto = ocupada (cabo, descrição ou
     equipamento). Porta fora do filtro fica apagada, sem sair do lugar. ---- */
  .rp-acoes-topo{ display:flex; gap:8px; flex-wrap:wrap; }
  .rp-acoes-topo #rpSelecionarBtn.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
  .rp-legenda{ display:flex; gap:12px; flex-wrap:wrap; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); margin:4px 0 12px; }
  .rp-legenda span{ display:inline-flex; align-items:center; gap:5px; }
  .rp-legenda i{ width:14px; height:14px; border-radius:3px; border:1.5px solid var(--line); display:inline-block; }
  .rp-switch-topo{ display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; margin-bottom:10px; }
  .rp-switch-topo b{ font-size:16px; }
  .rp-face{ max-width:1100px; margin-bottom:10px; background:#DCDAD4; border-radius:6px; padding:8px; }
  .rp-face .pt.fora{ opacity:0.22; }
  .rp-legenda i.ocupada{ border:1.5px solid #1A1A1A; width:9px; height:9px; border-radius:50%; background:#fff; }
  /* Conexões e conferência da infra (js/rede-plantas-infra.js) */
  .pl-conexoes{ border-top:1px dashed var(--line); margin-top:6px; padding-top:6px; font-size:12px; }
  .pl-conferencia{ margin:4px 0 8px; font-size:12px; border:1.5px solid var(--out); border-radius:8px; padding:6px 8px; }
  .pl-conferencia summary{ cursor:pointer; color:var(--out); font-weight:600; }
  .pl-conf-item{ padding:3px 0; border-bottom:1px dashed var(--line); cursor:pointer; }
  .pl-conf-item:hover{ color:var(--focus); }
  /* 🧩 Composições (js/rede-composicoes.js) */
  .pl-composicao{ border-top:1px dashed var(--line); margin-top:6px; padding-top:6px; }
  .pl-composicao select, .pl-composicao input{ font-family:'Oswald',sans-serif; font-size:12px; padding:3px 4px; border:1.5px solid var(--line); border-radius:5px; background:var(--card); color:var(--ink); max-width:190px; }
  .pl-comp-itens{ font-size:12px; margin:2px 0 6px; }
  .pl-comp-item{ display:flex; gap:6px; align-items:center; padding:1px 0; }
  .pl-comp-item .rip-mono{ width:54px; flex-shrink:0; color:var(--ink-soft); font-size:10.5px; }
  .comp-tabela input, .comp-tabela select{ font-family:'Oswald',sans-serif; font-size:12px; padding:3px 4px; border:1.5px solid var(--line); border-radius:5px; background:var(--card); color:var(--ink); width:100%; box-sizing:border-box; }
  /* 📋 Quadro de infraestrutura (js/rede-quadro.js) */
  .qd-resumo{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
  .qd-chip{ font-family:'Oswald',sans-serif; font-size:12.5px; border:1.5px solid var(--line); background:var(--card); color:var(--ink); border-radius:14px; padding:3px 10px; cursor:pointer; }
  .qd-chip:disabled{ cursor:default; }
  .qd-chip.ok b{ color:var(--ok); } .qd-chip.critico{ border-color:var(--out); color:var(--out); } .qd-chip.aviso{ border-color:#E6A700; }
  .qd-chip.ativo{ background:var(--ink); color:#fff; border-color:var(--ink); }
  .qd-filtros{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:6px; }
  .qd-filtros select{ font-family:'Oswald',sans-serif; font-size:13px; padding:6px 8px; border:1.5px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); max-width:100%; }
  .qd-vistas{ display:flex; gap:6px; flex-wrap:wrap; margin-left:auto; }
  .qd-vistas .quick-btn.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
  .qd-legenda{ display:flex; flex-wrap:wrap; gap:12px; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); margin-bottom:10px; align-items:center; }
  .qd-bola{ display:inline-block; width:8px; height:8px; border-radius:50%; border:1.5px solid var(--ink-soft); background:transparent; margin-right:4px; vertical-align:middle; }
  .qd-bola.ocupada{ background:var(--ok); border-color:var(--ok); } .qd-bola.problema{ background:var(--out); border-color:var(--out); }
  .qd-rack-topo{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:8px; }
  .qd-rack-topo b{ font-size:16px; }
  .qd-barra{ display:inline-block; width:90px; height:8px; border-radius:4px; background:var(--line); position:relative; overflow:hidden; }
  .qd-barra i{ position:absolute; left:0; top:0; bottom:0; background:var(--focus); }
  .qd-abrir{ margin-left:auto; padding:4px 10px; font-size:11px; }
  .qd-arvore{ font-size:13px; }
  .qd-no-linha{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:4px 2px; cursor:pointer; border-radius:6px; }
  .qd-no-linha:hover{ background:var(--paper); }
  .qd-ramo{ font-family:'JetBrains Mono',monospace; color:var(--ink-soft); }
  .qd-u{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft); width:30px; }
  .qd-eq-res{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); }
  .qd-poe.ok{ color:var(--ok); } .qd-poe.aviso{ color:#8A5000; } .qd-poe.critico{ color:var(--out); }
  .qd-prob{ color:var(--out); }
  .qd-bolas{ display:inline-flex; flex-wrap:wrap; gap:2px; max-width:420px; }
  .qd-bolas .qd-bola{ margin:0; width:7px; height:7px; }
  .qd-seta{ margin-left:auto; color:var(--ink-soft); }
  .qd-portas{ margin:4px 0 10px 34px; }
  .qd-linha-prob td{ background:var(--out-bg); }
  .qd-cor{ display:inline-block; width:9px; height:9px; border-radius:2px; margin-right:4px; vertical-align:middle; }
  .qd-front-linha{ display:flex; gap:8px; align-items:center; cursor:pointer; margin-bottom:2px; }
  .qd-face{ flex:1; min-width:0; max-width:720px; } .qd-face svg{ display:block; width:100%; height:auto; }
  .qd-front-nome{ width:240px; display:flex; flex-direction:column; font-size:12px; }
  .qd-front-nome span{ color:var(--ink-soft); font-size:11px; }
  @media (max-width:640px){ .qd-front-nome{ width:120px; } .qd-portas{ margin-left:0; } }
  /* 🏷 Etiquetas (js/etiquetas.js) */
  #etiquetasModal .modal-box{ max-width:1180px; }
  .etq-grade{ display:grid; grid-template-columns:minmax(0, 340px) minmax(0, 1fr); gap:14px; align-items:start; }
  @media (max-width:760px){ .etq-grade{ grid-template-columns:minmax(0, 1fr); } }
  .etq-bloco select{ width:100%; box-sizing:border-box; min-width:0; }
  .etq-config{ display:flex; flex-direction:column; gap:10px; }
  .etq-bloco{ border:1.5px solid var(--line); border-radius:8px; padding:8px 10px; display:flex; flex-direction:column; gap:6px; font-size:13px; }
  .etq-bloco select, .etq-num input, .etq-mini{ font-family:'Oswald',sans-serif; font-size:13px; padding:5px 6px; border:1.5px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); }
  .etq-nums{ display:grid; grid-template-columns:1fr 1fr; gap:6px; }
  .etq-num{ display:flex; flex-direction:column; gap:2px; font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft); }
  .etq-num input{ width:100%; box-sizing:border-box; }
  .etq-check{ display:flex; gap:6px; align-items:center; }
  .etq-mini{ margin:-2px 0 2px 22px; }
  .etq-linha{ display:flex; gap:6px; flex-wrap:wrap; }
  .etq-acoes{ display:flex; gap:8px; flex-wrap:wrap; align-items:flex-end; margin-bottom:8px; }
  .etq-acoes .register-btn{ width:auto; padding:9px 14px; }
  .etq-inicio{ width:120px; }
  .etq-previa-titulo{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft); text-transform:uppercase; margin:4px 0; }
  .etq-previa{ background:#DEDFE3; padding:8px; border-radius:8px; overflow:auto; max-height:460px; margin-bottom:10px; }
  .etq-previa .etq-folha{ box-shadow:0 1px 4px rgba(0,0,0,.25); }
  .etq-lista-topo{ display:flex; gap:10px; align-items:center; margin-bottom:6px; }
  .etq-lista-topo .search{ flex:1; margin:0; }
  .etq-lista{ max-height:260px; overflow:auto; border:1.5px solid var(--line); border-radius:8px; padding:4px 8px; }
  .etq-item{ display:flex; gap:6px; align-items:baseline; font-size:12.5px; padding:2px 0; }
  .etq-item span{ color:var(--ink-soft); }
  /* ⚡ PoE do switch (js/rede-portas.js poeSwitchHtml) */
  .rp-poe{ border:1.5px solid var(--line); border-radius:8px; padding:8px 10px; margin:0 0 10px; font-size:12.5px; }
  .rp-poe.vazio{ border-style:dashed; color:var(--ink-soft); }
  .rp-poe.aviso{ border-color:#E6A700; }
  .rp-poe.critico{ border-color:var(--out); }
  .rp-poe-topo{ display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; margin-bottom:6px; }
  .rp-poe-barra{ position:relative; height:10px; border-radius:5px; background:var(--line); overflow:visible; margin-bottom:5px; }
  .rp-poe-barra i{ position:absolute; left:0; top:0; bottom:0; border-radius:5px; background:var(--ok); }
  .rp-poe-barra.aviso i{ background:#E6A700; }
  .rp-poe-barra.critico i{ background:var(--out); }
  .rp-poe-barra b{ position:absolute; top:-3px; bottom:-3px; width:2px; background:var(--ink); }
  .rp-poe-num{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); }
  .rp-poe-alertas{ margin:6px 0 0; padding-left:16px; }
  .rp-poe-alertas li.critico{ color:var(--out); }
  .rp-poe-alertas li.aviso{ color:#8A5000; }
  .rp-problemas{ margin:0 0 10px; padding-left:18px; font-size:13px; color:var(--out); }
  .rp-problemas li{ margin-bottom:2px; }

  /* ---- Cabeamento → Fibras entre racks (js/rede-fibras.js): diagrama dos
     racks (caixas) com os cabos (arcos) e a lista dos cabos. ---- */
  .rf-diagrama{ overflow-x:auto; margin-bottom:6px; }
  .rf-diagrama svg{ display:block; margin:0 auto; font-family:'JetBrains Mono',monospace; }
  .rf-diagrama .rf-rack{ cursor:pointer; }
  .rf-diagrama .rf-rack:hover rect{ stroke:var(--focus); }
  /* Links backbone (área Fibras): cada link é uma cadeia
     equipamento ─ DIO ═ fibras ═ DIO ─ equipamento. */
  .bb-link{ border:1px solid var(--line); border-radius:8px; padding:10px 12px; margin-top:10px; background:var(--card); }
  .bb-topo{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:8px; }
  .bb-cat{ display:inline-flex; align-items:center; gap:6px; font-family:'Oswald',sans-serif; font-weight:600; font-size:13px; }
  .bb-cat i{ width:14px; height:14px; border-radius:3px; border:1px solid #3D4A5C; display:inline-block; }
  .bb-cadeia{ display:flex; align-items:center; overflow-x:auto; padding-bottom:2px; }
  .bb-no{ flex-shrink:0; display:flex; flex-direction:column; align-items:center; gap:1px; padding:6px 10px; border-radius:7px; font-family:'Oswald',sans-serif; line-height:1.2; text-align:center; }
  .bb-no small{ font-family:'JetBrains Mono',monospace; font-size:9.5px; color:var(--ink-soft); text-transform:uppercase; }
  .bb-no b{ font-size:14px; }
  .bb-no span{ font-family:'JetBrains Mono',monospace; font-size:11.5px; }
  .bb-equip{ border:2px solid var(--ink); background:var(--paper); color:var(--ink); cursor:pointer; }
  .bb-equip:hover, .bb-falta:hover{ border-color:var(--focus); }
  .bb-falta{ border:2px dashed var(--out); background:transparent; color:var(--out); cursor:pointer; }
  .bb-dio{ background:#1E2127; color:#fff; }
  .bb-dio span{ color:#C9CDD3; }
  .bb-cordao{ flex:0 0 28px; height:5px; border-radius:3px; background:var(--ink-soft); }
  .bb-cordao.vazio{ background:none; border-top:2px dashed var(--out); height:0; }
  .bb-fibras{ flex:1 1 140px; min-width:140px; display:flex; flex-direction:column; align-items:center; gap:3px; padding:0 6px; }
  .bb-feixe{ width:100%; display:flex; flex-direction:column; gap:1px; }
  .bb-feixe i{ display:block; height:4px; border-radius:2px; outline:1px solid rgba(0,0,0,0.25); }
  .bb-fibras span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); white-space:nowrap; }
  /* Fibras de reserva (backup): mesmo feixe, fino e apagado, embaixo do que está em uso. */
  .bb-feixe.reserva{ opacity:0.45; margin-top:4px; }
  .bb-feixe.reserva i{ height:2px; }
  .bb-fibras .bb-reserva{ font-style:italic; }
  .bb-dio em{ font-family:'JetBrains Mono',monospace; font-style:normal; font-size:9.5px; color:#8E949C; }
  .bb-reserva-linha{ display:flex; align-items:center; gap:10px; margin-top:6px; }
  .bb-reserva-linha .bb-feixe{ width:120px; flex-shrink:0; margin-top:0; }
  .bb-reserva-linha span{ font-size:12px; }
  .rf-rota{ font-size:12.5px; line-height:1.5; }
  .rf-cor{ display:inline-block; width:10px; height:10px; border-radius:2px; border:1px solid #3D4A5C; margin-right:6px; vertical-align:-1px; }
  .rf-seletor{ display:grid; grid-template-columns:repeat(auto-fill, minmax(54px, 1fr)); gap:5px; }
  .rf-porta{ position:relative; border:1.5px solid var(--line); background:var(--card); border-radius:6px; padding:5px 2px 8px; cursor:pointer; text-align:center; font-family:'JetBrains Mono',monospace; color:var(--ink); }
  .rf-porta b{ display:block; font-size:13.5px; }
  .rf-porta span{ display:block; font-size:9px; color:var(--ink-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .rf-porta:hover:not([disabled]){ border-color:var(--focus); }
  .rf-porta:focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
  .rf-porta.ocupada{ cursor:not-allowed; background:repeating-linear-gradient(135deg, #ECEDF1 0 5px, #F7F7F9 5px 10px); color:var(--ink-soft); }
  .rf-porta.escolhida{ border-color:var(--focus); background:#E3F3FA; }
  .rf-porta.inicio{ border-width:2.5px; }
  .rf-porta.conflito{ border-color:var(--out); background:var(--out-bg); }
  .rf-porta i{ position:absolute; left:6px; right:6px; bottom:3px; height:4px; border-radius:2px; border:1px solid rgba(0,0,0,0.25); }
  .rf-seletor-resumo{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--ok); margin-top:6px; }
  .rf-seletor-resumo.erro{ color:var(--out); }
  .rf-rota .rf-frente{ color:var(--ink-soft); font-size:11.5px; }

  /* ---- Cabeamento → Topologia (js/rede-topologia.js) ---- */
  .tp-diagrama{ overflow:auto; max-height:75vh; border:1px solid var(--line); border-radius:8px; background:#FFFFFF; }
  .tp-svg{ display:block; }
  .tp-rack:hover > rect{ stroke:var(--focus); stroke-width:2; }
  .tp-lig{ cursor:default; }
  .tp-lig.tp-acesa path{ stroke-width:7; }
  .tp-lig.tp-acesa circle{ r:13; }
  .tp-num{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; border:2.5px solid var(--ink); font-family:'Oswald',sans-serif; font-weight:700; font-size:12px; }
  .tp-lista tr.tp-acesa td{ background:#E3EEFF; }
  /* Seleção de uma peça: ela e as ligações dela acesas, o resto apagado. */
  .tp-item{ cursor:pointer; }
  .tp-item:hover .tp-sel-fundo{ fill:rgba(46,159,203,0.10); }
  .tp-item.tp-escolhido .tp-sel-fundo{ fill:rgba(46,159,203,0.22); stroke:#2E9FCB; stroke-width:2; }
  .tp-item.tp-vizinho .tp-sel-fundo{ fill:rgba(46,159,203,0.12); stroke:#2E9FCB; stroke-dasharray:4 3; }
  .tp-com-sel .tp-lig:not(.tp-dela){ opacity:0.12; }
  .tp-com-sel .tp-lig.tp-dela path{ stroke-width:6; }
  .tp-lista tr.tp-dela td{ background:#CFE3FF; font-weight:600; }
  .tp-sel-aviso{ margin:0 0 8px; font-weight:600; color:var(--ink); }
  /* ---- Cabeamento → Plantas (js/rede-plantas.js) ---- */
  .pl-vazio{ padding:22px; max-width:640px; }
  .pl-vazio h3{ margin:0 0 8px; }
  .pl-vazio p{ color:var(--ink-soft); line-height:1.5; margin:0 0 14px; }
  .pl-barra, .pl-ferramentas{ display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; margin-bottom:8px; }
  .pl-barra{ justify-content:space-between; }
  .pl-plantas, .pl-acoes-planta, .pl-grupo{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
  .pl-plantas .quick-btn.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
  .pl-grupo .quick-btn.active{ background:var(--focus); color:#fff; border-color:var(--focus); }
  .pl-zoom{ font-family:'JetBrains Mono',monospace; font-size:12px; min-width:46px; text-align:center; font-variant-numeric:tabular-nums; }
  .pl-busca{ flex:1 1 200px; min-width:160px; max-width:320px; font-family:'Oswald',sans-serif; font-size:14px; padding:7px 10px; border:2px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); }
  .pl-busca:focus{ border-color:var(--focus); outline:none; }
  .pl-camadas{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:8px; }
  .pl-rotulo{ font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.04em; color:var(--ink-soft); }
  .pl-camada{ display:inline-flex; align-items:center; gap:5px; border:1.5px solid var(--line); background:var(--card); color:var(--ink); border-radius:14px; padding:3px 10px; font-family:'Oswald',sans-serif; font-size:13px; cursor:pointer; }
  .pl-camada i{ width:11px; height:11px; border-radius:50%; border:1px solid rgba(0,0,0,0.25); }
  .pl-camada small{ color:var(--ink-soft); }
  .pl-camada.oculta{ opacity:0.45; text-decoration:line-through; }
  .pl-cor-por{ display:inline-flex; align-items:center; gap:0; margin-right:6px; border:1.5px solid var(--steel); border-radius:14px; overflow:hidden; }
  .pl-cor-por .pl-rotulo{ padding:0 8px; }
  .pl-cor-por button{ border:none; border-left:1.5px solid var(--steel); background:var(--card); color:var(--steel); font-family:"Oswald",sans-serif; font-size:12.5px; padding:3px 10px; cursor:pointer; }
  .pl-cor-por button.ativo{ background:var(--steel); color:#fff; }
  .pl-cad{ background:var(--card); border:1px solid var(--line); border-radius:8px; padding:8px 10px; margin-bottom:8px; }
  .pl-cad-topo{ display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; margin-bottom:6px; }
  .pl-cad-topo .quick-btn{ padding:3px 9px; font-size:11px; }
  .pl-cad-lista{ display:flex; flex-wrap:wrap; gap:5px; max-height:150px; overflow:auto; }
  .pl-cad-lista .pl-camada{ font-size:12.5px; padding:2px 9px; }
  .pl-aviso{ background:#E3F3FA; border:1.5px solid var(--focus); border-radius:8px; padding:7px 10px; margin-bottom:8px; font-size:13.5px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
  .pl-corpo{ display:grid; grid-template-columns:minmax(0, 1fr) 280px; gap:12px; align-items:start; }
  @media (max-width: 900px){ .pl-corpo{ grid-template-columns:minmax(0, 1fr); } }
  .pl-visor{ position:relative; overflow:auto; height:calc(100vh - 300px); min-height:360px; border:1px solid var(--line); border-radius:8px; background:#D9DCE2; padding:12px; box-sizing:border-box; cursor:grab; touch-action:none; outline:none; }
  .pl-visor:focus-visible{ box-shadow:0 0 0 2px var(--focus); }
  .pl-visor[data-arrastando]{ cursor:grabbing; }
  .pl-visor[data-ferramenta="ponto"], .pl-visor[data-ferramenta="texto"], .pl-visor[data-ferramenta="juntar"], .pl-visor[data-ferramenta="area"]{ cursor:crosshair; }
  .pl-visor[data-ferramenta="area"] .pl-obj{ cursor:pointer; }
  .pl-folha{ position:relative; margin:0 auto; background:#FFFFFF; box-shadow:0 1px 6px rgba(0,0,0,0.25); }
  .pl-fundo{ position:absolute; inset:0; width:100%; height:100%; display:block; user-select:none; pointer-events:none; }
  .pl-detalhe{ position:absolute; display:block; user-select:none; pointer-events:none; }
  .pl-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
  .pl-obj{ cursor:pointer; }
  .pl-visor[data-ferramenta="mover"] .pl-obj, .pl-visor[data-ferramenta="infra"] .pl-obj, .pl-visor[data-ferramenta="ponto"] .pl-obj, .pl-visor[data-ferramenta="texto"] .pl-obj{ cursor:move; }
  .pl-cor-rapida{ width:20px; height:20px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px var(--line); cursor:pointer; padding:0; flex:0 0 auto; }
  .pl-cor-rapida:hover, .pl-cor-rapida:focus-visible{ box-shadow:0 0 0 2px var(--focus); outline:none; }
  .pl-bib-topo{ display:flex; align-items:center; gap:8px; margin-bottom:8px; flex-wrap:wrap; }
  .pl-bib-topo span{ font-size:11.5px; color:var(--ink-soft); flex:1 1 140px; }
  .pl-aviso-dica{ display:block; margin-top:4px; color:var(--ink-soft); }
  .pl-obj.apagado{ opacity:0.2; }
  .pl-lado{ background:var(--card); border:1px solid var(--line); border-radius:8px; padding:12px; max-height:max(360px, calc(100vh - 300px)); overflow:auto; box-sizing:border-box; }
  /* Tela cheia da planta: ocupa a janela; as barras de cima podem ser recolhidas */
  #redePlantasConteudo.pl-cheia{ position:fixed; inset:0; z-index:90; background:var(--paper); padding:8px 12px; box-sizing:border-box; display:flex; flex-direction:column; overflow:auto; }
  #redePlantasConteudo.pl-cheia .pl-corpo{ flex:1 1 auto; min-height:0; align-items:stretch; grid-template-columns:minmax(0, 1fr) 320px; }
  #redePlantasConteudo.pl-cheia .pl-visor{ height:100%; min-height:300px; }
  #redePlantasConteudo.pl-cheia .pl-lado{ max-height:none; height:100%; }
  #redePlantasConteudo.pl-sem-barras .pl-barra > .pl-plantas, #redePlantasConteudo.pl-sem-barras .pl-cad, #redePlantasConteudo.pl-sem-barras .pl-camadas{ display:none; }
  #redePlantasConteudo.pl-sem-barras:not(.pl-cheia) .pl-visor{ height:calc(100vh - 160px); }
  #redePlantasConteudo.pl-sem-barras:not(.pl-cheia) .pl-lado{ max-height:max(360px, calc(100vh - 160px)); }
  /* barras compactas na tela cheia: botões menores, linhas baixas */
  #redePlantasConteudo.pl-cheia .quick-btn{ padding:3px 8px; font-size:12px; min-height:0; }
  #redePlantasConteudo.pl-cheia .pl-barra, #redePlantasConteudo.pl-cheia .pl-ferramentas{ gap:4px 8px; margin-bottom:4px; }
  #redePlantasConteudo.pl-cheia .pl-busca{ padding:3px 8px; font-size:12px; flex:0 1 180px; min-width:120px; }
  #redePlantasConteudo.pl-cheia .pl-aviso{ margin-bottom:4px; padding:3px 8px; font-size:12.5px; }
  #redePlantasConteudo.pl-cheia .pl-visor{ padding:6px; }
  #redePlantasConteudo.pl-sem-lado .pl-corpo, #redePlantasConteudo.pl-cheia.pl-sem-lado .pl-corpo{ grid-template-columns:minmax(0, 1fr); }
  #redePlantasConteudo.pl-sem-lado .pl-lado{ display:none; }
  @media (max-width: 900px){ #redePlantasConteudo.pl-cheia .pl-corpo{ grid-template-columns:minmax(0, 1fr); } }
  .pl-lado h4{ margin:0 0 8px; font-family:'Oswald',sans-serif; font-size:17px; display:flex; align-items:center; gap:8px; }
  .pl-lado h4 small{ color:var(--ink-soft); font-weight:400; }
  .pl-bola{ width:14px; height:14px; border-radius:50%; border:1px solid rgba(0,0,0,0.3); flex-shrink:0; }
  .pl-resumo{ font-size:13px; color:var(--ink-soft); margin-bottom:8px; }
  .pl-alerta{ color:#B25E00; font-weight:600; }
  .pl-dica{ font-size:12.5px; color:var(--ink-soft); line-height:1.45; margin:4px 0 8px; }
  .pl-lista{ display:flex; flex-direction:column; gap:2px; }
  .pl-item{ display:grid; grid-template-columns:12px minmax(0, 1fr) auto; gap:8px; align-items:center; text-align:left; border:1px solid transparent; background:none; border-radius:6px; padding:5px 6px; cursor:pointer; color:var(--ink); font-family:'Oswald',sans-serif; font-size:13.5px; }
  .pl-item:hover{ background:#F1F3F6; border-color:var(--line); }
  .pl-item.ativo{ background:#E3F3FA; border-color:var(--focus); }
  .pl-item i{ width:11px; height:11px; border-radius:50%; border:1px solid rgba(0,0,0,0.25); }
  .pl-item b{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:600; }
  .pl-item span{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); white-space:nowrap; }
  .pl-dado{ display:flex; justify-content:space-between; gap:10px; padding:5px 0; border-bottom:1px solid var(--line); font-size:13.5px; }
  .pl-dado span{ color:var(--ink-soft); }
  .pl-dado b{ text-align:right; font-weight:600; }
  .pl-dado .quick-btn{ padding:2px 10px; }
  .pl-direcoes{ display:flex; gap:4px; }
  .pl-direcoes .quick-btn{ padding:2px 8px; min-width:30px; }
  .pl-direcoes .quick-btn.active{ background:var(--focus); color:#fff; border-color:var(--focus); }
  .pl-aviso-lado{ background:var(--low-bg); color:#8A4B00; border-radius:6px; padding:7px 9px; font-size:13px; margin:8px 0; }
  .pl-acoes{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
  .pl-passos{ margin:0 0 8px; padding-left:20px; line-height:1.55; font-size:13.5px; }
  .pl-acoes-col{ flex-direction:column; align-items:stretch; }
  .pl-acoes-col .quick-btn{ text-align:left; }
  .pl-laco{ position:absolute; border:1.5px dashed #2E9FCB; background:rgba(46,159,203,0.10); pointer-events:none; }
  /* Infra na planta (js/rede-plantas-infra.js): escala, medir, trechos, lista de materiais */
  .pl-sem-escala{ border-style:dashed !important; color:#8A4B00 !important; }
  .pl-orto{ display:inline-flex; align-items:center; gap:4px; font-size:12.5px; margin-left:6px; }
  /* Paleta do ━ Infra (painel ao lado): peças com desenho + medidas em botões */
  .pl-infra-tipos{ display:grid; grid-template-columns:repeat(auto-fill, minmax(78px, 1fr)); gap:6px; margin-bottom:6px; }
  .pl-infra-tipo{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 4px 5px; border:1.5px solid var(--line); border-radius:8px; background:var(--card); cursor:pointer; font:inherit; }
  .pl-infra-tipo svg{ width:48px; height:32px; }
  .pl-infra-tipo span{ font-size:12px; font-weight:600; color:var(--ink); }
  .pl-infra-tipo:hover{ border-color:var(--focus); }
  .pl-infra-tipo.ativo{ border-color:currentColor; background:color-mix(in srgb, currentColor 8%, var(--card)); }
  .pl-infra-tipo:focus-visible, .pl-chip:focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
  .pl-infra-sec{ font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); margin:9px 0 4px; }
  .pl-chips{ display:flex; flex-wrap:wrap; gap:4px; }
  .pl-chip{ display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border:1px solid var(--line); border-radius:14px; background:var(--card); color:var(--ink); font:inherit; font-size:12.5px; cursor:pointer; font-variant-numeric:tabular-nums; }
  .pl-chip i{ width:9px; height:9px; border-radius:50%; display:inline-block; }
  .pl-chip:hover{ border-color:var(--focus); }
  .pl-chip.ativo{ background:var(--ink); border-color:var(--ink); color:var(--card); }
  .pl-infra-altura{ width:100%; box-sizing:border-box; padding:5px 8px; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); font:inherit; font-size:13px; }
  .pl-infra-andamento{ margin:12px 0; padding:10px; border:1.5px dashed var(--line); border-radius:8px; }
  .pl-infra-peca{ display:flex; align-items:center; gap:8px; margin-bottom:6px; }
  .pl-infra-peca svg{ width:42px; height:28px; flex:none; }
  .pl-infra-peca b{ color:var(--ink); font-size:13.5px; }
  .pl-infra-andamento .pl-acoes{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
  .pl-infra-andamento .pl-passos{ margin:4px 0 0; font-size:12.5px; }
  /* Biblioteca (js/rede-plantas-itens.js): abas, caixas, fiação, meus itens, ocupação */
  .pl-voltar{ margin:-2px 0 8px; }
  .pl-lista-icone{ width:46px; padding:2px 4px !important; }
  .pl-mini{ width:40px; height:27px; display:block; }
  img.pl-mini{ object-fit:cover; border-radius:4px; border:1px solid var(--line); }
  .pl-voltar .quick-btn{ padding:3px 10px; font-size:13px; }
  .pl-bib-abas{ display:flex; flex-wrap:wrap; gap:2px; margin:0 0 10px; border-bottom:1px solid var(--line); }
  .pl-bib-abas button{ border:none; background:none; color:var(--ink-soft); font:inherit; font-size:13px; font-weight:600; padding:6px 8px; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; }
  .pl-bib-abas button:hover{ color:var(--ink); }
  .pl-bib-abas button.ativo{ color:var(--ink); border-bottom-color:var(--focus); }
  .pl-bib-abas button:focus-visible{ outline:2px solid var(--focus); outline-offset:-2px; }
  .pl-meus-itens{ display:grid; grid-template-columns:repeat(auto-fill, minmax(96px, 1fr)); gap:6px; margin-top:8px; }
  .pl-meu-item{ display:flex; flex-direction:column; gap:3px; }
  .pl-meu-item .pl-infra-tipo{ width:100%; }
  .pl-meu-acoes{ display:flex; gap:3px; justify-content:center; }
  .pl-meu-acoes .quick-btn{ padding:1px 8px; font-size:12px; }
  .pl-ocupacao{ display:flex; flex-direction:column; gap:3px; padding:6px 0; font-size:13px; border-bottom:1px solid var(--line); }
  .pl-ocupacao-barra{ height:7px; border-radius:4px; background:var(--line); overflow:hidden; }
  .pl-ocupacao-barra i{ display:block; height:100%; }
  .pl-cabos-trecho{ display:flex; flex-wrap:wrap; gap:4px; padding:6px 0; }
  .pl-cabos-trecho span{ font-size:12px; padding:1px 7px; border-radius:10px; background:var(--paper); color:var(--ink); font-variant-numeric:tabular-nums; }
  .pl-item-caixa{ font-family:'Oswald',system-ui,sans-serif; width:min(760px, calc(100vw - 32px)); max-height:calc(100vh - 40px); overflow:auto; box-sizing:border-box; }
  .pl-item-corpo{ display:grid; grid-template-columns:minmax(220px, 300px) 1fr; gap:16px; }
  @media (max-width:640px){ .pl-item-corpo{ grid-template-columns:1fr; } }
  .pl-item-pad svg{ width:100%; aspect-ratio:1; border:1px solid var(--line); border-radius:8px; touch-action:none; cursor:crosshair; background:#fff; display:block; margin-bottom:6px; }
  .pl-item-campos{ display:flex; flex-direction:column; gap:6px; font-size:13px; }
  .pl-item-campos label{ display:flex; flex-direction:column; gap:3px; color:var(--ink-soft); }
  .pl-item-campos input:not([type=checkbox]):not([type=color]){ padding:6px 8px; border:1px solid var(--line); border-radius:6px; font:inherit; color:var(--ink); background:var(--card); }
  .pl-item-linha{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
  .pl-item-linha label, .pl-item-check{ flex-direction:row !important; align-items:center; gap:6px !important; color:var(--ink) !important; }
  .pl-item-previas{ display:flex; align-items:center; gap:14px; padding:8px; background:var(--paper); border-radius:6px; }
  .pl-visor[data-ferramenta="medir"], .pl-visor[data-ferramenta="calibrar"], .pl-visor[data-ferramenta="infra"]{ cursor:crosshair; }
  .pl-vertice{ cursor:move; }
  .pl-vertices{ display:inline-flex; flex-wrap:wrap; gap:3px; margin-left:4px; }
  .pl-vertices .quick-btn{ padding:1px 7px; font-size:11px; }
  .pl-lista-caixa{ max-width:min(1100px, 96vw) !important; width:100%; margin-top:30px; }
  .pl-lista-topo{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px; }
  .pl-lista-topo h3{ margin:0; font-family:'Oswald',sans-serif; }
  .pl-lista-rolagem{ max-height:60vh; overflow:auto; border:1px solid var(--line); border-radius:8px; }
  .pl-lista-tabela{ width:100%; border-collapse:collapse; font-size:13px; }
  .pl-lista-tabela th, .pl-lista-tabela td{ padding:5px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
  .pl-lista-tabela th{ position:sticky; top:0; background:#F1F3F6; font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; color:var(--ink-soft); }
  .pl-lista-tabela td.num{ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
  .pl-lista-tabela td.obs{ color:var(--ink-soft); font-size:12px; }
  .pl-lista-tabela td.falta{ color:var(--out); font-weight:700; }
  .pl-lista-grupo td{ background:#EEF2F7; font-family:'Oswald',sans-serif; font-weight:600; }
  .pl-item-estoque{ width:100%; min-width:180px; box-sizing:border-box; padding:4px 6px; border:1.5px solid var(--line); border-radius:5px; font-size:12.5px; }
  .pl-lista-detalhe{ margin-top:10px; }
  .pl-lista-detalhe summary{ cursor:pointer; font-weight:600; margin-bottom:6px; }
  .pl-membro{ border:1px solid var(--line); border-radius:8px; padding:7px 9px; margin-bottom:7px; cursor:pointer; }
  .pl-membro.ativo{ border-color:var(--focus); background:#EEF7FB; }
  .pl-membro-nome{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; font-family:"Oswald",sans-serif; font-size:15px; }
  .pl-membro-nome small{ color:var(--ink-soft); font-size:12px; }
  .pl-membro-porta{ font-family:"JetBrains Mono",monospace; font-size:11px; color:var(--ink-soft); margin:4px 0 0; line-height:1.5; }
  .pl-membro .pl-acoes{ margin-top:6px; }
  .pl-membro .pl-acoes .quick-btn{ padding:3px 9px; font-size:11px; }
  .pl-sel-linha{ margin-bottom:6px; }
  .pl-sel-linha .fr-opcao{ flex:0 1 auto; }

  /* ---- Cabeamento → Roteadores (js/rede-roteadores.js) ---- */
  .rt-card h4{ font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; color:var(--ink-soft); margin:14px 0 6px; display:flex; align-items:center; gap:8px; }
  .rt-card h4 .quick-btn{ padding:3px 8px; font-size:10.5px; }
  .rt-script{ background:#1E2A42; color:#E1E2E6; font-family:'JetBrains Mono',monospace; font-size:11.5px; line-height:1.5; padding:12px 14px; border-radius:8px; overflow-x:auto; white-space:pre; margin:6px 0 0; }
  .rt-sim-item{ display:flex; gap:8px; align-items:baseline; font-size:13px; padding:4px 0; border-bottom:1px solid var(--line); }
  .rt-sim-item:last-child{ border-bottom:none; }
  .rt-sim-item .rip-pill{ flex-shrink:0; }
  .rt-matriz td, .rt-matriz th{ text-align:center; }
  .rt-matriz td.sim{ color:var(--ok); font-weight:700; }
  .rt-matriz td.nao{ color:var(--out); font-weight:700; cursor:help; }
  .rt-matriz td.fw{ color:#8A5000; font-weight:700; cursor:help; }

  /* ---- Cores de fibra ABNT (js/rede.js: CORES_FIBRA_ABNT) ---- */
  .lc-chip-fibra{ background:var(--card) !important; color:var(--ink) !important; border:1px solid var(--line); cursor:pointer; display:inline-flex; align-items:center; gap:2px; }
  .lc-chip-fibra i{ display:inline-block; width:7px; height:12px; border:1px solid rgba(0,0,0,0.25); }
  .lc-titulo-fibra{ font-family:'JetBrains Mono',monospace; font-size:11px; text-transform:uppercase; color:var(--ink-soft); margin:18px 0 4px; }
  .lc-fibras{ display:grid; grid-template-columns:repeat(auto-fill, minmax(110px, 1fr)); gap:6px 10px; margin-top:8px; font-family:'Oswald',sans-serif; font-size:13.5px; }
  .lc-fibras span{ display:flex; align-items:center; gap:6px; }
  .lc-fibras i{ width:16px; height:16px; border-radius:4px; border:1px solid rgba(0,0,0,0.3); flex-shrink:0; }

  /* ---- Formulário rápido do Cabeamento — no lugar de prompt()/confirm()
     em cadeia: todas as perguntas numa tela, cada escolha um botão. ---- */
  .fr-campo{ margin-bottom:12px; }
  .fr-campo label{
    display:block; font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase;
    color:var(--ink-soft); margin-bottom:4px;
  }
  .fr-campo input, .fr-campo select{
    width:100%; box-sizing:border-box; font-family:'Oswald',sans-serif; font-size:14px; padding:8px 10px;
    border:2px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink);
  }
  .fr-campo input:focus, .fr-campo select:focus{ border-color:var(--focus); outline:none; }
  .fr-escolha{ display:flex; flex-direction:column; gap:6px; }
  .fr-multi, .fr-linha{ flex-direction:row; flex-wrap:wrap; }
  /* Escolha dos painéis na impressão de etiquetas: botões menores, em fileira. */
  .fr-multi[data-nome="paineis"]{ gap:6px; }
  .fr-multi[data-nome="paineis"] .fr-opcao{ flex:0 0 auto; padding:6px 12px; font-size:13px; min-height:0; }
  .fr-linha .fr-opcao{ flex:1 0 auto; min-width:58px; text-align:center; padding-left:8px; padding-right:8px; }
  .fr-opcao{
    font-family:'Oswald',sans-serif; font-size:14px; padding:9px 12px; border:2px solid var(--line);
    border-radius:6px; background:var(--card); color:var(--ink); cursor:pointer; text-align:left;
  }
  .fr-opcao:hover{ border-color:var(--ink-soft); }
  .fr-opcao.ativa{ border-color:var(--ink); background:var(--ink); color:#fff; }
  .fr-opcao.ativa::before{ content:'✓  '; }
  .fr-cor-dot{ display:inline-block; width:12px; height:12px; border-radius:50%; margin-right:8px; vertical-align:-1px; border:1px solid rgba(0,0,0,0.25); }
  .fr-dica{ font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft); margin-top:4px; line-height:1.4; white-space:pre-line; }
  .fr-erro{ color:var(--out); font-family:'JetBrains Mono',monospace; font-size:11px; min-height:14px; margin-bottom:6px; }
  .fr-botoes{ display:flex; justify-content:flex-end; gap:8px; }
  .fr-ok{ background:var(--ink); color:#fff; border-color:var(--ink); }

  /* ---- Editor "Desenhar modelo" ---- */
  .ed-ia{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:8px 0; }
  .ed-campos{
    display:grid; grid-template-columns:120px 1fr 1.4fr 80px 80px 110px; gap:8px;
    align-items:end; margin-bottom:10px;
  }
  .ed-campos label, .ed-props label, .ed-mini{
    font-family:'JetBrains Mono',monospace; font-size:9.5px; text-transform:uppercase;
    color:var(--ink-soft); display:flex; flex-direction:column; gap:3px;
  }
  .ed-campos input, .ed-campos select, .ed-props input, .ed-props select, .ed-mini select{
    font-family:'Oswald',sans-serif; font-size:13px; padding:5px 7px; border:2px solid var(--line);
    border-radius:6px; background:var(--card); color:var(--ink); text-transform:none;
  }
  .ed-campos input[type="color"], .ed-props input[type="color"]{ padding:1px; height:32px; width:100%; min-width:46px; }
  .ed-toolbar{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; align-items:flex-end; }
  .ed-toolbar .sep{ width:1px; align-self:stretch; background:var(--line); margin:0 3px; }
  .ed-canvas-wrap{
    overflow:auto; background:#DCDAD4; border:2px solid var(--ink); border-radius:6px; padding:12px;
  }
  .ed-canvas-wrap svg{ display:block; touch-action:none; user-select:none; -webkit-user-select:none; }
  .ed-com-balde svg, .ed-com-balde svg *{ cursor:crosshair !important; }
  .ed-balde-ferramenta{ display:inline-flex; align-items:center; gap:5px; }
  .ed-balde-ferramenta input[type="color"]{ width:34px; height:30px; padding:1px; border:2px solid var(--line); border-radius:6px; background:var(--card); }
  #edBaldeBtn.ativo{ background:var(--ink); color:#fff; border-color:var(--ink); }
  .ed-balde-dica{ color:var(--accent, var(--ink)); font-weight:700; }
  .ed-status{
    font-family:'JetBrains Mono',monospace; font-size:10.5px; margin:6px 0 8px;
    display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap;
  }
  .ed-status .ok{ color:var(--ok); font-weight:700; }
  .ed-status .erro{ color:var(--out); font-weight:700; }
  .ed-dica{ color:var(--ink-soft); }
  .ed-props{
    border:1px solid var(--line); border-radius:6px; padding:10px; display:flex; flex-wrap:wrap;
    gap:8px; align-items:flex-end; min-height:52px;
  }
  .ed-props input[type="number"]{ width:76px; }
  .ed-titulo-props{ font-family:'Oswald',sans-serif; font-weight:600; font-size:14px; align-self:center; margin-right:6px; }
  .ed-vazio{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); align-self:center; }
  .ed-salvar{ background:var(--ok); color:#fff; border-color:var(--ok); }
  .ed-recentes{ display:inline-flex; align-items:center; gap:5px; align-self:flex-end; height:32px; }
  .ed-recente{ width:20px; height:20px; }
  .ed-tamanho{ display:inline-flex; align-items:center; gap:4px; }
  .ed-tamanho > span{ font-family:'JetBrains Mono',monospace; font-size:9.5px; text-transform:uppercase; color:var(--ink-soft); margin-right:2px; }
  .ed-tamanho .quick-btn{ min-width:38px; font-size:18px; font-weight:700; padding-top:2px; padding-bottom:2px; }
  @media (max-width: 800px){ .ed-campos{ grid-template-columns:1fr 1fr; } }

  .reset-link{
    display:block; text-align:center; margin-top:22px; font-family:'JetBrains Mono',monospace;
    font-size:10.5px; color:var(--ink-soft); text-decoration:underline; cursor:pointer;
  }

  .kpi-row{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
  .kpi-tile{
    flex:1; min-width:120px; background:var(--card); border:1px solid var(--line);
    border-left:3px solid var(--ink-soft); border-radius:var(--radius); padding:4px 8px;
  }
  .kpi-tile.ok{ border-left-color:var(--ok); }
  .kpi-tile.low{ border-left-color:var(--low); }
  .kpi-tile.out{ border-left-color:var(--out); }
  .kpi-tile.over{ border-left-color:var(--over); }
  .kpi-tile.clickable{ cursor:pointer; transition:transform .1s; }
  .kpi-tile.clickable:hover{ transform:translateY(-2px); border-color:var(--focus); }
  .kpi-tile .kpi-num{ font-family:'Bebas Neue',sans-serif; font-size:20px; line-height:1; color:var(--ink); }
  .kpi-tile .kpi-label{
    font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft);
    text-transform:uppercase; margin-top:4px;
  }

  .chart-card{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    padding:16px; margin-bottom:14px;
  }
  .chart-card h3{
    font-family:'Oswald',sans-serif; font-size:12.5px; text-transform:uppercase; letter-spacing:0.5px;
    margin:0 0 14px; color:var(--ink);
  }

  .donut-wrap{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
  .donut-legend{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--ink); }
  .donut-legend-row{ display:flex; align-items:center; gap:8px; margin-bottom:7px; }
  .donut-legend-row i{ width:10px; height:10px; border-radius:3px; display:inline-block; flex-shrink:0; }
  .donut-legend-row b{ margin-left:auto; padding-left:10px; }

  .bar-row{ display:flex; align-items:center; gap:10px; margin-bottom:9px; font-family:'JetBrains Mono',monospace; font-size:11px; }
  .bar-row .bar-label{
    width:150px; flex-shrink:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink);
  }
  .bar-row .bar-track{ flex:1; background:#ECEDF1; border-radius:4px; height:14px; overflow:hidden; }
  .bar-row .bar-fill{ height:100%; border-radius:4px; }
  .bar-row .bar-val{ width:64px; text-align:right; flex-shrink:0; font-weight:700; color:var(--ink); }

  .mv-legend{ display:flex; gap:16px; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); margin-bottom:12px; }
  .mv-legend span{ display:flex; align-items:center; gap:6px; }
  .mv-legend i{ width:9px; height:9px; border-radius:2px; display:inline-block; }
  .mv-chart{ display:flex; align-items:flex-end; gap:5px; height:120px; }
  .mv-col{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
  .mv-bars{ display:flex; align-items:flex-end; gap:2px; height:100px; width:100%; justify-content:center; }
  .mv-bar{ width:6px; border-radius:2px 2px 0 0; min-height:2px; }
  .mv-bar.entrada{ background:var(--entrada); }
  .mv-bar.saida{ background:var(--accent); }
  .mv-day{ font-family:'JetBrains Mono',monospace; font-size:8.5px; color:var(--ink-soft); margin-top:5px; }

  .login-card{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    padding:20px; max-width:360px; margin:20px auto 0;
  }
  /* Tela de login: centraliza o bloco (logo + card) no meio da janela —
     sem isso, numa janela grande de app instalado sobra muito espaço
     vazio embaixo/do lado, já que o conteúdo é curto por natureza. */
  #loginScreen{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    min-height:100vh; gap:28px;
  }
  #loginScreen .header{ border-bottom:none; padding-bottom:0; margin-bottom:0; }
  #loginScreen .login-card{ margin-top:0; width:100%; }
  .login-field{ margin-bottom:14px; }
  .login-field label{
    display:block; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft);
    text-transform:uppercase; margin-bottom:5px;
  }
  .login-field input, .login-field select{
    width:100%; padding:11px 12px; border:2px solid var(--line); border-radius:8px;
    font-family:'Oswald',sans-serif; font-size:14px; background:var(--card); color:var(--ink);
  }
  .login-field input:focus, .login-field select:focus{ outline:none; border-color:var(--focus); }
  /* Um checkbox dentro de .login-field herdava o mesmo visual de campo
     de texto (fundo, borda grossa, padding) e ficava sem a marcação
     visível quando clicado — volta pra aparência nativa do navegador. */
  .login-field input[type="checkbox"]{
    width:auto; padding:0; border:1.5px solid var(--line); border-radius:3px; background:none;
  }
  .senha-wrap{ position:relative; }
  .senha-wrap input{ padding-right:40px !important; }
  .senha-toggle{
    position:absolute; right:10px; top:50%; transform:translateY(-50%);
    cursor:pointer; font-size:15px; color:var(--ink-soft); user-select:none;
  }
  .login-error{ color:var(--out); font-size:12.5px; margin-bottom:10px; min-height:1em; }
  .server-line{
    text-align:center; margin-top:16px; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft);
  }

  .user-row{
    background:var(--card); border:1px solid var(--line); border-radius:8px;
    padding:10px 14px; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:8px;
  }
  .checkbox-row{
    display:flex; align-items:center; gap:6px; font-size:13px; padding:4px 0;
  }
  /* Lista de obras/módulos marcáveis — em coluna única vira uma rolagem
     enorme com 50+ obras. Aqui quebra em várias colunas conforme o
     espaço disponível (1 no celular, várias numa tela larga). */
  .checkbox-grid{ display:flex; flex-wrap:wrap; gap:2px 20px; }
  .checkbox-grid .checkbox-row{ flex:0 0 auto; min-width:190px; }

  .modal-overlay{
    position:fixed; inset:0; background:rgba(27,27,24,0.6); z-index:100;
    /* os modais ficam fora do .app (quem dá a fonte) — sem isso caía na serifada do navegador */
    font-family:'Oswald',system-ui,sans-serif; color:var(--ink);
    display:none; align-items:flex-start; justify-content:center; padding:20px 12px; overflow-y:auto;
  }

  /* Abre por cima do modal "Desenhar modelo", que já está aberto. */
  #escolherLogoModal{ z-index:150; }
  /* Abre por cima do modal de cadastro de atividade. */
  #bloqueioModal{ z-index:160; }

  .restart-overlay{
    position:fixed; inset:0; background:rgba(27,27,24,0.88); z-index:200;
    display:none; align-items:center; justify-content:center; text-align:center;
  }
  .restart-overlay .spinner{
    width:44px; height:44px; margin:0 auto 18px; border-radius:50%;
    border:4px solid rgba(232,89,12,0.25); border-top-color:var(--accent);
    animation:restart-spin 0.8s linear infinite;
  }
  @keyframes restart-spin{ to{ transform:rotate(360deg); } }
  .restart-overlay h3{
    font-family:'Bebas Neue',sans-serif; font-size:26px; letter-spacing:0.5px;
    color:#fff; margin:0 0 6px;
  }
  .restart-overlay p{
    font-family:'JetBrains Mono',monospace; font-size:11.5px; color:rgba(255,255,255,0.7); margin:0;
  }
  .modal-box{
    background:var(--card); border-radius:var(--radius); max-width:520px; width:100%;
    padding:18px; margin:20px 0 40px;
  }
  .modal-box h3{ font-family:'Bebas Neue',sans-serif; font-size:22px; margin:0 0 10px; }
  .nf-row{ border-bottom:1px solid var(--line); padding-bottom:10px; margin-bottom:10px; }
  .nf-row select, .nf-row input{
    font-family:'Oswald',sans-serif; font-size:13px; padding:8px; border:2px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink);
  }

  /* Importação da NF-e: o que fazer com cada linha (js/itens-equivalencias.js) */
  .nf-det{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); margin-bottom:4px; }
  .nf-aviso{ font-size:12px; border-radius:6px; padding:6px 8px; margin:4px 0 6px; }
  .nf-aviso.ok{ background:var(--ok-bg); color:var(--ok); }
  .nf-aviso.semelhante{ background:var(--low-bg); color:var(--ink); }
  .nf-aviso.novo{ background:#EEF0F3; color:var(--ink-soft); }
  .nf-acoes{ display:flex; flex-wrap:wrap; gap:4px; margin-bottom:6px; }
  .nf-acao{ font-family:'Oswald',sans-serif; font-size:12px; padding:4px 8px; border:1.5px solid var(--line); border-radius:14px; background:var(--card); color:var(--ink-soft); cursor:pointer; }
  .nf-acao.ativa{ border-color:var(--focus); background:var(--focus); color:#fff; }
  .nf-dica-acao{ font-size:11px; color:var(--ink-soft); margin-top:4px; }
  .nf-campos{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
  .nf-campos .nf-alvo, .nf-campos .nf-nome{ flex:1 1 220px; min-width:0; max-width:100%; }
  .nf-row.nf-ignorada > div:first-child{ text-decoration:line-through; color:var(--ink-soft); }
  #nfImportModal .modal-box{ max-width:760px; }
  /* 🔗 Itens semelhantes */
  #itensSemelhantesModal .modal-box{ max-width:980px; }
  /* o modal fica fora do .app, que é quem dá a fonte */
  .sem-item .h-name{ font-size:13px; font-weight:500; }
  .sem-item .h-date{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); }
  .sem-abas{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
  .sem-aba{ font-family:'Oswald',sans-serif; font-size:13px; padding:6px 10px; border:1.5px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink-soft); cursor:pointer; }
  .sem-aba.ativa{ border-color:var(--accent); color:var(--ink); font-weight:600; }
  .sem-item{ display:flex; gap:8px; align-items:center; min-width:0; }
  .sem-item .icon{ flex-shrink:0; }
  .sem-par{ border:1.5px solid var(--line); border-radius:10px; padding:10px; margin-bottom:10px; }
  .sem-par-itens{ display:grid; grid-template-columns:1fr auto 1fr; gap:10px; align-items:center; margin-bottom:8px; }
  .sem-par-nota{ text-align:center; font-family:'Bebas Neue',sans-serif; font-size:24px; color:var(--focus); line-height:1; }
  .sem-par-nota small{ display:block; font-family:'JetBrains Mono',monospace; font-size:9.5px; color:var(--ink-soft); max-width:150px; }
  .sem-nomes{ border-bottom:1px solid var(--line); padding:8px 0; }
  .sem-tabela{ width:100%; border-collapse:collapse; font-size:12px; margin-top:6px; }
  .sem-tabela th{ text-align:left; font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--ink-soft); font-weight:normal; border-bottom:1px solid var(--line); padding:3px 4px; }
  .sem-tabela td{ border-bottom:1px solid var(--line); padding:4px; vertical-align:top; }
  .sem-tabela small{ color:var(--ink-soft); }
  .sem-variacoes{ margin:4px 0 0 40px; font-size:12.5px; }
  /* Ferramentas: ações e linha do tempo da ferramenta */
  .ferr-acoes{ display:flex; flex-wrap:wrap; gap:12px; margin-top:4px; font-family:'JetBrains Mono',monospace; font-size:10.5px; }
  .ferr-tempo{ list-style:none; margin:0; padding:0 0 0 14px; border-left:2px solid var(--line); font-size:13px; }
  .ferr-tempo li{ position:relative; padding:4px 0 8px 8px; }
  .ferr-tempo li::before{ content:""; position:absolute; left:-20px; top:9px; width:9px; height:9px; border-radius:50%; background:var(--focus); }
  .ferr-tempo li.alerta::before{ background:var(--out); }
  .ferr-tempo .h-date{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--ink-soft); }
  @media (max-width:640px){ .sem-par-itens{ grid-template-columns:1fr; } .sem-tabela{ display:block; overflow-x:auto; } }

  .os-foto-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(90px, 1fr)); gap:8px; }
  .os-foto-item{ position:relative; border-radius:8px; overflow:hidden; aspect-ratio:1; }
  .os-foto-item img{ width:100%; height:100%; object-fit:cover; cursor:pointer; display:block; }
  .os-foto-del{
    position:absolute; top:3px; right:3px; width:20px; height:20px; border:none; border-radius:50%;
    background:rgba(27,27,24,0.65); color:#fff; font-size:13px; line-height:1; cursor:pointer;
  }
  .os-foto-add{
    aspect-ratio:1; border:2px dashed var(--line); border-radius:8px; display:flex; align-items:center; justify-content:center;
    text-align:center; font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--ink-soft); cursor:pointer; padding:4px;
  }
  .os-foto-add:hover{ border-color:var(--focus); color:var(--focus); }

  /* --- Telas estreitas (celular/tablet retrato) --- */
  @media (max-width: 600px){
    .app{ padding:12px 14px 30px; }
    .header .logo{ height:38px; }
    .header h1{ font-size:22px; }
    .header .sub{ font-size:10px; }
    .stats{ text-align:left; }
    .kpi-tile{ min-width:100px; }
  }

  /* --- Telas largas (desktop) --- */
  /* No celular os botões esticados ocupando a linha toda fazem sentido
     (tela estreita, um por linha). Numa janela larga isso vira um monte
     de botão vazio e a lista de itens/usuários/obras fica uma coluna
     única gigante — o app não escala visualmente com muito conteúdo
     (100+ colaboradores, 50+ obras). Aqui só o layout muda; nada de
     comportamento é diferente entre as duas faixas de largura. */
  @media (min-width: 900px){
    /* Com poucos botões (colaborador restrito), cada um cresce só até um
       limite e sobra espaço — centralizado, essa sobra fica dividida nos
       dois lados em vez de virar um buraco de um lado só. */
    .tabs, .subtabs{ justify-content:center; }
    /* Mesmo max-width em todo botão de aba (obra incluída) — linhas com
       número diferente de botões (2 em cima, 2 embaixo, etc.) ficam
       alinhadas em vez de cada linha ter uma largura própria. */
    .tab-btn{ flex:1 1 0; max-width:260px; padding-left:20px; padding-right:20px; }
    /* auto-fit (não auto-fill) — com poucos itens as colunas vazias
       somem em vez de ficar reservadas como um buraco em branco. */
    /* stretch (padrão do grid): todo card de uma mesma linha fica com a
       mesma altura do maior vizinho, em vez de cada um "encolher" pro
       tamanho do próprio conteúdo — era isso que deixava os quadros com
       tamanhos desiguais numa mesma fileira. */
    .list{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); }
    /* Exceção: no #list (Estoque/Total) e no #obrasList, o card expande
       por dentro dele mesmo (painel de lançamento / dados da obra) —
       esse "stretch" faria os vizinhos da mesma fileira incharem junto
       quando só um é aberto, então o painel aberto flutua por cima em
       vez de empurrar a altura da fileira toda. */
    #list .panel.open, #obrasList .panel.open{
      position:absolute; left:0; right:0; top:100%; z-index:5;
      border:1px solid var(--line); border-top:none;
      border-radius:0 0 var(--radius) var(--radius);
      box-shadow:0 10px 24px rgba(0,0,0,0.14);
    }
    #list .card:has(.panel.open), #obrasList .card:has(.panel.open){
      position:relative; overflow:visible; z-index:1;
    }

    /* Formulário de nova obra: em vez de uma coluna estreita e comprida
       de campos empilhados, usa a largura toda em 2 colunas. */
    #novaObraCard{
      max-width:none; display:grid; grid-template-columns:1fr 1fr;
      column-gap:14px; align-items:start;
    }
    #novaObraCard .novaObraFullRow{ grid-column:1/-1; }
  }


/* Gestão > Perfis */
.perfil-aviso{ background:#FFF6E5; border:1px solid #F0D9A8; color:#6B4E0F; border-radius:8px; padding:10px 12px; font-size:13px; margin-bottom:12px; }
.perfil-campos{ display:flex; gap:10px; flex-wrap:wrap; }
.perfil-campos .login-field{ flex:1; min-width:200px; }
.perfil-tabela-wrap{ overflow-x:auto; margin-bottom:12px; }
.perfil-tabela{ width:100%; border-collapse:collapse; font-size:13px; min-width:760px; }
.perfil-tabela th, .perfil-tabela td{ padding:7px 8px; border-bottom:1px solid var(--line); text-align:center; }
.perfil-tabela thead th{ font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; color:var(--ink-soft); font-weight:500; }
.perfil-tabela thead th:first-child, .perfil-tabela .perfil-tela, .perfil-tabela .perfil-extras, .perfil-tabela thead th:last-child{ text-align:left; }
.perfil-tabela .perfil-grupo th{ text-align:left; background:var(--paper); font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; }
.perfil-grupo-acoes{ float:right; display:inline-flex; gap:12px; text-transform:none; font-weight:400; }
.perfil-tabela .perfil-na{ color:var(--line); }
.perfil-extra{ display:inline-flex; align-items:center; gap:4px; margin-right:10px; white-space:nowrap; font-size:12px; }
.perfil-tabela input[type=checkbox]{ width:16px; height:16px; margin:0; }
.observar-resumo{ min-width:640px; }
.observar-linha{ cursor:pointer; }
.observar-linha:hover, .observar-linha.ativa{ background:var(--paper); }
.observar-titulo{ margin:16px 0 8px; font-size:14px; }
/* Esconde as ações de cada linha; o X de fechar a janela continua. */
.somente-leitura .hist-del:not([onclick*="close"]):not([onclick*="fechar"]), .somente-leitura .os-foto-add{ display:none !important; }
.obras-grupos{ margin-top:22px; }
.obras-grupos .dv-titulo{ margin-bottom:8px; }
