/* Phoenix conversation desk: content first, ember for feedback. Layers:
 * settings 5, drawer scrim 9, history 10, native dialog in the top layer. */
body #page-playground { --pg-paper:#fffaf3; --pg-canvas:#fbefdf; --pg-ink:var(--ink); --pg-muted:var(--ink-2); --pg-line:var(--line-strong); --pg-selected:#f9dfc5; --pg-gutter:max(32px,calc((100% - 800px)/2)); padding:0; height:calc(100dvh - var(--workspace-header)); background:linear-gradient(145deg,#fff8eb,#fff2e6 60%,#fbe5d7); }
body #page-playground .pg-grid { height:100%; min-height:0; gap:0; overflow:hidden; position:relative; }
body #page-playground .pg-history { width:264px; height:100%; padding:24px 16px 18px; gap:18px; background:linear-gradient(170deg,#fcebd5,#f2f7fd 60%,#fae6d9); border-right:1px solid var(--pg-line); overflow:hidden; }
body #page-playground.history-hidden .pg-history { display:none; }
body #page-playground .new-chat-btn { min-height:46px; gap:12px; padding:11px 14px; border:0; background:var(--coral-deep); background-image:var(--phoenix-flame); color:#fff; font-size:14px; font-weight:600; text-align:left; justify-content:flex-start; border-radius:12px; flex-shrink:0; box-shadow:0 3px 10px rgba(150,56,28,.12); }
body #page-playground .new-chat-btn:hover:not(:disabled) { background:var(--coral-deep); transform:none; box-shadow:none; }
.pg-history-search { display:flex; gap:10px; align-items:center; color:var(--pg-muted); padding:0 13px; min-height:46px; border:1px solid var(--pg-line); border-radius:12px; background:var(--pg-paper); }
.pg-history-search:focus-within { border-color:var(--border-focus); box-shadow:0 0 0 1px var(--border-focus); }
body #page-playground .pg-history-search input { min-width:0; width:100%; padding:9px 0; font-size:14px; border:0!important; background:transparent!important; box-shadow:none!important; }
body #page-playground .pg-history-search input:focus-visible { outline:0; }
.pg-history-search svg { flex:none; }
body #page-playground .conv-section-title { font-size:12px; font-weight:600; letter-spacing:0; color:var(--pg-muted); padding:2px 12px 0; }
body #page-playground .conv-list { flex:1; min-height:0; max-height:none; overflow:auto; padding:3px; display:flex; flex-direction:column; gap:4px; }
body #page-playground .conv-item { min-height:64px; padding:12px; gap:8px; border:0; border-radius:12px; background:transparent; align-items:center; }
body #page-playground .conv-item.active { background:var(--pg-selected); color:var(--pg-ink); box-shadow:none; }
body #page-playground .conv-item:hover { background:var(--pg-selected); }
body #page-playground .conv-icon { display:none; }
.conv-item-copy { display:flex; flex:1; min-width:0; flex-direction:column; gap:5px; pointer-events:none; }
body #page-playground .conv-item-title { display:block; min-width:0; font-size:14px; font-weight:500; line-height:1.4; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
body #page-playground .conv-item.active .conv-item-title { font-weight:650; }
.conv-item-preview { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; line-height:1.4; color:var(--pg-muted); }
body #page-playground .conv-item-del, body #page-playground .conv-item-rename { position:absolute; right:0; top:10px; width:44px; height:44px; min-width:44px; padding:0; margin:0; z-index:1; opacity:0; pointer-events:none; color:var(--pg-muted); }
body #page-playground .conv-item-rename { right:44px; }
body #page-playground .conv-item:is(:hover,:focus-within) { padding-right:94px; }
body #page-playground .conv-item:is(:hover,:focus-within) :is(.conv-item-del,.conv-item-rename) { opacity:1; pointer-events:auto; }
body #page-playground .pg-rename-input { position:relative; z-index:2; min-width:0; width:100%; padding:3px; font-size:14px; pointer-events:auto; }
.pg-history-note, .pg-history-empty { color:var(--pg-muted); font-size:12px; line-height:1.6; padding:0 12px; margin:0; }
.pg-history-note { padding-top:14px; border-top:1px solid var(--pg-line); }
.pg-history-empty { padding-block:20px; }
body #page-playground .chat-area { height:100%; min-height:0; border:0; border-radius:0; background:transparent; overflow:hidden; }
.pg-threadbar { min-height:74px; display:flex; align-items:center; gap:14px; padding:14px 24px; }
.pg-threadbar h1 { margin:0; min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--pg-ink); font-size:17px; line-height:1.5; font-weight:650; letter-spacing:-.015em; }
#conversationExportBtn { margin-right:124px; }
body #page-playground .pg-configuration { position:absolute; right:20px; top:14px; z-index:5; padding:0; width:120px; max-height:calc(100% - 100px); margin:0; border:0; border-radius:12px; background:var(--pg-paper); }
body #page-playground .pg-configuration > summary { display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; margin:0; padding:10px 12px; list-style:none; font-size:13px; font-weight:600; letter-spacing:0; text-transform:none; white-space:nowrap; border-radius:10px; background:var(--pg-canvas); color:var(--pg-ink); }
.pg-settings-icon {display:none;flex:none;}
body #page-playground .pg-configuration > summary::-webkit-details-marker { display:none; }
body #page-playground .pg-configuration > summary:hover { background:var(--surface-soft); }
body #page-playground .pg-configuration[open] { width:min(360px,calc(100% - 32px)); padding:12px 20px 20px; overflow:auto; box-shadow:var(--shadow-md); }
body #page-playground .pg-configuration[open] > summary { justify-content:flex-end; }
body #page-playground .pg-configuration .field { margin-block:14px; }
.pg-checkbox { display:flex; align-items:center; gap:8px; min-height:44px; font-size:14px; }
body #page-playground .pg-checkbox input { width:18px; height:18px; min-height:18px; }
body #page-playground .pg-tabs { min-height:48px; padding:0 24px 8px; gap:6px; border-bottom:1px solid var(--pg-line); background:transparent; overflow-x:auto; scrollbar-width:thin; scroll-padding-inline:12px; }
body #page-playground .pg-tab { flex:0 0 auto; white-space:nowrap; min-height:44px; padding:8px 14px; font-size:13px; font-weight:500; background:transparent; border-radius:10px; color:var(--pg-muted); }
body .scroll-bottom-btn { min-height:44px; min-width:44px; }
body .scroll-bottom-btn[hidden] { display:none; }
body #page-playground .pg-tab.active { background:var(--coral-deep); background-image:var(--phoenix-flame); color:#fff; }
body #page-playground .pg-tab::after { display:none; }
body #page-playground .chat-meta-bar { min-height:30px; padding:8px var(--pg-gutter) 0; gap:12px; }
body #page-playground .chat-meta-bar .chip { border:0; padding:0; background:transparent; font-size:12px; color:var(--ink-2); }
body #page-playground .chat-meta-bar .chip:empty { display:none; }
body #page-playground .chat-messages { min-height:0; padding:24px var(--pg-gutter) 32px; gap:32px; overscroll-behavior:contain; scrollbar-gutter:stable; scroll-padding-block:24px; }
body #page-playground .message-assistant .msg-avatar { display:none; }
body #page-playground .message-assistant .bubble { font-size:16px; line-height:1.75; color:var(--pg-ink); overflow-wrap:anywhere; }
body #page-playground .message .bubble p { margin:0 0 14px; line-height:1.75; }
body #page-playground .message .bubble p:last-child { margin-bottom:0; }
body #page-playground .message .bubble :is(h1,h2,h3) { margin:24px 0 12px; padding:0; font-size:18px; line-height:1.45; font-weight:650; color:var(--pg-ink); letter-spacing:-.015em; }
body #page-playground .message .bubble :is(h1,h2,h3):first-child { margin-top:0; }
body #page-playground .message .bubble :is(ul,ol) { margin:12px 0 16px; padding-left:24px; }
body #page-playground .message .bubble li { padding-left:3px; margin:6px 0; line-height:1.7; }
body #page-playground .message .bubble blockquote { border-left:1px solid var(--pg-line); color:var(--pg-muted); background:var(--pg-canvas); padding:12px 16px; margin:16px 0; }
body #page-playground .message .bubble :is(pre,table) { max-width:100%; overflow:auto; }
body #page-playground .message-user { max-width:76%; }
body #page-playground .message-user .bubble { padding:13px 18px; color:var(--pg-ink); background:linear-gradient(120deg,#f9dfc5,#fcedd8); border-radius:16px 16px 5px 16px; font-size:15px; line-height:1.65; }
body #page-playground .msg-body { min-width:0; }
.pg-message-footer { display:flex; align-items:center; justify-content:flex-start; flex-wrap:wrap; column-gap:16px; margin-top:12px; }
body #page-playground .message-meta { padding:0; margin:0 0 0 auto; color:var(--pg-muted); font-size:12px; line-height:1.5; order:1; }
body #page-playground .message-meta .msg-time { color:inherit; font:inherit; font-variant-numeric:tabular-nums; }
body #page-playground .message-meta:has(.msg-time:empty) { display:none; }
.pg-reply-actions { display:flex; gap:2px; align-items:center; margin:0; }
body #page-playground .pg-icon-btn { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-width:44px; padding:0; border:0; border-radius:10px; background:transparent; color:var(--ink-2); cursor:pointer; flex:none; box-shadow:none; }
body #page-playground .pg-icon-btn:hover { background:var(--surface-soft); color:var(--ink); transform:none; }
body #page-playground .pg-icon-btn[aria-pressed=true] { background:var(--accent-pale); color:var(--accent-dark); }
body #page-playground button:disabled { opacity:.45; cursor:not-allowed; }
body #page-playground :is(button,summary,select,input,textarea):focus-visible { outline:2px solid var(--border-focus); outline-offset:2px; }
body #page-playground .empty-state { min-height:160px; max-width:620px; padding:20px 8px; }
body #page-playground .empty-title { font-size:30px; font-weight:650; line-height:1.35; letter-spacing:-.025em; color:var(--pg-ink); }
body #page-playground .empty-logo { display:none; }
body #page-playground .empty-quick { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:24px; }
body #page-playground .empty-quick button { min-height:44px; width:auto; padding:10px 14px; border:1px solid var(--line-strong); border-radius:12px; background:var(--surface-solid); }
body #page-playground .empty-quick .eq-d { display:none; }
body #page-playground .chat-input-wrap { padding:12px var(--pg-gutter) 22px; flex:none; background:transparent; }
body #page-playground .chat-input-box { padding:17px 16px 9px; gap:8px; border:1px solid var(--pg-line); border-radius:20px; background:var(--pg-paper); box-shadow:none; }
body #page-playground .chat-input-box:focus-within { border-color:var(--border-focus); box-shadow:0 0 0 1px var(--border-focus); }
body #page-playground .chat-input-box textarea { min-height:44px; max-height:180px; font-size:16px; }
body #page-playground .chat-input-actions { gap:6px; flex-wrap:nowrap; }
body #page-playground .chat-input-actions [hidden] { display:none; }
body #page-playground .pg-tool-btn { min-width:44px; min-height:44px; border:0; color:var(--ink-2); border-radius:10px; }
#charCount { flex:1; min-width:0; font-size:12px; color:var(--ink-2); white-space:nowrap; }
.pg-composer-model { min-width:0; width:auto; max-width:54%; margin-left:auto; border-radius:10px; background:var(--pg-canvas); }
body #page-playground .pg-composer-model select { width:100%; max-width:300px; min-width:0; min-height:44px; padding:8px 24px 8px 8px; font-size:13px; text-overflow:ellipsis; border:0!important; background-color:transparent!important; box-shadow:none!important; color:var(--ink); }
.pg-video-model-slot { min-width:0; width:100%; }
.pg-video-model-slot .pg-composer-model { display:flex; align-items:center; gap:8px; width:100%; max-width:100%; margin:0; padding-left:10px; }
.pg-video-model-slot .pg-composer-model > span { flex:none; font-size:13px; color:var(--ink-2); }
body #page-playground .pg-video-model-slot select { flex:1; max-width:none; appearance:auto; cursor:pointer; }
.pg-video-controls-slot .extra-params { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; gap:12px; padding:0; border:0; }
.pg-video-controls-slot .field { min-width:0; margin:0; }
.pg-video-controls-slot select { width:100%; min-height:44px; }
.video-references { min-width:0; margin:4px 0; padding:12px; border:1px solid var(--pg-line); border-radius:12px; }
.video-references legend { font-size:14px; font-weight:600; }
.video-reference-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(130px,180px) auto; gap:10px; padding:12px 0; border-bottom:1px solid var(--pg-line); }
.video-reference-row .field { min-width:0; margin:0; }
.video-reference-row input,.video-reference-row select { width:100%; min-height:44px; }
.video-reference-row > button { align-self:end; min-height:44px; }
.video-reference-metadata { grid-column:1/-1; }
.video-reference-metadata summary { cursor:pointer; min-height:44px; display:flex; align-items:center; font-size:13px; }
.video-reference-add { display:flex; align-items:end; gap:12px; padding-top:12px; flex-wrap:wrap; }
.video-reference-add .field { min-width:0; flex:1; margin:0; }
.video-reference-add button,.video-reference-add select { min-height:44px; }
@media (max-width:600px) { .pg-video-controls-slot .extra-params { grid-template-columns:minmax(0,1fr); } .video-reference-row { grid-template-columns:minmax(0,1fr); } .video-reference-add { align-items:stretch; flex-direction:column; } }
.pg-model-default { font-size:12px; color:var(--ink-2); white-space:nowrap; }
body #page-playground .pg-send-btn { width:44px; min-width:44px; height:44px; border:0; border-radius:50%; background:var(--coral-deep); background-image:var(--phoenix-flame); color:#fff; box-shadow:none; flex:none; }
body #page-playground .pg-send-btn:hover { transform:none; box-shadow:none; background:var(--accent-dark); }
body #page-playground .pg-send-btn:disabled { background:var(--pg-canvas); color:var(--pg-muted); opacity:1; }
body #page-playground .chat-input-hint { padding:0 5px; margin-top:10px; font-size:12px; line-height:1.5; color:var(--pg-muted); gap:8px; }
body #page-playground .chat-input-hint kbd { border:0; padding:0; background:transparent; font:inherit; color:inherit; }
body #page-playground .upload-preview-area:empty { display:none; }
.pg-text-file { display:flex; align-items:center; gap:8px; padding-left:12px; border:1px solid var(--line-strong); border-radius:10px; font-size:13px; max-width:100%; }
.pg-text-file > span { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.pg-attached-names { font-size:12px; line-height:1.6; color:var(--ink-2); margin-top:8px; overflow-wrap:anywhere; }
.pg-message-dialog { width:min(860px,calc(100vw - 32px)); max-height:calc(100dvh - 48px); padding:24px; border:0; border-radius:16px; color:var(--ink); background:var(--surface-solid); box-shadow:var(--shadow-md); }
.pg-message-dialog::backdrop { background:rgba(0,0,0,.4); }
.pg-message-dialog-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.pg-message-dialog-heading h2 { font-size:18px; margin:0; }
.pg-message-dialog .bubble { margin-top:20px; overflow-wrap:anywhere; font-size:16px; line-height:1.8; }
.pg-message-dialog pre { overflow:auto; }
.pg-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.pg-history-backdrop[hidden] { display:none; }
@media (max-width:1100px) { body #page-playground .pg-history { width:220px; } .pg-model-default { display:none; } #charCount { display:none; } }
@media (max-width:900px) {
  body #page-playground { height:calc(var(--workspace-viewport-height,100dvh) - var(--workspace-header)); min-height:0; padding:0; overflow:hidden; }
  body #page-playground .pg-grid { height:100%; min-height:0; flex-direction:row; }
  body #page-playground .pg-history { display:none; position:absolute; inset:0 auto 0 0; width:min(290px,84%); height:100%; z-index:10; }
  body #page-playground.history-open .pg-history { display:flex; }
  body #page-playground .pg-history-backdrop:not([hidden]) { position:absolute; inset:0; z-index:9; border:0; border-radius:0; background:rgba(0,0,0,.35); }
  body #page-playground .chat-area { height:100%; min-height:0; }
  body #page-playground .conv-item { padding-right:94px; }
  body #page-playground :is(.conv-item-del,.conv-item-rename) { opacity:1; pointer-events:auto; }
  .pg-threadbar { padding:10px 14px; min-height:64px; gap:4px; }
  #conversationExportBtn { margin-right:116px; }
  .pg-threadbar h1 { font-size:15px; }
  body #page-playground .pg-configuration { right:10px; top:10px; }
  body #page-playground .pg-tabs { padding:0 12px; }
  body #page-playground .pg-tab { min-height:44px; }
  body #page-playground .chat-messages { padding:20px 18px; gap:24px; }
  body #page-playground .chat-meta-bar { padding-inline:18px; }
  body #page-playground .message-user { max-width:90%; }
  body #page-playground .chat-input-wrap { padding:10px 12px max(12px,env(safe-area-inset-bottom)); }
  body #page-playground .chat-input-box { padding:12px 10px 6px; border-radius:20px; }
  body #page-playground .chat-input-hint > span:last-child { display:none; }
  .pg-composer-model { max-width:calc(100% - 150px); flex:1; }
  body #page-playground .pg-send-btn { width:44px; }
  body #page-playground .empty-title { font-size:24px; }
  body #page-playground .empty-state p { font-size:14px; }
  body #page-playground .empty-quick { margin-top:16px; }
  body #page-playground .empty-quick .eq-ico { display:none; }
}
@media (max-height:600px) and (min-width:601px) {
  /* Short landscape keeps identity readable without wrapping the app chrome. */
  body:has(#page-playground.active) .brand-text > span { display:none; }
  body:has(#page-playground.active) .header-right { min-width:0; gap:8px; }
  body:has(#page-playground.active) .nav-drawer-toggle { flex-shrink:0; white-space:nowrap; }
  body:has(#page-playground.active) #userBadge { flex-shrink:0; }
  body:has(#page-playground.active) #userName { max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  body:has(#page-playground.active) #userRole { flex-shrink:0; white-space:nowrap; }
  body #page-playground .pg-threadbar { min-height:52px; padding-block:4px; }
  body #page-playground .pg-configuration { top:4px; }
  body #page-playground .chat-messages { padding-block:12px; }
  body #page-playground .chat-input-wrap { padding-block:6px; }
  body #page-playground .chat-input-box { padding-block:8px 4px; }
  body #page-playground .chat-input-hint { display:none; }
}
@media (prefers-reduced-motion:no-preference) {
  body #page-playground :is(.pg-icon-btn,.pg-send-btn,.pg-tool-btn,.new-chat-btn,.empty-quick button) { transition:transform 160ms var(--ease),background-color 160ms ease,color 160ms ease; }
  body #page-playground :is(.pg-icon-btn,.pg-send-btn,.pg-tool-btn,.new-chat-btn):active { transform:scale(.96); }
  body #page-playground .conv-item :is(.conv-item-del,.conv-item-rename) { transition:opacity 140ms ease; }
  body #page-playground .pg-configuration[open] { animation:pg-settings-enter 180ms var(--ease); }
  body #page-playground.history-open .pg-history { animation:pg-history-enter 200ms var(--ease); }
  .pg-message-dialog[open] { animation:pg-settings-enter 180ms var(--ease); }
}
@keyframes pg-settings-enter { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
@keyframes pg-history-enter { from { opacity:0; transform:translateX(-16px); } to { opacity:1; transform:translateX(0); } }
@media (prefers-reduced-motion:reduce) { body #page-playground * { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* Video workbench shares the conversation drawer, not its text controls. */
body #page-playground [hidden] {display:none!important;}
.pg-history-content {display:flex;flex-direction:column;gap:18px;min-height:0;height:100%;}
body #page-playground[data-mode=video] .pg-history {width:292px;padding:22px 16px 16px;}
.pg-task-list-heading {display:flex;flex-direction:column;gap:4px;flex:none;}
.pg-task-list-heading h2 {font-size:12px;font-weight:650;margin:0 10px;color:var(--pg-muted);}
body #page-playground #refreshVideoTasks {min-height:44px;margin:0;text-align:left;justify-content:flex-start;color:var(--accent-dark);font-size:13px;}
body #page-playground #videoTaskStatus {margin:0 8px;color:var(--pg-muted);font-size:12px;line-height:1.6;}
body #page-playground #videoGenHist {display:flex;flex-direction:column;gap:8px;overflow:auto;min-height:0;flex:1;padding:3px;}
body #page-playground #videoGenHist .gen-hist-item {min-width:0;padding:0;border:0;background:transparent;}
body #page-playground .pg-video-task {display:grid;grid-template-columns:1fr auto;gap:8px;width:100%;padding:14px 12px;border:1px solid transparent;border-radius:12px;background:transparent;text-align:left;color:var(--pg-ink);white-space:normal;}
body #page-playground .pg-video-task:hover {background:var(--pg-canvas);transform:none;}
body #page-playground .pg-video-task[aria-pressed=true] {background:var(--pg-selected);border-color:var(--pg-line);}
.pg-video-task :is(strong,.pg-task-model,.pg-task-billing) {grid-column:1/-1;min-width:0;}
.pg-video-task strong {font-size:14px;line-height:1.5;font-weight:650;}
.pg-video-task :is(time,.pg-task-model,.pg-task-billing) {font-size:12px;color:var(--pg-muted);line-height:1.5;overflow-wrap:anywhere;}
.pg-task-state {font-size:12px;line-height:1.6;color:var(--accent-dark);font-weight:600;}
.pg-task-state[data-status=needs_reconciliation] {color:var(--warning-text,#8b450f);}
body #page-playground #panel-video {padding:0;scroll-padding-block:20px;overscroll-behavior:contain;}
body #page-playground #panel-video {scroll-padding-bottom:180px;}
body #page-playground #videoCreation :is(input,select,textarea) {scroll-margin-block:20px 180px;}
body #page-playground #videoCreation,body #page-playground .pg-video-detail {width:min(100%,880px);margin:0 auto;padding:28px 32px 24px;flex:none;min-width:0;}
.pg-video-intro {margin-bottom:22px;}
.pg-video-intro h2 {font-size:clamp(24px,2.2vw,30px);font-weight:650;letter-spacing:-.025em;line-height:1.35;margin:0 0 10px;color:var(--pg-ink);}
.pg-video-intro>p {font-size:14px;line-height:1.7;color:var(--pg-muted);margin:0;}
.pg-video-intro .studio-status {display:inline-block;margin-top:12px;}
body #page-playground input[type=checkbox] {accent-color:var(--coral-deep);}
body #page-playground #videoCreation .chat-input-box {padding:22px;gap:18px;overflow:visible;}
body #page-playground #videoCreation .chat-input-box:focus-within {border-color:var(--pg-line);box-shadow:none;}
body #page-playground #vidPromptInput {padding:12px;min-height:112px;max-height:280px;border:1px solid var(--pg-line);border-radius:12px;background:var(--surface-solid);resize:vertical;}
body #page-playground #videoModelSlot .pg-composer-model {background:var(--pg-canvas);min-height:48px;}
body #page-playground #videoCreation .video-references {padding:14px;margin:0;}
body #page-playground .pg-video-submit {position:sticky;bottom:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 -6px -6px;padding:14px 6px 6px;border-top:1px solid var(--pg-line);background:var(--pg-paper);}
body #page-playground #videoReservationSummary {flex:1;min-width:150px;margin:0;font-size:13px;line-height:1.6;color:var(--pg-muted);}
body #page-playground #vidGenBtn {min-height:46px;padding:12px 18px;flex:none;background:var(--coral-deep);background-image:var(--phoenix-flame);color:#fff;cursor:pointer;font-weight:600;}
body #page-playground #vidGenBtn:disabled {background:var(--pg-canvas);color:var(--pg-muted);opacity:1;cursor:not-allowed;}
.pg-video-billing-note {font-size:12px;line-height:1.8;color:var(--pg-muted);margin:16px 0 0;}
.pg-field-error {display:block;font-size:13px;line-height:1.6;color:var(--danger-text,#a32d20);margin-top:6px;}
.pg-video-validation {padding:12px;border-radius:10px;border:1px solid var(--danger-text,#a32d20);}
body #page-playground .pg-video-validation button {padding:0;min-height:44px;white-space:normal;text-align:left;background:transparent;border:0;color:var(--danger-text,#a32d20);text-decoration:underline;}
.pg-video-notice {font-size:13px;line-height:1.8;padding:12px 14px;border-radius:10px;background:var(--pg-canvas);color:var(--pg-ink);overflow-wrap:anywhere;}
.pg-video-detail h2 {margin:24px 0 12px;font-size:24px;line-height:1.4;color:var(--pg-ink);}
.pg-video-totals {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 24px;padding:20px 0;border-block:1px solid var(--pg-line);font-size:14px;line-height:1.6;}
.pg-video-totals dt {color:var(--pg-muted);}
.pg-video-totals dd {margin:0;text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;}
.pg-video-detail video {display:block;width:100%;max-height:480px;border-radius:14px;margin-top:24px;}
.pg-task-technical {margin-top:24px;border-top:1px solid var(--pg-line);}
.pg-task-technical summary {display:flex;align-items:center;min-height:48px;font-size:13px;color:var(--pg-muted);cursor:pointer;}
.pg-task-technical p {font-size:12px;line-height:1.8;overflow-wrap:anywhere;}
/* The image surface is a usable draft desk, not a simulated generator. */
body #page-playground #panel-image {padding:0;overscroll-behavior:contain;scroll-padding-block:20px 160px;}
body #page-playground #imageCreation {width:min(100%,880px);margin:0 auto;padding:32px;min-width:0;background:transparent;}
.pg-media-intro {margin-bottom:20px;}
.pg-media-intro h2 {font-size:clamp(24px,2.2vw,30px);font-weight:650;letter-spacing:-.025em;line-height:1.35;margin:0 0 10px;color:var(--pg-ink);}
.pg-media-intro p {font-size:14px;line-height:1.7;color:var(--pg-muted);margin:0;}
.pg-media-availability {font-size:14px;line-height:1.8;color:var(--pg-ink);background:var(--pg-canvas);border:1px solid var(--pg-line);padding:14px 16px;border-radius:12px;margin:0 0 24px;}
body #page-playground #imageCreation .chat-input-box {padding:22px;gap:14px;}
body #page-playground #imageCreation .chat-input-box:focus-within {border-color:var(--pg-line);box-shadow:none;}
body #page-playground #imgPromptInput {width:100%;min-height:220px;max-height:420px;padding:14px;border:1px solid var(--pg-line);border-radius:12px;background:var(--surface-solid);resize:vertical;scroll-margin-block:20px 160px;}
.pg-image-draft-meta {display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:12px;line-height:1.6;color:var(--pg-muted);}
body #page-playground .pg-image-actions {position:sticky;bottom:0;z-index:1;flex-wrap:wrap;gap:8px;padding:12px 0 0;background:var(--pg-paper);}
body #page-playground .pg-image-actions button {min-height:44px;white-space:normal;}
body #page-playground #imageDraftCopy {background:var(--coral-deep);background-image:var(--phoenix-flame);color:#fff;}
body #page-playground #imgGenBtn {margin-left:auto;color:var(--pg-muted);background:var(--pg-canvas);opacity:1;}
.pg-media-privacy {font-size:12px;line-height:1.8;color:var(--pg-muted);margin:16px 0 0;}
body #page-playground #imageCreation .gen-output-area {min-height:0;margin-top:24px;padding:0;background:transparent;}
body #page-playground #imageHistoryUse {min-height:44px;margin-top:12px;}
body #page-playground #imageHistorySection {margin-top:24px;padding:20px 0 0;background:transparent;}
body #page-playground #imageHistoryTitle {font-size:14px;line-height:1.5;letter-spacing:0;text-transform:none;color:var(--pg-ink);margin:0 0 14px;}
body #page-playground #panel-video .form-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;}
body #page-playground #panel-video [hidden], [data-video-bands][hidden] {display:none!important;}
@media(max-width:900px){body #page-playground[data-mode=video] .pg-history {width:min(308px,86%);}body #page-playground #videoCreation,body #page-playground .pg-video-detail {padding:24px 18px max(18px,env(safe-area-inset-bottom));}}
@media(max-width:600px){body #page-playground #videoCreation .chat-input-box {padding:16px;gap:16px;}body #page-playground .pg-video-controls-slot .extra-params {grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}.pg-video-controls-slot .field-label {font-size:12px;}body #page-playground .pg-video-controls-slot select {padding-inline:8px;font-size:14px;}body #page-playground #vidGenBtn {width:100%;}.pg-video-intro {margin-bottom:18px;}.pg-video-totals {gap:12px;}}
@media(max-width:900px){body #page-playground #imageCreation {padding:24px 18px;}}
@media(max-width:600px){
  body #page-playground .pg-configuration:not([open]) {width:44px;}
  body #page-playground .pg-settings-icon {display:block;}
  body #page-playground .pg-configuration:not([open]) > summary {padding:10px;}
  body #page-playground .pg-configuration:not([open]) .pg-settings-label {display:none;}
  body #page-playground .pg-configuration[open] .pg-settings-label {display:inline;}
  body #page-playground #conversationExportBtn {margin-right:48px;}
  body #page-playground .pg-tabs {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:0 10px 8px;min-height:58px;overflow:visible;}
  body #page-playground .pg-tab {min-width:0;min-height:48px;white-space:normal;line-height:1.35;justify-content:center;padding:8px 6px;font-size:13px;}
  body #page-playground .pg-tab svg {display:none;}
  body #page-playground #imageCreation .chat-input-box {padding:16px;}
  body #page-playground #imgPromptInput {min-height:200px;}
  body #page-playground #imgGenBtn {margin-left:0;}
  body #page-playground .pg-image-actions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
  body #page-playground #imgGenBtn {grid-column:1/-1;}
}
[data-video-bands] .form-grid, [data-profiles] .form-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px;align-items:end;margin:12px 0;}
[data-video-bands] input, [data-profiles] input {min-width:0;width:100%;}
[data-video-bands] button, [data-profiles] button, [data-video-add], [data-profiles] ~ [data-add] {min-height:44px;}
.modal .video-config-toggle {display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;min-height:44px;}
.modal .video-config-toggle input[type=checkbox] {flex:none;width:18px;height:18px;min-height:18px;margin:0;accent-color:var(--coral-deep);}