*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f0f2f4;--surface:#ffffff;--border:#d0d8e0;
  --text:#1a2030;--muted:#6a7d90;--accent:#2979c8;
  --tag-bg:#e4eaf0;--danger:#d94040;
  --font-d:'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;
  --font-m:'Lucida Console','Courier New',Courier,monospace;
}
[data-theme="dark"]{
  --bg:#141618;--surface:#1e2226;--border:#2e3438;
  --text:#e8eaec;--muted:#7e9099;--accent:#64b5f6;
  --tag-bg:#242a30;
  
}
[data-theme="dark"] body,
[data-theme="dark"] .def-text,
[data-theme="dark"] .def-example,
[data-theme="dark"] .syn-chip,
[data-theme="dark"] .synonyms-label,
[data-theme="dark"] .entry-phonetic,
[data-theme="dark"] .tag,
[data-theme="dark"] .tag.cat,
[data-theme="dark"] #history-list li,
[data-theme="dark"] .sidebar-label,
[data-theme="dark"] .db-count,
[data-theme="dark"] #suggestions li,
[data-theme="dark"] #suggestions li .sug-cat,
[data-theme="dark"] .not-found,
[data-theme="dark"] .aw-word,
[data-theme="dark"] .aw-cat,
[data-theme="dark"] .aw-count,
[data-theme="dark"] .aw-page-btn,
[data-theme="dark"] .aw-title,
[data-theme="dark"] .modal-title,
[data-theme="dark"] .form-row label,
[data-theme="dark"] .defs-section-label,
[data-theme="dark"] .def-block-num,
[data-theme="dark"] .btn-cancel,
[data-theme="dark"] .history-empty,
[data-theme="dark"] .empty-state p,
[data-theme="dark"] .def-num{color:#e8eaec !important}
/* 🔤 BASE: tamaño raíz del documento */
html{font-size:16px;-webkit-text-size-adjust:100% !important;text-size-adjust:100% !important}
body{background:var(--bg);color:var(--text);font-family:var(--font-d);min-height:100vh;line-height:1.6;-webkit-text-size-adjust:none !important;text-size-adjust:none !important}

/* HEADER */
header{position:sticky;top:0;z-index:100;background:var(--bg);border-bottom:1px solid var(--border);padding:.55rem 1.5rem .6rem}
.header-inner{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:.5rem}
.header-top{display:flex;align-items:center;gap:.5rem;flex-wrap:nowrap;min-width:0;overflow:visible}
/* 🔤 LOGO: "LÉXICO" en el header (desktop) */
.logo{font-family:var(--font-d);font-weight:300;font-size:24px !important;letter-spacing:.18em;text-transform:uppercase;color:var(--text);white-space:nowrap;flex-shrink:0}
.logo span{color:var(--accent)}
.header-spacer{flex:1;min-width:.25rem}
.search-wrap{position:relative;width:100%}
.search-wrap svg{position:absolute;left:.25rem;top:50%;transform:translateY(-50%);width:22px;height:22px;stroke:var(--muted);fill:none;pointer-events:none}
/* 🔤 BUSCADOR: input de búsqueda (desktop) */
#search{width:100%;padding:.5rem .75rem .5rem 2.25rem;background:var(--surface);border:1px solid var(--border);border-radius:4px;font-family:var(--font-d);font-size:22px !important;color:var(--text);outline:none;transition:border-color .15s}
#search:focus{border-color:var(--accent)}
#search::placeholder{color:var(--muted);font-style:italic}
/* 🔤 BADGE: contador de palabras "📖 562" */
.word-count-badge{font-family:var(--font-m);font-size:15px !important;letter-spacing:.05em;color:var(--muted);border:1px solid var(--border);border-radius:4px;padding:.32rem .65rem;white-space:nowrap;flex-shrink:0;cursor:pointer;transition:border-color .15s,color .15s}
.word-count-badge:hover{border-color:var(--accent);color:var(--accent)}
.word-count-badge.active{border-color:var(--accent);color:var(--accent);background:rgba(41,121,200,.04)}
.word-count-badge span{color:var(--accent);font-weight:400}
.header-actions{display:flex;gap:.25rem;flex-shrink:1;align-items:center;min-width:0}
/* 🔤 BOTONES PEQUEÑOS: "aleatorio", "exportar"… */
.btn-sm{padding:.28rem .55rem;background:none;border:1px solid var(--border);border-radius:4px;font-family:var(--font-m);font-size:18px !important;letter-spacing:.04em;color:var(--muted);cursor:pointer;white-space:nowrap;transition:border-color .15s,color .15s}
.btn-sm:hover{border-color:var(--accent);color:var(--accent)}
.btn-sm.primary{border-color:var(--accent);color:var(--accent);padding:.32rem .55rem;font-size:18px !important}
.btn-sm.primary:hover{background:var(--accent);color:#fff}

.btn-add-short{display:none}
.btn-add-full{display:inline}
.btn-theme{padding:.32rem .55rem;border:1px solid var(--border);border-radius:4px;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .15s,color .15s;color:var(--muted);flex-shrink:0}
.btn-theme:hover{border-color:var(--accent);color:var(--accent)}
.btn-theme svg{width:22px;height:22px;stroke:currentColor;fill:none}

/* FILTRO DE CATEGORÍAS */
.cat-filter{display:flex;gap:.35rem;flex-wrap:wrap;padding:.1rem 0}
/* 🔤 CHIPS DE CATEGORÍA: todos/sustantivo/verbo… */
.cat-chip{padding:.3rem .75rem;border:1px solid var(--border);border-radius:20px;font-family:Georgia,serif;font-size:16px !important;letter-spacing:.02em;color:var(--muted);background:none;cursor:pointer;transition:border-color .15s,color .15s,background .15s;white-space:nowrap}
.cat-chip:hover{border-color:var(--accent);color:var(--accent)}
.cat-chip.active{border-color:var(--accent);background:var(--accent);color:#fff}

/* LAYOUT */
.page{max-width:900px;margin:0 auto;display:grid;grid-template-columns:210px 1fr;gap:2.5rem;padding:2rem 1.5rem 4rem;padding-bottom:4rem}

/* SIDEBAR */
/* 🔤 SIDEBAR: etiqueta "HISTORIAL" */
.sidebar-label{font-family:var(--font-m);font-size:18px !important;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.75rem}
#history-list{list-style:none}
/* 🔤 HISTORIAL: palabras en la lista lateral */
#history-list li{padding:.35rem 0;border-bottom:1px solid var(--border);font-size:19px !important;font-weight:300;cursor:pointer;color:var(--muted);transition:color .12s;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#history-list li:hover{color:var(--accent)}
#history-list li.active{color:var(--text);font-weight:400}
/* 🔤 HISTORIAL VACÍO: mensaje "—" */
.history-empty{font-size:16px !important;font-style:italic;color:var(--muted)}
.db-info{margin-top:1.5rem}
/* 🔤 SIDEBAR: contador "palabras: 562" */
.db-count{font-family:var(--font-m);font-size:17px !important;color:var(--muted);letter-spacing:.05em}
.db-count span{color:var(--text);font-weight:400}

/* MAIN */
main{min-height:60vh}
.empty-state{padding-top:3rem;text-align:center}
/* 🔤 PANTALLA INICIAL: letra "A" decorativa grande */
.empty-state .big-char{font-size:5rem;font-weight:300;color:var(--border);line-height:1;display:block;margin-bottom:1rem}
/* 🔤 PANTALLA INICIAL: texto "Escribe una palabra…" */
.empty-state p{font-size:15px !important;font-style:italic;color:var(--muted)}
#suggestions{list-style:none;margin-bottom:1rem}
/* 🔤 SUGERENCIAS: palabras en lista de resultados */
#suggestions li{padding:.55rem 0;border-bottom:1px solid var(--border);font-size:22px !important;font-weight:300;cursor:pointer;display:flex;align-items:baseline;gap:.6rem;transition:color .12s}
#suggestions li:hover{color:var(--accent)}
/* 🔤 SUGERENCIAS: categoría junto a la palabra */
#suggestions li .sug-cat{font-family:Georgia,serif;font-size:15px !important;font-weight:400;color:#888 !important;padding-right:.2rem}
#suggestions li .sug-sep{color:#555 !important;font-size:15px !important;margin:0 .3rem;font-family:Georgia,serif}
#suggestions li.sug-pagination{display:flex;flex-wrap:wrap;gap:.3rem;padding:.6rem 0;border-bottom:none;cursor:default}
#suggestions li.sug-pagination:hover{color:inherit}

/* ENTRADA */
.entry{animation:fadeUp .22s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.entry-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.2rem}
/* 🔤 ENTRADA: palabra principal (ej. "acervo") */
.entry-word{font-size:2.8rem;font-weight:300;line-height:1.1;letter-spacing:-.01em}
.entry-actions{display:flex;gap:.4rem;flex-shrink:0;padding-top:.6rem}
.btn-icon{width:32px;height:32px;border:1px solid var(--border);border-radius:4px;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .15s,color .15s;color:var(--muted)}
.btn-icon:hover{border-color:var(--accent);color:var(--accent)}
.btn-icon.danger:hover{border-color:var(--danger);color:var(--danger)}
.btn-icon svg{width:14px;height:14px;stroke:currentColor;fill:none}
/* 🔤 ENTRADA: fonética "[a·sér·bo]" */
.entry-phonetic{font-family:var(--font-m);font-size:16px !important;color:var(--muted);margin-bottom:.8rem}
.entry-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.4rem}
/* 🔤 ENTRADA: tags de categoría (sustantivo masculino…) */
.tag{padding:.15rem .55rem;background:var(--tag-bg);border:1px solid var(--border);border-radius:2px;font-family:var(--font-m);font-size:15px !important;letter-spacing:.07em;color:var(--muted)}
.tag.cat{color:var(--accent);border-color:rgba(41,121,200,.25);background:rgba(41,121,200,.04)}
.divider{width:32px;height:1px;background:var(--accent);margin-bottom:1.4rem}
.defs{list-style:none}
.def-item{display:grid;grid-template-columns:28px 1fr;gap:.5rem 1rem;margin-bottom:1.4rem}
/* 🔤 DEFINICIÓN: número "01" */
.def-num{font-family:var(--font-m);font-size:15px !important;color:var(--muted);padding-top:.15rem}
/* 🔤 DEFINICIÓN: texto principal de la definición */
.def-text{font-size:22px !important;font-weight:400;line-height:1.6;margin-bottom:.5rem}
/* 🔤 DEFINICIÓN: ejemplo en cursiva */
.def-example{font-size:24px !important;font-style:italic;color:var(--muted);line-height:1.5}
[data-theme="dark"] .def-example{color:#9ab8d0 !important}
.def-example::before{content:'« '}
.def-example::after{content:' »'}
.synonyms-row{margin-top:1.6rem;padding-top:1.2rem;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:.5rem;align-items:baseline}
/* 🔤 SINÓNIMOS: etiqueta "SINÓNIMOS" */
.synonyms-label{font-family:var(--font-m);font-size:18px !important;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-right:.3rem}
/* 🔤 SINÓNIMOS: palabras sinónimas */
.syn-chip{font-size:22px !important;font-weight:300;font-style:italic;color:var(--muted);cursor:pointer;transition:color .12s}
.syn-chip:hover{color:var(--accent)}
.syn-chip+.syn-chip::before{content:' – '}
/* 🔤 NO ENCONTRADO: mensaje de palabra no hallada */
.not-found{padding-top:2rem;font-size:16px !important;font-style:italic;color:var(--muted)}
.not-found strong{font-style:normal;color:var(--text)}

/* MODAL */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:500;align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal{background:var(--surface);border:1px solid var(--border);border-radius:6px;width:100%;max-width:540px;max-height:90vh;overflow-y:auto;padding:2rem}
/* 🔤 MODAL: título "Agregar / Editar palabra" */
.modal-title{font-size:24px !important;font-weight:300;margin-bottom:1.5rem}
.form-row{margin-bottom:1.1rem}
/* 🔤 MODAL: etiquetas PALABRA, FONÉTICA, CATEGORÍA… */
.form-row label{display:block;font-family:var(--font-m);font-size:14px !important;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
/* 🔤 MODAL: inputs y selects del formulario */
.form-row input,.form-row select,.form-row textarea{width:100%;padding:.5rem .75rem;border:1px solid var(--border);border-radius:4px;background:var(--bg);font-family:var(--font-d);font-size:22px !important;color:var(--text);outline:none;transition:border-color .15s}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--accent)}
.form-row textarea{resize:vertical;min-height:70px;line-height:1.5}
.form-row select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238c867d' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;padding-right:2rem}
/* 🔤 MODAL: título sección "DEFINICIONES" */
.defs-section-label{font-family:var(--font-m);font-size:14px !important;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}
.def-block{border:1px solid var(--border);border-radius:4px;padding:.85rem;margin-bottom:.6rem;position:relative}
/* 🔤 MODAL: "Definición 1", "Definición 2"… */
.def-block-num{font-family:var(--font-m);font-size:14px !important;color:var(--muted);margin-bottom:.5rem}
/* 🔤 MODAL: inputs de texto y ejemplo de definición */
.def-block input,.def-block textarea{width:100%;padding:.4rem .6rem;border:1px solid var(--border);border-radius:3px;background:var(--bg);font-family:var(--font-d);font-size:22px !important;color:var(--text);outline:none;margin-bottom:.4rem;transition:border-color .15s}
.def-block input:focus,.def-block textarea:focus{border-color:var(--accent)}
.def-block textarea{resize:vertical;min-height:55px;line-height:1.4}
/* 🔤 MODAL: botón × eliminar definición */
.btn-remove-def{position:absolute;top:.5rem;right:.5rem;width:22px;height:22px;border:none;background:none;cursor:pointer;color:var(--muted);font-size:1.1rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:color .12s}
.btn-remove-def:hover{color:var(--danger)}
/* 🔤 MODAL: botón "+ agregar definición" */
.btn-add-def{padding:.35rem .7rem;border:1px dashed var(--border);border-radius:4px;background:none;font-family:var(--font-m);font-size:22px !important;letter-spacing:.06em;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s;width:100%;margin-top:.2rem}
.btn-add-def:hover{border-color:var(--accent);color:var(--accent)}
.modal-footer{display:flex;gap:.75rem;justify-content:flex-end;margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid var(--border)}
/* 🔤 MODAL: botón "cancelar" */
.btn-cancel{padding:.5rem 1.2rem;border:1px solid var(--border);border-radius:4px;background:none;font-family:var(--font-m);font-size:16px !important;letter-spacing:.06em;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s}
.btn-cancel:hover{border-color:var(--text);color:var(--text)}
/* 🔤 MODAL: botón "guardar" */
.btn-save{padding:.5rem 1.4rem;border:1px solid var(--accent);border-radius:4px;background:var(--accent);font-family:var(--font-m);font-size:16px !important;letter-spacing:.06em;color:#fff;cursor:pointer;transition:opacity .15s}
.btn-save:hover{opacity:.85}

/* ALL WORDS VIEW */
.all-words-view{animation:fadeUp .2s ease}
.aw-topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.4rem;flex-wrap:wrap}
/* 🔤 TODAS: título "Todas las palabras" */
.aw-title{font-family:Georgia,serif;font-size:20px !important;font-weight:400;letter-spacing:.02em}
/* 🔤 TODAS: contador "562 palabras · pág. 1/11" */
.aw-count{font-family:var(--font-m);font-size:16px !important;color:var(--muted);letter-spacing:.06em}
.aw-count span{color:var(--accent)}
.aw-list{list-style:none}
.aw-list li{display:flex;align-items:baseline;gap:.7rem;padding:.5rem 0;border-bottom:1px solid var(--border);cursor:pointer;transition:color .12s}
.aw-list li:hover .aw-word{color:var(--accent)}
/* 🔤 TODAS: nombre de cada palabra en la lista */
.aw-word{font-family:var(--font-d);font-size:22px !important;font-weight:400;color:var(--text)}
/* 🔤 TODAS: categoría junto a cada palabra */
.aw-cat{font-family:Georgia,serif;font-size:15px !important;font-weight:400;color:#888 !important;flex-shrink:0;padding-right:.2rem}
.aw-sep{color:#555 !important;font-size:15px !important;margin:0 .3rem;font-family:Georgia,serif;flex-shrink:0}
.aw-pagination{display:flex;align-items:center;justify-content:center;gap:.4rem;flex-wrap:wrap;padding-top:1.8rem}
/* 🔤 PAGINACIÓN: botones de número de página */
.aw-page-btn{min-width:34px;height:34px;padding:0 .5rem;border:1px solid var(--border);border-radius:4px;background:none;font-family:var(--font-m);font-size:16px !important;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s,background .15s}
.aw-page-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.aw-page-btn.active{border-color:var(--accent);background:var(--accent);color:#fff;pointer-events:none}
.aw-page-btn:disabled{opacity:.3;cursor:not-allowed}
/* 🔤 PAGINACIÓN: puntos "…" entre páginas */
.aw-page-dots{font-family:var(--font-m);font-size:16px !important;color:var(--muted);padding:0 .15rem;line-height:34px}

/* 🔤 TOAST: notificación emergente */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:#1e2226;color:#e8eaec;font-family:var(--font-m);font-size:16px !important;letter-spacing:.05em;padding:.6rem 1.2rem;border-radius:4px;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;z-index:999;white-space:normal;max-width:88vw;text-align:center;line-height:1.4}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* CONFIRM */
.confirm-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:600;align-items:center;justify-content:center}
.confirm-overlay.open{display:flex}
.confirm-box{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:1.5rem;width:290px;text-align:center}
/* 🔤 CONFIRMAR: texto del diálogo de confirmación */
.confirm-box p{font-size:16px !important;font-weight:300;margin-bottom:1.2rem}
.confirm-actions{display:flex;gap:.75rem;justify-content:center}
/* 🔤 CONFIRMAR: botón "eliminar" */
.btn-confirm-del{padding:.45rem 1.2rem;border:1px solid var(--danger);border-radius:4px;background:var(--danger);font-family:var(--font-m);font-size:16px !important;letter-spacing:.06em;color:#fff;cursor:pointer}
/* 🔤 CONFIRMAR: botón "cancelar" */
.btn-confirm-no{padding:.45rem 1.2rem;border:1px solid var(--border);border-radius:4px;background:none;font-family:var(--font-m);font-size:16px !important;letter-spacing:.06em;color:var(--muted);cursor:pointer}

/* NÚMEROS EN NEGRITA */
.aw-count span,.word-count-badge span,.def-num,
.aw-page-btn,.aw-page-dots{font-weight:700}

/* MENÚ ENGRANAJE */
.btn-gear{padding:.32rem .55rem;border:1px solid var(--border);border-radius:4px;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .15s,color .15s;color:var(--muted);flex-shrink:0;position:relative}
.btn-gear:hover{border-color:var(--accent);color:var(--accent)}
.btn-gear svg{width:18px;height:18px;stroke:currentColor;fill:none}
.gear-menu{display:none;position:absolute;top:calc(100% + .4rem);right:0;background:var(--surface);border:1px solid var(--border);border-radius:6px;min-width:160px;box-shadow:0 4px 16px rgba(0,0,0,.2);z-index:1000;overflow:hidden}
.gear-menu.open{display:block}
/* 🔤 ENGRANAJE: opciones "Exportar" / "Importar" */
.gear-menu button,.gear-menu label{display:block;width:100%;padding:.6rem .9rem;background:none;border:none;font-family:var(--font-m);font-size:13px !important;color:var(--text);cursor:pointer;text-align:left;transition:background .12s;white-space:nowrap;box-sizing:border-box}
.gear-menu button:hover,.gear-menu label:hover{background:var(--tag-bg);color:var(--accent)}
.gear-menu .gear-divider{height:1px;background:var(--border);margin:0}


/* REPORTE */
.btn-flag{background:none;border:none;cursor:pointer;color:var(--muted);font-size:16px;padding:.2rem .3rem;transition:color .15s;line-height:1}
.btn-flag:hover{color:#e09040}
.btn-flag.flagged{color:#e09040}
.report-fields{display:flex;flex-direction:column;gap:.6rem}
.report-check{display:flex;align-items:center;gap:.6rem;font-size:16px;cursor:pointer;color:var(--text)}
.report-check input{width:18px;height:18px;accent-color:var(--accent);cursor:pointer}
/* RESPALDO */
.backup-info{font-size:12px;color:var(--muted);padding:.3rem .9rem .5rem;font-family:var(--font-m)}

/* FAB — más separación */
/* 🔤 FAB: botón flotante "+" en móvil */
.fab{display:none;position:fixed;bottom:1.4rem;right:5.5rem;width:48px;height:48px;background:var(--accent);border:none;border-radius:50%;box-shadow:0 2px 10px rgba(41,121,200,.35);align-items:center;justify-content:center;cursor:pointer;z-index:200;color:#fff;font-size:1.5rem;line-height:1}
.mobile-history-btn{display:none;position:fixed;bottom:1.4rem;right:1.2rem;width:48px;height:48px;background:var(--surface);border:1px solid var(--border);border-radius:50%;box-shadow:0 2px 10px rgba(0,0,0,.1);align-items:center;justify-content:center;cursor:pointer;z-index:200}
.mobile-history-btn{display:none !important}
/* MÓVIL */
.mobile-history-btn svg{stroke:var(--muted);fill:none;width:18px;height:18px}
.drawer-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.25);z-index:300}
.drawer{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--border);border-radius:12px 12px 0 0;padding:1.2rem 1.5rem 2rem;z-index:400;transform:translateY(100%);transition:transform .25s ease;max-height:55vh;overflow-y:auto}
.drawer.open{transform:translateY(0)}
.drawer-overlay.open{display:block}
.drawer-handle{width:36px;height:3px;background:var(--border);border-radius:2px;margin:0 auto 1.2rem}

@media(max-width:640px){
  .page{grid-template-columns:1fr;padding:1.5rem 1.2rem 5rem;gap:0}
  .sidebar{display:none}
  .mobile-history-btn{display:flex}
  .fab{display:flex}
  /* 🔤 MÓVIL — LOGO: "LÉXICO" */
  .logo{font-size:20px !important}
  .btn-sm:not(.primary){display:none}
  /* 🔤 MÓVIL — BUSCADOR */
  #search{font-size:22px !important;padding:.5rem .7rem .5rem 2.2rem}
  /* 🔤 MÓVIL — PALABRA PRINCIPAL */
  .entry-word{font-size:28px !important}
  /* 🔤 MÓVIL — FONÉTICA */
  .entry-phonetic{font-size:16px !important}
  /* 🔤 MÓVIL — TAGS */
  .tag{font-size:15px !important}
  /* 🔤 MÓVIL — TEXTO DEFINICIÓN */
  .def-text{font-size:22px !important;line-height:1.6}
  /* 🔤 MÓVIL — EJEMPLO */
  .def-example{font-size:20px !important}
  .def-item{margin-bottom:1.6rem}
  /* 🔤 MÓVIL — SINÓNIMOS */
  .syn-chip{font-size:20px !important}
  #suggestions li{padding:.6rem 0}
  .cat-chip{padding:.25rem .55rem}  .modal{padding:1.4rem;max-height:95vh}
  /* 🔤 MÓVIL — TÍTULO MODAL */
  .modal-title{font-size:22px !important}
  /* 🔤 MÓVIL — BADGE CONTADOR */
  .word-count-badge{font-size:22px !important;padding:.28rem .5rem}
  .btn-add-full{display:none}
  .btn-add-short{display:inline}
}

/* KOFI BAR */
.kofi-bar{position:fixed;bottom:0;left:0;right:0;background:#1a2744;border-top:2px solid var(--accent);padding:.5rem 1.5rem;display:flex;align-items:center;gap:1rem;z-index:150}
.kofi-btn{font-family:var(--font-m);font-size:13px !important;color:#fff;background:#FF5E5B;border:none;border-radius:4px;padding:.4rem .9rem;cursor:pointer;text-decoration:none;white-space:nowrap;transition:opacity .15s;flex-shrink:0}
.kofi-btn:hover{opacity:.85}
.kofi-msg{font-family:var(--font-d);font-size:18px !important;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kofi-bar{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--border);padding:.5rem 1.5rem;display:flex;align-items:center;gap:1rem;z-index:150}
.kofi-btn{font-family:var(--font-m);font-size:13px !important;color:#fff;background:#FF5E5B;border:none;border-radius:4px;padding:.4rem .9rem;cursor:pointer;text-decoration:none;white-space:nowrap;transition:opacity .15s;flex-shrink:0}
.kofi-btn:hover{opacity:.85}
.kofi-msg{font-family:var(--font-d);font-size:18px !important;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.kofi-bar{background:#1a2744 !important;border-top:1px solid var(--border) !important}
.kofi-msg{color:#FF5E5B !important}
@media(min-width:641px){
  .kofi-msg{font-size:20px !important;white-space:normal}
  .kofi-bar{padding:.6rem 2rem}
  .kofi-btn{font-size:15px !important;padding:.5rem 1.2rem}
}
.mobile-history-btn-inline{background:none;border:1px solid var(--border);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.mobile-history-btn-inline svg{stroke:var(--muted);fill:none;width:18px;height:18px}
.mobile-history-btn-inline:hover{border-color:var(--accent)}
/* SUGERENCIAS */
.suggest-label{font-size:16px !important;color:var(--muted);margin-top:.8rem;font-style:italic}
.suggest-form{display:flex;gap:.5rem;margin-top:.8rem;flex-wrap:wrap}
.suggest-input{padding:.5rem .75rem;border:1px solid var(--border);border-radius:4px;background:var(--bg);font-family:var(--font-d);font-size:18px !important;color:var(--text);outline:none;flex:1;min-width:200px}
.suggest-input:focus{border-color:var(--accent)}
.suggest-btn{padding:.5rem 1.2rem;border:1px solid var(--accent);border-radius:4px;background:var(--accent);font-family:var(--font-m);font-size:14px !important;color:#fff;cursor:pointer;transition:opacity .15s}
.suggest-btn:hover{opacity:.85}
.suggest-btn:disabled{opacity:.5;cursor:not-allowed}
.suggest-hint{font-size:13px !important;color:var(--muted);margin-top:.4rem;font-style:italic}
.footer-rights{font-family:var(--font-m);font-size:15px !important;color:#fff;letter-spacing:.05em;white-space:nowrap;flex-shrink:0}
@media(min-width:641px){.footer-rights{margin-left:auto}}

/* ── DESKTOP: tamaños responsivos con clamp(min, vw, max) ── */
@media(min-width:641px){
  html{font-size:16px !important}
  .logo{font-size:clamp(26px, 2vw, 38px) !important}
  #search{font-size:clamp(22px, 1.8vw, 32px) !important}
  .word-count-badge{font-size:clamp(15px, 1.1vw, 20px) !important}
  .btn-sm{font-size:clamp(16px, 1.2vw, 22px) !important}
  .btn-sm.primary{font-size:clamp(16px, 1.2vw, 22px) !important}
  .cat-chip{font-size:clamp(15px, 1.1vw, 20px) !important}
  .sidebar-label{font-size:clamp(16px, 1.2vw, 22px) !important}
  #history-list li{font-size:clamp(17px, 1.3vw, 24px) !important}
  .db-count{font-size:clamp(15px, 1.1vw, 20px) !important}
  .entry-word{font-size:clamp(2.8rem, 4vw, 5.5rem) !important}
  .entry-phonetic{font-size:clamp(16px, 1.2vw, 22px) !important}
  .tag{font-size:clamp(14px, 1vw, 18px) !important}
  .def-text{font-size:clamp(22px, 1.8vw, 32px) !important}
  .def-example{font-size:clamp(20px, 1.6vw, 30px) !important}
  .synonyms-label{font-size:clamp(16px, 1.2vw, 22px) !important}
  .syn-chip{font-size:clamp(20px, 1.6vw, 30px) !important}
  .not-found{font-size:clamp(17px, 1.3vw, 24px) !important}
  #suggestions li{font-size:clamp(22px, 1.8vw, 32px) !important}
  #suggestions li .sug-cat{font-size:clamp(15px, 1.1vw, 20px) !important}
  .aw-title{font-size:clamp(20px, 1.6vw, 30px) !important}
  .aw-count{font-size:clamp(15px, 1.1vw, 20px) !important}
  .aw-word{font-size:clamp(22px, 1.8vw, 32px) !important}
  .aw-cat{font-size:clamp(15px, 1.1vw, 20px) !important}
  .aw-page-btn{font-size:clamp(15px, 1.1vw, 20px) !important}
  .suggest-label{font-size:clamp(17px, 1.3vw, 24px) !important}
  .suggest-input{font-size:clamp(18px, 1.4vw, 26px) !important}
  .modal-title{font-size:clamp(24px, 1.9vw, 34px) !important}
  .form-row input,.form-row select,.form-row textarea{font-size:clamp(18px, 1.4vw, 26px) !important}
  .def-block input,.def-block textarea{font-size:clamp(17px, 1.3vw, 24px) !important}
  .kofi-msg{font-size:clamp(17px, 1.3vw, 24px) !important}
}