/* «Cómo se hace»: bandeja de pasos grabados y editor de pasos a pantalla completa (js/howimadethis.js). */
#himt-tray { position:fixed; left:12px; bottom:calc(var(--statusbar-h, 28px) + 12px); z-index:900; display:flex; align-items:center; gap:8px;
  padding:4px 14px 4px 4px; border:1px solid #444; border-radius:24px; background:#2d2d30; color:#fff; font:600 12px system-ui, sans-serif;
  cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.35); }
#himt-tray:hover { background:#3a3a3e; }
#himt-tray img { width:32px; height:32px; border-radius:50%; object-fit:cover; display:block; }

.ml-dialog.himt-dialog { width:100vw; height:100dvh; max-width:none; max-height:none; border-radius:0; border:0; }
.himt-body { flex:1; min-height:0; display:flex; flex-direction:column; gap:8px; padding:10px 12px; }
.himt-meta summary { cursor:pointer; font-size:12px; color:#555; }
.himt-meta label { margin-top:6px; }
.himt-meta textarea, .himt-caption { padding:6px 8px; border:1px solid #ccc; border-radius:3px; font:inherit; font-size:13px; background:#fff; color:#222; resize:vertical; box-sizing:border-box; width:100%; }
.himt-empty { margin:auto; max-width:420px; text-align:center; color:#666; font-size:13px; }
.himt-editor { flex:1; min-height:0; display:flex; flex-direction:column; gap:8px; }
.himt-view { position:relative; flex:1; min-height:0; display:flex; align-items:center; justify-content:center; background:#111; border-radius:4px; }
.himt-view img { max-width:100%; max-height:100%; object-fit:contain; display:block; }
.himt-nav { position:absolute; top:50%; transform:translateY(-50%); width:40px; height:56px; border:0; border-radius:4px; background:rgba(0,0,0,.45); color:#fff; font-size:30px; line-height:1; cursor:pointer; }
.himt-nav:disabled { opacity:.2; cursor:default; }
.himt-nav--prev { left:8px; }
.himt-nav--next { right:8px; }
.himt-tools { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.himt-num { font-size:12px; color:#555; }
.himt-tools .ml-btn:disabled { opacity:.45; cursor:default; }
.himt-del { color:#b00; }
.himt-caption { min-height:64px; }
.himt-dots { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
.himt-dot { width:9px; height:9px; padding:0; border:0; border-radius:50%; background:#c8c8c8; cursor:pointer; }
.himt-dot.is-on { background:#007acc; }
.himt-body .ml-dialog__error { margin:0; }
.himt-body .ml-dialog__error.himt-ok { background:#eef8f0; color:#1d6b33; }
.himt-body .ml-dialog__error a { color:#007acc; word-break:break-all; }

[data-theme="dark"] .himt-meta summary, [data-theme="dark"] .himt-num, [data-theme="dark"] .himt-empty { color:#aaa; }
[data-theme="dark"] .himt-meta textarea, [data-theme="dark"] .himt-caption { background:#2a2a2a; color:#e0e0e0; border-color:#444; }
[data-theme="dark"] .himt-dot { background:#555; }
[data-theme="dark"] .himt-body .ml-dialog__error.himt-ok { background:#173322; color:#8fd6a4; }