/* BOLUO V2: official tokens, existing product interactions. */
body { line-height: 24px; }
h1 { font-size: 28px; line-height: 36px; font-weight: 600; }
h2 { font-weight: 500; }
.small { line-height: 22px; }
.btn, .chip, .nav a { font-weight: 500; }
.btn:active { transform: none; background: var(--bg-sunken); }
.btn.primary:active { background: var(--action-pressed); }
.btn:disabled, .btn[aria-disabled=true] { opacity: 1; background: var(--action-disabled); border-color: var(--action-disabled); color: var(--ink-disabled); }
.btn.icon-only { width: 44px; height: 44px; }
.btn.danger-solid { color: var(--on-danger); }
.chip.on { background: var(--action); color: var(--on-action); border-color: var(--action); }
input[type=text], input[type=search], input[type=email], input[type=password], input[type=number], select, textarea { border-radius: 8px; padding: 9px 12px; background-color: var(--bg-sunken); }
input[type=search] { background: var(--bg-sunken); }
select { padding-right: 40px; }
input::placeholder, textarea::placeholder { color: var(--ink-muted); }
.notice { border: 1px solid var(--line); }
.notice.danger, .notice.ok { border-color: transparent; }
.progress { height: 4px; border-radius: 0; }
.progress > i { background: var(--action); }
.dots i { width: 8px; height: 8px; border-radius: 0; animation-duration: 900ms; }
.spin { border: 0; border-radius: 0; width: 24px; height: 8px; background: currentColor; clip-path: polygon(0 0,25% 0,25% 100%,0 100%,0 0,37.5% 0,62.5% 0,62.5% 100%,37.5% 100%,37.5% 0,75% 0,100% 0,100% 100%,75% 100%,75% 0); animation: blink 900ms infinite; }
.mask, .drawer-mask { background: var(--scrim); }
.mask { z-index: var(--z-modal); }
.modal { box-shadow: none; border-radius: 24px; }
.toasts { z-index: var(--z-toast); left: 24px; bottom: 24px; transform: none; align-items: flex-start; }
.toast { box-shadow: none; }
.panel .panel { border: 0; border-radius: 0; }
.page-head { align-items: center; gap: 24px; margin-bottom: 32px; }
.page-head p { font-size: 14px; line-height: 22px; margin-top: 8px; }
.page-head > .btn { margin-left: auto; }
main { padding: 32px; max-width: none; margin: 0; }
.content { min-width: 0; }
.mobile-bar { display: flex; height: 64px; align-items: center; gap: 16px; padding: 0 32px; border-bottom: 1px solid var(--line); background: var(--bg); position: sticky; top: 0; z-index: 35; font-size: 14px; }
#menuBtn { display: none; }
.workspace-label, .header-caption, .header-divider { color: var(--ink-muted); }
.header-caption { font-size: 12px; }
.mobile-bar b { font-weight: 500; }
.sidebar { padding: 0 12px 12px; gap: 0; background: var(--bg-sunken); }
.sidebar-heading, .secondary-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 64px; flex: none; }
.sidebar .brand { min-width: 0; min-height: 44px; padding: 0 12px; margin: 0; }
.brand-mark, .brand-wordmark { position: relative; display: block; }
.brand-mark { width: 44px; height: 32px; color: var(--ink-strong); }
.brand-wordmark { width: 240px; height: 70px; }
/* 品牌标志：字形随主题黑/白，末尾方块固定品牌紫（brand-logo） */
.brand-mark::before, .brand-mark::after, .brand-wordmark::before, .brand-wordmark::after { content: ""; position: absolute; inset: 0; }
.brand-mark::before { background: currentColor; mask: url('/assets/brand/mask-mark-letters.svg') center / contain no-repeat; }
.brand-mark::after { background: var(--brand-logo); mask: url('/assets/brand/mask-mark-square.svg') center / contain no-repeat; }
.brand-wordmark::before { background: currentColor; mask: url('/assets/brand/mask-wordmark-letters.svg') center / contain no-repeat; }
.brand-wordmark::after { background: var(--brand-logo); mask: url('/assets/brand/mask-wordmark-square.svg') center / contain no-repeat; }
.primary-closed .sidebar { padding-inline: 8px; }
.primary-closed .sidebar-heading { justify-content: center; }
.primary-closed .sidebar .brand { display: none; }
.primary-closed .brand-mark { width: 38px; height: 28px; }
.sidebar .nav { margin-top: 16px; gap: 4px; }
.nav a { position: relative; min-height: 44px; }
.sidebar .nav a, .secondary-nav .nav a { justify-content: flex-start; text-align: left; gap: 12px; padding: 0 12px; }
.nav .nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav a.active { background: var(--bg-raised); color: var(--ink-strong); }
.nav a.active::before { content: ''; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; background: var(--ink-strong); }
.nav-toggle { flex: 0 0 44px; padding: 0; color: var(--ink-muted); }
#primaryToggle, #secondaryToggle { width: 44px; height: 44px; min-height: 44px; justify-content: center; }
.nav-toggle[aria-expanded=false] .icon { transform: scaleX(-1); }
.secondary-nav { display: flex; flex-direction: column; background: var(--bg); padding: 0 12px 12px; }
.secondary-heading { margin: 0; font-size: 14px; }
.secondary-heading > b { padding-left: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.secondary-nav .nav { margin-top: 16px; gap: 4px; overflow-y: auto; min-height: 0; scrollbar-width: thin; }
.secondary-nav .nav a.active { background: var(--bg-sunken); }
.secondary-closed .secondary-nav { padding-inline: 6px; }
.secondary-closed .secondary-heading { display: flex; justify-content: center; }
.secondary-closed .secondary-heading > b { display: none; }
.primary-closed .sidebar .nav a, .secondary-closed .secondary-nav .nav a { justify-content: center; padding: 0; }
.sidebar-divider:hover, .sidebar-divider:focus-visible { background: var(--line-strong); }
.account-area { border-top: 1px solid var(--line); padding-top: 12px; }
.sidebar-footer { margin-top: auto; padding-top: 24px; }
.sidebar-footer > a { display: flex; align-items: center; min-height: 44px; gap: 12px; padding: 0 12px; margin-bottom: 12px; border-radius: 8px; color: var(--ink-muted); font-size: 14px; text-decoration: none; }
.sidebar-footer > a:hover, .sidebar-footer > a.active { background: var(--bg-raised); color: var(--ink-strong); }
.primary-closed .sidebar-footer > a { padding: 0; justify-content: center; }
.account-chevron { margin-left: auto; color: var(--ink-muted); }
.primary-closed .account-chevron { display: none; }
.account-button { background: transparent; min-height: 64px; gap: 12px; }
.account-button:hover, .account-button[aria-expanded=true] { background: var(--bg-raised); }
.account-avatar { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; min-width: 32px; flex: 0 0 32px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--bg-raised); color: var(--ink-strong); font-size: 18px; line-height: 1; font-weight: 500; text-align: center; }
.account-info { gap: 2px; }
#accountId { color: var(--ink-muted); }
#accountPoints { font-weight: 500; }
.account-menu { border: 0; box-shadow: var(--shadow-popover); border-radius: 12px; }
.primary-closed .account-button { padding: 8px; gap: 0; }
@media (min-width: 1200px) {
 .primary-closed .account-button { width: 48px; height: 48px; min-height: 48px; justify-content: center; }
}
.dashboard-intro { margin-bottom: 32px; padding-bottom: 32px; }
.dashboard-summary { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px; margin-top: 40px; }
.dashboard-summary p { gap: 12px; padding-right: 24px; }
.dashboard-summary p + p { border-left: 1px solid var(--line); padding-left: 32px; }
.dashboard-summary span { font-size: 14px; }
.dashboard-summary strong { font: 500 40px/48px var(--font-num); font-variant-numeric: tabular-nums; }
.dashboard-workflow { padding: 24px; background: var(--bg-sunken); border-radius: 16px; gap: 12px; }
.dashboard-workflow > .row { margin-top: 12px; }
.dashboard-recent { margin-top: 40px; }
.dashboard-task { padding: 24px 0; }
.dashboard-task-copy strong { font-weight: 500; }
.dashboard-task > span:last-child { font-weight: 500; }
.dashboard-task:hover { background: var(--bg-sunken); }
.workbench { grid-template-columns: 360px minmax(0,1fr); gap: 24px; }
.steps { top: 88px; max-height: calc(100vh - 112px); scrollbar-width: thin; }
.step-title { font-weight: 500; }
.step-no { border-radius: 4px; width: 24px; height: 24px; font-weight: 500; }
.cards { grid-template-columns: repeat(auto-fill,minmax(min(100%,340px),1fr)); }
.results-head { min-height: 32px; }
.empty.brand-empty { grid-template-columns: 1fr; text-align: center; padding: 64px 24px; gap: 24px; background: var(--bg); border: 1px solid var(--line); }
.empty.brand-empty > div { max-width: 360px; margin-inline: auto; }
.empty-blocks { display: flex; align-items: flex-end; justify-content: center; gap: 8px; width: 120px; height: 80px; margin: 0 auto; }
.empty-blocks i { display: block; width: 36px; height: 64px; background: var(--line); }
.empty-blocks i:nth-child(2) { height: 80px; width: 24px; }
.empty-blocks i:nth-child(3) { height: 24px; width: 24px; background: var(--ink-strong); }
.lib-cover { aspect-ratio: 4 / 3; }
.lib-card { text-decoration: none; }
.lib-detail { grid-template-columns: minmax(280px,360px) minmax(0,1fr); }
.lib-detail > .panel:first-child { max-width: 720px; }
.lib-new { border-width: 1px; }
.mat-del { opacity: 1; }
.account-details { max-width: 720px; }
.account-details.account-ledger { max-width: none; width: 100%; }
.table-scroll { width: 100%; min-width: 0; overflow-x: auto; border-radius: 16px; }
.table-scroll .data-table { display: table; min-width: 760px; white-space: normal; }
.data-table th.numeric, .data-table td.numeric { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.data-table .table-time { width: 140px; white-space: nowrap; color: var(--ink-muted); }
.data-table .table-type { width: 140px; white-space: nowrap; }
.data-table .table-description { min-width: 240px; overflow-wrap: anywhere; }
.data-table .table-message { height: 160px; text-align: center; color: var(--ink-muted); }
.data-table tbody tr:hover { background: var(--bg-sunken); }
.points-change { font-weight: 600; font-variant-numeric: tabular-nums; }
.ledger-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.account-details > .btn { align-self: flex-start; }
.appearance-settings { margin-top: 24px; padding-top: 32px; border-top: 1px solid var(--line); }
.account-space { margin-top: 24px; padding-top: 32px; border-top: 1px solid var(--line); }
.account-space-details { display: grid; gap: 12px; margin: 16px 0 0; font-size: 14px; }
.account-space-details > div { display: flex; gap: 24px; }
.account-space-details dt { width: 80px; color: var(--ink-muted); }
.account-space-details dd { margin: 0; }
.editor { grid-template-columns: minmax(0,1fr) minmax(320px,400px); }
.editor-top { gap: 16px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.editor-top h1 { font-size: 24px; line-height: 32px; }
.editor-heading { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; width: 100%; }
.editor-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px; width: 100%; }
.editor-actions > .small { margin-right: auto; }
.editor-actions > .row { flex-wrap: wrap; }
.tabs button.on { box-shadow: none; border-bottom-color: var(--ink-strong); }
.tbl th { font-size: 12px; line-height: 18px; font-weight: 500; height: 40px; padding-block: 10px; }
.tbl td { min-height: 48px; line-height: 22px; }
.stat b { font-family: var(--font-num); font-weight: 500; font-variant-numeric: tabular-nums; }
.stat-row { grid-template-columns: repeat(4,minmax(0,1fr)); }
.stat-row .stat { min-width: 0; }
.stat-row .stat > span:last-child { display: block; line-height: 22px; }
.admin-content { width: 100%; max-width: 1400px; }
.admin-toolbar { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; }
.admin-toolbar input { max-width: 400px; }
.provider-grid { grid-template-columns: repeat(auto-fill,minmax(min(100%,340px),1fr)); }
.auth-wrap { min-height: 100dvh; grid-template-columns: minmax(0,1fr) minmax(320px,400px); padding: 64px max(48px,calc((100vw - 1200px)/2)); gap: 96px; background: var(--bg); }
.auth-hero { display: flex; flex-direction: column; align-items: flex-start; gap: 64px; }
.auth-hero .display { font: 600 48px/1.25 var(--font-sans); max-width: 10em; letter-spacing: normal; }
.auth-hero p:not(.overline) { margin-top: 24px; font-size: 16px; line-height: 28px; max-width: 34em; color: var(--ink-muted); }
.auth-hero .overline { display: none; }
.auth-card { border: 0; padding: 32px; background: var(--bg-sunken); }
.auth-card > h2 { font-weight: 600; }
.auth-tabs { background: var(--bg); }
.auth-tabs button.on { background: var(--action); color: var(--on-action); }
@container workspace (max-width: 900px) {
 .stat-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .workbench, .lib-detail, .editor, .admin { grid-template-columns: minmax(0,1fr); }
 .workbench .steps { position: static; max-height: none; }
 .lib-detail > .panel:first-child { max-width: none; }
}
@container workspace (min-width: 681px) and (max-width: 900px) {
 .workbench { grid-template-columns: 320px minmax(0,1fr); }
 .workbench .steps { position: sticky; top: 88px; max-height: calc(100vh - 112px); overflow: auto; }
 .workbench .step { padding: 20px 16px; }
}
@media (min-width: 768px) and (max-width: 1199px) {
 main, .shell.has-secondary main { padding: 24px; }
}
@media (max-width: 1199px) {
 .shell, .shell.has-secondary { grid-template-columns: minmax(0,1fr); }
 .sidebar { position: fixed; inset: 0 auto 0 0; width: 240px; height: 100dvh; z-index: 60; transform: translateX(-100%); transition: transform 220ms var(--ease-out); box-shadow: none; }
 .shell.drawer-open .sidebar { transform: none; }
 .drawer-mask { position: fixed; inset: 0; z-index: 55; }
 .primary-closed #sidebar .nav-label, .primary-closed .account-info { display: grid; }
 .primary-closed .sidebar .brand { display: flex; justify-content: flex-start; padding-left: 12px; }
 .primary-closed .sidebar .nav a, .secondary-closed .secondary-nav .nav a { justify-content: flex-start; padding: 0 12px; }
 .primary-closed .sidebar-heading { justify-content: space-between; }
 .primary-closed .sidebar-footer > a { justify-content: flex-start; padding: 0 12px; }
 .primary-closed .account-chevron { display: block; }
 .primary-closed .account-button { gap: 12px; }
 #primaryToggle { display: none; }
 #menuBtn { display: inline-flex; }
 .mobile-bar { padding-inline: 24px; }
 .secondary-nav { position: static; height: auto; padding: 12px 24px; border-right: 0; border-bottom: 1px solid var(--line); grid-column: 1; order: 0; }
 .shell.has-secondary { display: flex; flex-direction: column; }
 .shell.has-secondary .content { display: contents; }
 .shell.has-secondary .mobile-bar { order: -1; }
 .shell.has-secondary main { order: 1; width: 100%; }
 .secondary-heading, #secondaryToggle, .sidebar-divider { display: none; }
 .secondary-nav .nav { flex-direction: row; margin: 0; gap: 8px; }
 .secondary-nav { width: 100%; max-width: 100vw; }
 .secondary-nav .nav { overflow-x: auto; overflow-y: hidden; max-width: 100%; }
 .secondary-nav .nav a { flex: 0 0 auto; }
 .secondary-closed .secondary-nav .nav-label { display: inline; }
 .secondary-closed .secondary-nav { padding: 12px 24px; }
 .auth-wrap { gap: 48px; grid-template-columns: minmax(0,1fr) minmax(300px,380px); padding: 48px 32px; }
 .auth-hero .display { font-size: 36px; }
}
@media (max-width: 767px) {
 .toasts { left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); }
 .panel-head h2 { flex-shrink: 0; }
 .tbl select { min-width: 160px; }
 .admin-content .panel { overflow-x: auto; }
 .admin-content .tbl { min-width: 560px; }
 .stat-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .stat-row .stat { padding: 16px; }
 .stat b { font-size: 24px; line-height: 32px; overflow-wrap: anywhere; }
 main, .shell.has-secondary main { padding: 24px 16px; }
 .mobile-bar { padding-inline: 12px; gap: 8px; }
 .workspace-label, .header-divider, .header-caption { display: none; }
 .secondary-nav, .secondary-closed .secondary-nav { padding: 8px 16px; }
 .page-head { gap: 16px; margin-bottom: 24px; }
 .page-head > .grow { flex-basis: 100%; }
 .page-head > .btn { margin-left: 0; }
 .dashboard-summary { gap: 12px; margin-top: 24px; }
 .dashboard-summary p { padding: 0; }
 .dashboard-summary p + p { padding-left: 12px; }
 .dashboard-summary span { font-size: 12px; }
 .dashboard-summary strong { font-size: 28px; line-height: 36px; }
 .dashboard-workflow { padding: 20px 16px; }
 .dashboard-task { gap: 12px; }
 .dashboard-task > span:last-child { margin-left: auto; }
 .auth-wrap { grid-template-columns: minmax(0,1fr); padding: 32px 24px; gap: 32px; }
 .auth-hero { gap: 32px; }
 .brand-wordmark { width: 180px; height: 52px; }
 .auth-hero .display { font-size: 28px; line-height: 36px; }
 .auth-hero p:not(.overline) { margin-top: 16px; font-size: 14px; line-height: 22px; }
 .auth-card { padding: 24px 16px; }
 .empty.brand-empty { padding: 40px 16px; }
 .editor-top > .btn.primary { width: 100%; }
 .editor-actions > .btn.primary { width: 100%; }
 .editor-top h1 { flex-basis: 100%; font-size: 20px; line-height: 28px; }
 .stage-wrap { padding: 16px; }
 .modal-foot { flex-wrap: wrap; }
 .btn { min-height: 44px; }
 .btn.sm { min-height: 32px; }
 .btn.sm.icon-only { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { .spin, .dots i { animation: none; } }

/* AI creation: compact input column, spacious output canvas, BOLUO controls. */
.ai-page, .library-page { min-width: 0; }
.ai-page .page-head, .library-page .page-head { margin-bottom: 24px; }
.ai-page .page-head p, .library-page .page-head p { font-size: 14px; line-height: 22px; margin-top: 8px; }
.ai-workbench { grid-template-columns: minmax(300px,32%) minmax(0,1fr); gap: 20px; align-items: start; }
.ai-workbench .steps { top: 88px; max-height: calc(100dvh - 112px); overflow: auto; }
.ai-workbench .step { padding: 20px; }
.ai-workbench .step-title { font-size: 14px; line-height: 22px; gap: 8px; margin-bottom: 12px; }
.ai-workbench .step-no { width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%; font-size: 12px; }
.ai-workbench .step p { font-size: 12px; line-height: 18px; }
.ai-workbench .field, .library-info .field { font-size: 14px; line-height: 22px; }
.ai-workbench input:not([type=range]), .ai-workbench select, .ai-workbench textarea,
.library-info input, .library-info textarea { font-size: 14px; line-height: 22px; }
.ai-workbench .btn, .library-page .btn { font-size: 14px; }
.ai-workbench .chip, .library-info .chip { min-height: 32px; font-size: 12px; padding: 4px 10px; }
.ai-workbench .step .row { flex-wrap: wrap; gap: 8px; }
.ai-workbench .step .row select { flex: 1 1 160px; min-width: 0; width: 0; }
.ai-workbench .step input[type=range] { flex: 1; min-width: 80px; }
.workbench-results { min-width: 0; overflow: hidden; background: var(--bg-sunken); }
.workbench-results .results-head { padding: 16px 20px; margin: 0; background: var(--bg); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.workbench-results h2 { font-size: 16px; line-height: 24px; overflow-wrap: anywhere; }
.workflow { padding: 16px 20px; background: var(--bg); border-bottom: 1px solid var(--line); }
.workflow-steps { display: flex; margin: 0; padding: 0; list-style: none; gap: 8px; }
.workflow-steps li { display: flex; align-items: center; gap: 6px; font-size: 12px; line-height: 18px; color: var(--ink-muted); min-width: 0; }
.workflow-steps li:not(:last-child) { flex: 1; }
.workflow-steps li:not(:last-child)::after { content: ''; height: 1px; background: var(--line); flex: 1; min-width: 8px; margin-left: 4px; }
.workflow-steps li > span:last-child { white-space: nowrap; }
.workflow-number { display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%; border: 1px solid var(--line-strong); font-size: 12px; }
.workflow-steps .current { color: var(--ink-strong); font-weight: 600; }
.workflow-steps .current .workflow-number { background: var(--action); color: var(--on-action); border-color: var(--action); }
.workflow-steps .done .workflow-number { color: var(--ink); background: var(--bg-sunken); }
.workflow-hint { margin: 10px 0 0; color: var(--ink-muted); font-size: 12px; line-height: 18px; }
.workflow-hint.error { color: var(--danger); }
.workbench-results .cards { padding: 20px; gap: 16px; grid-template-columns: repeat(auto-fit,minmax(min(100%,300px),1fr)); }
.workbench-results .card { background: var(--bg); }
.workbench-results .card-head, .workbench-results .card-body, .workbench-results .card-foot { padding: 16px; }
.workbench-empty { grid-column: 1/-1; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; gap: 12px; min-height: 280px; padding: 32px 16px; }
.workbench-empty > .icon { width: 32px; height: 32px; color: var(--ink-muted); margin-bottom: 4px; }
.workbench-empty b { font-size: 16px; font-weight: 500; }
.workbench-empty p { margin: 0; max-width: 38ch; color: var(--ink-muted); font-size: 14px; line-height: 22px; }
.library-page .lib-grid { grid-template-columns: repeat(auto-fill,minmax(min(100%,220px),1fr)); gap: 20px; }
.library-page .lib-cover { aspect-ratio: 16/9; }
.library-page .lib-card { color: var(--ink); }
.library-page .lib-card .panel-body { padding: 16px; }
.library-page .lib-card b { font-size: 16px; line-height: 24px; overflow-wrap: anywhere; }
.library-page .lib-new { min-height: 200px; align-content: center; gap: 12px; }
.library-page .lib-detail { grid-template-columns: minmax(280px,32%) minmax(0,1fr); gap: 20px; }
.library-page .lib-detail > .panel:last-child { grid-row: auto; }
.library-page .panel-head { padding: 16px 20px; min-height: 64px; }
.library-page .panel-head h2 { font-size: 16px; line-height: 24px; }
.library-page .panel-body { padding: 20px; }
.library-info .hint { font-size: 12px; line-height: 18px; }
.library-info .stack { gap: 16px; }
.library-media { min-width: 0; }
.library-media .panel-head .small { display: block; margin-top: 4px; }
.library-media .dropzone { padding: 24px 16px; border-width: 1px; }
.library-media .dropzone .small { max-width: 60ch; margin: 8px auto 0; font-size: 12px; line-height: 18px; }
.library-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.library-actions .btn { flex: 0 1 auto; }
.library-page .mats { grid-template-columns: repeat(auto-fill,minmax(min(100%,180px),1fr)); gap: 12px; }
.library-page .mat-thumb { aspect-ratio: 16/10; }
.mat-open { position: absolute; inset: 0; display: grid; place-items: center; width: 100%; height: 100%; border: 0; color: var(--ink-inverse); background: transparent; cursor: pointer; }
.mat-open .icon { width: 32px; height: 32px; padding: 4px; border-radius: 50%; background: var(--bg-inverse); }
.mat-open:hover .icon { transform: scale(1.1); }
.mat-open:disabled { cursor: default; }
.mat-open:disabled .icon { display: none; }
.mat-thumb .badge, .mat-thumb .dur { pointer-events: none; }
.library-page .mat-del { width: 32px; height: 32px; display: grid; place-items: center; }
.library-page .mat-info { padding: 12px; }
.library-page .mat-info .n { font-size: 14px; line-height: 22px; }
.library-page .mat-info .s { font-size: 12px; line-height: 18px; }
@container workspace (max-width: 820px) {
 .ai-workbench { grid-template-columns: minmax(280px,40%) minmax(0,1fr); }
 .ai-workbench .step { padding: 16px; }
 .workbench-results .cards, .workflow { padding: 16px; }
 .workflow-steps { flex-wrap: wrap; gap: 12px 8px; }
 .workflow-steps li, .workflow-steps li:not(:last-child) { flex: 1 1 calc(50% - 8px); }
 .workflow-steps li:nth-child(2)::after { display: none; }
 .library-page .lib-detail { grid-template-columns: minmax(0,1fr); }
 .library-info .panel-body { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; }
}
@container workspace (max-width: 640px) {
 .ai-workbench { grid-template-columns: minmax(0,1fr); }
 .ai-workbench .steps { position: static; max-height: none; }
 .library-info .panel-body { display: flex; align-items: stretch; }
 .ai-page .page-head > .btn { width: 100%; }
 .workbench-empty { min-height: 220px; }
}
/* 首次预览前的包装示意与镜头确认，复用品牌表单和表格。 */
.packaging-demo { position:relative; min-height:210px; aspect-ratio:16/10; background:#202020; color:#fff; border-radius:12px; overflow:hidden; }
.packaging-demo-note { position:absolute; inset:12px 12px auto; font-size:12px; color:#ddd; }
.packaging-demo-title, .packaging-demo-sub { position:absolute; left:50%; transform:translate(-50%,-50%); width:88%; text-align:center; font-weight:700; line-height:1.5; overflow-wrap:anywhere; paint-order:stroke fill; }
.packaging-demo-title { font-size:22px; }
.packaging-presets { display:flex; flex-wrap:wrap; gap:8px; }
.packaging-presets .btn[aria-pressed="true"] { background:var(--action); color:var(--on-action); }
.packaging-controls .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.packaging-controls .field, .packaging-controls input { min-width:0; max-width:100%; }
.shot-plan-entry summary { padding:12px 0; font-weight:600; cursor:pointer; overflow-wrap:anywhere; }
.shot-plan-entry .table-scroll { max-width:100%; overflow-x:auto; }
.shot-plan-entry table { min-width:560px; }
.shot-plan-entry td { vertical-align:top; }
.shot-plan-entry td:nth-child(1) { min-width:140px; }
.shot-plan-entry td:nth-child(2) { min-width:200px; }
@media (max-width:480px) { .packaging-controls .form-grid { grid-template-columns:minmax(0,1fr); } }

/* 文案模板：窄输入栏内使用原生选择器，结构说明紧随选择，补充要求独立保留。 */
.copy-template-field { display:grid; gap:8px; min-width:0; }
.copy-template-field .field { margin:0; }
.copy-template-description { margin:0; color:var(--ink-muted); font-size:12px; line-height:18px; overflow-wrap:anywhere; }
.copy-facts-note { margin:0; }

/* 安全设置与邮箱注册复用通用表单、确认弹窗和横向滚动表格。 */
.registration-code { display:flex; align-items:center; gap:8px; min-width:0; }
.registration-code input { min-width:0; flex:1; }
.registration-code .btn { flex:none; }
.security-target { overflow-wrap:anywhere; max-width:320px; }
.admin-content .table-scroll { overflow-x:auto; }
.admin-content .table-scroll table { min-width:680px; }
@media (max-width:360px) { .registration-code { flex-direction:column; align-items:stretch; } }

.payment-qr { display:block; width:240px; height:240px; max-width:100%; background:#fff; border:1px solid var(--line); }


/* Compact controls: intrinsic actions, bounded filters, container-aware fields. */
input:not([type]) { width:100%; min-width:0; min-height:44px; border:1px solid var(--line-strong); border-radius:8px; padding:9px 12px; font:400 16px/24px var(--font-sans); color:var(--ink); background:var(--bg-sunken); }
.admin-content { container: admin-layout / inline-size; }
.admin-content .page-head > :is(input,select) { width:auto; max-width:100%; flex:0 1 240px; min-width:0; }
.admin-toolbar { flex-wrap:wrap; gap:12px; align-items:center; margin-bottom:0; }
.admin-toolbar > select { flex:0 1 180px; width:180px; min-width:0; max-width:100%; }
.admin-toolbar > input { flex:1 1 240px; width:auto; min-width:0; max-width:360px; }
.control-row, .form-actions { display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; }
.control-row > :is(input,select,.field) { flex:1 1 220px; width:auto; min-width:0; max-width:400px; }
.control-row > .btn, .form-actions > .btn { flex:0 0 auto; max-width:100%; }
.form-actions { align-items:center; }
.admin-content .row { flex-wrap:wrap; }
.admin-content .form-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); align-items:start; }
.form-grid > * { min-width:0; }
.form-grid .field > :is(input,select,textarea) { min-width:0; }
.admin-content :is(.stack,.form-grid) > .btn:not(.block), .account-details > .btn:not(.block) { justify-self:start; align-self:flex-start; }
.admin-content .panel-head { flex-wrap:wrap; }
.admin-content .panel-head > .btn { flex:0 0 auto; }
.admin-content .panel-head > h2 { min-width:0; }
.admin-content .provider-card .control-row > input { flex-basis:180px; }
.modal-foot { flex-wrap:wrap; }
.modal-foot > .btn { flex:0 0 auto; }
@container admin-layout (max-width:560px) {
 .admin-content .form-grid { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:480px) {
 .admin-toolbar > select { flex:1 1 140px; width:auto; }
 .admin-toolbar > input { flex:1 1 100%; max-width:none; }
 .control-row > :is(input,select,.field) { flex-basis:180px; }
 .form-actions { gap:8px; }
}

.admin-content .page-head { margin-bottom:8px; }
.admin-content .page-head p { max-width:72ch; }
input[type=file] { max-width:100%; min-width:0; }
@media (max-width:480px) {
 .modal-foot > .grow { flex-basis:100%; }
}

/* Model routes keep label, provider and independently priced model together. */
.route-table { table-layout:fixed; width:100%; }
.route-table td:first-child { width:100px; }
.route-table td:nth-child(2) { width:25%; }
.model-picker { min-width:0; }
.model-picker .control-row > select { max-width:none; flex:1 1 180px; }
.model-picker .control-row { align-items:center; gap:8px; }
.model-picker .caption { overflow-wrap:anywhere; }
.modal .admin-toolbar { margin-bottom:8px; }
.modal .admin-toolbar > .btn { flex:0 0 auto; }
@container admin-layout (max-width:650px) {
 .admin-content .route-table { min-width:0; display:table; }
 .route-table tbody,.route-table tr,.route-table td { display:block; width:100%; }
 .route-table tr { padding:12px 16px; border-bottom:1px solid var(--line); }
 .route-table td:first-child,.route-table td:nth-child(2) { width:100%; }
 .route-table td { border:0; padding:4px 0; }
 .route-table select { min-width:0; }
}

/* ---------- 登录：与官网首屏同一套品牌表达（0.9） ---------- */
.auth-wrap { align-items: center; }
.auth-hero { gap: 48px; }
.auth-eyebrow { display: flex; gap: 8px; align-items: center; font-size: 12px; line-height: 18px; font-weight: 500; color: var(--ink-muted); letter-spacing: .08em; margin-bottom: 16px; }
.auth-eyebrow b { color: var(--ink-strong); font-weight: 600; letter-spacing: 0; }
.auth-intro .display { margin: 0; }
.auth-modes { width: 100%; max-width: 560px; }
.auth-modes-title { font-size: 12px; line-height: 18px; color: var(--ink-muted); margin-bottom: 12px; }
.auth-modes ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.auth-modes li { display: grid; grid-template-columns: 20px minmax(0,1fr); grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 14px 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--ink-muted); font-size: 14px; line-height: 22px; }
.auth-modes li .icon { width: 20px; height: 20px; grid-row: span 2; }
.auth-modes li small { font-size: 12px; line-height: 18px; color: var(--ink-disabled); }
.auth-modes li.open { color: var(--ink-strong); background: var(--bg-sunken); font-weight: 500; }
.auth-modes li.open small { color: var(--success); font-weight: 400; }

/* ---------- 创作中心（原首页看板） ---------- */
.hub-page { display: flex; flex-direction: column; gap: 40px; }
.hub-page > .page-head { margin: 0; }
.hub-head { flex-wrap: wrap; }
.hub-points { display: grid; gap: 2px; text-align: right; text-decoration: none; color: var(--ink); padding: 4px 24px; border-right: 1px solid var(--line); margin-left: auto; }
.hub-points b { font: 500 20px/28px var(--font-num); font-variant-numeric: tabular-nums; }
.hub-points:hover b { text-decoration: underline; }
.hub-head > .btn { margin-left: 0; }
.hub-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.hub-section-head h2 { font-size: 20px; line-height: 28px; }
.hub-guide { padding: 24px; border: 1px solid var(--line-strong); border-radius: 16px; }
.hub-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.hub-steps li { display: grid; grid-template-columns: 28px minmax(0,1fr); grid-template-rows: 1fr auto; gap: 12px; padding: 16px; border-radius: 12px; background: var(--bg-sunken); align-items: start; }
.hub-steps li > :last-child { grid-column: 2; justify-self: start; }
.hub-step-no { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line-strong); font: 500 12px/1 var(--font-num); }
.hub-steps .current .hub-step-no { background: var(--action); color: var(--on-action); border-color: var(--action); }
.hub-steps .done { color: var(--ink-muted); }
.hub-steps .done .hub-step-no { border-color: var(--line); }
.hub-step-copy { display: grid; gap: 4px; }
.hub-step-copy b { font-weight: 500; }
.hub-step-copy p { margin: 0; }
.hub-mode-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.hub-mode { display: grid; gap: 8px; align-content: start; height: 100%; padding: 20px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink-muted); text-decoration: none; }
.hub-mode.open { border: 2px solid var(--ink-strong); padding: 19px; color: var(--ink); }
.hub-mode.open:hover { background: var(--bg-sunken); }
.hub-mode-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--bg-sunken); color: var(--ink-muted); margin-bottom: 4px; }
.hub-mode.open .hub-mode-icon { background: var(--action); color: var(--on-action); }
.hub-mode-name { display: flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--ink-strong); }
.hub-mode[aria-disabled=true] .hub-mode-name { color: var(--ink-muted); }
.hub-mode .badge.soon { background: transparent; border: 1px solid var(--line); color: var(--ink-muted); }
.hub-mode p { margin: 0; }
.hub-mode-go { margin-top: 4px; font-size: 14px; font-weight: 500; color: var(--ink-strong); }
.hub-page .dashboard-summary { margin: 0; padding: 24px 0; border-block: 1px solid var(--line); }
.hub-page .dashboard-summary a { display: grid; gap: 8px; color: inherit; text-decoration: none; padding-right: 24px; }
.hub-page .dashboard-summary a + a { border-left: 1px solid var(--line); padding-left: 32px; }
.hub-page .dashboard-summary dt { font-size: 14px; }
.hub-page .dashboard-summary dd { margin: 0; font: 500 32px/40px var(--font-num); font-variant-numeric: tabular-nums; }
.hub-page .dashboard-summary a:hover dd { text-decoration: underline; }
.hub-page .dashboard-recent { margin: 0; }
.hub-empty { padding: 24px 0; border-top: 1px solid var(--line); }

