#model-drafts-button[hidden] { display: none; }
#model-drafts-button.has-unsaved-draft strong::after { content: ''; display: inline-block; margin-left: 7px; width: 6px; height: 6px; border-radius: 50%; background: #b4862c; vertical-align: middle; }
.draft-dialog, .draft-prompt { color: #24221d; background: #fcfaf6; border: 1px solid #d9d1c3; box-shadow: 0 24px 80px #0003; font-family: inherit; padding: 0; }
.draft-dialog::backdrop, .draft-prompt::backdrop { background: #1a18194d; backdrop-filter: blur(3px); }
.draft-dialog { width: min(960px, calc(100vw - 48px)); max-height: min(90dvh, 900px); border-radius: 20px; overflow: auto; }
.draft-dialog[open] { display: flex; flex-direction: column; }
.draft-dialog > header { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 22px 26px 16px; }
.draft-eyebrow { margin: 0 0 5px; color: #83785f; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.draft-dialog h2, .draft-prompt h2 { margin: 0; font-size: 24px; line-height: 1.35; }
.draft-dialog button, .draft-prompt button { min-height: 38px; padding: 8px 13px; border: 1px solid #d9d0c1; border-radius: 9px; background: #fffdf8; color: #302a20; font-family: inherit; font-size: 13px; line-height: 1.3; font-weight: 600; cursor: pointer; }
.draft-dialog button:hover, .draft-prompt button:hover { border-color: #a18857; background: #f3eddf; }
.draft-dialog button:disabled, .draft-prompt button:disabled { opacity: .55; cursor: wait; }
.draft-dialog button.draft-primary, .draft-prompt button.draft-primary { background: #1c1a16; color: white; border-color: #1c1a16; }
.draft-dialog button:focus-visible, .draft-prompt button:focus-visible, .draft-dialog input:focus-visible, .draft-prompt input:focus-visible { outline: 2px solid #95743d; outline-offset: 3px; }
.draft-dialog > header button { border-radius: 50%; font-size: 24px; width: 38px; padding: 0; }
.draft-toolbar { padding: 0 26px 18px; border-bottom: 1px solid #e2dbce; display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; }
.draft-toolbar p { min-width: 0; margin: 0; font-size: 13px; color: #766a56; overflow-wrap: anywhere; }
.draft-toolbar > div { display: flex; gap: 8px; }
.draft-toolbar input { grid-column: 1 / -1; }
.draft-dialog input, .draft-prompt input { box-sizing: border-box; width: 100%; min-height: 42px; border: 1px solid #d5ccbb; border-radius: 9px; background: white; padding: 10px 13px; font: inherit; color: #23211c; }
.draft-list-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 26px; font-size: 12px; color: #7d715e; }
.draft-list-status button { min-height: 30px; padding: 5px 10px; font-size: 12px; white-space: nowrap; }
.draft-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 0 26px 20px; }
.draft-card { position: relative; overflow: hidden; min-width: 0; border: 1px solid #ddd3c2; border-radius: 14px; background: white; }
.draft-card.is-current { border-color: #9e804b; box-shadow: 0 0 0 1px #9e804b; }
.draft-card.is-selected { border-color: #997339; box-shadow: 0 0 0 2px #997339; }
.draft-dialog input[type="checkbox"] { width: 18px; height: 18px; min-height: 18px; margin: 0; padding: 0; flex: 0 0 auto; accent-color: #8f7139; cursor: pointer; }
.draft-card-select { position: absolute; z-index: 1; top: 10px; left: 10px; display: flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 10px; border: 1px solid #d9d0c1; border-radius: 9px; background: #fffef8f2; box-shadow: 0 2px 5px #0001; color: #51442f; font-size: 12px; font-weight: 600; cursor: pointer; }
.draft-bulk-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin: 0 26px 16px; padding: 10px 12px; border: 1px solid #e2dbce; border-radius: 10px; background: #f5f0e6; font-size: 12px; color: #6b5b40; }
.draft-select-all { display: flex; align-items: center; gap: 8px; min-height: 38px; cursor: pointer; }
.draft-bulk-toolbar > div { display: flex; gap: 6px; margin-left: auto; }
.draft-bulk-toolbar small { flex-basis: 100%; line-height: 1.5; }
.draft-dialog button.draft-danger { color: #a22d25; border-color: #d8a7a1; background: #fff9f7; }
.draft-dialog button.draft-danger:not(:disabled):hover { background: #fbe7e4; border-color: #ad5249; }
.draft-card button.draft-card-preview { display: grid; place-items: center; width: 100%; aspect-ratio: 3 / 2; border: 0; border-bottom: 1px solid #eee9df; border-radius: 0; background: #f6f4ef; padding: 0; color: #958b7b; }
.draft-card-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
.draft-card-info { padding: 15px; }
.draft-card-info h3 { font-size: 17px; margin: 0 0 5px; overflow-wrap: anywhere; }
.draft-card-info p { margin: 0 0 7px; color: #625a4f; font-size: 13px; }
.draft-card-info small { color: #8a806e; font-size: 11px; }
.draft-card-pricing { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; margin: 10px 0; }
.draft-card-pricing > span { display: grid; gap: 2px; padding: 8px 10px; border-radius: 9px; background: #f4efe4; }
.draft-card-pricing small { color: #776b59; font-size: 10px; }
.draft-card-pricing strong { color: #9f5b00; font-size: 15px; line-height: 1.2; overflow-wrap: anywhere; }
.draft-card-pricing em { grid-column: 1 / -1; color: #a56b14; font-size: 11px; font-style: normal; }
.draft-card-pricing.is-pending { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border-radius: 9px; background: #f5f1e9; color: #817765; font-size: 11px; }
.draft-card-pricing.is-pending strong { color: #766b59; font-size: 11px; }
.draft-card-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.draft-card-actions button { padding: 6px 10px; font-size: 12px; }
.draft-empty { grid-column: 1 / -1; text-align: center; padding: 60px 20px; color: #756a57; }
.draft-empty p { font-size: 13px; }
.draft-dialog > footer { padding: 4px 26px 20px; text-align: center; }
.draft-dialog > footer p { margin: 12px 0 0; font-size: 11px; color: #928572; }
.draft-dialog > footer button { margin: 4px; }
.draft-dialog [hidden] { display: none !important; }
.draft-prompt { width: min(460px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; border-radius: 16px; padding: 24px; box-sizing: border-box; }
.draft-prompt h2 { font-size: 21px; }
.draft-prompt p { font-size: 14px; color: #776a55; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.draft-prompt label { display: grid; gap: 8px; margin-top: 20px; font-size: 13px; }
.draft-prompt-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
@media (max-width: 700px) {
  .draft-dialog { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; border: 0; border-radius: 0; margin: 0; }
  .draft-dialog > header { padding: 20px 16px 14px; }
  .draft-toolbar { grid-template-columns: 1fr; padding: 0 16px 14px; }
  .draft-toolbar > div > button { flex: 1; }
  .draft-list-status { padding: 12px 16px; }
  .draft-bulk-toolbar { margin: 0 16px 16px; }
  .draft-list { grid-template-columns: 1fr; padding: 0 16px 20px; }
  .draft-prompt-actions button { flex: 1; }
}