/* wygge Admin Cockpit — the note tile with CSS and pictures (FND-1088 PR 6: dashboard_tile_note.jsx, dashboard_tile_css.jsx).
   Peter 14.10. („Klarstellung 3“): „HTML-Kacheln können reines HTML und CSS darstellen. Kein JavaScript. … Bilder hochladen.“
   The note's own CSS is scoped by the parser to `.dash-nt[data-note-id] .dash-nt-html …` and never carries !important. These rules are
   the second line of defence, independent of the parser:
   - the content box clips everything it holds AND is the containing block even for a `position: fixed` that the parser never lets
     through (contain: paint) — nothing of a note can paint or be placed outside its tile;
   - the note's root isolates its z-index values (isolation: isolate) — the tile's own ⋯ button and resize handle (z-index 2) stay on top;
   - a picture fits the tile by default; loading and error states are visible boxes in the tile ink, never an empty gap;
   - prefers-reduced-motion stops every animation and transition of a note (the note's CSS cannot override it). */
.dash-nt-content { contain: paint; }
.dash-nt-html { position: relative; isolation: isolate; min-width: 0; }
.dash-nt-html img { max-width: 100%; height: auto; vertical-align: middle; }
.dash-nt-img {
  display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 32px; max-width: 100%; box-sizing: border-box;
  vertical-align: middle; border-radius: 6px; box-shadow: inset 0 0 0 1px var(--tile-ring); color: var(--tile-muted);
}
.dash-nt-img.is-loading { animation: dash-nt-img-wait 1.2s ease-in-out infinite; }
@keyframes dash-nt-img-wait { 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) {
  .dash-nt-html, .dash-nt-html * { animation: none !important; transition: none !important; }
  .dash-nt-img.is-loading { animation: none; }
}

/* The editor: „Bild einfügen“ under the HTML field (kit Btn / Input / WyHint, the PR 1 option grid). */
.dash-nt-inputwrap { display: block; }
.dash-nt-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.dash-nt-imgpanel {
  display: flex; flex-direction: column; gap: 8px; margin-top: 8px; padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--ad-border); background: var(--ad-surface-inset);
}
.dash-nt-imgown-head { font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ad-text-muted); }