/* ---------- AI 智能剪辑：可折叠步骤 + 固定下一步 ---------- */
.ai-workbench .steps { display: flex; flex-direction: column; padding: 0; }
.ai-workbench details.step { padding: 0; }
.ai-workbench details.step > .step-title { list-style: none; cursor: pointer; display: grid; grid-template-columns: 22px auto minmax(0,1fr) 16px; align-items: center; gap: 8px; padding: 16px 20px; margin: 0; }
.ai-workbench details.step > .step-title::-webkit-details-marker { display: none; }
.ai-workbench details.step > .step-title::after { content: ''; width: 8px; height: 8px; border-right: 1.5px solid var(--ink-muted); border-bottom: 1.5px solid var(--ink-muted); transform: rotate(45deg); justify-self: center; margin-top: -4px; transition: transform 120ms; }
.ai-workbench details.step[open] > .step-title::after { transform: rotate(225deg); margin-top: 4px; }
.ai-workbench details.step > .step-title:hover { background: var(--bg-sunken); }
.ai-workbench details.step[open] > .step-title .step-summary { visibility: hidden; }
.step-name { white-space: nowrap; }
.step-summary { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; line-height: 18px; font-weight: 400; color: var(--ink-muted); text-align: right; }
.ai-workbench .step-body { padding: 0 20px 20px; }
.ai-workbench details.step.locked { opacity: 1; }
.ai-workbench details.step.locked > .step-title { cursor: not-allowed; color: var(--ink-disabled); }
.ai-workbench details.step.locked > .step-title:hover { background: transparent; }
.ai-workbench details.step.locked .step-no { background: var(--action-disabled); color: var(--ink-disabled); }
.ai-workbench details.step.locked > .step-title::after { border-color: var(--ink-disabled); }
.steps-action { position: sticky; bottom: 0; margin-top: auto; display: grid; gap: 8px; padding: 16px 20px; background: var(--bg); border-top: 1px solid var(--line); z-index: 1; }
.steps-action > p { margin: 0 !important; }
.steps-action-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.steps-action-row .btn.sm { margin-right: -12px; }
@container workspace (min-width: 641px) { .ai-workbench .steps { max-height: calc(100dvh - 196px); } }
.steps-cost summary { font-size: 12px; line-height: 18px; color: var(--ink-muted); cursor: pointer; width: max-content; }
.steps-cost p { margin: 6px 0 0; font-size: 12px; line-height: 18px; color: var(--ink-muted); }
.workbench-empty-steps { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; font-size: 12px; line-height: 18px; color: var(--ink-muted); }
.workbench-empty-steps li { display: flex; align-items: center; gap: 6px; }
.workbench-empty-steps span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--line-strong); font-size: 11px; }

