.op-summary-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 768px) { .op-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.op-panel { background: var(--bg-surface); border: 1px solid var(--border-color); color: var(--text-main); border-radius: 8px; padding: 1rem; }
dialog.op-panel, .op-panel[role="dialog"] { width: min(92vw, 36rem); max-height: 82dvh; margin: auto; }
.op-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.op-actions { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.op-actions button, .op-copy-edit { min-height: 44px; min-width: 44px; border: 1px solid var(--alma-violet); color: var(--alma-violet); background: var(--bg-surface); border-radius: 6px; cursor: pointer; }
.op-status { font-size: 0.875rem; color: var(--text-muted); }
.op-ready { color: #17634d; font-weight: 600; }
.op-pending { color: #855400; }
.op-intake { background: var(--bg-subtle); border-radius: 8px; padding: 0.75rem; }
.op-intake-media { display: flex; gap: 0.5rem; overflow-x: auto; }
.op-directory { display: grid; gap: 0.75rem; }
.op-agent { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem; }
.op-avatar { width: 44px; height: 44px; object-fit: contain; background: transparent; }

[data-theme="dark"] .op-ready { color: #88ddbc; }
[data-theme="dark"] .op-pending { color: #f3cb7d; }
.op-summary { margin-block: 16px 22px; }
.op-summary h2, .op-directory h2 { margin: 0 0 12px; font-size: 1.2rem; }
.op-panel h3 { margin: 0 0 8px; font-size: 1rem; }
.op-panel > .btn-secondary { margin-top: 10px; }
.op-count { margin: 0; font-size: 2rem; line-height: 1.15; font-weight: 750; }
.op-status { margin: 0.25rem 0; }
.op-event { width: 100%; flex-wrap: wrap; text-align: start; min-height: 44px; border: 0; border-bottom: 1px solid var(--border-color); background: transparent; color: inherit; padding: 6px 0; cursor: pointer; }
.op-event > :first-child { flex: 1 0 100%; font-weight: 650; overflow-wrap: anywhere; }
.op-copy > .copy-box, .review-details-fold .copy-box { white-space: pre-wrap; overflow-wrap: anywhere; }
.op-copy-edit { display: block; width: 100%; padding: 10px; color: var(--text-main); border-color: var(--border-color); font: inherit; resize: vertical; }
.op-copy-editor .op-actions, .op-copy + .op-actions, .cal-copy-box .op-actions { margin-top: 6px; }
.op-intake { margin-block: 10px; }
.op-intake-media figure { flex: 0 0 100px; margin: 4px 0; }
.op-intake-media img { width: 100px; height: 82px; object-fit: contain; border-radius: 6px; }
.op-agenda-art { min-width: 0; }
.op-agenda-art .cal-gallery-thumb-btn { width: 100%; }
.op-agenda-art .op-actions button { width: 100%; font-size: 0.75rem; padding-inline: 4px; }
.op-directory { inset: 0; color: var(--text-main); overflow: auto; }
.op-directory:not([open]) { display: none; }
.op-directory::backdrop { background: #18102a88; }
.op-directory input { background: var(--bg-subtle); color: var(--text-main); border: 1px solid var(--border-color); border-radius: 8px; font: inherit; padding: 10px; min-height: 44px; width: 100%; }
.op-directory-list .op-row, .op-agent { border-top: 1px solid var(--border-color); padding-block: 9px; }
.op-agent-details { min-width: 0; overflow-wrap: anywhere; }
.op-agent-details a { color: var(--alma-violet); }
.viewer-footer { flex-wrap: wrap; }

.op-directory input::placeholder { color: var(--text-muted); opacity: 1; }

/* Ampliación de retrato y nombre de Alma sin solapar saludo */
.alma-presence {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  flex-shrink: 0;
}
.alma-portrait-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}
.alma-portrait {
  width: 72px;
  height: 72px;
}
.alma-portrait .alma-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.alma-name {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.2;
}
.editorial-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .alma-portrait {
    width: 96px;
    height: 90px;
  }
  .alma-name {
    font-size: 1.35rem;
  }
  .editorial-header {
    gap: 2rem;
  }
}

.op-heading { display:flex; align-items:center; gap:.55rem; }
.op-heading-icon { width:1.9rem; height:1.9rem; flex:0 0 auto; display:grid; place-items:center; border-radius:.55rem; color:#865006; background:#fff0d5; }
.op-heading-icon svg { width:1.2rem; height:1.2rem; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.op-icon-review { color:#165747; background:#dcf5eb; }
.op-icon-birthday { color:#6a358f; background:#f1e5ff; }
.op-icon-networks { color:#145577; background:#e2f3ff; }
[data-theme="dark"] .op-heading-icon { color:#f6ca7a; background:#51381c; }
[data-theme="dark"] .op-icon-review { color:#a4ebd1; background:#174535; }
[data-theme="dark"] .op-icon-birthday { color:#e4c1ff; background:#43295a; }
[data-theme="dark"] .op-icon-networks { color:#b4def9; background:#223c52; }
.op-account[open] { animation:op-account-in 120ms ease-out; }
@keyframes op-account-in { from { opacity:.7; transform:translateY(3px); } }
@media (prefers-reduced-motion:reduce) { .op-account[open] { animation:none; } }

.theme-toggle[data-nav="directory"] {
  min-inline-size: 44px;
  min-block-size: 44px;
  flex-shrink: 0;
}
#view-home {
  padding-block-start: 28px;
}
#view-home .editorial-header {
  align-items: center;
  flex-wrap: nowrap;
  overflow: visible;
}
#view-home .alma-presence {
  gap: 2px;
}
#view-home .alma-caption {
  padding-block-start: 0;
}
#view-home .alma-portrait-wrap {
  width: clamp(104px, 34vw, 140px);
  height: 90px;
}
#view-home .alma-portrait {
  position: absolute;
  bottom: -12px;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
}
#view-home .alma-img {
  width: 100%;
  height: auto;
}
#view-home .alma-name { font-size: 1.375rem; }
#view-home .alma-role { font-size: 0.875rem; }
@media (max-width: 768px) {
  #view-home {
    padding-block-start: 24px;
  }
  #view-home .editorial-header {
    padding-inline: 14px;
    gap: 8px;
  }
}
@media (min-width: 769px) {
  #view-home .alma-portrait-wrap {
    width: 176px;
    height: 116px;
  }
  #view-home .alma-name { font-size: 1.625rem; }
  #view-home .alma-role { font-size: 1rem; }
}

.cal-filters-bar { display: grid; gap: 8px; }
.cal-filter-chips-row { display: grid; gap: 8px; }
.cal-chip-group { display: flex; flex-wrap: wrap; gap: 6px; }
.cal-chip-group .btn-chip {
  min-height: 44px;
  padding-inline: 10px;
  font-size: 0.85rem;
  color: var(--text-main);
  background: var(--bg-surface);
  border: 1px solid var(--border-color);
}
.cal-chip-group .btn-chip[aria-pressed="true"] {
  color: var(--text-main);
  background: var(--bg-subtle);
  border-color: var(--alma-violet);
  font-weight: 700;
}
.cal-agent-search {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 8px 12px;
  background: var(--bg-surface);
  color: var(--text-main);
  font: inherit;
}
.cal-gallery-placeholder { min-height: 4rem; padding: 8px; }
.cal-schedule-edit { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; }
.cal-schedule-edit label { display: grid; gap: 4px; }
.cal-schedule-edit input { min-height: 44px; }
.notice-it > button { margin-block-start: 8px; }
@media (max-width: 480px) {
  .topbar-status[data-state="conectado"] { display: none; }
  .cal-dialog-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .cal-dialog-actions > .cal-btn-verify { grid-column: 1 / -1; }
  .cal-dialog-actions > button {
    min-width: 0;
    min-height: 44px;
    white-space: nowrap;
    padding-inline: 8px;
  }
}

/* Notificaciones y consumo */
.alma-usage-toggle { color: #067a80; }
[data-theme="dark"] .alma-usage-toggle { color: #7de4df; }
dialog:has(> .alma-dialog-close) { padding-block-start: max(3.4rem, 18px); }
.alma-dialog-close {
  position: absolute; inset-block-start: 8px; inset-inline-end: 8px;
  display: grid; place-items: center; width: 44px; height: 44px;
  border-radius: 12px; border: 1px solid currentColor;
  color: #a12548; background: #fff1f5; font-size: 1.45rem; line-height: 1;
}
[data-theme="dark"] .alma-dialog-close { color: #ffadc5; background: #391d32; }
.alma-notice-card { position: relative; text-align: start; padding: 14px 48px 14px 14px; overflow-wrap: anywhere; }
.alma-notice-card h3 { margin: 0 0 4px; font-size: 1rem; }
.alma-notice-card p { margin: 5px 0; }
.alma-notice-card > button[aria-label] { position: absolute; inset: 5px 5px auto auto; min-width: 44px; min-height: 44px; }
.alma-usage-list { display: grid; gap: .5rem; overflow-wrap: anywhere; }
.alma-usage-list :is(td,dd,span) { font-variant-numeric: tabular-nums; }
#view-avisos > h2 { margin-block: 0 .75rem; }
@media (max-width: 400px) {
  .topbar .theme-toggle { width: 44px; min-width: 44px; }
  .bottom-item[data-view="avisos"] > span:not(.nav-badge) { font-size: .68rem; }
}
.cal-verify-result[hidden] { display: none; }
#view-avisos .alma-notice-list { display: grid; gap: .75rem; padding: 0; text-align: start; align-content: start; }
#view-avisos .alma-notice-list > button { justify-self: start; }
.alma-notice-card.unread { font-weight: 400; }
#btn-directory-mobile ~ .alma-usage-toggle { color: #067a80; }
[data-theme="dark"] #btn-directory-mobile ~ .alma-usage-toggle { color: #7de4df; }
