/* Bildkapitel: original, locally served functional icons and B chapter mark. */
@media screen {
  svg.ui-icon { display:inline-block; width:20px; height:20px; flex:none; fill:currentColor; stroke:none; vertical-align:middle; pointer-events:none; }
  .brand svg.ui-icon, .footer-brand svg.ui-icon { width:28px; height:28px; }
  .photo-viewer .save-button, .photo-viewer .icon-button, .photo-viewer-nav button,
  #shared-pdf, #payment-next, #edit-timeline, #photo-undo-action, #draft-backup-open,
  #bulk-photo-open, #quick-preview, #quick-edit, #continue {
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
  }
  .photo-viewer [data-photo-close], .um-consent-close { display:inline-grid; place-items:center; }
  .photo-viewer [data-photo-close] { min-width:44px; min-height:44px; }
  .photo-viewer [data-photo-close] .ui-icon { width:20px; height:20px; }
  .legal-shell header a .ui-icon, .legal-actions a .ui-icon { width:16px; height:16px; margin-left:4px; }
  .package-includes li::before { content:""; position:absolute; left:0; top:12px; width:18px; height:18px; background:currentColor; mask:url("/assets/brand/icons/check.svg") center/contain no-repeat; }
  .editor-page .photo-selected-mark .ui-icon, .bulk-photo-check .ui-icon { width:14px; height:14px; }
  .bulk-photo-check { display:grid; place-items:center; }
  .editor-page .photo-context .photo-edit-actions .ui-icon { width:18px; height:18px; }
  .editor-page .photo-context .photo-controls button { display:inline-flex; align-items:center; justify-content:center; }
  .editor-page .local-badge .ui-icon { width:16px; height:16px; }
  .editor-page .moment-list-arrow .ui-icon { width:18px; height:18px; }
  .editor-page .intro[open] .details-chevron { transform:none; }
  .editor-page .bulk-initial-symbol .ui-icon, .editor-page .workspace-empty .ui-icon { width:28px; height:28px; }
  .landing-page .example-arrow { display:inline-flex; align-items:center; justify-content:center; }
  /* These buttons replace their labels at runtime; masks preserve the icon. */
  body:not(.package-locked) [data-pdf], #package-download, #payment-next { display:inline-flex; align-items:center; justify-content:center; gap:8px; }
  body:not(.package-locked) [data-pdf]::before, #package-download::before, #payment-next::after { content:""; display:inline-block; width:20px; height:20px; flex:none; background:currentColor; mask:url("/assets/brand/icons/download-simple.svg") center/contain no-repeat; }
  #payment-next::after { mask-image:url("/assets/brand/icons/arrow-right.svg"); }
  #payment-next>.ui-icon { display:none; }
  @media(max-width:760px) {
    .editor-page .memory .icon-button[data-remove] { min-width:44px; }
    .editor-page .memory .icon-button[data-remove] .action-label { display:none; }
    .editor-page .photo-context .photo-edit-actions button, .editor-page .photo-context .photo-thumb { gap:5px; white-space:normal; line-height:1.25; }
    .editor-page .photo-context .photo-edit-actions .ui-icon { width:17px; height:17px; }
    .editor-page .photo-context .photo-edit-actions span { min-width:0; }
    .editor-page .savebar .ui-icon { width:18px; height:18px; }
  }
}