@media (max-width: 1199px) {
  .hub-mode-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@container workspace (max-width: 820px) {
  .ai-workbench details.step > .step-title { padding: 16px; }
  .ai-workbench .step-body { padding: 0 16px 16px; }
  .steps-action { padding: 16px; }
}
@container workspace (max-width: 640px) { .steps-action { position: static; } }
@media (max-width: 899px) { .auth-modes ul { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 767px) {
  .hub-page { gap: 32px; }
  .hub-steps, .hub-mode-grid { grid-template-columns: minmax(0,1fr); }
  .hub-guide { padding: 16px; }
  .hub-points { margin-left: 0; padding: 0; border: 0; text-align: left; }
  .hub-head > .btn { flex: 1 1 auto; }
  .hub-page .dashboard-summary a { padding-right: 0; }
  .hub-page .dashboard-summary a + a { padding-left: 12px; }
  .hub-page .dashboard-summary dt { font-size: 12px; }
  .hub-page .dashboard-summary dd { font-size: 24px; line-height: 32px; }
  .auth-modes { display: none; } /* 手机上让登录表单尽早出现 */
}

/* Unified administration navigation; group captions disappear in icon-only mode. */
.table-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:nowrap;white-space:nowrap}
.table-row-actions>.table-more{min-width:44px;min-height:44px;padding:0;font-size:24px;line-height:1}
.table-action-menu{position:fixed;inset:auto;margin:0;min-width:160px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);overflow:auto;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--bg-raised);color:var(--ink);box-shadow:0 8px 24px var(--scrim);z-index:1000}
.table-action-menu:popover-open{display:grid;gap:2px}
.table-action-menu>.btn,.image-remix .table-action-menu>button{display:flex;justify-content:flex-start;width:100%;min-height:44px;border:0;border-radius:8px;margin:0;padding:8px 12px;white-space:nowrap;background:transparent;color:var(--ink);font-size:14px}
.table-action-menu>.danger,.image-remix .table-action-menu>.danger{color:var(--danger)}
.table-action-menu>.btn:hover,.image-remix .table-action-menu>button:hover{background:var(--bg-sunken)}
.table-action-menu [role=menuitem]:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
body .table-action-menu>.btn.sm{height:auto;min-height:44px;padding:8px 12px}
.admin-content table td:has(>.table-row-actions){position:sticky;right:0;background:var(--bg-raised);box-shadow:inset 1px 0 0 var(--line)}
.admin-content table tr:hover td:has(>.table-row-actions){background:var(--bg-sunken)}
.admin-content .table-scroll{border:1px solid var(--line);border-radius:16px;background:var(--bg-raised);overflow:auto}
.admin-content .section-card .table-scroll{border:0;border-radius:0}
.admin-content .route-table{table-layout:fixed}
@container admin-layout (max-width:650px){
 .admin-content table.route-table{display:block;width:100%;min-width:0;max-width:100%}
 .admin-content .route-table colgroup,.admin-content .route-table thead{display:none}
 .admin-content .route-table tbody{display:block}
 .admin-content .route-table tr{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding:16px;border-bottom:1px solid var(--line)}
 .admin-content table.route-table td,.admin-content #imageRemixPage .route-table td{display:block;width:auto;height:auto;min-height:0;min-width:0;max-width:100%;padding:0;border:0;white-space:normal}
 .admin-content .route-table select{width:100%;min-width:0;max-width:100%}
 .admin-content .route-table .control-row{flex-wrap:wrap}
}
.admin-ledger-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 28px;margin:0}
.admin-ledger-summary dt{font-size:13px;color:var(--ink-muted)}
.admin-ledger-summary dd{margin:4px 0;font-size:20px;line-height:28px;font-weight:600;font-variant-numeric:tabular-nums}
.admin-ledger-summary p{margin:0}
.cloud-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.admin-network{border-top:1px solid var(--line);padding-top:20px}
.admin-network>summary{cursor:pointer;min-height:44px}
.admin-content #imageRemixPage .section-card{margin:0 0 20px;padding:0}
.admin-content #imageRemixPage .section-card-title h2{margin:0;font:600 16px/24px var(--font-sans)}
.admin-content #imageRemixPage .section-card .table-wrap{border:0;border-radius:0}
.admin-content #imageRemixPage .section-card th,.admin-content #imageRemixPage .section-card td{padding:8px 16px;height:48px;font-size:14px}
.admin-content #imageRemixPage .section-card th{font-size:12px}
.admin-content #imageRemixPage .section-card .route-row{padding:0}
.admin-content #imageRemixPage .section-card .section-card-body>.admin-inline-form{padding:0}
@media(max-width:700px){.cloud-check-grid{grid-template-columns:minmax(0,1fr)}.admin-ledger-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px}.cloud-check-grid .section-card-head{flex-wrap:wrap}}
.admin-nav-group{padding:20px 12px 6px;color:var(--text-muted,var(--muted));font-size:12px;line-height:18px;font-weight:500}
.admin-nav-group:first-child{padding-top:8px}
.secondary-closed .admin-nav-group{display:none}

