  :root{
    --bg:#0F0C0A;
    --surface:#1B1512;
    --surface-2:#241C17;
    --ink:#F3E9DD;
    --ink-soft:#B8A897;
    --line:#3B2E24;
    --jade:#E8720F;
    --jade-dark:#FFA24D;
    --jade-tint:rgba(232,114,15,0.14);
    --hanko:#FF4A1C;
    --hanko-dark:#FF8156;
    --hanko-tint:rgba(255,74,28,0.14);
    --gold:#FFB238;
    --font-display:'Fraunces',serif;
    --font-body:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
    --font-mono:'IBM Plex Mono',monospace;
    --radius:10px;
    --shadow:0 1px 2px rgba(0,0,0,0.3), 0 6px 20px rgba(0,0,0,0.35);
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:var(--font-body);
    -webkit-font-smoothing:antialiased;
  }
  ::selection{ background:var(--hanko); color:#fff; }
  button{ font-family:inherit; cursor:pointer; }
  input,textarea,select{ font-family:inherit; }

  .app{ display:flex; min-height:100vh; }

  /* ---------- SIDEBAR ---------- */
  .sidebar{
    width:236px;
    flex-shrink:0;
    background:#15120E;
    color:#D8D2C8;
    display:flex;
    flex-direction:column;
    padding:24px 16px;
    position:sticky;
    top:0;
    height:100vh;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 8px 24px 8px;
    border-bottom:1px solid rgba(255,255,255,0.08);
    margin-bottom:20px;
  }
  .hanko-mark{
    width:40px; height:40px;
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
    filter:drop-shadow(0 2px 6px rgba(255,74,28,0.35));
  }
  .hanko-mark svg{ width:100%; height:100%; }
  .brand-text .name{ font-family:var(--font-display); font-size:19px; font-weight:600; line-height:1.1; color:#F3EFE8; }
  .brand-text .tag{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.09em; text-transform:uppercase; color:#B9CFC6; }

  .nav{ display:flex; flex-direction:column; gap:4px; }
  .nav-btn{
    display:flex; align-items:center; gap:12px;
    background:transparent; border:none; color:#B7AFA2;
    padding:11px 12px; border-radius:10px; text-align:left;
    font-size:14px; font-weight:500;
    transition:background .15s ease, color .15s ease, box-shadow .15s ease;
  }
  .nav-btn svg{ width:18px; height:18px; flex-shrink:0; opacity:0.85; }
  .nav-btn:hover{ background:rgba(255,255,255,0.05); color:#F3EFE8; }
  .nav-btn.active{
    background:rgba(255,138,61,0.14);
    color:#FF9B54;
    font-weight:600;
    box-shadow:inset 0 0 0 1px rgba(255,138,61,0.32);
  }
  .nav-btn.active svg{ opacity:1; color:#FF9B54; }

  /* Nav groups — altura animada por JS; chevron + items por CSS */
  .nav-group{ margin: 2px 0 4px; }
  .nav-group-toggle{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: transparent;
    border: none;
    color: rgba(216,210,200,0.55);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 10px 14px 6px;
    cursor: pointer;
    text-align: left;
    transition: color 0.18s ease, background 0.18s ease;
    border-radius: 8px;
  }
  .nav-group-toggle:hover{
    color: rgba(243,239,232,0.95);
    background: rgba(255,255,255,0.04);
  }
  .nav-group-title{ flex: 1; }
  .nav-group-chevron{
    flex-shrink: 0;
    opacity: 0.7;
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease;
  }
  .nav-group.open .nav-group-chevron{
    transform: rotate(180deg);
    opacity: 1;
  }
  .nav-group-items{
    overflow: hidden;
    height: 0;
    opacity: 0;
  }
  .nav-group.open .nav-group-items{
    /* height/opacity los controla JS; open marca estado */
  }
  .nav-group-items-inner{
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 0 4px;
    min-height: 0;
  }
  .nav-group-items .nav-btn{
    opacity: 0;
    transform: translateX(-6px);
    transition:
      opacity 0.22s ease,
      transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
      background 0.15s ease,
      color 0.15s ease;
  }
  .nav-group.open .nav-group-items .nav-btn{
    opacity: 1;
    transform: translateX(0);
  }
  .nav-group.open .nav-group-items .nav-btn:nth-child(1){ transition-delay: 0.04s; }
  .nav-group.open .nav-group-items .nav-btn:nth-child(2){ transition-delay: 0.07s; }
  .nav-group.open .nav-group-items .nav-btn:nth-child(3){ transition-delay: 0.10s; }
  .nav-group.open .nav-group-items .nav-btn:nth-child(4){ transition-delay: 0.13s; }
  .nav-group.open .nav-group-items .nav-btn:nth-child(5){ transition-delay: 0.16s; }
  .nav-group.open .nav-group-items .nav-btn:nth-child(6){ transition-delay: 0.19s; }
  .nav-group-label{ display: none; } /* legacy */

  .nav-footer{ margin-top:auto; padding:12px 8px 0 8px; font-size:11.5px; color:#8A8375; line-height:1.5; border-top:1px solid rgba(255,255,255,0.08); padding-top:14px;}

  /* ---------- MAIN ---------- */
  main{ flex:1; min-width:0; padding:36px 44px 60px; }
  .view{ display:none; animation:fadeIn .25s ease; }
  .view.active{ display:block; }
  @keyframes fadeIn{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:none;} }

  .view-header{ margin-bottom:28px; }
  .eyebrow{ font-family:var(--font-mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 6px; }
  h1{ font-family:var(--font-display); font-size:30px; font-weight:600; margin:0 0 6px; }
  .subtitle{ color:var(--ink-soft); font-size:14.5px; max-width:60ch; line-height:1.5; margin:0; }

  .panel{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }
  .panel + .panel{ margin-top:20px; }
  .panel-pad{ padding:22px 24px; }

  /* ---------- CONTACTOS ---------- */
  .form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px 16px; }
  .form-grid .full{ grid-column:1 / -1; }
  label{ display:block; font-size:12.5px; font-weight:600; color:var(--ink-soft); margin-bottom:5px; }
  input[type=text], input[type=email], input[type=tel], textarea, select{
    width:100%; border:1px solid var(--line); border-radius:7px; padding:9px 11px;
    font-size:14px; color:var(--ink); background:var(--surface-2);
    transition:border-color .15s ease, background .15s ease;
  }
  input:focus, textarea:focus, select:focus{ outline:2px solid var(--jade); outline-offset:1px; border-color:var(--jade); background:var(--surface-2); }
  textarea{ resize:vertical; min-height:56px; }

  .btn{
    display:inline-flex; align-items:center; gap:8px;
    border:none; border-radius:8px; padding:10px 18px;
    font-size:13.5px; font-weight:600;
    transition:transform .1s ease, box-shadow .15s ease, background .15s ease;
  }
  .btn:active{ transform:translateY(1px); }
  .btn-jade{ background:var(--jade); color:#fff; }
  .btn-jade:hover{ background:var(--jade-dark); }
  .btn-hanko{ background:var(--hanko); color:#fff; }
  .btn-hanko:hover{ background:var(--hanko-dark); }
  .btn-ghost{ background:transparent; color:var(--ink-soft); border:1px solid var(--line); }
  .btn-ghost:hover{ background:var(--surface-2); color:var(--ink); }
  .btn:disabled{ opacity:0.5; cursor:not-allowed; transform:none; }
  .btn-sm{ padding:6px 11px; font-size:12.5px; border-radius:6px; }
  .btn-icon{ padding:7px; border-radius:6px; }

  table{ width:100%; border-collapse:collapse; }
  thead th{
    text-align:left; font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.07em; text-transform:uppercase;
    color:var(--ink-soft); padding:0 14px 10px; border-bottom:1px solid var(--line); font-weight:500;
  }
  tbody td{ padding:13px 14px; border-bottom:1px solid var(--line); font-size:13.5px; vertical-align:middle; }
  tbody tr:last-child td{ border-bottom:none; }
  tbody tr:hover{ background:var(--surface-2); }
  .contact-name{ font-weight:600; }
  .contact-sub{ color:var(--ink-soft); font-size:12px; }

  .badge{ display:inline-block; padding:3px 9px; border-radius:99px; font-size:11px; font-weight:600; }
  .badge-prospecto{ background:rgba(255,178,56,0.16); color:var(--gold); }
  .badge-activo{ background:var(--jade-tint); color:var(--jade-dark); }
  .badge-cliente{ background:rgba(93,169,255,0.16); color:#7FB4FF; }
  .badge-inactivo{ background:rgba(184,168,151,0.14); color:var(--ink-soft); }

  .empty-state{ text-align:center; padding:48px 20px; color:var(--ink-soft); }
  .empty-state .stamp{ width:44px;height:44px;border-radius:50%;border:2px dashed var(--line); margin:0 auto 14px; display:flex; align-items:center; justify-content:center; color:var(--line); font-size:20px;}
  .empty-state p{ margin:0; font-size:13.5px; }

  /* ---------- PDF MODULE ---------- */
  .dropzone{
    border:1.5px dashed var(--line); border-radius:var(--radius);
    padding:34px 20px; text-align:center; background:var(--surface-2);
    transition:border-color .15s ease, background .15s ease;
    cursor:pointer;
  }
  .dropzone.drag{ border-color:var(--jade); background:var(--jade-tint); }
  .dropzone svg{ width:26px; height:26px; color:var(--ink-soft); margin-bottom:10px; }
  .dropzone p{ margin:0; font-size:13.5px; color:var(--ink-soft); }
  .dropzone .hint{ font-size:11.5px; margin-top:4px; }

  .img-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin-top:18px; }
  .img-card{ border:1px solid var(--line); border-radius:8px; overflow:hidden; background:var(--surface-2); position:relative; cursor:grab; transition:box-shadow .15s ease, opacity .15s ease, border-color .15s ease; }
  .img-card:active{ cursor:grabbing; }
  .img-card.dragging{ opacity:0.45; border-color:var(--jade); }
  .img-card.drag-over{ border-color:var(--hanko); box-shadow:0 0 0 2px var(--hanko-tint); }
  .img-card .thumb-wrap{ height:110px; overflow:hidden; background:var(--surface-2); display:flex; align-items:center; justify-content:center;}
  .img-card img{ width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; }
  .img-card .order-num{
    position:absolute; top:6px; left:6px; background:rgba(30,42,44,0.75); color:#fff;
    font-family:var(--font-mono); font-size:11px; padding:2px 6px; border-radius:5px;
  }
  .img-card .meta{ padding:8px 9px; }
  .img-card .fname{ font-size:11.5px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .img-card .actions{ display:flex; gap:5px; padding:0 9px 9px; }
  .img-card .actions button{ flex:1; padding:5px; border-radius:5px; border:1px solid var(--line); background:var(--surface-2); font-size:12px; cursor:pointer; }
  .img-card .actions button:hover{ background:var(--surface-2); }
  .img-card .remove{ color:var(--hanko); }
  .jp-rotate-row{ display:flex; gap:8px; margin-top:12px; }
  .jp-rotate-row .btn{ flex:1; justify-content:center; }

  /* ---------- JAPANESE MODULE ---------- */
  .jp-layout{ display:grid; grid-template-columns:300px 1fr; gap:20px; align-items:start; }
  @media (max-width:900px){ .jp-layout{ grid-template-columns:1fr; } }

  .upload-box{
    border:1.5px dashed var(--line); border-radius:var(--radius);
    background:var(--surface-2); padding:22px; text-align:center; cursor:pointer;
  }
  .upload-box:hover{ border-color:var(--hanko); }
  .preview-img{ width:100%; border-radius:8px; margin-top:14px; border:1px solid var(--line); display:none; }
  .jp-select-hint{ margin:8px 0 0; font-size:11.5px; color:var(--ink-soft); }
  .crop-tag{
    display:inline-flex; align-items:center; gap:6px; margin-top:8px;
    font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.05em; text-transform:uppercase;
    color:var(--jade-dark); background:var(--jade-tint); padding:4px 9px; border-radius:99px;
  }
  .crop-tag button{
    background:none; border:none; color:inherit; font:inherit; text-decoration:underline;
    cursor:pointer; padding:0; margin-left:2px;
  }

  .jp-select-wrap{
    position:relative; margin-top:14px; touch-action:none; user-select:none; line-height:0;
  }
  .jp-select-wrap img{
    width:100%; border-radius:8px; border:1px solid var(--line); display:block; cursor:crosshair;
  }
  .crop-selection{
    position:absolute; border:1.5px dashed var(--hanko);
    background:rgba(178,58,46,0.14); display:none; pointer-events:none;
  }
  .pdf-chip{
    display:flex; align-items:center; gap:10px; margin-top:14px;
    border:1px solid var(--line); border-radius:8px; padding:12px 13px; background:var(--surface-2);
  }
  .pdf-chip .icon{
    width:34px; height:34px; border-radius:7px; background:var(--hanko); color:#fff;
    display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:10.5px; font-weight:700; flex-shrink:0;
  }
  .pdf-chip .name{ font-size:12.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .pdf-chip .sub{ font-size:11px; color:var(--ink-soft); }

  .jp-pdf-nav{
    display:flex; align-items:center; gap:8px; margin-top:14px; flex-wrap:wrap;
  }
  .jp-pdf-nav .btn-sm{ padding:6px 10px; }
  .jp-pdf-nav-page{
    display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink-soft);
    font-family:var(--font-mono);
  }
  .jp-pdf-nav-page input{
    width:48px; text-align:center; padding:5px 4px; border:1px solid var(--line); border-radius:6px;
    font-family:var(--font-mono); font-size:12.5px; background:var(--surface);
  }
  .jp-pdf-nav #jp-pdf-use-full{ margin-left:auto; }
  .jp-pdf-nav.full-mode #jp-pdf-use-full{ background:var(--jade-tint); color:var(--jade-dark); font-weight:600; }
  .jp-pdf-nav.full-mode #jp-pdf-prev, .jp-pdf-nav.full-mode #jp-pdf-next, .jp-pdf-nav.full-mode .jp-pdf-nav-page{
    opacity:0.5;
  }
  @media (max-width:520px){ .jp-pdf-nav #jp-pdf-use-full{ margin-left:0; width:100%; order:5; } }
  .block-heading .jp-text{ font-size:23px; font-weight:600; }
  .block-heading .es-text{ font-weight:600; }

  .results-wrap{ position:relative; }
  .phrase-row{
    display:grid; grid-template-columns:1fr 1fr 1fr auto;
    gap:14px; padding:14px 16px; border-bottom:1px solid var(--line);
    align-items:start;
  }
  .phrase-row:last-child{ border-bottom:none; }
  .phrase-row .col-label{ font-family:var(--font-mono); font-size:10px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); display:block; margin-bottom:4px; }
  .jp-text{ font-family:var(--font-display); font-size:19px; line-height:1.5; cursor:text; user-select:text; }
  .reading-text{ font-family:var(--font-mono); font-size:12.5px; color:var(--jade-dark); line-height:1.6; }
  .es-text{ font-size:13.5px; color:var(--ink); line-height:1.6; }
  .speak-btn{
    width:32px; height:32px; border-radius:50%; border:1px solid var(--line); background:var(--surface-2);
    display:flex; align-items:center; justify-content:center; color:var(--hanko); flex-shrink:0;
  }
  .speak-btn:hover{ background:var(--hanko-tint); border-color:var(--hanko); }
  .speak-btn svg{ width:15px; height:15px; }

  .float-speak{
    display:none; position:absolute; z-index:50;
    align-items:center; gap:6px;
    background:var(--hanko); color:#fff; border:none; border-radius:20px;
    padding:7px 13px 7px 10px; font-size:12.5px; font-weight:600;
    box-shadow:0 4px 14px rgba(140,42,33,0.35);
  }
  .float-speak svg{ width:13px; height:13px; }

  .block-separator{
    display:flex; align-items:center; gap:10px;
    margin:18px 0 6px; padding:0 16px;
    font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--ink-soft);
  }
  .block-separator:first-child{ margin-top:4px; }
  .block-separator::after{ content:''; flex:1; height:1px; background:var(--line); }
  .block-separator .count{ color:var(--jade-dark); font-weight:600; }

  .analyze-status{ display:flex; align-items:center; gap:10px; padding:14px 16px; font-size:13px; color:var(--ink-soft); }
  .dot-spin{ width:14px; height:14px; border-radius:50%; border:2px solid var(--line); border-top-color:var(--hanko); animation:spin .7s linear infinite; }
  @keyframes spin{ to{ transform:rotate(360deg); } }

  .col-headers{ display:grid; grid-template-columns:1fr 1fr 1fr auto; gap:14px; padding:0 16px 8px; }
  .col-headers span{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.07em; text-transform:uppercase; color:var(--ink-soft); }

  .toast{
    position:fixed; bottom:22px; right:22px; background:#000; color:#fff; border:1px solid var(--hanko);
    padding:11px 18px; border-radius:8px; font-size:13px; box-shadow:var(--shadow);
    display:none; align-items:center; gap:8px; z-index:100;
    max-width:min(420px, calc(100vw - 44px)); line-height:1.5;
  }
  .toast .stamp-dot{ width:8px;height:8px;border-radius:50%; background:var(--hanko); flex-shrink:0; }

  /* ---------- MÓDULO 4: LECTOR DE DOCUMENTOS ---------- */
  .doc-type-pills{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
  .doc-type-pills span{
    font-family:var(--font-mono); font-size:10px; letter-spacing:0.05em; text-transform:uppercase;
    background:var(--surface-2); border:1px solid var(--line); color:var(--ink-soft);
    padding:3px 8px; border-radius:99px;
  }
  .doc-file-chip{
    display:flex; align-items:center; gap:10px; margin-top:14px;
    border:1px solid var(--line); border-radius:8px; padding:12px 13px; background:var(--surface-2);
  }
  .doc-file-chip .icon{
    width:34px; height:34px; border-radius:7px; background:var(--jade); color:#fff;
    display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:10px; font-weight:700; flex-shrink:0; text-align:center;
  }
  .doc-file-chip .name{ font-size:12.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .doc-file-chip .sub{ font-size:11px; color:var(--ink-soft); }
  .doc-content{ padding:22px 24px; max-height:70vh; overflow:auto; }
  .doc-lo-frame{ width:100%; height:64vh; border:none; border-radius:8px; background:#fff; display:block; }
  .doc-content h1,.doc-content h2,.doc-content h3{ font-family:var(--font-display); }
  .doc-content table{ margin-bottom:16px; }
  .doc-content table td, .doc-content table th{ border:1px solid var(--line); padding:6px 9px; font-size:12.5px; }
  .doc-content img{ max-width:100%; border-radius:6px; margin:8px 0; }
  .sheet-tabs{ display:flex; gap:6px; flex-wrap:wrap; padding:14px 22px 0; border-bottom:1px solid var(--line); }
  .sheet-tab{
    background:var(--surface-2); border:1px solid var(--line); border-bottom:none;
    padding:7px 13px; border-radius:7px 7px 0 0; font-size:12.5px; font-weight:600; color:var(--ink-soft);
  }
  .sheet-tab.active{ background:var(--surface); color:var(--jade-dark); }
  .slide-card{ border:1px solid var(--line); border-radius:8px; padding:16px 18px; margin-bottom:14px; background:var(--surface-2); }
  .slide-card .slide-num{ font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:0.07em; color:var(--jade-dark); margin-bottom:8px; }
  .slide-card ul{ margin:6px 0 0; padding-left:18px; font-size:13.5px; line-height:1.7; }

  /* ---------- Visor de PDF dentro del Lector de documentos ---------- */
  .doc-txt-view{ padding:20px 24px; font-family:var(--font-mono); font-size:12.5px; line-height:1.7; white-space:pre-wrap; word-break:break-word; }

  /* ---------- MÓDULO 5: PDF → WORD ---------- */
  .p2w-page-status{ display:flex; align-items:center; gap:10px; padding:10px 0; font-size:13px; color:var(--ink-soft); }
  .p2w-preview{ margin-top:18px; }
  .p2w-preview h3{ font-family:var(--font-display); font-size:16px; margin:18px 0 8px; }
  .p2w-preview img{ max-width:100%; border-radius:6px; border:1px solid var(--line); margin-bottom:8px; }
  .p2w-preview p{ font-size:13px; line-height:1.6; }

  /* ---------- MÓDULO 6: CONTABILIDAD ---------- */
  .acc-tabs{ display:flex; gap:6px; margin-bottom:20px; border-bottom:1px solid var(--line); }
  .acc-tab{
    background:transparent; border:none; padding:11px 16px; font-size:13.5px; font-weight:600;
    color:var(--ink-soft); border-bottom:2px solid transparent; margin-bottom:-1px;
    cursor:pointer; pointer-events:auto; position:relative; z-index:2;
  }
  .acc-tab:hover{ color:var(--ink); }
  .acc-tab.active{ color:var(--hanko); border-bottom-color:var(--hanko); }
  .acc-subview{ display:none; }
  .acc-subview.active{ display:block; }

  .acc-invoice-layout{ display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start; }
  @media (max-width:900px){ .acc-invoice-layout{ grid-template-columns:1fr; } }
  .acc-invoice-preview img{ width:100%; border-radius:8px; border:1px solid var(--line); }
  .acc-field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px; }
  .acc-items-table{ width:100%; border-collapse:collapse; margin-top:6px; }
  .acc-items-table td{ font-size:12.5px; padding:6px 4px; border-bottom:1px solid var(--line); }

  .acc-quickforms{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; margin-top:22px; }
  @media (max-width:1100px){ .acc-quickforms{ grid-template-columns:1fr; } }
  .acc-quickforms h3{ font-family:var(--font-display); font-size:15px; margin:0 0 12px; }
  .acc-quickforms .panel-pad{ padding:18px 18px; }

  .stmt-tx-row{ display:flex; align-items:center; gap:12px; padding:11px 4px; border-bottom:1px solid var(--line); }
  .stmt-tx-row:last-child{ border-bottom:none; }
  .stmt-tx-row.is-dup{ opacity:0.55; }
  .stmt-tx-main{ flex:1; min-width:0; }
  .stmt-tx-desc{ font-size:13px; font-weight:600; }
  .stmt-tx-sub{ font-size:11.5px; color:var(--ink-soft); }
  .stmt-tx-amt{ font-family:var(--font-mono); font-weight:600; font-size:13.5px; white-space:nowrap; }
  .stmt-tx-amt.ingreso{ color:var(--jade-dark); }
  .stmt-tx-amt.egreso{ color:var(--hanko-dark); }
  .stmt-dup-badge{ display:inline-block; margin-left:6px; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--hanko-dark); background:var(--hanko-tint); padding:1px 7px; border-radius:99px; }

  .acc-list-item{ border-bottom:1px solid var(--line); }
  .acc-list-item:last-child{ border-bottom:none; }
  .acc-list-row{
    display:flex; align-items:center; gap:12px; padding:13px 16px; cursor:pointer;
  }
  .acc-list-row:hover{ background:var(--surface-2); }
  .acc-list-thumb{ width:40px; height:40px; border-radius:6px; object-fit:cover; border:1px solid var(--line); background:var(--surface-2); flex-shrink:0; }
  .acc-list-thumb.placeholder{ display:flex; align-items:center; justify-content:center; color:var(--ink-soft); font-size:16px; }
  .acc-list-main{ flex:1; min-width:0; }
  .acc-list-title{ font-weight:600; font-size:13.5px; }
  .acc-list-sub{ font-size:12px; color:var(--ink-soft); }
  .acc-list-amount{ font-family:var(--font-mono); font-weight:600; font-size:13.5px; }
  .acc-list-payer{ max-width:110px; font-size:11.5px; padding:5px 7px; margin-right:10px; flex-shrink:0; }
  .acc-list-amount.pos{ color:var(--jade-dark); }
  .acc-list-amount.neg{ color:var(--hanko-dark); }
  .acc-expand{ padding:0 16px 18px; display:none; background:var(--surface-2); border-top:1px dashed var(--line); }
  .acc-expand.open{ display:block; }
  .acc-expand .form-grid{ padding-top:16px; }

  .acc-summary-bar{ display:flex; gap:16px; margin-bottom:20px; flex-wrap:wrap; }
  .acc-summary-card{ flex:1; min-width:180px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:16px 18px; }
  .acc-summary-card .label{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.07em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:6px; }
  .acc-summary-card .value{ font-family:var(--font-display); font-size:24px; font-weight:600; }
  .acc-summary-card.jade .value{ color:var(--jade-dark); }
  .acc-summary-card.hanko .value{ color:var(--hanko-dark); }

  .acc-balance-bar{ height:14px; border-radius:99px; background:var(--surface-2); overflow:hidden; display:flex; margin:10px 0 6px; border:1px solid var(--line); }
  .acc-balance-bar .ingreso-fill{ background:var(--jade); height:100%; }
  .acc-balance-bar .gasto-fill{ background:var(--hanko); height:100%; }
  .acc-legend{ display:flex; gap:18px; font-size:12.5px; color:var(--ink-soft); }
  .acc-legend .dot{ width:9px; height:9px; border-radius:50%; display:inline-block; margin-right:6px; }
  .acc-legend .dot.jade{ background:var(--jade); }
  .acc-legend .dot.hanko{ background:var(--hanko); }

  .acc-balance-detail{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:20px; }
  @media (max-width:900px){ .acc-balance-detail{ grid-template-columns:1fr; } }
  .acc-mini-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 16px; border-bottom:1px solid var(--line); font-size:12.5px; }
  .acc-mini-row:last-child{ border-bottom:none; }
  .acc-mini-row .desc{ color:var(--ink); flex:1; min-width:0; }
  .acc-mini-row .amt{ font-family:var(--font-mono); font-weight:600; white-space:nowrap; }
  .acc-mini-del{
    background:transparent; border:none; color:var(--ink-soft); font-size:13px; line-height:1;
    padding:3px 5px; border-radius:5px; flex-shrink:0;
  }
  .acc-mini-del:hover{ background:var(--hanko-tint); color:var(--hanko-dark); }

  .acc-shared-items{ display:flex; flex-direction:column; gap:8px; margin-top:6px; }
  .acc-shared-item-row{
    display:flex; align-items:center; gap:12px; padding:9px 12px;
    border:1px solid var(--line); border-radius:8px; background:var(--surface); flex-wrap:wrap;
  }
  .acc-shared-item-desc{ flex:1; min-width:130px; }
  .acc-shared-item-desc .name{ font-size:12.5px; font-weight:600; }
  .acc-shared-item-desc .amt{ font-size:11px; color:var(--ink-soft); font-family:var(--font-mono); }
  .acc-shared-check{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-soft); white-space:nowrap; }
  .acc-shared-check input[type="checkbox"]{ width:auto; }
  .acc-shared-item-row select{ max-width:150px; }

  .month-switcher{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
  .month-switcher button{ background:var(--surface); border:1px solid var(--line); border-radius:6px; width:30px; height:30px; }
  .month-switcher .current-month{ font-family:var(--font-mono); font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.05em; min-width:140px; text-align:center; }

  /* ---------- MÓDULO CONFIGURACIÓN — Correo POP3/SMTP ---------- */
  .mail-cfg-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .mail-cfg-grid label{ margin-top:10px; }
  .mail-cfg-grid label:first-of-type{ margin-top:0; }
  .mail-cfg-row2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  @media (max-width:640px){ .mail-cfg-grid{ grid-template-columns:1fr; } }

  /* ---------- MÓDULO TELEFONÍA — estilos amigables ---------- */
  .tel-role-chip{
    display:inline-flex; align-items:center; gap:8px; margin:12px 0 0; padding:6px 12px 6px 10px;
    background:var(--surface-2); border:1px solid var(--line); border-radius:99px;
    font-size:12px; color:var(--ink-soft);
  }
  .tel-role-chip .dot{ width:8px; height:8px; border-radius:50%; background:var(--jade); flex-shrink:0; }
  .tel-role-chip.locked .dot{ background:var(--hanko); }
  .tel-role-chip b{ color:var(--ink); font-weight:600; }

  .tel-tab-ico{ margin-right:6px; }

  .tel-perm-legend{ display:flex; flex-wrap:wrap; gap:6px; margin:0 0 14px; }
  .tel-perm-pill{
    font-size:11px; padding:4px 9px; border-radius:99px; background:var(--surface-2);
    border:1px solid var(--line); color:var(--ink-soft); cursor:help;
  }
  .tel-perm-pill b{ color:var(--jade-dark); font-weight:600; }

  .tel-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
  .tel-toolbar-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
  .tel-search-wrap{ position:relative; flex-shrink:0; min-width:220px; }
  .tel-search-wrap .tel-search-ico{ position:absolute; left:11px; top:50%; transform:translateY(-50%); font-size:12.5px; opacity:0.6; pointer-events:none; }
  .tel-search-wrap input{ padding-left:32px; margin:0; }

  .tel-stats{ display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; }
  .tel-stat-chip{
    display:flex; align-items:center; gap:7px; padding:7px 12px; border-radius:10px;
    background:var(--surface-2); border:1px solid var(--line); font-size:12px; color:var(--ink-soft);
  }
  .tel-stat-chip .n{ font-family:var(--font-display); font-size:15px; font-weight:700; color:var(--ink); }
  .tel-stat-chip.jade .n{ color:var(--jade-dark); }
  .tel-stat-chip.hanko .n{ color:var(--hanko-dark); }

  .tel-status-row{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:12px; }
  .tel-save-status{ font-size:12px; color:var(--ink-soft); transition:color .2s; }
  .tel-save-status.pending{ color:var(--jade-dark); }
  .tel-save-status.saved{ color:var(--jade-dark); font-weight:600; }
  .tel-save-status.error{ color:var(--hanko-dark); font-weight:600; }

  .tel-table-panel{ overflow:auto; max-height:70vh; }
  .tel-table thead th{ position:sticky; top:0; background:var(--surface); z-index:1; box-shadow:0 1px 0 var(--line); }
  .tel-table tbody tr:hover{ background:var(--surface-2); }
  .tel-table input[type="text"]{ transition:background .15s; }
  .tel-table input[type="text"]:disabled, .tel-table input[type="checkbox"]:disabled{
    opacity:0.45; cursor:not-allowed; background:transparent;
  }
  .tel-table input[type="checkbox"]{ width:17px; height:17px; accent-color:var(--jade); cursor:pointer; }
  .tel-table input[type="checkbox"]:disabled{ cursor:not-allowed; }

  .tel-badge{ display:inline-block; padding:3px 10px; border-radius:99px; font-size:11px; font-weight:600; white-space:nowrap; }
  .tel-badge-ejecutado{ background:var(--jade-tint); color:var(--jade-dark); }
  .tel-badge-pendiente{ background:var(--hanko-tint); color:var(--hanko-dark); }
  .tel-badge-otro{ background:rgba(184,168,151,0.14); color:var(--ink-soft); }

  @media (max-width:720px){
    .tel-toolbar{ flex-direction:column; align-items:stretch; }
    .tel-search-wrap{ min-width:0; }
  }

  /* ---------- MÓDULO TELEFONÍA — Tickets (tareas / correos / OST) ---------- */
  .tick-badge{ display:inline-block; padding:3px 10px; border-radius:99px; font-size:11px; font-weight:600; white-space:nowrap; }
  .tick-badge-alta{ background:var(--hanko-tint); color:var(--hanko-dark); }
  .tick-badge-media{ background:rgba(180,146,63,0.16); color:#7A5E15; }
  .tick-badge-baja{ background:rgba(184,168,151,0.16); color:var(--ink-soft); }
  .tick-badge-abierto, .tick-badge-pendiente{ background:var(--hanko-tint); color:var(--hanko-dark); }
  .tick-badge-en_progreso{ background:rgba(180,146,63,0.16); color:#7A5E15; }
  .tick-badge-cerrado, .tick-badge-hecha, .tick-badge-completado{ background:var(--jade-tint); color:var(--jade-dark); }
  .tick-badge-ticket{ background:var(--jade-tint); color:var(--jade-dark); }
  .tick-badge-tarea{ background:rgba(180,146,63,0.16); color:#7A5E15; }
  .tick-badge-ost{ background:rgba(107,120,214,0.16); color:#4048A0; }
  .tick-flujo-wrap{
    display:flex; flex-wrap:wrap; gap:6px 10px; max-width:420px; padding:4px 0;
  }
  .tick-dep-check{
    display:inline-flex; align-items:center; gap:5px;
    font-size:11px; color:var(--ink); cursor:pointer;
    background:var(--surface-2); border:1px solid var(--line);
    border-radius:99px; padding:3px 9px 3px 6px; user-select:none;
  }
  .tick-dep-check input{ accent-color:var(--jade); width:14px; height:14px; margin:0; cursor:pointer; }
  .tick-dep-check:has(input:checked){
    background:var(--jade-tint); border-color:rgba(47,158,122,0.45); color:var(--jade-dark); font-weight:600;
  }
  .tk-looking-up{
    outline:1px solid var(--gold);
    background:rgba(255,178,56,0.08);
  }

  .tick-estado-select{ font-size:11.5px; padding:4px 8px; border-radius:6px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink); }

  .tick-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px 14px; margin-top:12px; }
  .tick-form-grid .full{ grid-column:1 / -1; }
  .tick-form-grid label{ display:block; font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:5px; }
  .tick-form-grid textarea{ width:100%; min-height:70px; resize:vertical; }

  .correo-row{
    border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:10px; background:var(--surface);
  }
  .correo-row-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:wrap; }
  .correo-remitente{ font-weight:600; font-size:13.5px; }
  .correo-asunto{ font-size:12.5px; color:var(--ink-soft); margin-top:2px; }
  .correo-fecha{ font-family:var(--font-mono); font-size:11px; color:var(--ink-soft); white-space:nowrap; }
  .correo-cuerpo-preview{
    font-size:12.5px; color:var(--ink-soft); margin-top:8px; line-height:1.5;
    max-height:60px; overflow:hidden; white-space:pre-wrap;
  }
  .correo-actions{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }

  .tick-hist-btn{
    display:inline-flex; align-items:center; gap:4px;
    font-size:11px; padding:4px 8px; border-radius:6px;
    border:1px solid var(--line); background:var(--surface-2); color:var(--ink-soft); cursor:pointer;
  }
  .tick-hist-btn.has-hist{ color:var(--jade-dark); border-color:rgba(232,114,15,0.35); background:var(--jade-tint); font-weight:600; }
  .tick-hist-btn:hover{ border-color:var(--jade); color:var(--ink); }
  .tick-historial-panel{
    margin-top:14px; border:1px solid var(--line); border-radius:var(--radius);
    background:var(--surface); box-shadow:var(--shadow); display:none;
  }
  .tick-historial-panel.open{ display:block; }
  .tick-historial-panel .thp-head{
    display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
    padding:14px 16px; border-bottom:1px solid var(--line);
  }
  .tick-historial-panel .thp-body{ padding:14px 16px; max-height:420px; overflow:auto; }
  .tick-hist-entry{
    border:1px solid var(--line); border-radius:8px; padding:12px 14px; margin-bottom:10px;
    background:var(--surface-2);
  }
  .tick-hist-entry .the-meta{
    font-family:var(--font-mono); font-size:11px; color:var(--ink-soft); margin-bottom:6px;
    display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  }
  .tick-hist-entry .the-asunto{ font-weight:600; font-size:13px; margin-bottom:4px; }
  .tick-hist-entry .the-resumen{ font-size:12.5px; color:var(--ink); line-height:1.55; white-space:pre-wrap; }
  .tick-hist-entry .the-cuerpo{
    margin-top:8px; font-size:11.5px; color:var(--ink-soft); line-height:1.5;
    max-height:80px; overflow:auto; white-space:pre-wrap; border-top:1px dashed var(--line); padding-top:8px;
  }

  .ai-analysis-card{
    margin-top:12px; padding:14px; border-radius:9px; background:var(--jade-tint); border:1px solid rgba(47,110,92,0.25);
  }
  .ai-analysis-card .aa-head{ display:flex; align-items:center; gap:8px; margin-bottom:8px; flex-wrap:wrap; }
  .ai-analysis-card .aa-title{ font-weight:600; font-size:13.5px; }
  .ai-analysis-card .aa-desc{ font-size:12.5px; color:var(--ink-soft); line-height:1.5; margin-bottom:10px; }
  .ai-analysis-card .aa-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; }
  .ai-analysis-card select{ font-size:12.5px; padding:6px 9px; }

  .tick-loading{ font-size:12.5px; color:var(--ink-soft); display:flex; align-items:center; gap:8px; }
  .tick-err{ font-size:12.5px; color:var(--hanko-dark); background:var(--hanko-tint); border-radius:8px; padding:9px 12px; margin-top:10px; }

  /* ---------- MÓDULO 8: TELEGRAM ---------- */
  .tg-chat-row{ display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--line); cursor:pointer; }
  .tg-chat-row:last-child{ border-bottom:none; }
  .tg-chat-row:hover{ background:var(--surface-2); }
  .tg-chat-row.active{ background:var(--jade-tint); }
  .tg-chat-avatar{ width:36px; height:36px; border-radius:50%; background:var(--jade); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:600; font-size:14px; flex-shrink:0; }
  .tg-chat-main{ flex:1; min-width:0; }
  .tg-chat-name{ font-weight:600; font-size:13px; }
  .tg-chat-snippet{ font-size:11.5px; color:var(--ink-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:180px; }
  .tg-chat-meta{ display:flex; flex-direction:column; align-items:flex-end; gap:4px; flex-shrink:0; }
  .tg-chat-time{ font-size:10px; color:var(--ink-soft); font-family:var(--font-mono); }
  .tg-chat-badge{ background:var(--hanko); color:#fff; font-size:10px; font-weight:700; border-radius:99px; padding:1px 6px; }

  .tg-msg-list{ padding:16px 20px; display:flex; flex-direction:column; gap:10px; }
  .tg-msg{ max-width:82%; background:var(--surface-2); border:1px solid var(--line); border-radius:10px; padding:9px 12px; font-size:13px; line-height:1.5; align-self:flex-start; }
  .tg-msg.out{ background:var(--jade-tint); align-self:flex-end; border-color:#FFA24D; }
  .tg-msg .tg-msg-meta{ font-family:var(--font-mono); font-size:10px; color:var(--ink-soft); margin-top:4px; }

  .cfg-api-status{ font-size:12.5px; font-weight:600; display:inline-flex; align-items:center; gap:6px; }
  .cfg-api-status.ok{ color:var(--jade-dark); }
  .cfg-api-status.off{ color:var(--ink-soft); }

  .tg-photo-thumb{ display:block; max-width:220px; max-height:220px; border-radius:8px; margin-bottom:8px; cursor:zoom-in; border:1px solid var(--line); }
  .tg-photo-actions{ margin-top:6px; }
  .tg-send-select, .tg-file-send-select{ font-size:11.5px; padding:5px 8px; border-radius:6px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink); }
  .tg-lightbox-overlay{ position:fixed; inset:0; background:rgba(20,18,14,0.82); display:flex; align-items:center; justify-content:center; z-index:999; cursor:zoom-out; padding:24px; }
  .tg-lightbox-overlay img{ max-width:92vw; max-height:88vh; border-radius:6px; box-shadow:0 10px 40px rgba(0,0,0,0.4); }
  .tg-lightbox-close{ position:absolute; top:18px; right:22px; color:#fff; font-size:28px; line-height:1; cursor:pointer; opacity:0.85; }
  .tg-lightbox-close:hover{ opacity:1; }
  .tg-file-chip{
    display:flex; align-items:center; gap:10px; margin-bottom:8px;
    border:1px solid var(--line); border-radius:8px; padding:10px 12px; background:var(--surface);
    text-decoration:none; color:inherit; max-width:260px; text-align:left;
    font-family:inherit; cursor:pointer;
  }
  .tg-file-chip:hover{ border-color:var(--jade); }
  .tg-file-chip:disabled{ opacity:0.6; cursor:wait; }
  .tg-file-chip .icon{
    width:32px; height:32px; border-radius:7px; background:var(--jade); color:#fff;
    display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:9.5px; font-weight:700; flex-shrink:0; text-align:center;
  }
  .tg-file-chip .name{ font-size:12.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .tg-file-chip .sub{ font-size:10.5px; color:var(--ink-soft); }

  .tg-photo-download-btn{
    display:inline-flex; align-items:center; gap:5px; margin-top:6px;
    background:var(--surface); border:1px solid var(--line); border-radius:7px;
    padding:5px 10px; font-size:11px; color:var(--ink-soft); cursor:pointer;
  }
  .tg-photo-download-btn:hover{ border-color:var(--jade); color:var(--jade); }

  .tg-file-unavailable{
    font-size:11.5px; color:var(--ink-soft); font-style:italic; margin-bottom:8px;
  }

  @media (max-width:820px){
    .app{ flex-direction:column; }
    .sidebar{ width:100%; height:auto; position:relative; flex-direction:row; align-items:center; padding:14px 16px; }
    .brand{ border:none; margin:0; padding:0; }
    .nav{ flex-direction:row; margin-left:auto; }
    .nav-footer{ display:none; }
    main{ padding:24px 18px 48px; }
    .form-grid{ grid-template-columns:1fr; }
    .phrase-row, .col-headers{ grid-template-columns:1fr; }
    .col-headers{ display:none; }
    .speak-btn{ margin-top:6px; }
  }
  /* ====================================================================
     DASHBOARD (pantalla inicial) — tema oscuro, autocontenido bajo .dash-scope
     para no afectar el resto de la app.
  ==================================================================== */
  .dash-scope{
    --dsk-bg1:#120E0A; --dsk-bg2:#1D150E; --dsk-card:#221913; --dsk-card-hover:#2C2117;
    --dsk-line:#3B2C1F; --dsk-text:#F3E9DD; --dsk-text-soft:#B8A897;
    --dsk-violet:#FF8A2E; --dsk-violet2:#FFB238; --dsk-jade:#FF8A2E; --dsk-hanko:#FF4A1C;
    background:linear-gradient(160deg, var(--dsk-bg1), var(--dsk-bg2));
    margin:-36px -44px -60px; padding:36px 44px 60px; border-radius:0;
    min-height:100%;
  }
  .dash-scope .btn-hanko{ background:linear-gradient(135deg, var(--dsk-violet), var(--dsk-hanko)); border:none; }
  .dash-header{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:26px; flex-wrap:wrap; }
  .dash-eyebrow{ font-family:var(--font-mono); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--dsk-violet2); margin:0 0 6px; }
  .dash-title{
    font-family:var(--font-display); font-size:32px; font-weight:600; margin:0 0 6px;
    background:linear-gradient(90deg, var(--dsk-violet2), var(--dsk-hanko));
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .dash-subtitle{ margin:0; color:var(--dsk-text-soft); font-size:13.5px; }
  .dash-streak{
    display:flex; align-items:center; gap:10px; background:var(--dsk-card); border:1px solid var(--dsk-line);
    border-radius:12px; padding:10px 16px;
  }
  .dash-streak-flame{ font-size:22px; }
  .dash-streak-num{ font-family:var(--font-mono); font-size:18px; font-weight:700; color:var(--dsk-text); line-height:1.1; }
  .dash-streak-label{ font-size:10.5px; color:var(--dsk-text-soft); }

  .dash-grid{ display:grid; gap:18px; margin-bottom:18px; }
  .dash-grid-3{ grid-template-columns:repeat(3, 1fr); }
  .dash-grid-2{ grid-template-columns:1fr 1fr; }
  @media (max-width:1000px){ .dash-grid-3, .dash-grid-2{ grid-template-columns:1fr; } }

  .dash-card{
    background:var(--dsk-card); border:1px solid var(--dsk-line); border-radius:16px; padding:18px 20px;
    display:flex; flex-direction:column; min-width:0;
  }
  .dash-card-lg{ min-height:280px; }
  .dash-card-head{ display:flex; align-items:center; gap:9px; margin-bottom:14px; }
  .dash-card-icon{ font-size:15px; }
  .dash-card-title{
    font-family:var(--font-mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase;
    color:var(--dsk-text-soft); font-weight:600;
  }
  .dash-card-link{
    margin-top:auto; padding-top:12px; font-size:12px; color:var(--dsk-violet2); text-decoration:none; font-weight:600;
  }
  .dash-card-link:hover{ color:var(--dsk-hanko); }

  .dash-fin-balance{ font-family:var(--font-mono); font-size:28px; font-weight:700; color:var(--dsk-text); }
  .dash-fin-sub{ font-size:11.5px; color:var(--dsk-text-soft); margin-bottom:14px; }

  .dash-bars{ display:flex; align-items:flex-end; gap:6px; height:54px; margin-bottom:6px; }
  .dash-bar{ flex:1; border-radius:4px 4px 0 0; background:linear-gradient(180deg, var(--dsk-violet2), var(--dsk-violet)); min-height:3px; }
  .dash-bar.neg{ background:linear-gradient(180deg, var(--dsk-hanko), #5C1D0C); }

  .dash-list{ display:flex; flex-direction:column; gap:9px; margin-bottom:6px; }
  .dash-list-row{ display:flex; justify-content:space-between; gap:10px; font-size:12.5px; }
  .dash-list-row .main{ color:var(--dsk-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .dash-list-row .sub{ color:var(--dsk-text-soft); font-family:var(--font-mono); font-size:11px; white-space:nowrap; flex-shrink:0; }
  .dash-empty{ color:var(--dsk-text-soft); font-size:12px; padding:6px 0; }

  .dash-jp-input-row{ display:flex; gap:8px; margin-bottom:12px; }
  .dash-jp-input-row input{
    flex:1; background:var(--dsk-bg1); border:1px solid var(--dsk-line); color:var(--dsk-text);
    border-radius:8px; padding:9px 12px; font-size:13px;
  }
  .dash-jp-input-row input::placeholder{ color:#7A6A56; }
  .dash-jp-result{ flex:1; font-size:13px; color:var(--dsk-text); min-height:60px; }
  .dash-jp-result .jp-direction{
    display:inline-block; font-family:var(--font-mono); font-size:10px; letter-spacing:0.06em; text-transform:uppercase;
    color:var(--dsk-violet2); background:rgba(255,138,46,0.14); padding:2px 8px; border-radius:99px; margin-bottom:8px;
  }
  .dash-jp-result .jp-word-row{ display:flex; align-items:center; gap:10px; margin-bottom:6px; }
  .dash-jp-result .jp-word{ font-family:var(--font-display); font-size:20px; margin-bottom:0; }
  .dash-jp-listen-btn{
    width:28px; height:28px; border-radius:50%; border:1px solid var(--dsk-line); background:var(--dsk-bg1);
    color:var(--dsk-violet2); display:flex; align-items:center; justify-content:center; flex-shrink:0; cursor:pointer;
  }
  .dash-jp-listen-btn:hover{ border-color:var(--dsk-violet2); }
  .dash-jp-listen-btn svg{ width:13px; height:13px; }
  .dash-jp-result .jp-word{ font-family:var(--font-display); font-size:20px; margin-bottom:6px; }
  .dash-jp-result .jp-row{ display:flex; gap:8px; padding:4px 0; border-bottom:1px solid var(--dsk-line); font-size:12.5px; }
  .dash-jp-result .jp-row .k{ color:var(--dsk-text-soft); width:70px; flex-shrink:0; }
  .dash-jp-result .jp-err{ color:var(--dsk-hanko); font-size:12.5px; }
  .dash-jp-result .jp-loading{ color:var(--dsk-text-soft); font-size:12.5px; }

  .dash-assistant{ display:flex; flex-direction:column; }
  .dash-chat-messages{
    flex:1; overflow:auto; display:flex; flex-direction:column; gap:8px; margin-bottom:12px; max-height:190px; padding-right:4px;
  }
  .dash-chat-msg{ font-size:12.5px; padding:8px 11px; border-radius:10px; max-width:88%; line-height:1.45; }
  .dash-chat-msg.bot{ background:var(--dsk-bg1); color:var(--dsk-text); align-self:flex-start; border:1px solid var(--dsk-line); }
  .dash-chat-msg.user{ background:linear-gradient(135deg, var(--dsk-violet), var(--dsk-hanko)); color:#fff; align-self:flex-end; }

  .dash-quick-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; }
  @media (max-width:800px){ .dash-quick-grid{ grid-template-columns:repeat(2, 1fr); } }
  .dash-quick-btn{
    display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center;
    background:var(--dsk-bg1); border:1px solid var(--dsk-line); border-radius:12px; padding:14px 8px;
    color:var(--dsk-text); font-size:11.5px; cursor:pointer; transition:border-color .15s, background .15s;
  }
  .dash-quick-btn:hover{ border-color:var(--dsk-violet); background:var(--dsk-card-hover); }
  .dash-quick-btn .ic{ font-size:19px; }

  /* ---------- LOGIN (Supabase Auth) ---------- */
  .login-overlay{
    position:fixed; inset:0; z-index:10000;
    display:flex; align-items:center; justify-content:center;
    background:linear-gradient(160deg, #120E0A, #1D150E 50%, #2C1A12);
    padding:24px;
  }
  .login-overlay[hidden]{ display:none !important; }
  .login-card{
    width:100%; max-width:400px;
    background:var(--surface); border:1px solid var(--line);
    border-radius:16px; padding:28px 26px 24px; box-shadow:var(--shadow);
  }
  .login-brand{ display:flex; align-items:center; gap:12px; margin-bottom:22px; }
  .login-brand .name{ font-family:var(--font-display); font-size:22px; font-weight:600; color:var(--ink); }
  .login-brand .tag{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); }
  .login-card h2{ font-family:var(--font-display); font-size:20px; margin:0 0 6px; font-weight:600; }
  .login-card .login-sub{ font-size:13px; color:var(--ink-soft); margin:0 0 18px; line-height:1.5; }
  .login-card label{ margin-top:10px; }
  .login-card .btn{ width:100%; justify-content:center; margin-top:16px; }
  .login-error{
    display:none; margin-top:12px; padding:10px 12px; border-radius:8px;
    background:var(--hanko-tint); color:var(--hanko-dark); font-size:12.5px; line-height:1.45;
  }
  .login-error.show{ display:block; }
  .login-hint{ margin-top:14px; font-size:11.5px; color:var(--ink-soft); line-height:1.5; }
  .app-auth-locked .app{ display:none !important; }
  .sidebar-user{
    margin-top:10px; padding-top:10px; border-top:1px solid rgba(255,255,255,0.08);
    font-size:11.5px; color:#8A8375; line-height:1.4;
  }
  .sidebar-user .email{ color:#D8D2C8; font-weight:600; word-break:break-all; }
  .sidebar-user .btn{ margin-top:8px; width:100%; justify-content:center; }

  /* ========== INVENTARIO (integrado desde Yomu) — tema oscuro GusBot ========== */
  .inv-scope{
    --inv-bg: var(--bg);
    --inv-surface: var(--surface);
    --inv-surface-2: var(--surface-2);
    --inv-ink: var(--ink);
    --inv-ink-soft: var(--ink-soft);
    --inv-line: var(--line);
    --inv-jade: var(--jade);
    --inv-jade-dark: var(--jade-dark);
    --inv-jade-tint: var(--jade-tint);
    --inv-hanko: var(--hanko);
    --inv-hanko-dark: var(--hanko-dark);
    --inv-hanko-tint: var(--hanko-tint);
    --inv-gold: var(--gold);
  }
  .inv-scope .view-header{ margin-bottom:22px; }
  .inv-scope .eyebrow{ font-family:var(--font-mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 6px; }
  .inv-scope h1{ font-family:var(--font-display); font-size:28px; font-weight:600; margin:0 0 6px; color:var(--ink); }
  .inv-scope h2{ font-family:var(--font-display); font-size:20px; font-weight:600; margin:0 0 4px; color:var(--ink); }
  .inv-scope h3{ font-family:var(--font-display); font-size:16px; font-weight:600; margin:0 0 10px; color:var(--ink); }
  .inv-scope .subtitle{ color:var(--ink-soft); font-size:14px; max-width:70ch; line-height:1.5; margin:0; }

  .inv-scope .breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:18px; font-size:12.5px; }
  .inv-scope .breadcrumb button{
    background:transparent; border:none; color:var(--jade-dark); font-weight:600; padding:3px 2px; border-radius:5px; cursor:pointer;
  }
  .inv-scope .breadcrumb button:hover{ text-decoration:underline; color:var(--jade); }
  .inv-scope .breadcrumb .sep{ color:var(--ink-soft); }
  .inv-scope .breadcrumb .current{ color:var(--ink-soft); }

  .inv-scope .panel{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }
  .inv-scope .panel + .panel{ margin-top:18px; }
  .inv-scope .panel-pad{ padding:20px 22px; }
  .inv-scope .panel-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:16px 22px; border-bottom:1px solid var(--line); }
  .inv-scope .panel-head h3{ margin:0; }

  .inv-scope .form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px 14px; }
  .inv-scope .form-grid.cols-3{ grid-template-columns:1fr 1fr 1fr; }
  .inv-scope .form-grid.cols-4{ grid-template-columns:1fr 1fr 1fr 1fr; }
  .inv-scope .form-grid .full{ grid-column:1 / -1; }
  .inv-scope label{ display:block; font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:5px; }
  .inv-scope input[type=text], .inv-scope input[type=number], .inv-scope input[type=file], .inv-scope textarea, .inv-scope select{
    width:100%; border:1px solid var(--line); border-radius:7px; padding:8px 10px;
    font-size:13.5px; color:var(--ink); background:var(--surface-2);
    transition:border-color .15s ease, background .15s ease;
  }
  .inv-scope input:focus, .inv-scope textarea:focus, .inv-scope select:focus{ outline:2px solid var(--jade); outline-offset:1px; border-color:var(--jade); background:var(--surface-2); }
  .inv-scope textarea{ resize:vertical; min-height:50px; }

  .inv-scope .btn{
    display:inline-flex; align-items:center; gap:7px;
    border:none; border-radius:8px; padding:9px 16px;
    font-size:13px; font-weight:600; cursor:pointer;
    transition:transform .1s ease, box-shadow .15s ease, background .15s ease;
  }
  .inv-scope .btn:active{ transform:translateY(1px); }
  .inv-scope .btn-jade{ background:var(--jade); color:#fff; }
  .inv-scope .btn-jade:hover{ background:var(--jade-dark); }
  .inv-scope .btn-hanko{ background:var(--hanko); color:#fff; }
  .inv-scope .btn-hanko:hover{ background:var(--hanko-dark); }
  .inv-scope .btn-ghost{ background:transparent; color:var(--ink-soft); border:1px solid var(--line); }
  .inv-scope .btn-ghost:hover{ background:var(--surface-2); color:var(--ink); }
  .inv-scope .btn:disabled{ opacity:0.5; cursor:not-allowed; transform:none; }
  .inv-scope .btn-sm{ padding:6px 11px; font-size:12px; border-radius:6px; }

  .inv-scope table{ width:100%; border-collapse:collapse; }
  .inv-scope thead th{
    text-align:left; font-family:var(--font-mono); font-size:10px; letter-spacing:0.06em; text-transform:uppercase;
    color:var(--ink-soft); padding:0 12px 9px; border-bottom:1px solid var(--line); font-weight:500;
  }
  .inv-scope tbody td{ padding:11px 12px; border-bottom:1px solid var(--line); font-size:13px; vertical-align:middle; color:var(--ink); }
  .inv-scope tbody tr:last-child td{ border-bottom:none; }
  .inv-scope tbody tr.clickable{ cursor:pointer; }
  .inv-scope tbody tr.clickable:hover{ background:var(--surface-2); }

  .inv-scope .badge{ display:inline-block; padding:3px 9px; border-radius:99px; font-size:10.5px; font-weight:700; letter-spacing:0.02em; }
  .inv-scope .badge-jade{ background:var(--jade-tint); color:var(--jade-dark); }
  .inv-scope .badge-hanko{ background:var(--hanko-tint); color:var(--hanko-dark); }
  .inv-scope .badge-gold{ background:rgba(255,178,56,0.16); color:var(--gold); }
  .inv-scope .badge-muted{ background:var(--surface-2); color:var(--ink-soft); border:1px solid var(--line); }

  .inv-scope .empty-state{ text-align:center; padding:40px 20px; color:var(--ink-soft); }
  .inv-scope .empty-state .stamp{ width:42px;height:42px;border-radius:50%;border:2px dashed var(--line); margin:0 auto 12px; display:flex; align-items:center; justify-content:center; color:var(--line); font-size:19px;}
  .inv-scope .empty-state p{ margin:0; font-size:13px; }

  .inv-scope .grid-cards{ display:grid; grid-template-columns:repeat(auto-fill, minmax(190px,1fr)); gap:12px; }
  .inv-scope .equipo-card{
    border:1px solid var(--line); border-radius:9px; padding:14px; background:var(--surface-2);
    cursor:pointer; transition:border-color .15s ease, box-shadow .15s ease;
  }
  .inv-scope .equipo-card:hover{ border-color:var(--jade); box-shadow:0 2px 8px rgba(0,0,0,0.25); }
  .inv-scope .equipo-card .eq-tipo{ font-family:var(--font-mono); font-size:10px; letter-spacing:0.06em; text-transform:uppercase; }
  .inv-scope .equipo-card .eq-num{ font-family:var(--font-display); font-size:20px; font-weight:600; margin:4px 0 2px; color:var(--ink); }
  .inv-scope .equipo-card .eq-sub{ font-size:11.5px; color:var(--ink-soft); }

  /* ---- Formato "plano" (estilo AREA_METROPOLITANA) ---- */
  .inv-scope .plano-box{
    background:#0B0908; border:1px solid var(--line); border-radius:10px; padding:16px;
    font-family:var(--font-mono); color:#EADFCE;
  }
  .inv-scope .plano-central-name{ font-size:15px; font-weight:700; letter-spacing:0.02em; color:var(--jade-dark); }
  .inv-scope .plano-abs{ font-size:12.5px; color:var(--ink-soft); margin-top:2px; }
  .inv-scope .plano-shelters{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
  .inv-scope .plano-chip{
    border:1px solid var(--line); border-radius:6px; padding:8px 10px; min-width:104px;
    background:var(--surface-2); text-align:center; font-size:11px; line-height:1.5;
  }
  .inv-scope .plano-chip .pc-vendor{ font-weight:700; color:var(--ink); font-size:11.5px; }
  .inv-scope .plano-chip .pc-shelter{ color:var(--jade-dark); }
  .inv-scope .plano-chip .pc-ports{ color:var(--ink-soft); }
  .inv-scope .plano-empty{ font-size:12px; color:var(--ink-soft); }
  .inv-scope .ia-import-preview{ display:flex; flex-direction:column; gap:10px; }
  .inv-scope .ia-shelter-row{ display:grid; grid-template-columns:1.4fr 1fr 1fr 0.6fr; gap:8px; align-items:center; }
  .inv-scope .ia-shelter-row input{ width:100%; }

  .inv-scope .rack-toolbar{ display:flex; align-items:center; gap:10px; margin-bottom:6px; font-size:11px; color:var(--ink-soft); flex-wrap:wrap; }
  .inv-scope .rack-toolbar .rt-label{ font-family:var(--font-mono); font-size:11px; font-weight:700; color:var(--ink); text-transform:uppercase; letter-spacing:0.04em; }
  .inv-scope .rack-toolbar input[type=number]{ width:56px; padding:3px 5px; font-size:11px; }
  .inv-scope .rack-toolbar input[type=text]{ width:76px; padding:3px 5px; font-size:11px; }
  .inv-scope .rack-toolbar label{ display:flex; align-items:center; gap:4px; font-size:11px; font-weight:400; margin:0; color:var(--ink-soft); }
  .inv-scope .rack-toolbar label input{ width:auto; margin:0; }
  .inv-scope .rack-block{ margin-bottom:16px; overflow-x:auto; }
  .inv-scope .rack-row{ display:flex; align-items:stretch; border:2px solid var(--line); background:var(--surface-2); width:max-content; min-width:100%; }
  .inv-scope .rack-row.activo{ background:rgba(255,178,56,0.12); border-color:var(--gold); }
  .inv-scope .rack-cell{
    flex:1 0 40px; min-width:40px; border-right:1px dotted var(--line);
    display:flex; align-items:center; justify-content:center; text-align:center;
    font-family:var(--font-mono); font-size:9.5px; line-height:1.2; padding:9px 2px; cursor:pointer; color:var(--ink);
  }
  .inv-scope .rack-cell:last-child{ border-right:none; }
  .inv-scope .rack-cell.empty{ color:var(--ink-soft); }
  .inv-scope .rack-cell.empty:hover{ background:var(--jade-tint); }
  .inv-scope .rack-cell.filled{ font-weight:700; color:var(--jade-dark); background:rgba(232,114,15,0.12); }
  .inv-scope .rack-cell.filled:hover{ background:rgba(232,114,15,0.22); }
  .inv-scope .rack-cell.edge{
    background:var(--surface); color:var(--ink-soft); flex:0 0 22px; min-width:22px;
    writing-mode:vertical-rl; text-orientation:mixed; cursor:default; font-size:9px; letter-spacing:0.03em;
  }
  .inv-scope .rack-count{ font-family:var(--font-mono); font-size:12px; font-weight:700; color:var(--ink-soft); padding-left:10px; display:flex; align-items:center; }
  .inv-scope .rack-legend{ margin-top:16px; }
  .inv-scope .rack-legend table{ width:auto; }
  .inv-scope .rack-legend td{ padding:3px 18px 3px 0; border:none; font-size:12.5px; font-family:var(--font-mono); color:var(--ink); }
  .inv-scope .rack-legend td.rl-count{ font-weight:700; color:var(--jade-dark); }

  .inv-scope .port-row input[type=text]{ padding:6px 8px; font-size:12.5px; }
  .inv-scope .port-num{ font-family:var(--font-mono); font-weight:700; color:var(--ink-soft); }

  .inv-scope .search-row{ display:flex; gap:8px; }
  .inv-scope .search-row input{ flex:1; }

  .inv-scope .const-wrap{
    position:relative; overflow-x:auto; overflow-y:auto; border-radius:var(--radius);
    background:
      radial-gradient(1px 1px at 12% 22%, rgba(255,255,255,0.25) 0, transparent 60%),
      radial-gradient(1px 1px at 28% 68%, rgba(255,255,255,0.18) 0, transparent 60%),
      radial-gradient(1.5px 1.5px at 44% 14%, rgba(255,255,255,0.22) 0, transparent 60%),
      radial-gradient(1px 1px at 61% 78%, rgba(255,255,255,0.15) 0, transparent 60%),
      radial-gradient(1.5px 1.5px at 77% 34%, rgba(255,255,255,0.22) 0, transparent 60%),
      linear-gradient(160deg, #131328, #1c1f3d 55%, #171a34);
  }
  .inv-scope .const-wrap svg{ display:block; margin:0 auto; }
  .inv-scope .const-wrap-open{
    min-height:480px; max-height:78vh; border:1px solid rgba(168,155,255,0.18);
    box-shadow:inset 0 0 40px rgba(0,0,0,0.35);
  }
  .inv-scope .const-wrap-open .const-label{ font-size:12px; }
  .inv-scope .const-wrap-open .const-code{ font-size:10px; }
  .inv-scope .const-wrap-open .const-abs{ font-size:10px; }
  .esquema-toolbar{
    display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px;
  }
  .esquema-toolbar .esquema-hint{ font-size:11px; color:var(--ink-soft); margin-left:4px; }
  .esquema-panel{ position:relative; }
  .esquema-restore-fab{
    position:fixed !important;
    top:18px !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%);
    z-index:10050 !important;
    box-shadow:0 10px 32px rgba(0,0,0,.55);
    font-size:14px !important;
    font-weight:700 !important;
    padding:10px 20px !important;
    pointer-events:auto !important;
  }
  .const-node.is-dragging{ opacity:0.92; filter:drop-shadow(0 0 6px rgba(255,178,56,.55)); }
  .const-node.is-dragging .const-box{ stroke:rgba(255,178,56,.7); }
  .const-node.is-selected .const-box{
    stroke:var(--hanko) !important; stroke-width:2.2; fill:rgba(240,114,138,0.18);
  }
  .const-node.is-selected{ filter:drop-shadow(0 0 8px rgba(240,114,138,.45)); }
  .const-viewport.select-mode .const-node{ cursor:pointer; }
  .const-viewport.link-mode .const-node{ cursor:crosshair; }
  .const-node.link-from .const-box{ stroke:#FFB238 !important; stroke-width:2.4; }
  .const-edge-mesh:hover .const-edge-path{ stroke:#fff; stroke-width:2.2; }
  .esquema-toolbar #esquema-delete-sel:disabled{ opacity:0.45; cursor:not-allowed; }
  .esquema-links-table{ width:100%; border-collapse:collapse; font-size:12.5px; }
  .esquema-links-table th,.esquema-links-table td{ padding:6px 8px; border-bottom:1px solid var(--line); text-align:left; }
  .esquema-links-table input{ width:70px; }
  .esquema-legend-grid{
    display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:8px 16px;
    font-size:12px; color:var(--ink-soft);
  }
  .esquema-legend-item{ display:flex; align-items:center; gap:10px; }
  .esquema-legend-item svg{ flex-shrink:0; }
  /* Mapa Leaflet — tamaño normal */
  #tel-esquema-map-wrap{
    display:none; /* se muestra desde JS como flex */
    flex-direction:column;
    min-height:0;
    box-sizing:border-box;
  }
  #tel-esquema-map-wrap.is-visible{
    display:flex !important;
  }
  #tel-esquema-map{
    width:100%;
    height:min(70vh, 640px);
    min-height:480px;
    border-radius:10px;
    border:1px solid var(--line);
    background:#0b1218;
    position:relative;
    overflow:hidden;
  }
  .esquema-toolbar{
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
  }
  .esquema-map-actions{
    display:flex; flex-wrap:wrap; gap:8px; margin:0 0 10px; align-items:center;
  }
  .esquema-map-actions .btn{ font-size:12.5px; }

  #tel-esquema-map .leaflet-container{
    width:100% !important;
    height:100% !important;
    background:#0b1218;
    font-family:var(--font-body);
  }
  #tel-esquema-map-wrap #tel-esquema-map-hint{
    flex-shrink:0;
    margin-top:10px;
  }

  /* Panel maximizado (esquema SVG o mapa) */
  .esquema-panel.is-max{
    position:fixed;
    inset:12px;
    z-index:9999;
    margin:0;
    border-radius:12px;
    background:var(--bg);
    box-shadow:0 20px 60px rgba(0,0,0,.55);
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  .esquema-panel.is-max #tel-esquema-root{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    padding:12px 14px 14px;
    overflow:hidden;
  }
  .esquema-panel.is-max .const-wrap-open{
    max-height:none !important;
    height:100% !important;
    min-height:0;
    flex:1 1 auto;
  }

  /* Mapa a pantalla completa dentro del panel maximizado */
  .esquema-panel.is-max #tel-esquema-map-wrap,
  .esquema-panel.is-max #tel-esquema-map-wrap.is-visible{
    display:flex !important;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    height:auto;
    padding:12px 14px 14px;
    box-sizing:border-box;
    overflow:hidden;
  }
  .esquema-panel.is-max #tel-esquema-map{
    /* truco flex: height:0 + flex:1 fuerza que ocupe todo el espacio disponible */
    flex:1 1 auto;
    height:0 !important;
    min-height:0 !important;
    border-radius:10px;
  }
  .esquema-panel.is-max #tel-esquema-map .leaflet-container{
    width:100% !important;
    height:100% !important;
  }
  .esquema-panel.is-max #tel-esquema-map-hint{
    flex-shrink:0;
    margin:8px 0 0;
  }
  .leaflet-marker-label{
    background:rgba(20,18,14,0.88); color:#F3E9DD; border:1px solid rgba(255,138,46,0.45);
    border-radius:8px; padding:4px 8px; font-size:11px; font-weight:600;
    white-space:nowrap; box-shadow:0 4px 14px rgba(0,0,0,0.35);
    font-family:Inter,sans-serif; pointer-events:auto; cursor:pointer;
  }
  .leaflet-marker-label.primaria{ border-color:rgba(255,74,28,0.7); }
  .leaflet-marker-label .sub{ display:block; font-size:10px; color:#B8A897; font-weight:500; }
  /* Iconos del esquema sobre el mapa */
  .leaflet-esquema-icon{
    background:transparent; border:0;
  }
  .leaflet-esquema-marker{
    display:flex; flex-direction:column; align-items:center;
    pointer-events:auto; cursor:pointer;
    filter:drop-shadow(0 2px 6px rgba(0,0,0,.55));
  }
  .leaflet-esquema-marker svg{
    display:block; overflow:visible;
  }
  .leaflet-esquema-marker .lem-label{
    margin-top:2px;
    background:rgba(20,18,14,0.90);
    color:#F3E9DD;
    border:1px solid rgba(255,138,46,0.45);
    border-radius:7px;
    padding:2px 7px;
    font-size:10.5px;
    font-weight:600;
    font-family:Inter,sans-serif;
    white-space:nowrap;
    max-width:160px;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1.25;
    text-align:center;
    box-shadow:0 3px 10px rgba(0,0,0,.4);
  }
  .leaflet-esquema-marker.primaria .lem-label{
    border-color:rgba(255,74,28,0.75);
  }
  .leaflet-esquema-marker .lem-sub{
    display:block;
    font-size:9.5px;
    color:#B8A897;
    font-weight:500;
  }
  .leaflet-esquema-marker:hover .lem-label{
    border-color:rgba(255,178,56,0.85);
    background:rgba(28,22,14,0.95);
  }
  .esquema-mode-btn.active{ background:var(--jade-tint); color:var(--jade-dark); border-color:rgba(232,114,15,0.4); font-weight:600; }
  #tel-esquema-map .leaflet-control-layers{ border-radius:8px; border:1px solid var(--line); }

  .const-viewport{ width:100%; height:100%; overflow:hidden; cursor:grab; touch-action:none; }
  .const-viewport.is-panning{ cursor:grabbing; }
  .const-viewport .const-node{ cursor:move; }
  .inv-scope .const-node{ cursor:pointer; }
  .inv-scope .const-node .const-dot{ transition:r .15s ease, filter .15s ease; }
  .inv-scope .const-node:hover .const-dot{ filter:brightness(1.35); }
  .inv-scope .const-node .const-box{
    fill:rgba(20,22,48,0.72); stroke:rgba(168,155,255,0.28); stroke-width:1; pointer-events:none;
  }
  .inv-scope .const-node:hover .const-box{ stroke:rgba(255,155,84,0.55); fill:rgba(28,24,40,0.88); }
  .inv-scope .const-node .const-label{
    font-family:var(--font-mono); fill:#E7E4F5; font-size:11px; font-weight:600; text-anchor:middle; pointer-events:none;
  }
  .inv-scope .const-node .const-code{
    font-family:var(--font-mono); fill:#FFB238; font-size:9px; text-anchor:middle; pointer-events:none;
  }
  .inv-scope .const-node .const-abs{
    font-family:var(--font-mono); fill:#7FB4FF; font-size:9px; text-anchor:middle; pointer-events:none;
  }
  .inv-scope .const-node .const-sub{
    font-family:var(--font-mono); fill:#9088B8; font-size:9px; text-anchor:middle; pointer-events:none;
  }
  .inv-scope .const-edge-cap{
    font-family:var(--font-mono); fill:#FFB238; font-size:10px; font-weight:600; text-anchor:middle; pointer-events:none;
  }
  .inv-scope .const-empty{ padding:40px 20px; text-align:center; color:#9088B8; font-size:13px; }

  .inv-scope .del-link{ background:transparent; border:none; color:var(--ink-soft); font-size:12px; padding:4px 6px; border-radius:5px; cursor:pointer; }
  .inv-scope .del-link:hover{ background:var(--hanko-tint); color:var(--hanko-dark); }

  .inv-scope .inline-form{ margin-top:14px; padding-top:14px; border-top:1px dashed var(--line); }
  .inv-scope .row-flex{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
  .inv-scope .imp-note{ font-size:11.5px; color:var(--ink-soft); line-height:1.5; margin-top:8px; }

  @media (max-width:700px){
    .inv-scope .form-grid, .inv-scope .form-grid.cols-3, .inv-scope .form-grid.cols-4{ grid-template-columns:1fr; }
  }


/* ========== LIAM / Almuerzo ========== */
.liam-almuerzo-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:18px;
}
@media (max-width:900px){
  .liam-almuerzo-grid{ grid-template-columns:1fr; }
}
.liam-stats-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.liam-cal-weekdays{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:6px;
  margin-bottom:8px;
  text-align:center;
  font-size:11px;
  color:var(--ink-soft);
  font-family:var(--font-mono);
  letter-spacing:0.04em;
  text-transform:uppercase;
}
.liam-cal-grid{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:6px;
}
.liam-cal-day{
  aspect-ratio:1;
  border:1px solid var(--line);
  background:var(--surface-2);
  color:var(--ink);
  border-radius:10px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  transition: background .15s, border-color .15s, color .15s;
}
.liam-cal-day:hover:not(:disabled){
  border-color:var(--jade);
  background:var(--jade-tint);
}
.liam-cal-day.empty{
  visibility:hidden;
  pointer-events:none;
  border:none;
  background:transparent;
}
.liam-cal-day.today{
  box-shadow: inset 0 0 0 2px var(--jade);
}
.liam-cal-day.eaten{
  background:var(--hanko);
  border-color:var(--hanko);
  color:#fff;
}
.liam-cal-day.eaten:hover{
  background:var(--hanko-dark);
  border-color:var(--hanko-dark);
}
.cfg-label{
  display:block;
  font-size:11.5px;
  color:var(--ink-soft);
  margin-bottom:4px;
}
.cfg-input{
  background:var(--surface-2);
  border:1px solid var(--line);
  color:var(--ink);
  border-radius:8px;
  padding:8px 10px;
  font-size:13.5px;
}


/* ========== Animaciones GusBot ========== */
@keyframes gbFadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
@keyframes gbFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes gbScaleIn {
  from { opacity: 0; transform: scale(0.55); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes gbStarPop {
  0%   { opacity: 0; transform: scale(0.2); }
  70%  { opacity: 1; transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes gbEdgeDraw {
  from { stroke-dashoffset: 120; opacity: 0; }
  to   { stroke-dashoffset: 0; opacity: 1; }
}
@keyframes gbPulseSoft {
  0%, 100% { filter: drop-shadow(0 0 0 transparent); }
  50% { filter: drop-shadow(0 0 10px rgba(255,178,56,.45)); }
}
@keyframes gbSlideTab {
  from { opacity: 0; transform: translateX(6px); }
  to   { opacity: 1; transform: none; }
}

.view.active{
  animation: gbFadeUp .28s ease both;
}
.acc-subview.active{
  animation: gbSlideTab .22s ease both;
}
.acc-tab{
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .15s ease;
}
.acc-tab:active{ transform: scale(0.97); }
.acc-tab.active{
  transition: color .18s ease, border-color .22s ease;
}

.inv-scope .const-node{
  transform-box: fill-box;
  transform-origin: center;
  transition: opacity .25s ease, filter .2s ease;
}
.inv-scope .const-node.gb-enter{
  animation: gbStarPop .38s cubic-bezier(.2,.9,.3,1.2) both;
}
.inv-scope .const-node.gb-exit{
  animation: gbFadeIn .2s ease reverse both;
  pointer-events: none;
}
.inv-scope .const-node.gb-parent-open{
  animation: gbPulseSoft 1.2s ease 1;
}
.inv-scope .const-edge{
  stroke-dasharray: 8 6;
  transition: opacity .25s ease, stroke .2s ease;
}
.inv-scope .const-edge.gb-edge-enter{
  animation: gbEdgeDraw .45s ease both;
}
.inv-scope .const-box{
  transition: stroke .2s ease, opacity .2s ease;
}
.inv-scope .const-wrap svg{
  transition: height .35s ease, width .35s ease;
}

#inv-consolidate-panel{
  animation: gbFadeUp .25s ease both;
}
.login-overlay{
  transition: opacity .25s ease, visibility .25s ease;
}
.btn{
  transition: transform .12s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.btn:active{ transform: scale(0.97); }

@media (prefers-reduced-motion: reduce){
  .view.active, .acc-subview.active, .inv-scope .const-node.gb-enter,
  .inv-scope .const-edge.gb-edge-enter, #inv-consolidate-panel{
    animation: none !important;
  }
  .inv-scope .const-node, .acc-tab, .btn{ transition: none !important; }
}

.view.active.gb-view-reenter{ animation: gbFadeUp .28s ease both; }

.dash-boss-row{ display:flex; align-items:center; gap:8px; margin:6px 0; font-size:12px; }
.dash-boss-label{ width:64px; color:var(--ink-soft); flex-shrink:0; }
.dash-boss-track{ flex:1; height:12px; background:rgba(255,255,255,.06); border-radius:6px; overflow:hidden; display:flex; }
.dash-boss-fill-boss{ background:linear-gradient(90deg,#5B8DEF,#7FB4FF); height:100%; }
.dash-boss-fill-central{ background:linear-gradient(90deg,#3d9,#5FD9B0); height:100%; }
.dash-boss-val{ width:52px; text-align:right; font-variant-numeric:tabular-nums; }
.dash-evo-svg{ width:100%; height:140px; display:block; }
.esquema-map-actions{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 10px; align-items:center; }

/* —— Telefonía: zona de carga de archivos —— */
.tel-dropzone{
  margin: 14px 0 8px;
  border: 1.5px dashed rgba(95, 217, 176, 0.35);
  border-radius: 14px;
  background: linear-gradient(160deg, rgba(95,217,176,.06), rgba(91,141,239,.04));
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .12s ease;
  outline: none;
}
.tel-dropzone:hover,
.tel-dropzone:focus-visible{
  border-color: rgba(95, 217, 176, 0.7);
  background: linear-gradient(160deg, rgba(95,217,176,.12), rgba(91,141,239,.08));
  box-shadow: 0 0 0 3px rgba(95,217,176,.12);
}
.tel-dropzone.tel-dropzone-active{
  border-color: var(--jade, #5FD9B0);
  background: linear-gradient(160deg, rgba(95,217,176,.18), rgba(91,141,239,.12));
  box-shadow: 0 0 0 4px rgba(95,217,176,.18);
  transform: scale(1.01);
}
.tel-dropzone.tel-dropzone-busy{
  pointer-events: none;
  opacity: 0.85;
  border-style: solid;
}
.tel-dropzone-inner{
  padding: 22px 18px 18px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.tel-dropzone-icon{
  font-size: 28px;
  line-height: 1;
  margin-bottom: 2px;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.25));
}
.tel-dropzone-title{
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ink, #e8eef5);
  letter-spacing: 0.01em;
}
.tel-dropzone-sub{
  font-size: 12px;
  color: var(--ink-soft, #9aabbc);
  max-width: 420px;
  line-height: 1.4;
}
.tel-dropzone-actions{
  margin-top: 8px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}
.tel-dropzone-status{
  margin-top: 8px;
  min-height: 18px;
  font-size: 12.5px;
  color: var(--ink-soft, #9aabbc);
  font-variant-numeric: tabular-nums;
}
.tel-dropzone-status.ok{ color: var(--jade, #5FD9B0); }
.tel-dropzone-status.err{ color: var(--hanko-dark, #e07070); }
.tel-dropzone-status.busy{ color: var(--ink, #e8eef5); }
.tel-dropzone-progress{
  margin-top: 8px;
  width: min(320px, 90%);
  height: 8px;
  background: rgba(255,255,255,.08);
  border-radius: 5px;
  overflow: hidden;
}
.tel-dropzone-progress > i{
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #3d9, #5FD9B0);
  border-radius: 5px;
  transition: width .15s linear;
}

  .login-mode-chip{
    border:1px solid var(--line, rgba(255,255,255,0.12));
    border-radius:10px;
    padding:10px 12px;
    background:rgba(255,255,255,0.03);
  }
  .login-mode-chip:has(input:checked){
    border-color: rgba(255,138,46,0.55);
    background: rgba(255,138,46,0.08);
  }



/* ========== VISUAL POLISH v2: fondos + animaciones ========== */
body{
  background:
    radial-gradient(1200px 700px at 12% -10%, rgba(255, 74, 28, 0.16), transparent 55%),
    radial-gradient(900px 600px at 95% 8%, rgba(232, 114, 15, 0.12), transparent 50%),
    radial-gradient(800px 500px at 70% 100%, rgba(30, 136, 229, 0.06), transparent 45%),
    linear-gradient(165deg, #0c0a09 0%, #120e0c 40%, #0f0c0a 100%);
  background-attachment: fixed;
  min-height: 100vh;
}
body::before{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.35;
  background-image:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  mix-blend-mode: overlay;
}
.app, .login-overlay{ position: relative; z-index: 1; }

.sidebar{
  background: linear-gradient(180deg, rgba(22,18,14,0.97) 0%, rgba(14,12,10,0.98) 100%);
  border-right: 1px solid rgba(255,255,255,0.06);
  box-shadow: 4px 0 32px rgba(0,0,0,0.25);
  backdrop-filter: blur(12px);
}
.main, .content, .app > main, .app > .main-content{
  position: relative;
}

/* Glow suave del logo */
.hanko-mark{
  animation: hankoPulse 4.5s ease-in-out infinite;
}
@keyframes hankoPulse{
  0%, 100%{ filter: drop-shadow(0 2px 6px rgba(255,74,28,0.35)); transform: scale(1); }
  50%{ filter: drop-shadow(0 4px 14px rgba(255,138,46,0.55)); transform: scale(1.03); }
}

/* Nav más vivo */
.nav-btn{
  transition: background .22s ease, color .22s ease, box-shadow .22s ease, transform .18s ease;
}
.nav-btn:hover{
  transform: translateX(3px);
  background: rgba(255,255,255,0.06);
}
.nav-btn.active{
  animation: navActiveIn .35s ease;
}
@keyframes navActiveIn{
  from{ background: transparent; transform: translateX(0); }
  to{ background: rgba(255,138,61,0.14); transform: none; }
}

/* Transición de vistas */
.view{
  display: none;
  animation: none;
}
.view.active{
  display: block;
  animation: viewEnter .38s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes viewEnter{
  from{ opacity: 0; transform: translateY(10px) scale(0.992); filter: blur(2px); }
  to{ opacity: 1; transform: none; filter: none; }
}
.gb-view-reenter{
  animation: viewEnter .38s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Paneles / cards */
.panel, .dash-card, .login-card{
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  background:
    linear-gradient(145deg, rgba(36,28,23,0.95) 0%, rgba(27,21,18,0.98) 100%);
  border: 1px solid rgba(59,46,36,0.9);
}
.panel:hover, .dash-card:hover{
  border-color: rgba(255,138,61,0.28);
  box-shadow: 0 8px 28px rgba(0,0,0,0.35), 0 0 0 1px rgba(255,138,61,0.08);
}
.panel-pad{ backdrop-filter: blur(8px); }

/* Botones */
.btn{
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease, filter .2s ease;
}
.btn:hover{ transform: translateY(-1px); }
.btn:active{ transform: translateY(1px) scale(0.98); }
.btn-hanko, .btn-jade{
  box-shadow: 0 2px 0 rgba(0,0,0,0.2), 0 6px 16px rgba(255,74,28,0.18);
}
.btn-hanko:hover, .btn-jade:hover{
  box-shadow: 0 4px 0 rgba(0,0,0,0.15), 0 10px 24px rgba(255,74,28,0.28);
}

/* Tablas */
tbody tr{
  transition: background .18s ease, transform .18s ease;
}
tbody tr:hover{
  background: rgba(255,138,61,0.06);
}

/* Login */
.login-overlay{
  background:
    radial-gradient(900px 500px at 50% 0%, rgba(255,74,28,0.2), transparent 60%),
    radial-gradient(700px 400px at 20% 100%, rgba(232,114,15,0.12), transparent 50%),
    #0c0a09;
}
.login-card{
  animation: viewEnter .5s cubic-bezier(0.22, 1, 0.36, 1) both;
  box-shadow: 0 24px 80px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,138,61,0.12);
}
.login-mode-chip{
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.login-mode-chip:hover{ transform: translateY(-2px); }

/* Toast */
#toast, .toast{
  animation: toastIn .3s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes toastIn{
  from{ opacity: 0; transform: translateY(12px) scale(0.96); }
  to{ opacity: 1; transform: none; }
}

/* Status banner */
#gb-status-banner{
  animation: bannerSlide .35s ease both;
}
@keyframes bannerSlide{
  from{ opacity: 0; transform: translateY(-8px); }
  to{ opacity: 1; transform: none; }
}

/* Ficha abonado modal */
#gb-ficha-abo > div{
  animation: viewEnter .35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Scrollbar sutil */
*::-webkit-scrollbar{ width: 8px; height: 8px; }
*::-webkit-scrollbar-track{ background: transparent; }
*::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,0.12);
  border-radius: 99px;
}
*::-webkit-scrollbar-thumb:hover{ background: rgba(255,138,61,0.35); }

/* Respetar usuarios con menos movimiento */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .hanko-mark{ animation: none; }
}

/* ===== Telefonía / EWSD v12 — búsqueda, esquema, mapa ===== */
.ewsd-search-meta{
  font-size: 11.5px;
  color: var(--ink-soft);
  margin: 0 0 10px;
  letter-spacing: .02em;
}
.ewsd-search-table th{
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink-soft);
}
.ewsd-dn{
  font-family: var(--font-mono);
  letter-spacing: .03em;
  font-size: 13.5px;
}
.ewsd-badge{
  display: inline-block;
  font-size: 9.5px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 99px;
  background: rgba(46, 184, 138, 0.18);
  color: var(--jade, #2eb88a);
  vertical-align: middle;
}
.ewsd-badge.soft{
  background: rgba(255, 178, 56, 0.15);
  color: var(--gold, #ffb238);
}
.ewsd-lbl{
  color: var(--ink-soft);
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.ewsd-pos{
  font-size: 11px;
  color: var(--gold, #ffb238);
  margin-top: 2px;
  font-family: var(--font-mono);
}
.ewsd-cal{
  font-size: 10.5px;
  color: var(--ink-soft);
  margin-top: 2px;
}
.ewsd-src{
  font-size: 10px;
  margin-top: 3px;
}
.ewsd-src.sb{ color: var(--jade, #2eb88a); }
.ewsd-src.mem{ color: var(--ink-soft); }

#tel-esquema-root .esquema-node,
#tel-esquema-root .esquema-card{
  border-radius: 12px;
  transition: box-shadow .15s ease, border-color .15s ease;
}
#tel-esquema-root .esquema-node:hover,
#tel-esquema-root .esquema-card:hover{
  box-shadow: 0 8px 28px rgba(0,0,0,.22);
}
#tel-esquema-map-wrap{
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--line, rgba(255,255,255,.08));
}
#tel-esquema-map .tel-map-pin{
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.45));
}
#tel-esquema-map .leaflet-popup-content-wrapper{
  border-radius: 12px;
  background: rgba(28, 24, 20, 0.96);
  color: var(--ink, #f2ebe3);
  border: 1px solid rgba(255,178,56,.25);
  box-shadow: 0 12px 40px rgba(0,0,0,.4);
}
#tel-esquema-map .leaflet-popup-tip{
  background: rgba(28, 24, 20, 0.96);
}
#tel-esquema-map-hint{
  font-size: 12px;
  line-height: 1.45;
}
