/* Voicepa creator drafts. Component classes intentionally differ from public feed tiles. */
.voicepa-draft-workspace {
    --vp-draft-ink: #382e36;
    --vp-draft-muted: #7d717a;
    --vp-draft-accent: #963660;
    --vp-draft-line: #e9e0e5;
    --vp-draft-soft: #f7edf2;
    container: vp-drafts / inline-size;
    isolation: isolate;
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0 0 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--vp-draft-ink);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.6;
    text-align: left;
    overflow-wrap: anywhere;
}
.voicepa-draft-workspace *, .voicepa-draft-workspace *::before, .voicepa-draft-workspace *::after { box-sizing: border-box; }
.voicepa-draft-workspace [hidden] { display: none !important; }
.voicepa-draft-workspace :is(h1,h2,h3,p,header,footer,form) { float: none; clear: none; width: auto; max-width: 100%; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: inherit; }
.voicepa-draft-workspace :is(h1,h2,h3)::before, .voicepa-draft-workspace :is(h1,h2,h3)::after { content: none; }
.voicepa-draft-workspace :is(button,input,select,summary,a) { -webkit-tap-highlight-color: transparent; }
.voicepa-draft-workspace :is(button,input,select,summary,a):focus { outline: none; }
.voicepa-draft-workspace :is(button,summary,a):focus-visible { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.voicepa-draft-workspace :is(input:not([type=checkbox]),select):focus-visible { background-color: #fbf0f5; box-shadow: inset 0 -2px var(--vp-draft-accent); }
.voicepa-draft-workspace label:has(input[type=checkbox]:focus-visible) { background-color: #f1dbe6; text-decoration: underline; }
.voicepa-draft-workspace svg { display: inline-block; flex: 0 0 auto; width: 18px; height: 18px; max-width: 18px; vertical-align: middle; }
.voicepa-draft-workspace .vp-drafts-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 17px; padding: 0; float: none; width: 100%; }
.voicepa-draft-workspace .vp-drafts-heading { display: flex; align-items: center; gap: 10px; min-width: 0; }
.voicepa-draft-workspace .vp-drafts-heading__icon { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; border-radius: 13px; background: var(--vp-draft-soft); color: var(--vp-draft-accent); }
.voicepa-draft-workspace .vp-drafts-heading__icon svg { width: 22px; height: 22px; max-width: 22px; }
.voicepa-draft-workspace .vp-drafts-heading :is(h1,h2,h3) { margin: 0; font-size: 24px; line-height: 1.25; font-weight: 750; letter-spacing: .025em; }
.voicepa-draft-workspace .vp-drafts-private { display: flex; align-items: center; gap: 4px; margin: 5px 0 0; color: var(--vp-draft-muted); font-size: 11px; line-height: 1.2; }
.voicepa-draft-workspace .vp-drafts-private svg { width: 12px; height: 12px; max-width: 12px; }
.voicepa-draft-workspace .vp-drafts-create { position: relative; flex: 0 0 auto; margin: 0; border: 0; }
.voicepa-draft-workspace .vp-drafts-create summary { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 7px 10px; border-radius: 8px; color: #685a64; font-size: 12px; font-weight: 600; cursor: pointer; list-style: none; }
.voicepa-draft-workspace .vp-drafts-create summary::marker, .voicepa-draft-workspace .vp-drafts-create summary::-webkit-details-marker { display: none; content: ''; }
.voicepa-draft-workspace .vp-drafts-create[open] summary { background: var(--vp-draft-soft); color: var(--vp-draft-accent); }
.voicepa-draft-workspace .vp-drafts-create__links { position: absolute; z-index: 3; top: calc(100% + 5px); right: 0; display: grid; gap: 2px; width: max-content; max-width: min(280px,80vw); padding: 5px; border: 1px solid var(--vp-draft-line); border-radius: 11px; background: #fff; box-shadow: 0 8px 28px #40243216; }
.voicepa-draft-workspace .vp-drafts-create__links a { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 10px; border-radius: 6px; color: var(--vp-draft-ink); font-size: 13px; text-decoration: none; }
.voicepa-draft-workspace .vp-drafts-create__links svg { width: 14px; height: 14px; max-width: 14px; color: var(--vp-draft-muted); }
.voicepa-draft-workspace .vp-drafts-tabs { display: flex; align-items: stretch; gap: 18px; margin: 0 0 15px; border-bottom: 1px solid var(--vp-draft-line); }
.voicepa-draft-workspace .vp-drafts-tabs button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex: 0 1 auto; width: auto; min-width: 0; min-height: 43px; margin: 0 0 -1px; padding: 7px 2px 10px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: transparent; box-shadow: none; color: var(--vp-draft-muted); font: inherit; font-size: 14px; font-weight: 600; line-height: 1.4; cursor: pointer; }
.voicepa-draft-workspace .vp-drafts-tabs button[data-vp-draft-status=trash] { margin-left: auto; font-size: 12px; font-weight: 500; }
.voicepa-draft-workspace .vp-drafts-tabs button[aria-selected=true] { color: var(--vp-draft-accent); border-bottom-color: var(--vp-draft-accent); }
.voicepa-draft-workspace .vp-drafts-tabs button span { min-width: 22px; padding: 1px 6px; border-radius: 6px; background: #eee7eb; color: #796571; font-size: 11px; font-variant-numeric: tabular-nums; }
.voicepa-draft-workspace .vp-drafts-tabs button[aria-selected=true] span { background: var(--vp-draft-soft); color: var(--vp-draft-accent); }
.voicepa-draft-workspace .vp-drafts-tabs svg { width: 16px; height: 16px; max-width: 16px; }
.voicepa-draft-workspace .vp-drafts-filters { display: grid; grid-template-columns: minmax(190px,1fr) minmax(105px,140px) minmax(140px,154px); gap: 8px; align-items: stretch; margin: 0 0 6px; }
.voicepa-draft-workspace .vp-drafts-search { display: flex; align-items: center; gap: 5px; min-width: 0; height: 46px; padding: 4px 5px 4px 12px; border: 1px solid var(--vp-draft-line); border-radius: 10px; background: #fff; color: #9a8290; }
.voicepa-draft-workspace .vp-drafts-search:focus-within { border-color: #c395ac; }
.voicepa-draft-workspace .vp-drafts-search input { display: block; flex: 1 1 0; width: 100%; min-width: 0; height: 36px; margin: 0; padding: 5px 0; border: 0; border-radius: 4px; background: transparent; box-shadow: none; color: var(--vp-draft-ink); font: inherit; font-size: 14px; }
.voicepa-draft-workspace .vp-drafts-search input::placeholder { color: #968890; opacity: 1; }
.voicepa-draft-workspace .vp-drafts-search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.voicepa-draft-workspace .vp-drafts-search button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-width: 30px; min-height: 34px; margin: 0; padding: 5px; border: 0; border-radius: 6px; background: transparent; box-shadow: none; color: #8a7280; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.voicepa-draft-workspace .vp-drafts-search .vp-drafts-search__submit { padding: 5px 10px; background: var(--vp-draft-soft); color: var(--vp-draft-accent); }
.voicepa-draft-workspace .vp-drafts-filter { position: relative; display: flex; flex-direction: column; justify-content: center; min-width: 0; min-height: 46px; margin: 0; padding: 4px 26px 4px 10px; border: 1px solid var(--vp-draft-line); border-radius: 10px; background: #fff; }
.voicepa-draft-workspace .vp-drafts-filter > span { color: var(--vp-draft-muted); font-size: 10px; line-height: 1.3; }
.voicepa-draft-workspace .vp-drafts-filter select { display: block; appearance: none; -webkit-appearance: none; width: 100%; min-width: 0; max-width: 100%; height: 23px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; background-image: none; box-shadow: none; color: #584b54; font: inherit; font-size: 12px; cursor: pointer; }
.voicepa-draft-workspace .vp-drafts-filter > svg { position: absolute; right: 8px; top: 50%; width: 14px; height: 14px; max-width: 14px; margin-top: -7px; color: var(--vp-draft-muted); pointer-events: none; }
.voicepa-draft-workspace .vp-drafts-selection { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; min-height: 44px; margin: 0 0 5px; }
.voicepa-draft-workspace .vp-drafts-results { color: var(--vp-draft-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.voicepa-draft-workspace .vp-drafts-select-all { display: none; align-items: center; gap: 7px; min-height: 36px; margin: 0; color: var(--vp-draft-accent); font-size: 12px; cursor: pointer; }
.voicepa-draft-workspace input[type=checkbox] { display: inline-block; appearance: auto; -webkit-appearance: checkbox; flex: 0 0 18px; width: 18px; height: 18px; margin: 0; padding: 0; border-radius: 5px; accent-color: var(--vp-draft-accent); box-shadow: none; cursor: pointer; }
.voicepa-draft-workspace .vp-draft-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; width: auto; min-width: 0; min-height: 40px; max-width: 100%; margin: 0; padding: 8px 12px; border: 0; border-radius: 8px; background: var(--vp-draft-soft); box-shadow: none; color: var(--vp-draft-accent); font: inherit; font-size: 13px; font-weight: 600; line-height: 1.5; text-align: center; text-decoration: none; white-space: normal; cursor: pointer; }
.voicepa-draft-workspace .vp-draft-button--organize { margin-left: auto; padding: 7px 8px; background: transparent; color: #70616b; font-size: 12px; font-weight: 500; }
.voicepa-draft-workspace .vp-draft-button--organize[aria-pressed=true] { background: var(--vp-draft-soft); color: var(--vp-draft-accent); }
.voicepa-draft-workspace .vp-drafts-bulk { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; min-width: 0; margin: 0 0 12px; padding: 8px 10px; border-radius: 10px; background: var(--vp-draft-soft); color: var(--vp-draft-accent); font-size: 12px; }
.voicepa-draft-workspace .vp-drafts-bulk [data-vp-draft-selected-count] { margin-right: auto; font-weight: 600; }
.voicepa-draft-workspace .vp-draft-button--bulk, .voicepa-draft-workspace .vp-draft-button--primary { background: var(--vp-draft-accent); color: #fff; }
.voicepa-draft-workspace .vp-draft-button--quiet { background: transparent; color: #796771; font-weight: 500; }
.voicepa-draft-workspace .vp-drafts-panel { min-width: 0; outline: none; }
.voicepa-draft-workspace .vp-drafts-panel:focus-visible { background: #fbf4f7; }
/* Container width, not viewport width: a sidebar never squeezes the card grid. */
.voicepa-draft-workspace .vp-drafts-list { display: grid; grid-template-columns: repeat(auto-fill,minmax(min(100%,310px),1fr)); align-items: stretch; gap: 12px; min-width: 0; }
.voicepa-draft-workspace .vp-draft-card { position: relative; display: flex; flex-direction: column; gap: 10px; float: none; clear: none; width: auto; min-width: 0; max-width: 100%; height: auto; margin: 0; padding: 12px; overflow: visible; border: 1px solid var(--vp-draft-line); border-radius: 13px; background: #fff; box-shadow: 0 2px 5px #38243103; }
.voicepa-draft-workspace .vp-draft-card__content { display: grid; grid-template-columns: clamp(100px,34%,144px) minmax(0,1fr); align-items: start; gap: 12px; min-width: 0; }
.voicepa-draft-workspace .vp-draft-card__cover { display: grid; place-items: center; position: relative; float: none; clear: none; width: 100%; min-width: 0; aspect-ratio: 1; margin: 0; padding: 0; overflow: hidden; border: 0; border-radius: 9px; background: #f3edf0; color: #af7994; text-decoration: none; }
.voicepa-draft-workspace .vp-draft-card__cover:focus-visible::after { content: ""; position: absolute; inset: auto 0 0; height: 3px; background: var(--vp-draft-accent); pointer-events: none; }
.voicepa-draft-workspace .vp-draft-card__cover img { position: absolute; inset: 0; display: block; float: none; width: 100%; height: 100%; min-height: 0; max-width: 100%; max-height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; object-fit: contain; object-position: center; box-shadow: none; }
.voicepa-draft-workspace .vp-draft-card__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 100%; min-width: 0; padding: 12px; }
.voicepa-draft-workspace .vp-draft-card__placeholder > svg { width: 34px; height: 34px; max-width: 34px; stroke-width: 1.4; }
.voicepa-draft-workspace .vp-draft-card__placeholder > span { color: #9e8493; font-size: 10px; font-weight: 400; }
.voicepa-draft-workspace .vp-draft-card[data-draft-kind=live] .vp-draft-card__cover { background: #f6efe8; color: #b08a69; }
.voicepa-draft-workspace .vp-draft-card[data-draft-kind=work] .vp-draft-card__cover { background: #eeedf4; color: #9584ab; }
.voicepa-draft-workspace .vp-draft-card__body { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.voicepa-draft-workspace .vp-draft-card__type { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding: 2px 6px; border-radius: 5px; background: #f6eff3; color: #875b73; font-size: 11px; font-weight: 600; line-height: 1.5; }
.voicepa-draft-workspace .vp-draft-card__type svg { width: 12px; height: 12px; max-width: 12px; }
.voicepa-draft-workspace .vp-draft-card__title { display: block; min-width: 0; margin: 0; padding: 0; overflow: visible; color: var(--vp-draft-ink); font-size: 16px; font-weight: 650; line-height: 1.5; letter-spacing: 0; white-space: normal; overflow-wrap: anywhere; }
.voicepa-draft-workspace .vp-draft-card__title a { display: inline; float: none; padding: 0; color: inherit; text-decoration: none; }
.voicepa-draft-workspace .vp-draft-card__time { display: flex; align-items: flex-start; gap: 4px; min-width: 0; color: #7d717a; font-size: 11px; line-height: 1.6; font-variant-numeric: tabular-nums; }
.voicepa-draft-workspace .vp-draft-card__time svg { width: 12px; height: 12px; max-width: 12px; margin-top: 2px; }
.voicepa-draft-workspace .vp-draft-card__excerpt { margin: 0; padding: 0; color: var(--vp-draft-muted); font-size: 12px; line-height: 1.7; }
.voicepa-draft-workspace .vp-draft-card__notice { margin: 0; padding: 7px 8px; border-radius: 6px; background: #fcf3ec; color: #98714f; font-size: 11px; line-height: 1.6; }
.voicepa-draft-workspace .vp-draft-card__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 0; margin-top: auto; }
.voicepa-draft-workspace .vp-draft-button--resume { flex: 1 1 auto; justify-content: flex-start; width: 100%; background: #f8eff4; color: var(--vp-draft-accent); font-weight: 650; }
.voicepa-draft-workspace .vp-draft-button--resume > svg:last-child { width: 15px; height: 15px; max-width: 15px; margin-left: auto; }
.voicepa-draft-workspace .vp-draft-button--restore { flex: 1 1 auto; width: 100%; }
.voicepa-draft-workspace .vp-draft-button--trash { display: none; min-height: 36px; margin-left: auto; padding: 5px 7px; background: transparent; color: #927f8a; font-size: 11px; font-weight: 500; }
.voicepa-draft-workspace .vp-draft-button--trash svg { width: 15px; height: 15px; max-width: 15px; }
.voicepa-draft-workspace:not(.is-organizing)[data-vp-draft-state=draft] .vp-draft-card__actions:not(:has(a)) { display: none; }
.voicepa-draft-workspace .vp-draft-card__select { display: none; position: absolute; z-index: 1; top: 17px; left: 17px; align-items: center; justify-content: center; width: 34px; min-height: 34px; margin: 0; padding: 0; border: 1px solid #eee5e9; border-radius: 8px; background: #fffffff5; box-shadow: 0 2px 7px #38243110; cursor: pointer; }
.voicepa-draft-workspace.is-organizing .vp-draft-card__select, .voicepa-draft-workspace.is-organizing .vp-drafts-select-all, .voicepa-draft-workspace.is-organizing .vp-draft-button--trash { display: inline-flex; }
.voicepa-draft-workspace.is-organizing .vp-draft-card:has(input:checked) { border-color: #c998af; background: #fdf5f9; }
.voicepa-draft-workspace :is(button,input):disabled { opacity: .42; cursor: not-allowed; }
.voicepa-draft-workspace .vp-drafts-retention { margin: 8px 0; padding: 8px 10px; border-radius: 8px; background: #f5efed; color: #907d75; font-size: 12px; }
.voicepa-draft-workspace .vp-drafts-feedback { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin: 10px 0; padding: 10px 12px; border-radius: 9px; background: var(--vp-draft-soft); color: #89546e; font-size: 13px; }
.voicepa-draft-workspace .vp-drafts-feedback.is-error { background: #fcf1e9; color: #986947; }
.voicepa-draft-workspace .vp-drafts-feedback p { flex: 1 1 180px; margin: 0; }
.voicepa-draft-workspace .vp-drafts-feedback button { min-height: 34px; padding: 4px 8px; }
.voicepa-draft-workspace.is-loading .vp-drafts-list { opacity: .6; }
.voicepa-draft-workspace.is-loading .vp-drafts-panel { cursor: progress; }
.voicepa-draft-workspace .vp-drafts-empty { display: flex; flex-direction: column; align-items: center; gap: 9px; margin: 0; padding: 32px 15px; border: 1px dashed #decfd7; border-radius: 13px; background: #ffffff7d; text-align: center; }
.voicepa-draft-workspace .vp-drafts-empty > svg { width: 28px; height: 28px; max-width: 28px; color: #b896a7; }
.voicepa-draft-workspace .vp-drafts-empty h3 { margin: 0; color: #79616e; font-size: 16px; font-weight: 600; line-height: 1.5; }
.voicepa-draft-workspace .vp-drafts-empty p { margin: 0; color: var(--vp-draft-muted); font-size: 12px; }
.voicepa-draft-workspace .vp-drafts-footer { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; width: 100%; margin: 17px 0 0; padding: 0; background: transparent; color: #9b8792; font-size: 12px; font-variant-numeric: tabular-nums; }
.voicepa-draft-workspace .vp-draft-button--more { min-width: 155px; min-height: 42px; background: #fff; box-shadow: inset 0 0 0 1px var(--vp-draft-line); color: #866978; }
.voicepa-draft-workspace .vp-drafts-dialog { position: fixed; inset: 0; width: min(400px,calc(100% - 28px)); max-width: 400px; max-height: calc(100vh - 28px); max-height: calc(100dvh - 28px); margin: auto; padding: 22px; overflow-y: auto; border: 0; border-radius: 16px; background: #fffdfd; color: var(--vp-draft-ink); box-shadow: 0 22px 80px #33202b33; }
.voicepa-draft-workspace .vp-drafts-dialog:not([open]) { display: none; }
.voicepa-draft-workspace .vp-drafts-dialog::backdrop { background: #30252b66; }
.voicepa-draft-workspace .vp-drafts-dialog__icon { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 12px; border-radius: 12px; background: var(--vp-draft-soft); color: var(--vp-draft-accent); }
.voicepa-draft-workspace .vp-drafts-dialog form { display: block; width: auto; height: auto; min-height: 0; margin: 0; padding: 0; border: 0; background: transparent; }
.voicepa-draft-workspace .vp-drafts-dialog h3 { margin: 0 0 9px; font-size: 17px; font-weight: 650; line-height: 1.6; }
.voicepa-draft-workspace .vp-drafts-dialog p { margin: 0; color: var(--vp-draft-muted); font-size: 13px; }
.voicepa-draft-workspace .vp-drafts-dialog__actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 7px; margin-top: 18px; }
.voicepa-draft-workspace .vp-drafts-sr { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
@container vp-drafts (max-width: 620px) {
    .voicepa-draft-workspace .vp-drafts-filters { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
    .voicepa-draft-workspace .vp-drafts-search { grid-column: 1 / -1; }
    .voicepa-draft-workspace .vp-drafts-list { grid-template-columns: minmax(0,1fr); }
    .voicepa-draft-workspace .vp-draft-card__content { grid-template-columns: clamp(104px,32%,144px) minmax(0,1fr); }
    .voicepa-draft-workspace .vp-draft-card__type { font-size: 11px; }
    .voicepa-draft-workspace .vp-draft-card__time { font-size: 11px; }
}
@media (max-width: 700px) {
    .voicepa-draft-workspace .vp-drafts-header { margin-bottom: 12px; }
    .voicepa-draft-workspace .vp-drafts-heading :is(h1,h2,h3) { font-size: 22px; }
    .voicepa-draft-workspace .vp-drafts-filters { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
    .voicepa-draft-workspace .vp-drafts-search { grid-column: 1 / -1; }
    .voicepa-draft-workspace .vp-drafts-search input { font-size: 16px; }
    .voicepa-draft-workspace .vp-drafts-filter select { height: 27px; font-size: 16px; }
    .voicepa-draft-workspace .vp-drafts-filter { min-height: 49px; }
    .voicepa-draft-workspace .vp-drafts-list { grid-template-columns: minmax(0,1fr); gap: 11px; }
    .voicepa-draft-workspace .vp-draft-card { padding: 11px; }
    .voicepa-draft-workspace .vp-draft-button--resume, .voicepa-draft-workspace .vp-draft-button--restore { min-height: 42px; }
}
@media (hover:hover) {
    .voicepa-draft-workspace .vp-draft-card:has(.vp-draft-button--resume):hover { border-color: #d7bdca; }
    .voicepa-draft-workspace .vp-draft-card__title a:hover { color: var(--vp-draft-accent); }
    .voicepa-draft-workspace .vp-draft-button--resume:hover, .voicepa-draft-workspace .vp-draft-button--restore:hover { background: #efdde7; color: #833254; }
    .voicepa-draft-workspace .vp-draft-button--primary:hover, .voicepa-draft-workspace .vp-draft-button--bulk:hover { background: #7b2b4e; color: #fff; }
    .voicepa-draft-workspace :is(.vp-draft-button--quiet,.vp-draft-button--organize,.vp-drafts-create summary,.vp-drafts-create__links a):hover { background: var(--vp-draft-soft); color: var(--vp-draft-accent); }
    .voicepa-draft-workspace .vp-draft-button--trash:hover { background: #f9eee9; color: #a16448; }
}
@media (prefers-reduced-motion: no-preference) {
    .voicepa-draft-workspace .vp-draft-card, .voicepa-draft-workspace .vp-draft-button { transition: background-color .12s ease, border-color .12s ease; }
    .voicepa-draft-workspace .vp-drafts-list { transition: opacity .12s ease; }
}