.admin-nav-group{white-space:nowrap;flex:none}
.admin-mobile-nav{display:none}
@media(max-width:1199px){
 .admin-navigation #secondaryLinks{display:none}
 .admin-navigation .admin-mobile-nav{display:block;width:100%;max-width:100%;min-height:44px}
 .admin-navigation .admin-nav-group{display:none}
}

/* Shared IMS packaging: compact sections, common theme, no nested scroll pane. */
.packaging-controls{min-width:0;gap:16px}
.packaging-controls>details{border-top:1px solid var(--border,#353535);padding-top:8px}
.packaging-controls>details>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600}
.packaging-controls>details[open]>summary{margin-bottom:12px}
.packaging-controls>details>summary::after{content:'';width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-left:auto;margin-right:4px}
.packaging-controls>details[open]>summary::after{transform:rotate(225deg)}
.packaging-controls .form-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px}
.packaging-controls input,.packaging-controls select{min-width:0;max-width:100%}
.packaging-controls .packaging-demo{position:relative;overflow:hidden}
.packaging-controls .cloud-media-logo-preview{object-fit:contain}
.packaging-controls .form-actions{gap:12px;flex-wrap:wrap}
.cloud-media-packaging-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cloud-media-packaging-modes{display:flex;gap:4px;padding:4px;background:var(--bg-sunken,#252525);border-radius:10px}
.cloud-media-packaging-modes>.btn{flex:1;min-height:40px}
.cloud-media-packaging-modes>.btn[aria-pressed=true]{background:var(--ink,#fff);color:var(--bg,#111)}
.cloud-media-template-panel[hidden],.cloud-media-custom-panel[hidden]{display:none!important}
.cloud-media-template-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-height:520px;overflow-y:auto;padding:3px;scrollbar-gutter:stable}
.cloud-media-template-card{display:flex;flex-direction:column;gap:8px;align-items:stretch;min-width:0;background:transparent;color:inherit;padding:5px;border:2px solid transparent;border-radius:12px;cursor:pointer;font:inherit;text-align:center}
.cloud-media-template-card>svg,.cloud-media-template-free{width:100%;aspect-ratio:3/4;height:auto;display:block;border-radius:8px;overflow:hidden}
.cloud-media-template-card>span:last-child{font-size:13px;line-height:1.4;padding:0 0 4px;overflow-wrap:anywhere}
.cloud-media-template-card:hover{background:var(--bg-sunken,#252525)}
.cloud-media-template-card[aria-pressed=true]{border-color:var(--ink,#fff)}
.cloud-media-template-card:focus-visible{outline:2px solid var(--focus,#5d00ff);outline-offset:2px}
.cloud-media-template-free{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--bg-sunken,#252525)}
.cloud-media-template-free>span{font-size:32px;font-weight:700}
.cloud-media-template-free>small{font-size:11px}
.cloud-media-custom-fields>details{border-top:1px solid var(--border,#353535);padding-top:8px}
.cloud-media-custom-fields>details>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600;gap:8px}
.cloud-media-custom-fields>details>summary::after{content:'⌄';margin-left:auto}
.cloud-media-custom-fields>details[open]>summary{margin-bottom:12px}
.cloud-media-custom-fields .packaging-demo{min-height:0;max-width:240px;aspect-ratio:3/4;margin-inline:auto;width:100%}
.cloud-media-presenter-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media(max-width:360px){.cloud-media-template-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Brand email editor reuses platform form and panel tokens. */
.mail-template-layout{display:grid;grid-template-columns:minmax(260px,1fr) minmax(300px,1fr);gap:24px;align-items:start}.mail-template-layout>div{min-width:0}.mail-template-layout iframe{display:block;box-sizing:border-box}@media(max-width:900px){.mail-template-layout{grid-template-columns:minmax(0,1fr)}}

/* Explicit draft scope: old outputs stay visible; only checked drafts are processed. */
.workbench-scope { padding: 12px 20px; border-bottom: 1px solid var(--line); }
.workbench-results .script-choice { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; cursor: pointer; font-size: 12px; flex-shrink: 0; }
@media (max-width: 640px) { .workbench-scope { padding: 12px 16px; } }

@container workspace (max-width: 640px) {
 .ai-page .ai-workbench > .steps { position: static; height: auto; max-height: none; overflow: visible; }
 .ai-page .ai-workbench > .steps .steps-content { overflow: visible; max-height: none; }
}

@container workspace (max-width: 640px) {
 .ai-page .ai-workbench .steps-action { position: static; bottom: auto; }
}

/* Unified materials composes source pages under one sticky heading. The source
   inner heading mask must not obscure the preceding category controls. */
.content .materials-body .page-head { position:relative; top:auto; z-index:auto; }
.content .materials-body .page-head::before { content:none; }
.materials-tabs .chip { display:inline-flex; align-items:center; justify-content:center; }