/* Notas: escala de Pro y una hoja de cuaderno propia, sin alterar la libreta. */
.np-canvas { padding:0 !important; overflow:auto; scrollbar-gutter:stable; container-type:inline-size; }
.np-page { --np-library-max:max(160px,calc(100dvh - var(--topbar-h,var(--pro-topbar-height,50px)) - var(--pro-page-start-space,32px) - 96px)); --np-control-ink:#52637b; width:100%; box-sizing:border-box; max-width:1440px; margin:0 auto; padding:28px 36px 44px; color:var(--ink); font:400 14px/1.5 Inter,sans-serif; }
.np-page *, .np-dialog * { box-sizing:border-box; }
.np-page button, .np-dialog button { appearance:none; -webkit-appearance:none; font:inherit; cursor:pointer; box-shadow:none; }
.np-page button:disabled, .np-dialog button:disabled { cursor:wait; opacity:.65; }
.np-page svg:not(.qv-close-button > svg), .np-dialog svg:not(.qv-close-button > svg) { width:16px; height:16px; flex:none; stroke-width:2; }
:is(.np-page,.np-dialog) :is(button,input,textarea):focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
.np-header, .np-between, .np-actions { display:flex; align-items:center; gap:12px; }
.np-header, .np-between { justify-content:space-between; }
.np-header { margin-bottom:24px; }
.np-header h1 { font-size:26px; font-weight:700; line-height:1.2; letter-spacing:-.03em; margin:0; }
:is(.np-page,.np-dialog) :is(.np-primary,.np-secondary) { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:36px; padding:7px 12px; border:1px solid var(--line); border-radius:var(--r-pill); font-size:13px; font-weight:500; line-height:20px; white-space:nowrap; }
.np-primary { background:var(--brand); border-color:var(--brand) !important; color:var(--card); }
.np-primary:hover { background:var(--brand); border-color:var(--brand) !important; }
.np-secondary { color:var(--np-control-ink,#52637b); background:var(--card); }
.np-secondary:hover { background:var(--bg); }
:is(.np-page,.np-dialog) .np-link { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:36px; padding:4px; border:0; border-radius:0; background:transparent; color:var(--np-control-ink,#52637b); font-size:12px; font-weight:400; line-height:1.5; }
.np-link:hover { color:var(--brand); }
.np-icon { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:36px; height:36px; padding:0; border:0; border-radius:8px; background:transparent; color:var(--np-control-ink,#52637b); }
.np-icon:hover { background:var(--bg); color:var(--brand); }
.np-icon.is-active { background:var(--brand-50); color:var(--brand); }
.np-notice:empty { display:none; }
.np-notice { margin:-8px 0 20px; padding:12px 16px; border:1px solid var(--line); background:var(--brand-50); border-radius:12px; font-size:12px; line-height:18px; }
.np-legacy { display:flex; gap:16px; align-items:center; flex-wrap:wrap; background:var(--card); border:1px solid var(--line); border-radius:var(--pro-card-radius); padding:16px 20px; margin-bottom:20px; font-size:12px; line-height:18px; }
.np-layout { display:grid; grid-template-columns:310px minmax(0,1fr); gap:24px; align-items:start; }
.np-library { display:flex; flex-direction:column; max-height:var(--np-library-max); background:var(--card); border:1px solid var(--line); border-radius:var(--pro-card-radius); overflow:hidden; position:sticky; top:20px; }
.np-search { flex-shrink:0; display:flex; gap:8px; align-items:center; margin:0 20px 24px; padding-inline:12px; min-height:36px; border:1px solid var(--line); border-radius:12px; background:var(--card); color:var(--mut); }
.np-search input { appearance:none; -webkit-appearance:none; min-width:0; width:100%; min-height:34px; padding:7px 0; border:0; background:transparent; font:400 13px/18px Inter,sans-serif; color:var(--ink); }
.np-search input::placeholder { color:var(--mut); opacity:1; }
.np-search:focus-within { outline:2px solid var(--brand); outline-offset:3px; }
.np-search input:focus-visible { outline:0; }
/* Segmentado y selección con el mismo tratamiento de Anualidades. */
.np-filters { flex-shrink:0; display:flex; width:fit-content; max-width:calc(100% - 40px); margin:20px auto 24px; padding:2px; gap:0; justify-content:center; border:1px solid transparent; border-radius:var(--r-pill); background:var(--qv-neutral-surface,#f3f4f6); }
.np-filters button { display:inline-flex; align-items:center; justify-content:center; min-height:30px; padding:4px 10px; border:0; border-radius:var(--r-pill); background:transparent; color:var(--np-control-ink); font-size:13px; font-weight:500; line-height:1.5; white-space:nowrap; }
.np-filters button:not([aria-pressed="true"]):hover { color:var(--ink); background:var(--qv-neutral-hover,#e5e7eb); }
.np-filters button[aria-pressed="true"] { color:var(--ink); background:var(--card); box-shadow:inset 0 0 0 1px var(--line); }
.np-list { flex:0 1 auto; min-height:0; overflow:auto; overscroll-behavior:contain; }
.np-list-group-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:16px 20px 4px; }
.np-list-heading { display:flex; align-items:center; gap:8px; margin:0; font-size:16px; font-weight:600; line-height:1.4; color:var(--ink); }
.np-page .np-list-heading svg { width:18px; height:18px; color:var(--mut); }
.np-list-group-head:first-child { padding-top:0; }
.np-list-group-head > .np-link { flex:none; }
.np-list-row { position:relative; border-bottom:1px solid var(--line); }
.np-list-row:last-child { border-bottom:0; }
.np-item { display:flex; flex-direction:column; gap:3px; min-height:76px; width:100%; padding:12px 20px; border:0; background:transparent; text-align:left; color:var(--ink); }
.np-list-row:not(.is-selecting) .np-item-title { padding-right:28px; }
.np-item-menu { position:absolute; top:6px; right:8px; opacity:0; pointer-events:none; }
.np-list-row:hover .np-item-menu, .np-list-row:focus-within .np-item-menu, .np-item-menu[aria-expanded="true"] { opacity:1; pointer-events:auto; }
.np-selection { flex-shrink:0; padding:0 20px 8px; text-align:right; }
.np-selection[hidden] { display:none; }
.np-selection-head, .np-selection-actions { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.np-selection-head > span { color:var(--mut); font-size:12px; line-height:18px; }
.np-selection-actions { flex-wrap:wrap; }
.np-page .np-selection-actions .np-link { font-size:13px; font-weight:500; }
.np-page .np-selection-actions [data-action="bulk-delete"] { color:var(--err); }
.np-list-row.is-selecting .np-item { padding-left:52px; }
.np-note-check { position:absolute; top:6px; left:8px; display:grid; place-items:center; width:36px; height:36px; cursor:pointer; }
.np-note-check input { position:absolute; inset:0; margin:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.np-note-check > span { display:grid; place-items:center; width:18px; height:18px; border:1px solid var(--line); border-radius:4px; background:var(--card); color:transparent; pointer-events:none; }
.np-note-check input:checked + span { background:var(--brand); border-color:var(--brand); color:var(--card); }
.np-note-check input:focus-visible + span { outline:2px solid var(--brand); outline-offset:3px; }
.np-note-check input:disabled { cursor:wait; }
.np-note-check:has(input:disabled) { opacity:.65; }
.np-page .np-note-check svg { width:14px; height:14px; }
@media (hover:none), (pointer:coarse) { .np-item-menu { opacity:1; pointer-events:auto; } }
@container (max-width:520px) { .np-item-menu { opacity:1; pointer-events:auto; } }
@media (pointer:coarse) { .np-note-check { width:44px; height:44px; } .np-list-row.is-selecting .np-item { padding-left:60px; } }
@container (max-width:520px) { .np-note-check { width:44px; height:44px; } .np-list-row.is-selecting .np-item { padding-left:60px; } }
.np-item:hover { background:var(--pro-row-hover); }
.np-item.is-selected { background:var(--brand-50); }
.np-item-title { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:14px; font-weight:600; line-height:20px; overflow-wrap:anywhere; }
.np-item-excerpt { display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; color:var(--mut); font-size:12px; font-weight:400; line-height:18px; overflow-wrap:anywhere; }
.np-item-meta { display:flex; align-items:center; gap:8px; color:var(--mut); font-size:12px; font-weight:400; line-height:18px; }
.np-item-meta > span:first-child { margin-right:auto; }
.np-item-date { color:var(--np-date-ink,#78869b); }
.np-unsaved { width:7px; height:7px; border-radius:50%; background:var(--warn,#b45309); flex:none; }
.np-page .np-more { min-height:36px; width:100%; padding:12px 20px; border:0; background:transparent; color:var(--brand); font-size:13px; font-weight:500; line-height:20px; }
.np-empty-small { padding:20px; font-size:14px; font-weight:400; line-height:1.5; color:var(--mut); }
/* Hoja rayada: superficies originales y líneas suaves sólo bajo los apuntes. */
.np-editor { --np-rule-ink:rgba(105,139,156,.12); --np-paper-margin:rgba(199,123,105,.20); background:var(--card); border:1px solid var(--line); border-radius:var(--pro-card-radius); overflow:hidden; min-width:0; min-height:360px; box-shadow:none; }
.np-page:not(.has-selection) .np-editor { background:transparent; border:0; border-radius:0; box-shadow:none; }
.np-editor-toolbar { display:flex; justify-content:space-between; gap:12px; align-items:center; border-bottom:1px solid var(--line); padding:8px 20px; }
.np-back { display:none; }
.np-paper { position:relative; padding:24px 24px 0 52px; }
.np-writing-area { --np-rule-step:24px; --np-rule-offset:0px; position:relative; margin-inline:-52px -24px; padding-inline:52px 24px; background-image:linear-gradient(to bottom,transparent calc(var(--np-rule-step) - 1px),var(--np-rule-ink) 0); background-size:100% var(--np-rule-step); background-position:0 var(--np-rule-offset); }
.np-writing-area::before { content:''; position:absolute; top:0; bottom:0; left:28px; width:1px; background:var(--np-paper-margin); pointer-events:none; }
/* El título de la nota es secundario al de página; el cuerpo conserva lectura 14/400. */
.np-page .np-title { display:block; border:0; background:transparent; width:100%; min-height:36px; font:600 18px/1.4 Inter,sans-serif; color:var(--ink); padding:0; resize:none; overflow:hidden; white-space:pre-wrap; }
.np-title::placeholder, .np-body::placeholder { color:var(--mut); opacity:1; }
.np-note-heading { display:flex; flex-wrap:wrap; align-items:flex-start; gap:12px 20px; margin-bottom:16px; }
.np-note-heading .np-title { flex:1 1 340px; min-width:0; }
.np-context { display:flex; align-items:center; gap:8px; min-height:36px; max-width:100%; margin:0; }
.np-page .np-context-link { display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:4px; border:0; background:transparent; color:var(--brand); font-size:12px; font-weight:400; line-height:18px; min-width:0; }
.np-context-link span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.np-context-link:hover span { text-decoration:none; }
.np-body { display:block; width:100%; min-height:calc(4 * var(--np-rule-step)); border:0; resize:none; font:400 14px/var(--np-rule-step) Inter,sans-serif; color:var(--ink); background:transparent; padding:0; }
.np-writing-tools { display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-top:0; padding:12px 0 8px; }
.np-dictate-icon { display:grid; place-items:center; width:100%; height:100%; flex:none; border-radius:50%; background:var(--brand); color:var(--card); }
.np-page .np-dictate-action .np-dictate-icon > svg { width:18px; height:18px; }
.np-link:hover .np-dictate-icon { background:var(--brand); }
.np-voice { display:block; margin:12px 0; }
.np-voice:empty { display:none; }
.np-tags { padding-top:8px; display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; }
.np-tags-label { display:flex; align-items:center; min-height:36px; color:var(--mut); font-size:12px; font-weight:500; line-height:18px; }
.np-tag-items { display:flex; flex:1; align-items:center; flex-wrap:wrap; gap:8px; min-width:0; max-width:100%; }
.np-tag-list { display:contents; }
.np-tag-pill { display:inline-flex; align-items:center; gap:4px; min-height:30px; max-width:100%; padding:2px 2px 2px 12px; border-radius:var(--r-pill); background:var(--bg); color:var(--np-control-ink); font-size:12px; font-weight:400; line-height:18px; }
.np-tag-name { min-width:0; overflow-wrap:anywhere; }
.np-tag-hash { margin-right:3px; color:var(--mut); }
.np-page .np-tag-add { justify-content:flex-start; border-radius:var(--r-pill); color:var(--mut); gap:4px; }
.np-page .np-tag-add svg { width:14px; height:14px; }
.np-page .np-tag-add:hover { color:var(--brand); }
.np-tag-entry { display:inline-flex; flex:0 1 268px; align-items:center; gap:4px; max-width:100%; margin:0; }
.np-tag-entry[hidden], .np-tag-add[hidden] { display:none; }
.np-tags input { flex:1; width:180px; min-width:0; min-height:36px; border:0; border-bottom:1px solid var(--line); border-radius:0; padding:7px 4px; color:var(--ink); font:400 13px/20px Inter,sans-serif; background:transparent; }
.np-tags input::placeholder { color:var(--mut); opacity:1; }
.np-page .np-tag-confirm { flex:none; width:32px; padding:0; border-radius:8px; }
.np-tag-status { flex-basis:100%; color:var(--mut); font-size:12px; line-height:18px; }
.np-tag-status:empty { display:none; }
/* Variante integrada del cierre canónico: dibujo fino, sin círculo permanente. */
.np-page .qv-close-button.np-tag-remove { --qv-close-bg:transparent; background-size:20px 20px; color:var(--mut); }
.np-page .qv-close-button.np-tag-remove > svg { width:12px; height:12px; stroke-width:1.6; }
.np-page .qv-close-button.np-tag-remove:focus-visible { --qv-close-bg:var(--qv-neutral-hover,#e5e7eb); }
@media (hover:hover) { .np-page .qv-close-button.np-tag-remove:hover { --qv-close-bg:var(--qv-neutral-hover,#e5e7eb); color:var(--np-control-ink); } }
.np-page .qv-close-button.np-tag-remove:active { --qv-close-bg:var(--qv-neutral-hover,#e5e7eb); }
.np-reminders { margin-top:24px; padding:16px 0; border-top:1px solid var(--line); }
.np-reminders h3 { display:flex; align-items:center; gap:8px; min-width:0; margin:0; font-size:16px; font-weight:600; line-height:1.4; }
.np-page .np-reminders h3 svg { width:18px; height:18px; color:var(--mut); }
.np-reminders > .np-between { margin-bottom:8px; gap:16px; }
.np-reminders > .np-between:has(+ #npReminders:empty) { margin-bottom:0; }
.np-muted { color:var(--mut); font-size:12px; font-weight:400; line-height:18px; }
.np-reminder { display:flex; align-items:center; gap:12px; min-height:64px; padding:8px 0; }
.np-reminder + .np-reminder { border-top:1px solid var(--line); }
.np-check { display:grid; place-items:center; position:relative; width:36px; height:36px; padding:0; border:0; background:transparent; flex:none; color:var(--brand); }
.np-check::before { content:''; position:absolute; width:19px; height:19px; border:1px solid var(--line); border-radius:6px; background:var(--card); }
.np-check[aria-pressed="true"]::before { background:var(--brand-50); border-color:var(--brand); }
.np-page .np-check svg { position:relative; width:14px; height:14px; }
.np-reminder-main { flex:1; min-width:0; min-height:36px; text-align:left; border:0; background:transparent; padding:0; display:grid; align-content:center; gap:3px; }
.np-reminder-main strong { font-size:14px; font-weight:600; line-height:20px; color:var(--ink); overflow-wrap:anywhere; }
.np-reminder-main span { font-size:12px; font-weight:400; line-height:18px; color:var(--mut); }
.np-reminder-main .np-overdue { color:var(--err); }
.np-reminder.is-done strong { text-decoration:line-through; color:var(--mut); }
.np-save { padding:12px 24px 12px 52px; border-top:1px solid var(--line); background:var(--bg); color:var(--mut); font-size:12px; font-weight:400; line-height:18px; display:flex; align-items:center; flex-wrap:wrap; gap:12px; min-height:44px; }
.np-page .np-save button { min-height:36px; padding:4px; border:0; background:transparent; color:var(--brand); font-size:12px; font-weight:400; line-height:18px; }
.np-save[data-state="error"] { background:#fff9ef; color:var(--warn,#b45309); }
.np-welcome { min-height:360px; padding:28px 20px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.np-page .np-welcome > svg { width:32px; height:32px; color:var(--mut); margin-bottom:16px; }
.np-welcome h2 { font-size:16px; font-weight:600; line-height:1.4; margin:0 0 8px; max-width:340px; }
.np-welcome p { max-width:340px; font-size:14px; font-weight:400; color:var(--mut); line-height:1.5; margin:0 0 20px; }
.np-summary { margin:20px 0; padding:16px; background:var(--bg); border:1px solid var(--line); border-radius:16px; color:var(--mut); }
.np-page .np-summary-toggle { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; min-height:36px; padding:0; border:0; background:transparent; color:var(--np-control-ink); font-size:13px; font-weight:600; line-height:1.5; text-align:left; }
.np-summary-toggle[aria-expanded="true"] svg { transform:rotate(180deg); }
.np-summary [hidden] { display:none; }
.np-summary p { white-space:pre-wrap; font-size:14px; font-weight:400; line-height:1.5; margin:12px 0; }
.np-summary small { color:var(--mut); font-size:12px; font-weight:400; line-height:18px; }
.np-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.np-backdrop { position:fixed; inset:0; z-index:700; background:rgba(255,255,255,.8); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); display:flex; align-items:center; justify-content:center; padding:24px; }
.np-dialog { width:min(560px,100%); max-height:85vh; overflow:auto; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:20px; color:var(--ink); font:400 14px/1.5 Inter,sans-serif; }
.np-dialog h2 { font-size:16px; font-weight:600; line-height:1.4; margin:0; }
.np-dialog-body { margin-top:16px; }
.np-dialog-body > p { color:var(--mut); }
.np-dialog-actions { display:flex; justify-content:flex-end; gap:12px; flex-wrap:wrap; margin-top:20px; }
.np-dialog-error { color:var(--err) !important; }
.np-dialog-error:empty { display:none; }
.np-field { display:grid; gap:8px; color:var(--mut); font-size:13px; font-weight:500; margin:16px 0; }
.np-field input, .np-field textarea, .np-search-input { appearance:none; -webkit-appearance:none; width:100%; min-height:36px; border:1px solid var(--line); border-radius:12px; padding:7px 12px; font:400 13px/20px Inter,sans-serif; color:var(--ink); background:var(--card); }
.np-field textarea { resize:vertical; }
.np-field .ac-date input { padding-right:36px; }
.np-form-row { display:grid; grid-template-columns:1.4fr 1fr; gap:16px; }
.np-date-quick { display:flex; gap:8px; flex-wrap:wrap; }
.np-quote-results { margin-top:12px; }
.np-quote-choice { display:grid; grid-template-columns:1fr auto; text-align:left; align-items:center; gap:3px 12px; width:100%; min-height:76px; padding:12px 0; border:0; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); }
.np-quote-choice strong { font-size:14px; font-weight:600; line-height:20px; }
.np-quote-choice span { font-size:12px; font-weight:400; line-height:18px; color:var(--mut); }
.np-quote-choice svg { grid-column:2; grid-row:1/3; color:var(--mut); }
.np-quote-choice:hover { color:var(--brand); }
.np-dialog pre { white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; background:var(--bg); padding:16px; border-radius:12px; }
/* El menú canónico vive en body; su consumidor Notas aporta la misma densidad. */
body:has(.np-page) .ac-popup { font:500 13px/20px Inter,sans-serif; }
body:has(.np-page) .ac-popup :is([role="option"],[role="menuitem"]) { min-height:36px; padding:7px 12px; }
@media (max-width:520px), (pointer:coarse) { body:has(.np-page) .ac-popup :is([role="option"],[role="menuitem"]) { min-height:44px; } }
.app:has(> .np-canvas):not(.has-insights) > .insights { border:0; }
/* La libreta reserva 32 px abajo; el editor conserva su cierre de 64 px. */
@container (min-width:761px) {
 #asApp[data-pro-page="notas"] .np-page:has(> .np-layout) { padding-bottom:0; }
 .np-layout { padding-bottom:32px; }
 .np-layout > .np-editor { margin-bottom:32px; }
 .np-editor:has(> .np-welcome) { min-height:0; }
 .np-welcome { min-height:min(360px,max(0px,calc(var(--np-library-max) - 34px))); }
}
@container (max-width:1000px) { .np-page { padding:24px; } .np-layout { grid-template-columns:270px minmax(0,1fr); gap:18px; } }
@container (max-width:760px) { .np-page { padding:22px 18px; } .np-layout { grid-template-columns:1fr; } .np-library { position:static; max-height:none; } .np-list { overflow:visible; overscroll-behavior:auto; } .np-page.has-selection .np-library { display:none; } .np-page:not(.has-selection) .np-editor { display:none; } .np-back { display:flex; } .np-editor { min-height:360px; } .np-editor-toolbar { flex-wrap:wrap; } .np-editor-toolbar > .np-actions { gap:8px; } .np-note-heading .np-title { flex-basis:100%; } }
@container (max-width:520px) {
 .np-header { flex-wrap:wrap; gap:16px; } .np-header h1 { font-size:24px; } .np-header > .np-actions { margin-left:auto; flex-wrap:wrap; justify-content:flex-end; }
 .np-page { padding:18px 12px; } .np-paper { padding:20px 16px 0 36px; } .np-writing-area { --np-rule-step:28px; --np-rule-offset:-2px; margin-inline:-36px -16px; padding-inline:36px 16px; } .np-writing-area::before { left:16px; } .np-save { padding-inline:36px 16px; } .np-writing-tools { gap:12px; }
 .np-reminders > .np-between { flex-wrap:wrap; gap:8px; }
 .np-tags { gap:4px 8px; } .np-tags-label { flex-basis:100%; min-height:24px; } .np-tag-pill { padding-block:0; min-height:44px; } .np-page .np-tag-confirm { width:44px; }
 .np-filters { flex-wrap:wrap; }
 .np-search { min-height:44px; } .np-search input { min-height:42px; }
 .np-page button:not(.qv-close-button), .np-dialog button:not(.qv-close-button) { min-height:44px; }
 :is(.np-page,.np-dialog) .np-icon, .np-check { width:44px; height:44px; }
 :is(.np-page,.np-dialog) :is(input,textarea) { font-size:16px; }
 .np-tags input, .np-field input, .np-search-input { min-height:44px; }
}
@media (pointer:coarse) {
 .np-tag-pill { padding-block:0; min-height:44px; } .np-page .np-tag-confirm { width:44px; }
 .np-writing-area { --np-rule-step:28px; --np-rule-offset:-2px; }
 .np-page button:not(.qv-close-button), .np-dialog button:not(.qv-close-button) { min-height:44px; }
 :is(.np-page,.np-dialog) .np-icon, .np-check { width:44px; height:44px; }
 :is(.np-page,.np-dialog) :is(input,textarea) { font-size:16px; }
 .np-tags input, .np-search, .np-field input, .np-search-input { min-height:44px; } .np-search input { min-height:42px; }
}
@media (max-width:520px) {
 .np-dialog :is(input,textarea) { font-size:16px; } .np-dialog :is(button,input):not(.qv-close-button) { min-height:44px; }
}
/* El cierre conserva el componente canónico del recomendador. */

/* Herramientas juntas; confirmación de aplicación separada del guardado. */
.np-writing-row { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px 16px; padding:12px 0 8px; }
.np-writing-row .np-writing-tools { margin-left:auto; padding:0; gap:8px; flex-wrap:nowrap; }
.np-page .np-ai-action { margin-left:0;padding:4px;gap:6px;border:0;border-radius:0;background:transparent;color:var(--brand);font-size:13px;font-weight:500;line-height:20px;text-decoration:none; }
.np-page .np-ai-action:not(:disabled):hover { background:transparent;color:var(--brand);text-decoration:none; }
.np-page .np-ai-action:disabled { cursor:default; opacity:.5; }
.np-page .np-dictate-action { display:flex; align-items:center; justify-content:center; flex:none; width:36px; height:36px; min-height:36px; padding:0; border:0; border-radius:50%; background:transparent; color:var(--card); }
.np-page .np-dictate-action:hover { background:transparent; color:var(--card); }
/* La escucha real cambia a detener; el permiso pendiente conserva el micrófono azul. */
.np-page .np-dictate-action:is([data-dictation="listening"],[data-dictation="stopping"]) .np-dictate-icon { background:var(--err,#dc2626); box-shadow:0 0 0 4px rgb(220 38 38 / .14); }
.np-page .np-dictate-action .np-dictate-icon[data-symbol="stop"] > svg { width:14px; height:14px; fill:currentColor; stroke-width:0; }
@media (prefers-reduced-motion:no-preference) {
  .np-dictate-action[data-dictation="listening"] .np-dictate-icon { animation:np-dictation-pulse 1.8s ease-in-out infinite; }
}
@keyframes np-dictation-pulse { 0%,100% { box-shadow:0 0 0 4px rgb(220 38 38 / .14); } 50% { box-shadow:0 0 0 7px rgb(220 38 38 / .04); } }
@container (max-width:520px) { .np-page .np-dictate-action { width:44px; height:44px; } .np-page .np-dictate-action .np-dictate-icon > svg { width:20px; height:20px; } }
@media (pointer:coarse) { .np-page .np-dictate-action { width:44px; height:44px; min-height:44px; } .np-page .np-dictate-action .np-dictate-icon > svg { width:20px; height:20px; } }
.np-ai-applied { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-right:auto; color:var(--mut); font-size:12px; line-height:18px; }
.np-ai-applied > svg { color:var(--brand); }
.np-page .np-ai-undo { min-height:32px; padding:4px; font-size:12px; color:var(--brand); gap:4px; }
.np-writing-row [hidden], .np-ai-dialog [hidden] { display:none !important; }
/* El ancho de comparación es una excepción funcional del diálogo de Notas. */
.np-ai-dialog { width:min(880px,100%); max-height:calc(100dvh - 48px); }
.np-ai-dialog > .np-between h2 { display:flex; align-items:center; gap:8px; }
.np-ai-dialog > .np-between .lucide-zap { color:var(--brand); }
.np-ai-stage { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin-bottom:8px; font-size:13px; line-height:20px; color:var(--mut); }
.np-ai-badge { display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:4px 10px; border-radius:var(--r-pill); background:var(--brand-50); color:var(--brand); font-weight:600; font-size:12px; }
.np-ai-stage[data-state="same"] .np-ai-badge { background:var(--bg); color:var(--mut); }
.np-ai-comparison { display:grid; grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr); align-items:stretch; gap:12px; }
.np-ai-card { border:1px solid var(--line); border-radius:12px; padding:16px; min-width:0; }
.np-ai-original { background:var(--bg); }
.np-ai-proposal { border-color:rgb(13 153 255 / .24); background:var(--card); }
.np-ai-card h3 { display:flex; align-items:center; gap:6px; margin:0 0 16px; color:var(--mut); font-size:12px; line-height:18px; font-weight:500; }
.np-ai-proposal h3 { color:var(--brand); }
.np-ai-arrow { display:grid; place-items:center; color:var(--mut); align-self:center; }
.np-ai-original-title { min-height:36px; margin:0 0 12px; color:var(--ink); font-size:16px; line-height:1.4; font-weight:600; white-space:pre-wrap; overflow-wrap:anywhere; }
.np-ai-original-body { margin:0; max-height:320px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--ink); font-size:14px; line-height:1.6; }
.np-ai-dialog .np-ai-edit { display:block; width:100%; min-height:36px; max-height:320px; border:0; border-radius:4px; padding:0; background:transparent; color:var(--ink); font:400 14px/1.6 Inter,sans-serif; resize:none; overflow:auto; }
.np-ai-dialog #npAiTitle { min-height:36px; font-size:16px; font-weight:600; line-height:1.4; margin-bottom:12px; }
.np-ai-dialog #npAiBody { min-height:96px; }
.np-ai-edit-hint { display:flex; align-items:center; gap:6px; margin:12px 0 0; color:var(--mut); font-size:12px; line-height:18px; }
.np-ai-dialog .np-ai-edit-hint > svg { width:14px; height:14px; }
.np-ai-dialog .np-dialog-actions { justify-content:center; position:sticky; bottom:-20px; margin:20px -20px -20px; padding:16px 20px 20px; background:var(--card); z-index:1; box-shadow:0 -12px 12px -12px rgb(255 255 255 / .95); }
.np-ai-dialog .np-dialog-error { margin:16px 0 0; font-size:13px; line-height:20px; }
@media (max-width:640px) {
 .np-ai-dialog { padding:16px; max-height:calc(100dvh - 32px); }
 .np-backdrop:has(.np-ai-dialog) { padding:16px; }
 .np-ai-comparison { grid-template-columns:minmax(0,1fr); gap:8px; }
 .np-ai-arrow { height:20px; transform:rotate(90deg); }
 .np-ai-card { padding:12px; }
 .np-ai-card h3 { margin-bottom:12px; }
 .np-ai-dialog .np-dialog-actions { bottom:-16px; margin:16px -16px -16px; padding:12px 16px 16px; gap:8px; }
 .np-ai-dialog .np-ai-edit, .np-ai-original-body { font-size:16px; }
 .np-ai-dialog #npAiTitle { font-size:16px; }
 .np-ai-applied { flex-basis:100%; }
}
@media (pointer:coarse) { .np-ai-dialog .np-ai-edit { font-size:16px; } }