/* finesse · register=product · shell=creator-workspace+infinite-canvas
 * Existing graphite/lavender identity; local system type; feedback-only motion. */
:root{
 --dur-1:120ms;--dur-2:180ms;--dur-3:260ms;
 --ui-ease:cubic-bezier(.2,.8,.2,1);--ui-ease-out:cubic-bezier(.4,0,1,1);
 --ui-radius-control:10px;--ui-radius-card:16px;--ui-radius-panel:22px;--ui-radius-dialog:24px;
 --ui-text-muted:#a4a0ad;--ui-focus:#c7b3ee;--ui-border:#d8c9ec20;
 --ui-shadow:0 18px 48px #120e2240,0 2px 8px #120e2220;
}
/* Scoped to chrome: user media, canvas positioning and document geometry stay untouched. */
:where(.workspace-layout,.workspace-page,.canvas-account-controls,.roc-creator-panel,.studio-dialog) :is(button,a,summary,input,select,textarea):focus-visible{
 outline:2px solid var(--ui-focus);outline-offset:3px;
}
:where(.workspace-layout,.workspace-page,.studio-dialog) :is(.primary,.secondary,.icon-button){
 transition:background-color var(--dur-1) var(--ui-ease),border-color var(--dur-1) var(--ui-ease),box-shadow var(--dur-2) var(--ui-ease),translate var(--dur-1) var(--ui-ease);
}
:where(.workspace-layout,.workspace-page,.studio-dialog) :is(.primary,.secondary,.icon-button):active:not(:disabled){translate:0 1px}
:where(.workspace-layout,.workspace-page,.studio-dialog) button:disabled{cursor:default}
:where(.workspace-layout,.workspace-page,.studio-dialog) :is(.primary,.secondary){border-radius:var(--ui-radius-control)}
:is(.wallet-amount,.points-balance,.rocanvas-points-badge,.roc-point-cost,.project-date,.production-stage-progress){font-variant-numeric:tabular-nums}
.wallet-popover-note,.composer-parameter-panel small{color:var(--ui-text-muted)}
.roc-agent-starters small,.roc-agent-skill-panel>p,.roc-agent-confirm-label{color:#afa1bd}
.roc-agent-starters button>span,.roc-agent-starters i{color:#ac99be}
.canvas-studio:has(button[title="切换到夜间模式"]){--ui-focus:#745098;--ui-text-muted:#71617e}
.canvas-studio:has(button[title="切换到夜间模式"]) :is(.roc-agent-starters small,.roc-agent-confirm-label,.roc-agent-skill-panel>p){color:#71617e}
/* Dialog close remains native (focus, Escape, returnValue); removal waits for CSS exit. */
.studio-dialog{
 border-radius:var(--ui-radius-dialog);box-shadow:var(--ui-shadow);
 max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;
 opacity:0;translate:0 7px;scale:.985;
 transition:opacity var(--dur-2) var(--ui-ease),translate var(--dur-2) var(--ui-ease),scale var(--dur-2) var(--ui-ease),display var(--dur-2) allow-discrete,overlay var(--dur-2) allow-discrete;
}
.studio-dialog[open]{opacity:1;translate:0 0;scale:1}
.studio-dialog::backdrop{
 opacity:0;transition:opacity var(--dur-2) var(--ui-ease),display var(--dur-2) allow-discrete,overlay var(--dur-2) allow-discrete;
}
.studio-dialog[open]::backdrop{opacity:1}
.dialog-head{gap:16px}.dialog-head h2{min-width:0;overflow-wrap:anywhere}
.dialog-head .icon-button{flex:none;min-width:40px;min-height:40px}
.toast{
 opacity:0;translate:0 7px;box-shadow:var(--ui-shadow);border-color:var(--ui-border);
 bottom:calc(24px + env(safe-area-inset-bottom,0px));overflow-wrap:anywhere;
 transition:opacity var(--dur-2) var(--ui-ease),translate var(--dur-2) var(--ui-ease),display var(--dur-2) allow-discrete;
}
.toast:not([hidden]){opacity:1;translate:0 0}
@starting-style{
 .studio-dialog[open]{opacity:0;translate:0 7px;scale:.985}
 .studio-dialog[open]::backdrop{opacity:0}
 .toast:not([hidden]){opacity:0;translate:0 7px}
}
/* Native details continues to own disclosure and keyboard behavior. */
:is(.account-popover,.roc-agent-skills)::details-content{
 opacity:0;transition:opacity var(--dur-2) var(--ui-ease),content-visibility var(--dur-2) allow-discrete;
}
:is(.account-popover,.roc-agent-skills)[open]::details-content{opacity:1}
:is(.account-popover-panel,.composer-parameter-panel,.roc-agent-skill-panel){box-shadow:var(--ui-shadow);animation-duration:var(--dur-2);animation-timing-function:var(--ui-ease)}
.canvas-studio .roc-creator-panel{
 animation:ui-panel-enter var(--dur-3) var(--ui-ease) both;
 transition:opacity var(--dur-2) var(--ui-ease-out),translate var(--dur-2) var(--ui-ease-out);
}
.canvas-studio .roc-creator-panel[data-motion-state=closing]{animation:none;opacity:0;translate:18px 0;pointer-events:none}
@keyframes ui-panel-enter{from{opacity:0;translate:18px 0}to{opacity:1;translate:0 0}}
.canvas-modal-card{animation:ui-card-enter var(--dur-2) var(--ui-ease) both}
@keyframes ui-card-enter{from{opacity:0;scale:.985}to{opacity:1;scale:1}}
.composer-result:not([hidden]){animation:ui-result-enter var(--dur-3) var(--ui-ease) both}
.composer-result[data-status=success]>div{animation:ui-result-enter var(--dur-3) var(--ui-ease) 60ms both}
@keyframes ui-result-enter{from{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}
@media(max-width:760px){
 .studio-dialog{max-height:calc(100dvh - 24px - env(safe-area-inset-bottom,0px));border-radius:var(--ui-radius-panel)}
 .dialog-head .icon-button{min-width:44px;min-height:44px}
 .canvas-studio .roc-creator-panel :is(.roc-agent-attach,.roc-agent-send){min-width:44px;min-height:44px}
 .canvas-studio .roc-agent-model-row{padding-right:50px}
 .canvas-studio .roc-agent-model-row select{min-height:44px}
 .canvas-studio .roc-agent-options{flex-wrap:wrap}
 .canvas-studio .roc-agent-options :is(select,summary){min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 .studio-dialog,.studio-dialog::backdrop,.toast,.canvas-studio .roc-creator-panel,.canvas-modal-card,.composer-result,.composer-result[data-status=success]>div{animation:none!important;transition:none!important}
 :is(.account-popover,.roc-agent-skills)::details-content{transition:none!important}
 :where(.workspace-layout,.workspace-page,.studio-dialog) :is(.primary,.secondary,.icon-button){transition:none!important}
}

/* Shared typography: PingFang first, fixed UI sizes and semantic text roles. */
:root{
 --ui-font:"PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei","Segoe UI",sans-serif;
 --ui-type-caption:12px;--ui-type-control:13px;--ui-type-body:14px;
 --ui-type-section:18px;--ui-type-title:28px;
 --ui-ink:#eeeef2;--ui-secondary:#c2c2cb;--ui-muted:#a0a0ac;
}
body,body.canvas-studio{
 --text:var(--ui-ink);--muted:var(--ui-muted);--creative-muted:var(--ui-muted);
 --roc-ink:var(--ui-ink);--roc-muted:var(--ui-muted);
 --canvas-text:var(--ui-ink);--canvas-label:var(--ui-secondary);--ui-text-muted:var(--ui-muted);
 font-family:var(--ui-font)!important;font-size:var(--ui-type-body);color:var(--ui-ink);
}
body :is(button,input,textarea,select,optgroup,option),
.production-report,.preview-toolbar,.agent-confirm,.report-flow>span{
 font-family:var(--ui-font)!important;
}
body.canvas-studio:has(button[title="切换到夜间模式"]){
 --ui-ink:#302d38;--ui-secondary:#514c5e;--ui-muted:#706879;
}
/* Preserve the independently selectable document/report theme. */
.production-report{
 --ui-ink:#302d38;--ui-secondary:#514c5e;--ui-muted:#706879;
 --ink:var(--ui-ink);--muted:var(--ui-muted);
}
.production-report[data-report-theme=dark]{--ui-ink:#eeeef2;--ui-secondary:#c2c2cb;--ui-muted:#a0a0ac}

/* Page hierarchy, without changing component boxes or document positions. */
body :is(.workspace-page-heading h1,.shell>main>header h1,.production-heading h1,.auth-form h2){
 font-size:var(--ui-type-title);font-weight:600;line-height:1.4;letter-spacing:-.02em;color:var(--ui-ink);
}
body :is(.dialog-head h2,.card h2,.production-panel h2,.production-card h3,.section-title,.creative-home .section-title,.canvas-modal-card h2){
 font-size:var(--ui-type-section);font-weight:600;line-height:1.5;letter-spacing:0;color:var(--ui-ink);
}
body :is(.creative-feature h2,.roc-canvas-welcome h1,.roc-agent-welcome){font-size:24px;font-weight:600;line-height:1.5;letter-spacing:0}
body :is(.project-meta h3,.workspace-projects .project-meta h3,.production-panel h3,.roc-creator-heading strong,.roc-home-agent-heading strong,.creative-new b){
 font-size:var(--ui-type-body);font-weight:500;line-height:1.5;color:var(--ui-ink);
}
body :is(.creative-signature h1,.production-breadcrumb h1){font-size:var(--ui-type-section);font-weight:500;color:var(--ui-ink)}
body :is(.workspace-page-heading p,.production-heading p,.production-card p,.production-panel p,.auth-form>.muted,.creative-composer textarea,.roc-creator-panel textarea,.roc-home-agent-form textarea,.production-assistant textarea,.production-source,.resource-body){
 font-size:var(--ui-type-body);line-height:1.7;
}
body :is(.creative-composer textarea,.roc-creator-panel textarea,.roc-home-agent-form textarea,.production-assistant textarea){color:var(--ui-ink)}
body :is(.roc-home-agent-message,.roc-home-agent-empty,.assistant-message p,.roc-agent-guide p,.agent-plan-list p){font-size:var(--ui-type-body);line-height:1.7}
body .assistant-message p{font-size:var(--ui-type-body)!important}

/* Controls share a compact size; icon-only and responsive hidden labels retain theirs. */
body :is(.primary,.secondary,.auth-switch a,.creative-mode-switch a,.creative-ideas button,.composer-select select,.composer-parameter-panel select,.workspace-nav-link>span,.settings-sections button,.admin-tabs button,.production-tabs button,.artifact-tabs button,.production-model-grid select,.production-inspector select,.production-form input,.production-form select,.production-form textarea,.auth-form input,.search input){
 font-size:var(--ui-type-control);
}
body :is(.composer-parameter-panel label,.auth-form label,.production-inspector label,.production-form label,.roc-learn-dialog label,.production-stage strong,.roc-agent-starters b,.roc-agent-skill-panel>b){
 font-size:var(--ui-type-control);color:var(--ui-secondary);
}
body :is(.roc-agent-controls select,.roc-agent-skills,.roc-agent-skill-list span,.roc-agent-skill-panel>button,.canvas-modal-card select,.preview-toolbar,.preview-toolbar button,.production-stage-toolbar button,.production-stage-tools button,.report-toolbar button){font-size:var(--ui-type-caption)}

/* Neutral metadata only; cost, links, selection and success/error colors remain semantic. */
body :is(.muted,.help,.workspace-page-heading p,.workspace-caption,.workspace-location,.workspace-environment,.auth-note,.project-meta small,.workspace-projects .project-meta small,.project-date,.composer-hint,.creative-ideas,.creative-new small,.composer-parameter-panel small,.wallet-popover-note,.roc-creator-heading small,.roc-home-agent-heading small,.roc-agent-subtitle,.roc-agent-starters small,.roc-agent-confirm-label,.roc-agent-skill-panel>p,.roc-agent-skill-list small,.roc-welcome-copy,.roc-welcome-keys,.production-heading p,.production-card p,.production-stage small,.production-stage em,.production-back,.production-facts div,.production-detail>span,.preview-header span){
 color:var(--ui-muted);
}
body :is(.help,.workspace-caption,.workspace-location,.workspace-environment,.auth-note,.project-meta small,.workspace-projects .project-meta small,.project-date,.composer-hint,.creative-ideas,.creative-new small,.composer-mark span,.composer-parameter-panel small,.wallet-popover-note,.roc-creator-heading small,.roc-home-agent-heading small,.roc-agent-subtitle,.roc-agent-starters small,.roc-agent-confirm-label,.roc-agent-skill-panel>p,.roc-agent-skill-list small,.roc-welcome-copy,.roc-welcome-keys,.production-stage small,.production-stage em,.production-back,.production-facts div,.production-detail>span,.preview-header span,.node-count){
 font-size:var(--ui-type-caption);
}
body :is(input,textarea)::placeholder{font-family:var(--ui-font);color:var(--ui-muted);opacity:1}
body :is(.workspace-admin th,.workspace-admin td,.model-manager-table code,.tiny-button){font-size:var(--ui-type-caption)}
body .workspace-admin th{color:var(--ui-muted)}
body .workspace-admin td{color:var(--ui-secondary)}
body .production-report h1{font-size:24px}
body .production-report h2{font-size:var(--ui-type-section)}
body .production-report h3{font-size:var(--ui-type-body)}
body .production-report :is(.report-title p,.report-metrics span,.report-field dt,.report-caption,.report-missing,.report-footer,summary small){font-size:var(--ui-type-caption)}
body .production-report :is(.report-field dd,.report-flow blockquote p){font-size:var(--ui-type-body)}
/* Compiled canvas text utilities inherit the same neutral hierarchy in both themes. */
body.canvas-studio :is(.text-neutral-100,.text-neutral-200){color:var(--ui-ink)}
body.canvas-studio .text-neutral-300{color:var(--ui-secondary)}
body.canvas-studio :is(.text-neutral-400,.text-neutral-500){color:var(--ui-muted)}
body.canvas-studio :is(.text-xs,.text-\[10px\],.text-\[11px\]){font-size:var(--ui-type-caption)}
body.canvas-studio .text-sm{font-size:var(--ui-type-body)}
body.canvas-studio .roc-creator-panel :is(.roc-agent-starters small,.roc-agent-confirm-label,.roc-agent-skill-panel>p){color:var(--ui-muted)}
@media(max-width:760px){body{--ui-type-title:24px}}

/* White text across every page; text fill preserves currentColor-based icons and borders. */
body,body *{-webkit-text-fill-color:#fff!important}
body :is(input,textarea)::placeholder{-webkit-text-fill-color:#fff!important;color:#fff!important}
body svg :is(text,tspan){fill:#fff!important}