/* Prompt Library workspace, picker and editor. */
    .custom-prompt-panel { display: flex; flex-direction: column; gap: 10px; }
    .custom-prompt-hint { margin: 0 0 2px; font-size: 12px; color: var(--muted); line-height: 1.5; }
    .custom-prompt-label { font-size: 10px; font-weight: 700; letter-spacing: 0.06em; color: #5b6b63; text-transform: uppercase; }
    .custom-prompt-input { width: 100%; box-sizing: border-box; padding: 7px 10px; font-size: 12px; line-height: 1.45; font-family: inherit; color: var(--text); background: #ffffff; border: 1px solid var(--line-dark); border-radius: 8px; }
    .custom-prompt-input:focus { outline: none; border-color: var(--accent); }
    .custom-prompt-input::placeholder { color: #93a49b; }
    .custom-prompt-textarea { resize: vertical; min-height: 110px; line-height: 1.5; }
    .custom-prompt-counter { margin: 0; font-size: 10px; color: var(--muted); }
    .custom-prompt-counter.is-error { color: #c0392b; font-weight: 700; }
    .custom-prompt-image-row { display: grid; grid-template-columns: 104px 1fr; align-items: center; gap: 10px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fbfdfb; }
    .custom-prompt-image-label { font-size: 10px; letter-spacing: 0.05em; color: var(--muted); text-transform: uppercase; }
    .custom-prompt-image-content { display: flex; align-items: center; gap: 12px; min-width: 0; }
    .custom-prompt-image-thumb { display: block; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border-radius: 8px; border: 1px solid var(--line); background: var(--soft) center/contain no-repeat; cursor: zoom-in; }
    .custom-prompt-image-thumb[hidden] { display: none; }
    .custom-prompt-image-thumb:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .custom-prompt-image-controls { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; }
    .custom-prompt-image-state { font-size: 11px; color: var(--text); flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .custom-prompt-image-actions { display: flex; flex: 0 0 auto; gap: 6px; }
    .custom-prompt-result-preview { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
    .custom-prompt-result-preview[hidden] { display: none; }
    .custom-prompt-result-thumb { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 8px; border: 1px solid var(--line); background: var(--soft) center/cover no-repeat; }
    .custom-prompt-result-caption { font-size: 10px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); }
    .custom-prompt-mini { font-size: 11px; font-weight: 600; padding: 6px 10px; border-radius: 8px; border: 1px solid var(--line-dark); background: var(--panel-strong); color: var(--text); cursor: pointer; }
    .custom-prompt-mini:hover { background: var(--soft); }
    .custom-prompt-mini.is-danger { border-color: #c0392b; color: #c0392b; }
    .custom-prompt-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 0; }
    .custom-prompt-actions #custom-prompt-delete { margin-left: auto; }
    .custom-prompt-save { font-size: 12px; font-weight: 700; padding: 8px 16px; border-radius: 8px; border: 1px solid var(--accent-dark); background: var(--accent); color: #ffffff; cursor: pointer; }
    .custom-prompt-save:hover { background: var(--accent-dark); }
    .custom-prompt-improve { font-size: 12px; font-weight: 600; padding: 8px 14px; border-radius: 8px; border: 1px solid var(--line-dark); background: var(--panel-strong); color: var(--text); cursor: pointer; }
    .custom-prompt-improve:hover { background: var(--soft); }
    .custom-prompt-improve:disabled { opacity: 0.55; cursor: default; }
    .custom-prompt-improve:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
    .custom-prompt-message { margin: 0; font-size: 11px; color: var(--muted); min-height: 0; }
    .custom-prompt-message.is-error { color: #c0392b; }
    .custom-prompt-message.is-ok { color: var(--accent-dark); }
    /* Modal shells follow the house .gallery-modal language (light surface,
       dimmed backdrop) so the library and the editor never look like a
       different product. */
    .custom-prompt-picker,
    .custom-prompt-modal { position: fixed; inset: 0; z-index: 999; display: grid; place-items: center; padding: 20px; }
    .custom-prompt-modal { z-index: 1000; }
    .custom-prompt-image-preview { position: fixed; inset: 0; z-index: 1100; display: grid; place-items: center; padding: 20px; }
    .custom-prompt-image-preview[hidden] { display: none; }
    .custom-prompt-image-preview-backdrop { position: absolute; inset: 0; background: rgba(10, 16, 13, 0.82); backdrop-filter: blur(3px); }
    .custom-prompt-image-preview-dialog { position: relative; display: flex; flex-direction: column; gap: 10px; width: min(1000px, calc(100vw - 40px)); max-height: calc(100vh - 40px); padding: 12px; border: 1px solid var(--line-dark); border-radius: 12px; background: var(--panel-strong); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.32); }
    .custom-prompt-image-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
    .custom-prompt-image-preview-title { font-size: 13px; font-weight: 700; color: var(--text); }
    .custom-prompt-image-preview-image { display: block; width: 100%; max-height: calc(100vh - 110px); object-fit: contain; border-radius: 6px; background: var(--soft); }
    .custom-prompt-picker[hidden],
    .custom-prompt-modal[hidden] { display: none; }
    .custom-prompt-backdrop { position: absolute; inset: 0; background: rgba(16, 24, 20, 0.68); backdrop-filter: blur(2px); }
    .custom-prompt-picker-panel,
    .custom-prompt-modal-panel { position: relative; display: flex; flex-direction: column; width: min(760px, calc(100vw - 40px)); max-height: min(88vh, 860px); border: 1px solid var(--line-dark); border-radius: 14px; background: var(--panel-strong); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28); overflow: hidden; }
    .custom-prompt-picker-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: #f4f8f6; }
    .custom-prompt-head-text { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
    .custom-prompt-instruction { margin: 0; padding: 5px 10px; font-size: 12px; font-weight: 600; line-height: 1.45; color: #b26a00; background: #fdf4e3; border-left: 3px solid #e0a33a; border-radius: 6px; }
    .custom-prompt-instruction[hidden] { display: none; }
    .custom-prompt-locked { margin: 0; padding: 5px 10px; font-size: 12px; font-weight: 600; line-height: 1.45; color: #8a3b12; background: #fdeee4; border-left: 3px solid #d97706; border-radius: 6px; }
    .custom-prompt-locked[hidden] { display: none; }
    .custom-prompt-share-row { display: flex; flex-wrap: wrap; gap: 6px; }
    .custom-prompt-share-link { font-size: 11px; font-weight: 600; padding: 6px 10px; border-radius: 8px; border: 1px solid var(--line-dark); background: var(--panel-strong); color: var(--text); text-decoration: none; }
    .custom-prompt-share-link:hover { background: var(--soft); }
    .custom-prompt-embed { display: block; padding: 8px 10px; background: var(--soft); border: 1px solid var(--line); border-radius: 8px; font-size: 10.5px; font-family: Consolas, monospace; color: var(--text); overflow-x: auto; white-space: pre; }
    .custom-prompt-row-lock { font-size: 9px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #8a3b12; background: #fdeee4; border: 1px solid #e0a33a; border-radius: 5px; padding: 1px 5px; margin-left: 6px; }
    .custom-prompt-row-uses { font-size: 9px; font-weight: 700; letter-spacing: 0.04em; color: var(--muted); background: var(--soft); border: 1px solid var(--line); border-radius: 5px; padding: 1px 5px; margin-left: 6px; }
    .custom-prompt-row-meta { display: block; font-size: 10.5px; color: var(--muted); margin-top: 2px; }
    .custom-prompt-picker-head strong { font-size: 16px; font-weight: 700; color: var(--text); }
    .custom-prompt-picker-head span { display: flex; gap: 6px; }
    .custom-prompt-editor-body { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; overflow-y: auto; background: var(--panel-strong); }
    .custom-prompt-editor-foot { display: flex; flex-direction: column; gap: 4px; padding: 10px 16px 12px; border-top: 1px solid var(--line); background: #f4f8f6; }
    .custom-prompt-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
    .custom-prompt-labelrow { display: flex; align-items: center; gap: 8px; min-width: 0; }
    .custom-prompt-labelrow .custom-prompt-counter { margin-left: auto; white-space: nowrap; }
    .custom-prompt-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
    .custom-prompt-grid2-version { grid-template-columns: minmax(120px, 150px) 1fr; }
    .custom-prompt-images { display: flex; flex-direction: column; gap: 5px; }
    .custom-prompt-images-title { margin: 0 0 1px; display: flex; align-items: baseline; gap: 8px; font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: #2f5c47; }
    .custom-prompt-images-title span { font-size: 11px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--muted); }
    .custom-prompt-picker-list { display: flex; flex-direction: column; gap: 10px; padding: 16px; overflow-y: auto; background: #f1f6f3; }
    .custom-prompt-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--line-dark); border-radius: 12px; background: #ffffff; }
    .custom-prompt-row:hover { border-color: var(--accent); }
    .custom-prompt-row.is-selected { border-color: var(--accent); background: var(--accent-soft); }
    .custom-prompt-row-thumb { flex: 0 0 54px; width: 54px; height: 54px; border-radius: 8px; border: 1px solid var(--line); background: var(--soft) center/cover no-repeat; }
    #custom-prompt-hover-preview { position: fixed; z-index: 1200; width: 400px; height: 400px; pointer-events: none; border: 1px solid var(--line-dark); border-radius: 12px; background: #f4f8f6 center / contain no-repeat; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.32); }
    #custom-prompt-hover-preview[hidden] { display: none; }
    .custom-prompt-row-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
    .custom-prompt-row-text strong { font-size: 13px; color: var(--text); }
    .custom-prompt-row-text small { color: var(--muted); font-size: 11px; line-height: 1.45; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
    .custom-prompt-row-actions { flex: 0 0 auto; display: flex; gap: 6px; }
    .custom-prompt-picker-empty { padding: 24px 16px; font-size: 12px; color: var(--muted); }
    .custom-prompt-picker-group { margin: 4px 0 2px; font-size: 10px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: #2f5c47; display: flex; flex-direction: column; gap: 2px; }
    .custom-prompt-picker-group:not(:first-child) { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line); }
    .custom-prompt-picker-group span { font-size: 11px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--muted); }

    .custom-prompt-picker-tools { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--panel-strong); }
    .custom-prompt-picker-tools label { font-size: 11px; font-weight: 700; color: var(--text); white-space: nowrap; }
    .custom-prompt-picker-tools input { flex: 1 1 auto; min-width: 0; padding: 9px 11px; font: inherit; font-size: 12px; color: var(--text); background: #fff; border: 1px solid var(--line-dark); border-radius: 8px; }
    .custom-prompt-picker-tools input:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .custom-prompt-picker-tools span { flex: 0 0 auto; font-size: 11px; color: var(--muted); white-space: nowrap; }
    .custom-prompt-row-select { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
    .custom-prompt-row-select:focus-visible, .custom-prompt-mini:focus-visible, .custom-prompt-save:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
    @media (max-width: 640px) {
      .custom-prompt-labelrow { flex-wrap: wrap; }
      .custom-prompt-labelrow > div { flex-wrap: wrap; row-gap: 6px; }
      .custom-prompt-grid2, .custom-prompt-grid2-version { grid-template-columns: 1fr; }
      .custom-prompt-image-row { grid-template-columns: 1fr; gap: 6px; padding: 8px; }
      .custom-prompt-image-content { align-items: flex-start; gap: 9px; }
      .custom-prompt-image-controls { align-items: flex-start; flex-direction: column; gap: 8px; padding-top: 3px; }
      .custom-prompt-image-actions { flex-wrap: wrap; }
      .custom-prompt-image-preview { padding: 12px; }
      .custom-prompt-image-preview-dialog { width: calc(100vw - 24px); max-height: calc(100vh - 24px); padding: 8px; }
      .custom-prompt-image-preview-image { max-height: calc(100vh - 90px); }
      .custom-prompt-picker-tools { flex-wrap: wrap; }
      .custom-prompt-picker-tools input { flex-basis: 100%; order: 2; }
      .custom-prompt-picker-tools span { margin-left: auto; }
      .custom-prompt-row { align-items: flex-start; flex-wrap: wrap; }
      .custom-prompt-row-select { flex-basis: 100%; }
      .custom-prompt-row-actions { margin-left: auto; }
    }
