/* Figma refinement: readable working surfaces, content-led artwork, purposeful motion. */
html {scroll-padding-top:24px; scrollbar-gutter:stable;}
:root {color-scheme:light}
* {scrollbar-color:var(--border-control) var(--canvas)}
audio {color-scheme:light;accent-color:var(--selection)}

.skip-link {top:0;left:8px;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:0}
.skip-link:focus {width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal;padding:12px;max-width:calc(100vw - 16px)}
.mobile-narration-next {display:none}
::selection {background:var(--selection-surface);color:var(--text)}
input,textarea {caret-color:var(--violet-ink)}
input::placeholder,textarea::placeholder {color:var(--muted);opacity:1}
.inline-notice {color:var(--violet-ink)}
h1:focus {outline:none}
main {animation:surface-enter 220ms var(--ease) both}
.topbar {min-height:76px;height:auto;padding-block:12px;gap:20px}
.brand {min-height:44px}
.button {min-height:44px;height:auto;padding:11px 17px;font-size:14px;line-height:1.35;white-space:normal;transition:background 140ms, border-color 140ms, transform 140ms var(--ease)}
.button.primary {background:var(--action);color:var(--on-action);border-color:var(--action)}
.button.primary:hover:not(:disabled) {background:var(--action-hover);border-color:var(--action-hover)}
.button.secondary:hover:not(:disabled),.button.ghost:hover:not(:disabled) {background:var(--surface-subtle)}
.button:hover:not(:disabled) {box-shadow:none;transform:translateY(-1px)}
.button:active:not(:disabled) {transform:translateY(0)}
.button.icon {width:44px;min-width:44px;height:44px;padding:10px}
.button.icon .icon {width:20px;height:20px}
.avatar {width:44px;height:44px;color:var(--violet-ink)}
.project-name-input {padding:8px 4px;border-radius:4px;font-size:14px}
.project-name-input:hover {background:var(--paper)}
.save-state {white-space:nowrap;font-size:12px}
.save-state.unsaved {color:var(--red)}
.top-actions .connection {font-size:12px}
.step {min-height:56px;font-size:13px;color:var(--muted);transition:color 160ms,background 160ms,border-color 160ms}
.step:hover:not(:disabled) {background:var(--paper)}
.step-index {font-size:12px}
.badge {font-size:11px;letter-spacing:.025em;font-weight:700;line-height:1.25;padding:5px 8px}
.home,.setup-page {max-width:1240px;padding-top:64px}
.home-heading h1 {font-size:clamp(36px,4.2vw,58px);line-height:1.08;max-width:700px;letter-spacing:-.04em}
.home-heading p {max-width:52ch;font-size:16px;margin-top:16px}
.home-toolbar {padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.search {min-height:44px;background:transparent}
.search input {font-size:14px;min-width:0;width:100%}
.project-grid {gap:24px}
.project-card {border-radius:14px;transition:transform 180ms var(--ease),border-color 180ms;box-shadow:none}
.project-card:hover,.project-card:focus-visible {transform:translateY(-3px);border-color:var(--ink);box-shadow:none}
.thumbnail {height:245px}
.thumbnail>.scene-artwork {position:absolute;inset:0;width:100%;height:80%;opacity:.8}
.thumbnail>.project-cover-title {position:absolute;bottom:30px;left:24px;right:65px;font-size:24px;line-height:1.2;letter-spacing:-.025em;z-index:1;overflow-wrap:anywhere;max-width:none;text-shadow:0 1px 5px var(--shadow-strong)}
.thumbnail>.project-cover-title {display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.thumbnail .thumb-kicker {position:absolute;top:20px;left:24px;font:11px 'DM Mono';letter-spacing:.04em;z-index:1}
.duration {font:12px 'DM Mono';padding:5px 8px}
.card-meta {padding:20px;min-height:88px}
.card-meta strong {font-size:15px;line-height:1.4;overflow-wrap:anywhere}
.card-meta small {font-size:12px;margin-top:6px}
.new-card {border-style:dashed;background:transparent;min-height:330px}
.new-card strong {font-size:16px}.new-card small {font-size:13px}
.empty-state {max-width:620px;margin:36px auto;padding:44px 24px;background:none;border:0}
.empty-state h2 {font-size:28px;line-height:1.2}
.empty-state p {font-size:16px;max-width:46ch}
.empty-state small {display:block;font-size:13px;line-height:1.6;margin-top:18px}
.setup-title {max-width:640px;margin-bottom:32px}
.setup-title h1,.page-heading h1,.storyboard-head h1,.preview-top h1 {font-size:36px;line-height:1.15}
.setup-title p,.page-heading p {font-size:16px;max-width:58ch;margin-top:12px}
.setup-layout {grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:32px}
.form-card,.settings-card {padding:28px;border-radius:12px;box-shadow:none}
.field {gap:9px;min-width:0}.field-label {font-size:14px;font-weight:700;overflow-wrap:anywhere}
.field-hint,.form-card>small,.setting-row small,.setup-summary p,.palette-choice small {font-size:13px;line-height:1.6}
.field>input,.field>select,.field>textarea,.input-suffix input {font-size:16px;min-height:46px;line-height:1.5;padding:11px 12px}
.field>textarea {resize:vertical;min-height:100px}
.field input:read-only,.field textarea:read-only {background:var(--surface-subtle);color:var(--muted)}
.field input[type=range] {padding:0;accent-color:var(--violet-ink)}
.choice strong,.palette-choice strong,.setting-row strong {font-size:14px}
.choice small {font:12px 'DM Mono';color:var(--muted)}
.choice {min-height:150px;border-radius:10px;transition:background 160ms,border-color 160ms}
.choice.selected,.palette-choice.selected {background:var(--selection-surface);border-color:var(--violet-ink);box-shadow:inset 0 0 0 1px var(--violet-ink)}
.palette-choice {gap:12px;padding:14px;min-height:88px}
.settings-card h2 {font-size:22px;margin-bottom:20px}
.setting-row {gap:16px;min-height:76px;flex-wrap:wrap}
.setting-row>span:first-child {flex:1;min-width:120px}
.setting-row select {min-height:44px;font-size:13px;padding:8px}
.toggle {flex-shrink:0;background:var(--border-control)}.toggle.on{background:var(--violet)}
.back-link {min-height:44px;font-size:14px}
.workspace {grid-template-columns:minmax(0,1fr) 340px;min-height:calc(100vh - 132px)}
.workspace-main {padding:44px clamp(24px,4vw,64px);min-width:0}
.page-heading {gap:24px;flex-wrap:wrap;margin-bottom:28px}
.page-heading>.button {flex-shrink:0}
.segmented {margin-bottom:24px;max-width:100%;width:fit-content}
.segmented button {min-height:44px;padding:10px 18px;font-size:14px;line-height:1.4;transition:background 150ms,color 150ms}
.editor-label {font-size:14px;padding:16px 20px}
.editor-field {border-radius:12px}
.editor-field textarea {font-size:18px;line-height:1.85;padding:24px;min-height:340px;max-width:100%;caret-color:var(--violet-ink)}
.text-stats {font-size:12px;line-height:1.5;gap:16px;flex-wrap:wrap;padding:14px 20px}
.next-panel {padding:46px 28px;background:var(--surface);display:flex;flex-direction:column;align-items:stretch;gap:0}
.next-panel h2 {font-size:26px;line-height:1.22;letter-spacing:-.025em}
.next-panel h3 {font-size:16px}.next-panel p {font-size:14px;line-height:1.7}
.next-panel hr {margin:24px 0}
.readiness-list {gap:16px;margin-block:22px}.readiness-list span {font-size:14px;line-height:1.5}
.readiness-list span:not(.muted) {color:var(--text)}
.readiness-list .icon {color:var(--selection)}
.inline-notice,.conversion-card p,.timing-card small,.generated-note small {font-size:13px;line-height:1.6}
.conversion-card {gap:16px;flex-wrap:wrap}.conversion-card strong,.timing-card strong {font-size:14px}
.inline-notice {padding-inline:0;border:0;background:none}
details>summary {font-size:14px;cursor:pointer;padding:10px 0;line-height:1.6}
details[open]>summary {margin-bottom:12px}
.narration-card {gap:24px}.provider-status {font-size:12px;white-space:normal;line-height:1.5}
.dropzone {padding:44px 24px;min-height:270px;border-radius:12px}
.dropzone strong {font-size:20px}.dropzone p {font-size:14px;max-width:38ch}
.file-drop:focus-within {outline:3px solid var(--focus);outline-offset:3px;background:var(--violet-soft)}
.record-panel {padding:40px 24px}.record-panel p {font-size:14px}
.record-ring {color:var(--violet-ink);background:var(--violet-soft);border-color:var(--violet)}
.is-recording .record-ring {color:var(--red);background:var(--red-soft);border-color:var(--red);animation:record-breathe 1.8s ease-in-out infinite}
.voice-audio {margin-block:8px}.narration-card+small {font-size:13px}
.planning-page {padding:8vh 24px 64px;min-height:calc(100vh - 132px)}
.planning-page h1 {font-size:clamp(30px,3.5vw,44px);max-width:650px;margin:24px auto 16px}
.planning-page>p {font-size:16px;max-width:52ch;margin-inline:auto}
.progress-label {font-size:14px}.planning-context {font:12px 'DM Mono';margin-top:18px!important}
.fallback-note {font-size:14px;line-height:1.65;max-width:480px;margin:24px auto}
.planning-art .orbit-one {animation:planning-turn 14s linear infinite}
.planning-art .orbit-two {animation:planning-turn 18s linear infinite reverse}
.editor-layout {grid-template-columns:minmax(340px,.95fr) minmax(0,1.05fr);height:calc(100vh - 132px)}
.storyboard-panel {padding:32px 26px}.storyboard-head {gap:16px;flex-wrap:wrap}.storyboard-head h1 {margin:0}
.summary-strip {margin:24px 0 16px;gap:12px;flex-wrap:wrap;padding:14px 16px;font-size:12px;line-height:1.5;height:auto;min-height:44px}
.scene-list {gap:10px}.scene-row {padding:16px 12px;grid-template-columns:12px 24px 84px minmax(0,1fr) 16px;gap:10px;min-height:112px;border-radius:10px;transition:background 150ms,border-color 150ms}
.scene-row.selected {background:var(--selection-surface);border-color:var(--violet-ink);box-shadow:inset 3px 0 var(--violet-ink)}
.scene-row:hover {background:var(--surface-subtle)}.drag {color:var(--muted)}
.scene-row.selected:hover {background:var(--selection-surface)}
.scene-num {font:12px 'DM Mono';color:var(--muted)}
.mini-visual {width:84px;height:72px;border-radius:6px}
.mini-visual>.scene-artwork {width:100%;height:100%;object-fit:cover;display:block}
.scene-copy {gap:7px}.scene-copy strong {font-size:14px;line-height:1.45;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.scene-copy small {font-size:12px;line-height:1.5}.scene-copy>span {gap:8px;flex-wrap:wrap}.scene-copy em {font:11px 'DM Mono';line-height:1.5}
.scene-reorder button {min-height:44px;padding:10px 12px;font-size:12px}
.scene-inspector {scroll-margin-top:16px;min-width:0}.inspector-head {padding:12px 24px;gap:16px;flex-wrap:wrap}
.scene-preview {min-height:300px;align-items:flex-end;justify-content:flex-start;padding:0}
.scene-preview>.scene-artwork {position:absolute;inset:0;width:100%;height:80%;object-fit:contain}
.sketch-label {position:absolute;top:14px;left:20px;color:var(--surface);background:var(--scrim);border-radius:4px;padding:5px 8px;font-size:11px;z-index:2}
.preview-caption {width:100%;text-align:left;padding:50px 24px 24px;background:linear-gradient(transparent,var(--text));text-shadow:none;pointer-events:none}
.preview-caption strong {font-size:26px;line-height:1.2;letter-spacing:-.025em;max-width:28ch;overflow-wrap:anywhere}
.preview-duration {font:11px 'DM Mono';bottom:auto;top:16px}
.inspector-form {padding:24px;gap:22px}.input-suffix {min-height:46px}.input-suffix span {font-size:12px}
.generated-note {background:none;border-radius:0;padding:16px 0;border-top:1px solid var(--line);color:var(--violet-ink)}
.generated-note strong {font-size:13px}.generated-note small {color:var(--muted)}
.inspector-footer {padding:16px 24px;box-shadow:none;min-height:78px}.inspector-footer>span {font-size:12px}
.preview-page {padding-top:36px}.preview-top p {font-size:14px;margin-top:12px}
.preview-status>span {font-size:12px}.preview-studio {grid-template-columns:130px minmax(0,1fr) 260px;box-shadow:none}
.preview-studio {background:var(--surface)}
.scene-rail {padding:20px 12px;background:var(--surface-subtle);color:var(--text)}.scene-rail>strong {font-size:12px;color:var(--text-muted)}
.scene-rail button {grid-template-columns:1fr;justify-items:center;gap:8px;padding:10px;color:var(--text-muted)}
.scene-rail button>span,.scene-rail button>small {font:11px 'DM Mono';grid-column:1}
.scene-rail button.active {border-color:var(--selection);background:var(--selection-surface);color:var(--selection)}
.scene-rail .mini-visual {width:82px;height:54px}
.player-area {padding:28px 20px;gap:8px;background:var(--stage)}.live-canvas {aspect-ratio:9/16;max-width:100%;height:auto;background:var(--stage)}
.preview-loading {min-height:240px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;color:var(--muted);font-size:14px}
.player-area .preview-loading {color:var(--stage-text-muted)}
.player-controls {flex-wrap:wrap;margin-top:16px;gap:8px;color:var(--stage-text)}.player-controls .button.icon {width:44px;min-width:44px;color:var(--stage-text);border-color:var(--stage-border)}
.player-controls .button.icon:hover {background:var(--stage-raised)}
.timecode {font:12px 'DM Mono';font-variant-numeric:tabular-nums}.scrubber {min-height:44px;min-width:50px}
.preview-notes {padding:28px 22px;background:var(--surface);color:var(--text)}.preview-notes h2 {font-size:23px;line-height:1.2}
.preview-notes .button.ghost {color:var(--text)}
.preview-status>.badge {color:var(--text-muted)}
.quality-check {gap:20px;margin-block:28px}.quality-check span {color:var(--selection)}.quality-check strong {font-size:14px;line-height:1.5;color:var(--text)}
.draft-warning {border-radius:0;background:none;padding:0;margin-block:24px}.draft-warning p {font-size:13px;color:var(--text-muted);line-height:1.7}
.preview-notes>.button.primary,.export-card.success>.button.primary {min-height:48px}
.export-card {padding:36px;border-radius:14px;box-shadow:none;max-width:100%}
.export-card h1 {font-size:34px;line-height:1.15;letter-spacing:-.035em}
.export-card>p {font-size:15px;overflow-wrap:anywhere}.export-card>small {font-size:13px;line-height:1.6}
.export-card>.badge {order:0; margin:0 0 18px;text-transform:none;letter-spacing:0}
.export-card.success {border-color:var(--ink);position:relative;overflow:hidden}
.export-card.success:before {content:'';position:absolute;left:0;right:0;top:0;height:5px;background:var(--lime)}
.status-illustration.success {background:var(--success-surface);color:var(--success);animation:completion-settle 480ms var(--ease) both}
.status-illustration.success path {stroke-dasharray:30;animation:completion-check 600ms var(--ease) both}
.render-details,.error-code {font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.error-code {border-left:3px solid var(--red);border-radius:0}
.global-error {font-size:14px;line-height:1.6}
.connection-dialog {padding:32px;border:1px solid var(--line-dark);box-shadow:0 24px 80px var(--shadow-medium);animation:dialog-enter 180ms var(--ease)}
.connection-dialog h2 {font-size:24px;align-items:center;gap:20px}.connection-dialog>p {font-size:14px}
.mobile-actions {min-width:230px}.mobile-actions .button {justify-content:flex-start}
.toast {font-size:14px;line-height:1.6;display:flex;align-items:center;gap:20px;animation:toast-enter 180ms var(--ease)}
.toast button {color:var(--on-action);background:transparent;border:0;font-weight:700;min-height:44px;padding:4px 8px;cursor:pointer;text-decoration:underline}
.storage-warning {position:fixed;bottom:0;left:0;right:0;z-index:105;padding:16px;background:var(--amber-soft);color:var(--ink);font-size:14px;line-height:1.6;border-top:1px solid var(--amber)}
.storage-warning button {font:inherit;color:inherit;text-decoration:underline;background:none;border:0;min-height:44px;cursor:pointer}
body.motion-paused *,body.motion-paused *:before,body.motion-paused *:after {animation-play-state:paused!important}
@keyframes surface-enter {from{opacity:.5;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes planning-turn {to{rotate:360deg}}
@keyframes record-breathe {50%{box-shadow:0 0 0 8px var(--record-halo)}}
@keyframes completion-settle {from{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes completion-check {from{stroke-dashoffset:30}to{stroke-dashoffset:0}}
@keyframes dialog-enter {from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes toast-enter {from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
@media(max-width:1100px) {
  .topbar {gap:12px}.project-crumb {position:static;transform:none;justify-self:center}.topbar{grid-template-columns:auto 1fr auto}
  .project-name-input {width:180px}.save-state {font-size:0}.save-state .icon{display:block}
  .workspace {grid-template-columns:minmax(0,1fr) 290px}.workspace-main {padding:32px 24px}.next-panel {padding:36px 24px}
  .palette-grid {grid-template-columns:1fr}.palette-choice {min-height:68px;flex-direction:row;align-items:center}.swatches{width:60px}
  .editor-layout {grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr)}.storyboard-panel{padding:28px 18px}.scene-row {grid-template-columns:22px 60px minmax(0,1fr);padding:14px 10px}.scene-row .drag,.scene-row>.icon {display:none}.mini-visual{width:60px}.scene-copy small{display:block}
  .preview-studio{grid-template-columns:110px minmax(0,1fr)}.preview-notes{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:12px 32px}.preview-notes h2,.preview-notes .quality-check{grid-column:1}.preview-notes .quality-check {margin:0}.preview-notes>.button{grid-column:2}.draft-warning{grid-column:2;grid-row:1/3;margin:0}
}
@media(max-width:760px) {
  html {scroll-padding-top:12px;scrollbar-gutter:auto}
  .topbar {min-height:66px;padding:10px 16px;gap:12px;grid-template-columns:40px minmax(0,1fr) 44px}
  .brand-mark{width:32px;height:32px}.project-crumb {max-width:100%;width:100%;gap:8px;justify-content:center;min-width:0}
  .project-name-input {width:100%;max-width:100%;font-size:13px;min-width:0}.save-state{flex-shrink:0}.top-actions {gap:0}.top-actions .mobile-menu {display:inline-flex}
  .screen-home .topbar,.screen-setup .topbar {grid-template-columns:1fr auto}.screen-home .topbar>div,.screen-setup .topbar>div {display:none}
  .screen-home .brand>span:last-child,.screen-setup .brand>span:last-child {display:inline;font-size:16px}
  .stepnav {height:auto;min-height:56px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible;gap:0}
  .step {padding:7px 1px;min-width:0;min-height:62px;gap:4px;flex-direction:column}.step>span:last-child{display:block;font-size:12px;line-height:1.4;overflow-wrap:anywhere;max-width:100%;text-align:center}.step-index{width:20px;height:20px;font-size:12px}
  .home,.setup-page {padding:32px 20px 64px}.home-heading {gap:18px;align-items:flex-start;flex-wrap:wrap}.home-heading h1{font-size:38px}.home-heading>.button{width:auto;font-size:14px;padding:11px 16px}.home-heading p{font-size:15px;margin-top:12px}
  .home-toolbar{margin-top:24px;gap:8px;flex-wrap:wrap}.home-toolbar .search{flex:1;min-width:160px}.home-toolbar>.button{padding-inline:0;font-size:13px}
  .project-grid{gap:20px}.new-card{min-height:150px}.thumbnail{height:230px}.empty-state{padding:24px 0;margin-top:24px}.empty-state h2{font-size:26px}
  .setup-title h1,.page-heading h1,.storyboard-head h1,.preview-top h1{font-size:30px}.setup-title{margin-top:20px}.setup-layout{grid-template-columns:minmax(0,1fr);gap:20px}
  .form-card,.settings-card{padding:20px}.choice{min-height:135px;padding:12px 6px}.choice strong{font-size:13px}.format-grid{gap:8px}.palette-grid{grid-template-columns:minmax(0,1fr)}.swatches{height:40px;width:65px}.palette-choice{flex-direction:row;align-items:center}.palette-choice>.icon{display:block}
  .workspace{display:flex;flex-direction:column}.workspace-main{padding:30px 20px}.page-heading{gap:16px;margin-bottom:24px}.page-heading>.button{font-size:13px;width:auto;padding:11px 14px}.page-heading p{font-size:15px}
  .editor-field textarea{min-height:300px;font-size:17px;padding:20px;line-height:1.8}.editor-label{padding:14px 16px}.text-stats{padding:14px 16px;font-size:12px}
  .segmented{width:100%;gap:2px;padding:4px}.segmented button{padding:10px 7px;font-size:13px;flex:1;min-width:0;white-space:normal}
  .next-panel{padding:24px 20px 36px;background:var(--surface)}.next-panel h2{font-size:24px}
  .screen-narration .next-panel{display:none}
  .mobile-narration-next {display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:0 0 28px;padding:0 0 24px;border-bottom:1px solid var(--line)}
  .mobile-narration-next>span{font-size:13px;color:var(--muted)}
  .screen-narration .next-panel h2{font-size:21px;margin-bottom:8px}.screen-narration .next-panel>p{margin-bottom:16px}.screen-narration .next-panel .timing-card{display:none}
  .narration-card{gap:20px}.two-col.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
  .storyboard-panel {padding:24px 16px}.storyboard-head{align-items:center;gap:12px}.storyboard-head>.button{font-size:13px;padding:10px 12px}.summary-strip{font-size:12px;margin-block:18px 14px}
  .editor-layout{display:block;height:auto}.scene-list{display:flex;flex-direction:row;align-items:stretch;overflow-x:auto;gap:12px;scroll-snap-type:x proximity;padding:3px 3px 12px;scrollbar-width:thin}
  .scene-row{flex:0 0 270px;scroll-snap-align:start;grid-template-columns:20px 56px minmax(0,1fr);gap:8px;min-height:110px}.scene-row .mini-visual{width:56px;height:64px}.scene-copy strong{font-size:13px}.scene-copy em{font-size:11px}.scene-copy small{display:none}.scene-copy .badge{font-size:10px}.scene-num{font-size:11px}
  .scene-inspector{border-top:1px solid var(--line);scroll-margin-top:12px}.inspector-head{padding:12px 16px;gap:8px}.inspector-head>span{gap:6px;flex-wrap:wrap}.inspector-head .badge{font-size:10px}.inspector-head .button.ghost{padding-inline:8px;font-size:12px}
  .scene-preview {min-height:260px}.preview-caption{padding:50px 20px 20px}.preview-caption strong{font-size:23px}.inspector-form{padding:22px 20px;gap:20px}.inspector-footer{padding:14px 20px}
  .preview-page{padding:28px 12px 50px}.preview-top{padding-inline:8px}.preview-status{gap:12px}.preview-top p{font-size:13px}
  .preview-studio{display:block}.scene-rail{padding:10px;gap:8px}.scene-rail button{width:92px;padding:8px;margin:0;display:flex;flex-direction:column;gap:6px;justify-content:center}.scene-rail button>span{display:block;font:11px 'DM Mono'}.scene-rail button>small{display:none}.scene-rail button>.mini-visual{display:block;width:72px;height:45px}
  .player-area{padding:20px 12px}.player-controls{gap:6px;width:100%}.player-controls .timecode{font-size:11px}.player-controls .scrubber{order:2;flex-basis:100%;height:44px}.player-controls .button.icon{width:44px}
  .preview-notes{display:block;padding:26px 20px}.preview-notes h2{font-size:24px}.quality-check{gap:16px;margin-block:22px}.draft-warning{margin:22px 0}
  .planning-page{padding-top:40px}.planning-art{transform:scale(.85);margin-bottom:0}.planning-page h1{margin-top:12px}.fallback-note{font-size:13px}
  .export-page{padding:30px 20px 64px;display:flex;flex-direction:column;gap:24px}.export-preview{margin:0}.export-card{width:100%;padding:26px 22px}.export-card h1{font-size:29px}.export-card>.button{width:100%}
  .connection-dialog{padding:24px;max-height:calc(100dvh - 32px);overflow-y:auto}.connection-dialog h2{font-size:23px}.dialog-backdrop{padding:16px}
  .toast{bottom:18px;padding:10px 16px;gap:12px;min-width:240px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){main,.connection-dialog,.toast,.status-illustration.success,.status-illustration.success path,.planning-art .orbit,.is-recording .record-ring{animation:none!important;transform:none}*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
.sync-recovery{max-width:520px}.sync-recovery>p{line-height:1.55}.sync-recovery-preview{display:grid;grid-template-columns:1fr auto;gap:6px 16px;padding:14px 0;border-bottom:1px solid var(--line)}.sync-recovery-preview strong{grid-column:1/-1;font-size:12px;color:var(--muted)}.sync-recovery-preview span{font-weight:650}.sync-recovery-preview small{color:var(--muted);text-align:right}.sync-recovery-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}@media(max-width:520px){.sync-recovery-actions{flex-direction:column-reverse}.sync-recovery-actions .button{width:100%}}