/* Hengyang's existing emblem and blue/gold interface palette.
   These rules style application controls; video frames and exported typography
   continue to use each project's saved rendering configuration. */
:root {
  --bg:#e3e9f1; --paper:#fff; --ink:#162c46; --muted:#52657e;
  --line:#b5c3d3; --lime:#f5e8d4; --green:#284d77; --sidebar:#cbd8e8;
  --navy:#0e3264; --gold:#c49a60; --gold-line:#d8bf9b;
  --gold-soft:#f5e8d4; --inset:#e9eff7; --radius:8px;
  font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:14px; color:var(--ink); background:var(--bg);
}
body { background:var(--bg); }
button,input,textarea,select { font-family:inherit; }
button,a,input,textarea,select,summary { outline-color:var(--gold); }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:2px solid var(--gold);outline-offset:3px; }
.sidebar { width:88px;padding:8px 6px 16px;background:var(--sidebar);color:#355476;border-right:1px solid #adbed4;align-items:center;z-index:15; }
.brand { display:block;width:76px;height:76px;flex:0 0 76px;margin:0 0 39px;letter-spacing:0; }
.brand img { display:block;width:76px;height:76px;object-fit:contain;padding:3px;border-radius:50%;background:#eaf0f7;box-shadow:0 0 0 1px var(--gold-line); }
.rail-navigation { display:flex;flex-direction:column;align-items:center;gap:25px;width:100%; }
.sidebar .rail-button { position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:76px;min-height:76px;margin:0;padding:12px 2px;border:1px solid transparent;border-radius:6px;background:transparent;color:#355476;font-size:13px;font-weight:400;line-height:1.5;text-align:center; }
.sidebar .rail-button svg { width:25px;height:25px;stroke-width:1.65; }
.sidebar .rail-button:hover { background:#c5d4e6;border-color:#a7bdd7;color:#24466e; }
.sidebar .rail-button[aria-expanded=true] { background:#f3e7d7;border-color:#d6c3a9;box-shadow:inset 3px 0 #ccab7f;color:#345372; }
.sidebar .rail-button>span { display:block;margin:0;font-size:13px;color:inherit; }
.sidebar .rail-button>[hidden] { display:none; }
.sidebar .rail-count { position:absolute;top:3px;right:5px;min-width:17px;height:17px;padding:0 3px;border-radius:8px;background:#eaf0f7;font-size:9px!important;line-height:17px; }
.sidebar .sidebar-bottom { display:flex;flex-direction:column;align-items:center;margin-top:auto;padding-top:25px;width:100%; }
.local-note { border:0;margin:12px 0 0;padding:0;gap:5px;align-items:center;color:#52657e;font-size:10px; }
.local-note i { margin:0;background:#527d6b; }
.project-panel { position:fixed;z-index:25;left:100px;top:126px;width:280px;max-height:calc(100vh - 155px);padding:14px;border:1px solid #afbed1;border-radius:8px;background:#fff;box-shadow:0 14px 40px #0e326425; }
.project-panel[hidden] { display:none; }
.project-panel-heading { padding:2px 8px 12px;border-bottom:1px solid #d9e2ed;color:var(--navy);font-size:16px;font-weight:650; }
.project-panel-heading small { display:block;margin-top:5px;color:var(--muted);font-size:11px;font-weight:400; }
.project-list { display:block;margin-top:8px;max-height:calc(100vh - 255px);overflow:auto; }
.project-link { padding:11px 10px;color:#344c66;font-size:12px; }
.project-link small { color:#62778d;font-size:10px; }
.project-link:hover { background:#edf2f8; }
.project-link.active { background:var(--gold-soft);color:#284d77;box-shadow:inset 3px 0 var(--gold); }
.workspace { margin-left:88px;min-height:100vh; }
.topbar { min-height:76px;height:76px;padding:12px 24px;background:#f7f9fc;border-bottom:1px solid #d8c7af;box-shadow:inset 0 -2px #eee2d1;gap:20px;color:#52657e; }
.brand-wordmark { display:flex;align-items:baseline;gap:16px;min-width:0;flex-wrap:wrap; }
.brand-wordmark h1 { margin:0;color:var(--navy);font-size:23px;font-weight:700;line-height:1.3;letter-spacing:-.4px;white-space:nowrap; }
.brand-wordmark>span { color:#52657e;font-size:14px;white-space:nowrap; }
.topbar-right { display:flex;align-items:center;gap:20px;min-width:0;font-size:13px;color:#52657e; }
.topbar .connection-status { display:flex;align-items:center;gap:7px;white-space:nowrap;color:#52657e; }
.status-dot { background:#527d6b; }
.workspace-location { display:flex;align-items:center;gap:9px;min-width:0;max-width:250px;padding:10px 14px;border:1px solid #b5c3d3;border-radius:6px;background:#f1f5fa;color:var(--navy); }
.workspace-location svg { width:21px;height:21px; }
#breadcrumb { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:500; }
.section-nav.workflow-nav { display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:14px;margin:7px 24px 0;padding:6px 16px;min-height:54px;border:1px solid #c2cedd;border-radius:8px;background:#fff;box-shadow:0 1px 3px #223d600a; }
.workflow-nav .section-button { display:flex;align-items:center;justify-content:center;gap:12px;flex:1;min-height:41px;margin:0;padding:9px 15px;border:1px solid transparent;border-radius:6px;background:transparent;color:#3f5774;font-size:15px;white-space:nowrap; }
.workflow-nav .section-button>span { display:inline;font-size:15px;color:inherit; }
.workflow-nav .section-button svg { width:24px;height:24px;stroke-width:1.65; }
.workflow-nav .section-button:hover { background:#e8eef6;border-color:#b5c3d3; }
.workflow-nav .section-button.active,#open-slicer.section-button.active { background:var(--gold-soft);color:#284d77;border:1px solid var(--gold-line);box-shadow:inset 0 -2px var(--gold);font-weight:650; }
.workflow-nav .section-button.active svg { color:#98713f; }
.workflow-separator { color:#5c7390;font-size:23px;font-weight:300; }
main { max-width:none;margin:0;padding:25px 24px 32px; }
.page-heading { margin-bottom:22px;align-items:center; }
.page-heading h1,.batch-page .page-heading h1,.rename-title { color:var(--navy);font-size:23px;font-weight:700;letter-spacing:-.3px; }
.page-heading p { color:#52657e;font-size:13px;line-height:1.8;margin-top:8px; }
.eyebrow { display:none; }
.button { border-color:#9aafc7;border-radius:6px;color:#355476;font-size:12px;font-weight:500;min-height:38px; }
.button:hover:not(:disabled) { border-color:#879eb8;background:#e9eff7;transform:none; }
.button.lime { background:var(--gold-soft);border-color:var(--gold-line);color:#284d77;box-shadow:inset 0 -2px var(--gold);font-weight:650; }
.button.lime:hover:not(:disabled) { background:#f1dfc4;border-color:#c7aa7f; }
.button.dark { background:var(--navy);border-color:var(--navy);color:#fff; }
.button.dark:hover:not(:disabled) { background:#17467d;border-color:#17467d; }
.button.small { font-size:11px;border-radius:5px; }
.button.ghost { color:#355476; }
.button span:first-child { font-size:inherit; }
.text-button,.icon-button { color:#355476; }
.icon-button:hover { color:var(--navy);background:#e9eff7; }
.grid { gap:20px; }
.card,.batch-page .batch-section,.batch-page .batch-result-card,.batch-page .batch-history,.slicer-workspace .batch-history { border:1px solid #afbed1;border-radius:8px;background:#fff;box-shadow:0 2px 5px #223d600a; }
.card,.batch-page .batch-section { padding:22px;box-shadow:inset 0 2px #e2c5a4,0 2px 5px #223d600a; }
.card-head { border-bottom:1px solid #e2d5c4;padding-bottom:13px; }
.card-head h2 { color:#162c46;font-size:20px;font-weight:650; }
.card-head h2>span { display:none; }
.card-head .counter,.counter { color:#52657e;background:#eef3f9;border-color:#c2cedd; }
.form-label,.field>label,.checkline,.batch-history,.slide-inline-field,.slide-text-mode label,.slide-text-controls label,.music-trim-simple>label { color:#344c66;font-size:13px; }
.form-input,textarea,select { color:#243f5f;background:#f7f9fc;border:1px solid #a8bad0;border-radius:5px;font-size:13px; }
.form-input:focus,textarea:focus,select:focus { outline:2px solid #c49a604d;outline-offset:1px;border-color:var(--gold); }
input[type=checkbox],input[type=radio],input[type=range],progress { accent-color:var(--navy); }
.muted,.help-line,.subtle,.notice,.modal-description,.slide-save-note,.slide-first-meta,.batch-result-card>small,.batch-result-title span,.batch-music-credit,.batch-copy-preview small,.batch-summary small,.music-project-license { color:#60738b; }
.help-line { font-size:11px;line-height:1.8; }
.pill { color:#355476;background:#e9eff7;border-radius:4px; }
.badge-number { background:var(--gold-soft);color:#284d77; }
.rule-note { color:#52657e;background:#edf2f8;border:1px solid #c2cedd;border-radius:5px; }
.rule-note strong { color:#284d77;font-size:12px; }
.rule-banner { border-color:#afbed1;background:#edf2f8;color:#52657e;border-radius:6px; }
.rule-banner strong { color:#284d77; }
.dropzone { background:#f7f9fb;border:1px dashed #9fb3c8;border-radius:5px; }
.dropzone:hover,.dropzone.drag { border-color:var(--gold);background:#fcf7ef; }
.dropzone b { color:#243d58;font-size:13px; }
.dropzone small { color:#62788d;font-size:11px; }
.drop-icon { color:var(--navy);background:#faf5ed;border-color:#e4ccb0; }
.stepper { background:#fff;border-color:#c2cedd;border-radius:8px; }
.step { color:#60738b; }
.step b { background:#f0f4f9;border-color:#bdcbdc;color:#52657e; }
.step.active { color:var(--navy); }
.step.active b { background:var(--gold-soft);border-color:var(--gold-line);color:#284d77; }
.step.done b { background:#e4ecf6;border-color:#b5c3d3;color:var(--navy); }
.step.done { color:#355476; }
.mode { border-radius:6px; }
.mode.selected { background:var(--gold-soft);border-color:var(--gold-line);box-shadow:inset 0 -2px var(--gold); }
.mode small,.setting-row,.stat small { color:#60738b; }
.mode strong,.stat b { color:#284d77; }
.setting-row strong { color:#344c66; }
.source-card,.source-meta,.asset-card { background:#f4f7fa;border-color:#bdcbdc; }
.asset-image { background:#e9eff7; }
.asset-name { color:#243f5f; }
.asset-bottom small,.source-info small,.source-meta { color:#60738b; }
.preview-placeholder { background:#f4f7fa;border-color:#bdcbdc;color:#52657e; }
.timeline-item { background:#e0e9f4;color:#355476; }
.timeline-item.avatar { background:#efdcbf;color:#284d77; }
.legend-dot { background:#a3b9d3; }
.legend-dot.avatar { background:#d0ad7c; }
.timeline-legend,.timeline-row,.time-axis { color:#52657e; }
.progress-box { background:#edf2f8;border-color:#c2cedd;color:#355476; }
.progress-track { background:#dbe4ef; }
.progress-fill { background:#345b88; }
.batch-page .batch-workspace { gap:20px; }
.batch-page .batch-section { margin-bottom:18px;padding:22px; }
.batch-page .batch-section h3 { color:#162c46;font-size:20px;margin:0 0 14px;padding-bottom:13px;border-bottom:1px solid #e2d5c4; }
.batch-page .batch-history,.slicer-workspace .batch-history { padding:14px 17px; }
.batch-history select { background:#f5f8fb; }
.batch-copy-stats { background:#e9eff7;border:1px solid #c3d0df;color:#345476;border-radius:5px;font-size:12px; }
.batch-copy-stats.has-error { background:#fff3ee;color:#a94d3c;border-color:#e1b8aa; }
.batch-page .batch-summary { background:#e9eff7;border:1px solid #b5c3d3;border-radius:6px;color:#284d77; }
.batch-summary>b { color:var(--navy); }
.batch-empty { background:#f7f9fc;border:1px dashed #afbed1;border-radius:6px;color:#62778d; }
.batch-page .batch-result-card { padding:19px 20px;margin-top:14px; }
.batch-result-title { color:var(--navy);font-size:13px; }
.batch-copy-preview>div { background:#f1f5f9;border:1px solid #e0e7ef;border-radius:4px; }
.batch-copy-preview p { color:#243f5f; }
.batch-image-strip img { border-radius:4px;background:#e3e9f1; }
.batch-result-card progress { accent-color:var(--navy); }
.batch-heading-actions .lime { min-height:42px;font-size:13px; }
.batch-heading-status { color:#52657e; }
.batch-heading-status.has-error { color:#b24f40; }
.batch-video-audio-options { background:#e9eff7;border-color:#b5c3d3;border-radius:5px; }
.batch-preview-stage { background:#dbe4ef;border-radius:6px; }
.batch-type-preview { border-color:#b5c3d3; }
.slide-card { border-color:#b5c3d3;border-radius:6px; }
.slide-card:hover { border-color:#879eb8; }
.slide-photo { background:#e9eff7; }
.slide-icon { color:#355476;background:#f1f5faed; }
.slide-icon:hover:not(:disabled) { background:#e0e9f4; }
.slide-card-body select,.slide-inline-field input,.music-trim-simple input { background:#f7f9fc;border-color:#a8bad0;color:#344c66; }
.slide-music-info { background:#e9eff7;border-color:#b5c3d3;color:#355476; }
.slide-music-info small,.slide-music-info strong,.music-more>summary { color:#52657e; }
.text-template { border-color:#b5c3d3; }
.text-template.selected { border-color:var(--gold);box-shadow:inset 0 -2px var(--gold); }
.text-template>strong,.text-template>small,.text-frame-status,.text-photo-nav,.text-selection-note { color:#52657e; }
.text-style-grid label,.text-effect-detail label { color:#344c66; }
.text-canvas-wrap { background:#e9eff7;border-color:#b5c3d3; }
.music-library-toolbar select { background:#f7f9fc;color:#344c66; }
.music-library-toolbar label,.music-library-curation span,.music-library-count,.music-library-card>p,.music-library-license,.music-library-player small,.music-library-card-head small,.music-library-empty { color:#60738b; }
.music-library-player,.music-library-symbol,.music-library-license pre { background:#e9eff7;color:#355476;border-color:#b5c3d3; }
.music-library-player b,.music-library-card h3,.music-library-current { color:#284d77; }
.music-library-card { border-color:#b5c3d3;border-radius:6px; }
.music-library-card.current { background:#fcf8f1;border-color:var(--gold); }
.music-library-tags>* { background:#edf2f8;color:#52657e; }
.music-library-tags>b { background:var(--gold-soft);color:#284d77; }
.music-library-license a { color:#284d77;text-decoration:underline; }
.welcome { color:#162c46; }
.welcome h1,.welcome h1 span { color:var(--navy); }
.welcome-top p,.welcome-card p { color:#52657e; }
.welcome-card { background:#fff;border:1px solid #afbed1;border-radius:8px; }
.welcome-card h3,.welcome-card .number { color:#284d77; }
.welcome-ribbon { background:#e9eff7;border-color:#b5c3d3;color:#52657e; }
dialog { border:1px solid #afbed1;border-radius:9px;color:#162c46;box-shadow:0 20px 70px #0e326438; }
dialog::backdrop { background:#132c4c59;backdrop-filter:blur(2px); }
.modal-head h2 { color:var(--navy); }
.modal-actions { border-color:#c2cedd; }
.toast { left:calc(50% + 44px);background:#173b67;color:#fff;border-radius:6px; }
.toast.error { background:#8b463d; }
footer { margin:0 24px;padding:15px 0;border-color:#bac8d8;color:#60738b;font-size:10px; }
@media (min-width:1600px) {
  .topbar { padding-left:28px;padding-right:28px; }
  main { padding-left:28px;padding-right:28px; }
  .section-nav.workflow-nav { margin-left:28px;margin-right:28px; }
}
@media (max-width:1100px) {
  .brand-wordmark { gap:6px;flex-direction:column; }
  .brand-wordmark>span { font-size:11px; }
  .topbar-right { gap:12px; }
  .workspace-location { max-width:180px; }
  .workflow-nav .section-button { font-size:13px;gap:8px;padding:9px 10px; }
  .workflow-nav .section-button>span { font-size:13px; }
  .workflow-nav .section-button svg { width:21px;height:21px; }
  .section-nav.workflow-nav { gap:6px; }
  .batch-page .batch-workspace { grid-template-columns:minmax(0,1fr); }
  .batch-page .batch-results { padding-top:18px;border-top:1px solid #b5c3d3; }
}
@media (max-width:850px) {
  .sidebar { width:76px;padding-left:4px;padding-right:4px; }
  .brand,.brand img { width:66px;height:66px; }
  .brand { flex-basis:66px;margin-bottom:30px; }
  .sidebar .rail-button { width:66px; }
  .sidebar .rail-button>span { font-size:11px; }
  .sidebar .nav-current,.sidebar .sidebar-bottom { display:flex; }
  .workspace { margin-left:76px; }
  .topbar { height:76px;padding:10px 18px; }
  .brand-wordmark h1 { font-size:21px; }
  .connection-status { display:none; }
  main { padding:22px 18px; }
  .section-nav.workflow-nav { margin-left:18px;margin-right:18px;gap:3px;padding:5px 7px;overflow-x:auto; }
  .workflow-nav .section-button { flex:1 0 auto;min-height:43px;padding:8px;gap:6px; }
  .workflow-nav .section-button>span { display:inline;font-size:12px; }
  .workflow-separator { font-size:17px; }
  .project-panel { left:85px; }
}
@media (max-width:600px) {
  .topbar { height:84px;min-height:84px;padding:10px 14px;gap:8px; }
  .brand-wordmark h1 { font-size:19px; }
  .brand-wordmark>span { font-size:10px; }
  .workspace-location { padding:8px;max-width:100px; }
  .workspace-location svg { display:none; }
  #breadcrumb { font-size:10px; }
  .section-nav.workflow-nav { margin:8px 12px 0; }
  .workflow-nav .section-button { flex-direction:column;min-width:78px;gap:4px; }
  .workflow-nav .section-button>span { font-size:11px; }
  .workflow-nav .section-button svg { width:20px;height:20px; }
  .workflow-separator { display:none; }
  main { padding:20px 12px; }
  .card,.batch-page .batch-section { padding:17px; }
  .page-heading h1,.batch-page .page-heading h1,.rename-title { font-size:21px; }
  .page-heading p { font-size:12px; }
  .project-panel { left:82px;top:110px;width:min(280px,calc(100vw - 92px)); }
  .batch-page .batch-section h3 { font-size:16px; }
  .heading-actions { flex-wrap:wrap; }
  .toast { left:calc(50% + 38px); }
  footer { margin:0 12px; }
}
@media (max-width:480px) {
  .workspace-location { display:none; }
}

/* Keep random selection out of the editor's main layout. */
.text-random-card { display:flex;flex-direction:column; }
.text-random-actions { display:flex;gap:6px;flex-wrap:wrap;margin-top:7px; }
.text-random-actions button { flex:1;white-space:nowrap;padding:6px 8px;border:1px solid #b5c3d3;border-radius:5px;background:#fff;color:#344c66;font-size:11px; }
.text-random-actions button:hover { background:var(--gold-soft);border-color:var(--gold); }
.random-picker { width:min(860px,92vw);max-height:85vh;padding:0;border:1px solid #b5c3d3;border-radius:14px;background:#fff;color:var(--navy);box-shadow:0 20px 80px #0e326440; }
.random-picker::backdrop { background:#102c4b66;backdrop-filter:blur(3px); }
.random-picker header { display:flex;align-items:center;justify-content:space-between;padding:22px 26px;border-bottom:1px solid #dce3ec; }
.random-picker h2 { margin:0;font-size:21px; }
.random-picker header p { margin:8px 0 0;color:#52657e;font-size:13px; }
.random-picker-search { padding:16px 24px 0; }
.random-picker-options { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:24px;max-height:52vh;overflow:auto; }
.random-picker-options.font-options { grid-template-columns:repeat(3,minmax(0,1fr)); }
.random-picker-option { display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #c7d2df;border-radius:9px;background:#f8fafc;cursor:pointer;min-width:0; }
.random-picker-option:has(:checked) { border-color:var(--gold);background:var(--gold-soft);box-shadow:inset 0 0 0 1px var(--gold); }
.random-picker-option input { flex:0 0 auto;width:17px;height:17px;accent-color:var(--navy); }
.random-picker-option>span { min-width:0;flex:1; }
.random-picker-option strong,.random-picker-option small,.random-picker-option [data-font-sample] { display:block;overflow-wrap:anywhere; }
.random-picker-option strong { font-size:13px; }
.random-picker-option small { margin-top:5px;font-size:10px;color:#52657e; }
.random-picker-option [data-font-sample] { margin-top:10px;font-size:19px; }
.random-picker-option[hidden] { display:none; }
.random-picker footer { display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;padding:16px 24px;border-top:1px solid #dce3ec;background:#f8fafc;font-size:13px; }
.random-picker footer>div { display:flex;gap:10px; }
@media(max-width:700px) { .random-picker-options.font-options { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.batch-color-control { display:flex;align-items:center;gap:8px; }
.batch-color-control input[type=color] { flex:0 0 44px;width:44px;height:39px;border:1px solid #a8bad0;border-radius:5px;padding:3px;background:#f7f9fc;cursor:pointer; }
.batch-color-control select { min-width:0;flex:1; }
.random-picker-option .random-color-swatch { flex:0 0 44px;width:44px;height:44px;border-radius:8px;border:1px solid #0e326433; }

.batch-color-swatch { flex:0 0 44px;width:44px;height:39px;border:1px solid #a8bad0;border-radius:5px;background:#ffe381;box-shadow:inset 0 0 0 4px #f7f9fc;cursor:pointer; }
.random-picker-options:has(.random-color-swatch) { grid-template-columns:repeat(4,minmax(0,1fr)); }
.random-picker-option:has(.random-color-swatch) { position:relative;flex-direction:column;align-items:stretch;padding:10px;gap:9px;text-align:center; }
.random-picker-option:has(.random-color-swatch)>input { position:absolute;top:15px;right:14px;margin:0; }
.random-picker-option .random-color-swatch { flex:none;width:100%;height:58px;border-radius:6px; }
@media(max-width:600px) { .random-picker-options:has(.random-color-swatch) { grid-template-columns:repeat(3,minmax(0,1fr)); } }

/* Batch: independently scrolling controls and a continuously visible preview. */
body.batch-workbench-active { height:100dvh;overflow:hidden; }
body.batch-workbench-active .workspace { height:100dvh;min-height:0;overflow:hidden; }
body.batch-workbench-active .topbar,body.batch-workbench-active .workflow-nav { flex-shrink:0; }
body.batch-workbench-active .workspace>footer { display:none; }
main.batch-page { display:flex;flex-direction:column;flex:1;min-height:0;padding-top:16px;padding-bottom:14px;overflow:hidden; }
#batch-page { display:flex;flex-direction:column;flex:1;min-height:0; }
.batch-page .page-heading { flex-shrink:0;margin-bottom:10px; }
.batch-page .page-heading p { margin-top:6px; }
.batch-view-tabs { display:flex;gap:6px;flex-shrink:0;margin:0 0 12px;border-bottom:1px solid #b5c3d3; }
.batch-view-tabs button { padding:10px 20px;border:0;border-bottom:3px solid transparent;background:transparent;color:#52657e;font-size:14px; }
.batch-view-tabs button.active { color:var(--navy);font-weight:650;border-bottom-color:var(--gold); }
.batch-page .batch-workspace { flex:1;min-height:0;overflow:hidden;align-items:stretch;grid-template-columns:minmax(300px,1fr) minmax(280px,.95fr);gap:18px; }
.batch-page .batch-form { height:100%;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:0 10px 8px 0; }
.batch-live-preview { min-height:0;min-width:0;overflow:hidden;display:flex;flex-direction:column;padding:18px;background:#fff;border:1px solid #afbed1;border-radius:8px;box-shadow:inset 0 2px #e2c5a4; }
.batch-live-preview .batch-type-preview { display:flex;flex:1;flex-direction:column;min-height:0;margin:0;padding:0;border:0; }
.batch-live-preview .batch-preview-heading,.batch-live-preview p,.batch-live-preview select,.batch-live-preview label { flex-shrink:0; }
.batch-live-preview .batch-preview-heading { margin-bottom:4px; }
.batch-live-preview .batch-preview-stage { flex:1;min-height:0;margin-top:8px;overflow:hidden; }
.batch-live-preview .batch-preview-stage img { max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain; }
.batch-live-preview #batch-text-fonts,.batch-live-preview #batch-text-status { font-size:11px;line-height:1.5;margin:5px 0; }
.batch-live-preview .batch-type-preview>p:last-child { font-size:10px;line-height:1.5;margin-bottom:0; }
.batch-page #batch-output-page { flex:1;min-height:0;overflow-y:auto;padding:0 10px 10px 0;border:0; }
.batch-page #batch-edit-page[hidden],.batch-page #batch-output-page[hidden] { display:none!important; }
.batch-page #batch-output-page .batch-history { position:sticky;top:0;z-index:1;background:#fff; }
.batch-page #batch-output-page .batch-empty { padding:50px 25px; }
@media(max-width:1000px) { .batch-page .batch-workspace { grid-template-columns:minmax(260px,1fr) minmax(220px,.85fr);gap:12px; } .batch-live-preview { padding:12px; } .batch-page .page-heading p { display:none; } }
@media(max-width:650px) { .batch-page .batch-workspace { grid-template-columns:1fr;grid-template-rows:minmax(180px,.8fr) minmax(220px,1.2fr); } .batch-live-preview { grid-row:1; } .batch-page .batch-form { grid-row:2; } .batch-live-preview .batch-type-preview>p:last-child { display:none; } .batch-view-tabs button { padding:7px 14px; } }

/* Reserve more of the viewport for the live canvas. */
.batch-page .page-heading p { display:none; }
.batch-page .page-heading { margin-bottom:6px; }
.batch-page .page-heading h1 { font-size:21px; }
.batch-live-preview #batch-text-status { max-height:34px;overflow:auto; }

.batch-page .page-heading { align-items:center;margin-bottom:10px; }
.batch-page .page-heading .batch-view-tabs { margin:0;border:0; }
.batch-live-preview { padding:12px; }
.batch-live-preview #batch-text-status { white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-height:18px; }
.batch-live-preview .batch-type-preview>p:last-child { display:none; }
@media(max-width:750px) { .batch-page .page-heading { flex-wrap:wrap;gap:5px; } .batch-view-tabs button { padding:7px 10px; } }