/* Monkey Click AI — cinematic studio. Presentation only; existing application
   controls, visibility states and business logic retain their original owners. */
:root {
  color-scheme: dark;
  --bg-page: #0b1017;
  --bg-soft: #141f29;
  --bg-card: #141d27;
  --bg-card-2: #18232f;
  --bg-card-dark: #101822;
  --bg-input: #0e1720;
  --text-primary: #f0eee7;
  --text-secondary: #b0bdc8;
  --text-muted: #8999a9;
  --accent: #edbd73;
  --accent-2: #ffdaa1;
  --accent-green: #78c9bd;
  --accent-orange: #edbd73;
  --accent-red: #ff9e97;
  --mint: #202b2c;
  --border: #2b3845;
  --border-soft: #22303d;
  --panel-border: #34404b;
  --radius-lg: 16px;
  --radius-md: 12px;
  --radius-sm: 8px;
  --shadow-sm: 0 2px 8px #0003;
  --shadow-md: 0 14px 36px #0003;
  --shadow-lg: 0 28px 90px #0009;
}
html { background: var(--bg-page); }
body, body.rs-body {
  background: radial-gradient(ellipse at 83% 12%, #1b303444, transparent 45%), radial-gradient(ellipse at 25% 60%, #25344925, transparent 55%), #0b1017;
  color: var(--text-primary);
  --rs-ink: #f0eee7;
  --rs-green: #edbd73;
  --rs-line: #2b3845;
  --rs-soft: #141f29;
}
body { background-attachment: fixed; }
h1,h2,h3,h4 { color: var(--text-primary); }
a:hover { color: var(--accent-2); }
::selection { background: #edbd7340; color: #fff; }
:focus-visible { outline: 2px solid #8bdfd1 !important; outline-offset: 4px; }
input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea,
.rs-form input:not([type=checkbox]), .rs-form select, .rs-form textarea {
  background: var(--bg-input); color: var(--text-primary); border-color: var(--border);
}
input::placeholder, textarea::placeholder { color: #7f91a2; }
input:focus, select:focus, textarea:focus { border-color: #78c9bd; box-shadow: 0 0 0 3px #78c9bd18; }
input[type=file] { background: var(--bg-input) !important; }
input[type=file]::file-selector-button { background: var(--bg-card-2); color: var(--text-primary); }
option { background: #14202b; color: var(--text-primary); }
button:disabled { opacity: .5; }
.skip-link, .rs-skip { background: #edbd73; color: #141a20; }
.skip-link:focus { color: #141a20; }
::-webkit-scrollbar-thumb { background: #455767; }

/* All persistent work surfaces share the same material. */
.card, .package, .license, .license-group, .license-stat-card, .license-mobile-card,
.binding-mobile-card, .binding-ip-card, .license-details-body > form,
.bank-copy-card, .kpi, .pricing-card, .scene-card, .modal, .app-alert-card,
.loading-popup, .trial-modal-card, .slip-modal-card,
.rs-card, .rs-stat, .rs-plan-card, .rs-dialog, .rs-login-card, .rs-total-box,
.vs-card, .vs-sidebar, .vs-step-card {
  background: linear-gradient(145deg, #1b2630e8, #121c27f5);
  border-color: var(--border);
  box-shadow: inset 0 1px 0 #ffffff05, 0 12px 35px #0002;
  color: var(--text-primary);
}
.bank-box, .checkout-summary, .license-details, .license-bulk-toolbar,
.license-mobile-meta-item, .binding-mobile-item, .license-mobile-note,
.ev-preview, .recheck-page .hero, .pricing-page .bank-box,
.admin-stats-grid .package, .secondary-note-box, .tutorial-step,
.rs-banner, .rs-dialog-note, .rs-login-help, .rs-meta-row,
.rs-key-guard, .rs-security-summary, .rs-policy-grid > div {
  background: #15232d; border-color: #30414b; color: var(--text-secondary);
}
.table-scroll, .account-table-scroll, .rs-table-scroll { border-color: var(--border); }
th, .rs-table th { background: #1b2934; color: #c7d2da; border-color: var(--border); }
td, .rs-table td { border-color: #293743; }
tbody tr:hover, .rs-table tbody tr:hover { background: #1b2b35; }
.muted, .meta, .rs-muted, .rs-field-help, .rs-stat-hint, .rs-empty, .vs-muted { color: var(--text-secondary); }
.topbar, .rs-card-head, .rs-dialog-head, .modal-header { border-color: var(--border); }
.eyebrow, .rs-eyebrow, .license-kicker { color: var(--accent); }

/* Bright controls are reserved for the next meaningful action. */
button, .button, .btn { background-color: #edbd73; color: #192029; }
button:hover, .button:hover, .btn:hover { background-color: #ffcf88; color: #101821; }
.generate-btn, .primary-btn, .auth-popup-submit, .auth-submit-btn, .app-alert-ok,
.new-project-btn, .rs-button-primary, .vs-btn--primary {
  color: #171e25; background: linear-gradient(110deg, #e8b669, #f4cd91); border: 1px solid #ffd79766;
  box-shadow: 0 3px 16px #dcaa5818, inset 0 1px 0 #fff4; font-weight: 600;
}
.generate-btn:hover, .primary-btn:hover, .auth-popup-submit:hover, .new-project-btn:hover,
.rs-button-primary:hover, .vs-btn--primary:hover { background: #ffdaa1; color: #171e25; border-color: #ffe3b4; }
.action-btn:not(.primary-btn), .copy-btn, button.ghost, .button.ghost, .btn-soft,
.selector-btn, .prompt-mode-btn, .platform-mode-btn, .btn-option,
.secondary-speaker-btn, .composer-option, .idea-provider-button,
.assistant-action-list button, .idea-chips button, .auth-link-btn,
.rs-button:not(.rs-button-primary):not(.rs-button-danger), .rs-icon-button,
.rs-password-wrap button, .vs-btn--ghost, .vs-btn:not(.vs-btn--primary):not(.vs-btn--danger) {
  color: #c9d3d9; background: #192630; border-color: #34434f; box-shadow: none;
}
.action-btn:hover, .copy-btn:hover, button.ghost:hover, .selector-btn:hover,
.composer-option:hover, .assistant-action-list button:hover, .idea-chips button:hover,
.auth-link-btn:hover, .rs-button:hover { background: #273b43; color: #f9e8cb; border-color: #789185; }
.action-btn.auth-popup-submit { color: #171e25; background: linear-gradient(110deg,#e8b669,#f4cd91); border-color: #ffd79766; }
.text-button, .icon-button, .modal-close, .app-alert-close,
.rs-button-text, .rs-back-link, .vs-img-del { background: transparent; color: #b9c8cf; }
.text-button:hover, .icon-button:hover, .modal-close:hover { background: #ffffff08; color: var(--accent); }
.prompt-mode-btn.active, .platform-mode-btn.active, .btn-option.active,
.modal-card.selected, .selector-btn.has-selection, .rs-plan-card.selected {
  background: #263934; color: #b0e5d8; border-color: #56897d;
}
.btn-danger, button.license-danger-button, .danger, .rs-button-danger, .vs-btn--danger {
  background: #44282e; color: #ffb3aa; border-color: #72454b;
}
.alert, .auth-popup-alert, .rs-alert, .vs-alert { background: #1b2935; color: #c0d1de; border-color: #405767; }
.alert.error, .auth-popup-alert.error, .error, .result.err, .rs-alert-error, .vs-toast--error {
  background: #38252d; color: #ffb1a8; border-color: #76444b;
}
.alert.success, .auth-popup-alert.success, .success, .flash, .result.ok,
.rs-alert-success, .rs-toast, .vs-toast--ok { background: #18372f; color: #9fe1c6; border-color: #386454; }
.status, .badge, .mcm-pill, .vs-pill, .group-count, .binding-ip-badge, .rs-pill {
  background: #26343e; color: #c2d3db;
}
.status.approved, .badge:not(.off), .mcm-pill.on, .vs-pill.on, .rs-pill-green,
.created, .created-list, .mcm-newkey, .rs-key-output {
  background: #18372f; color: #a3e0c5; border-color: #416655;
}
.status.pending, .vs-pill.cool, .rs-pill-amber, .vs-alert--warn { background: #382f23; color: #f4d297; border-color: #65523a; }
.status.rejected, .badge.off, .mcm-pill.off, .vs-pill.off, .rs-pill-red { background: #3d2930; color: #ffb1a8; }
.license-ip-summary-pill { background: #1e3039; color: #bcd0d5; border-color: #3b505b; }
.license-ip-summary-pill.is-primary { background: #263d36; color: #b0dfc4; border-color: #496e5b; }
.license-online-state.is-online, .binding-online-badge.is-online { color: #98d9bb; }
.rs-pill-blue { background: #1d3544; color: #9bd6f0; }
.modal-overlay, .app-alert-overlay, .loading-overlay { background: #03070dc9; backdrop-filter: blur(8px); }
.modal-card, .image-upload-zone, .prompt-block, .block-text, .idea-result,
.api-settings-note, .chat-box, .follow-up-card, .empty-state, .tutorial-step-highlight {
  background: #121e28; border-color: var(--border); color: var(--text-primary);
}
.modal-card:hover, .image-upload-zone:hover { background: #21343c; border-color: #669288; }
.modal-body, .modal-header, .tools-search-wrap { background: transparent; }
.tools-grid .sidebar-section { background: #17232d; border: 1px solid var(--border); border-radius: 10px; }
.scene-header { background: #1b2b34; border-color: var(--border); }
.scene-number, .step-number { background: #2d3e3c; color: var(--accent); }
.scene-tag, .scene-variant-badge, .style-badge { background: #273b3b; color: #a8d7cd; }
.scene-story, .idea-feedback, .idea-result-changed { background: #1c2d37; color: var(--text-secondary); border-color: #354853; }
.prompt-block-title, .prompt-label { color: #9fdace; }
.idea-result-text, .idea-feedback p, .idea-feedback button { color: #c3d4d8; }
.idea-feedback[data-state="error"] p { color: #ffb1a8; }
.idea-result-changed { color: #ebc88f; }
.variant-b, .vid-prompt { color: #d7c28e; }
.story-art .floating-art-label { color: #e4d6b6; }
.storyboard-header, .license-hero { background: linear-gradient(120deg,#24343c,#15222d); border-color: #3c5157; color: var(--text-primary); }
/* The legacy follow-up renderer emits inline presentation styles. Scope the
   palette override to that renderer; retain every control and visibility rule. */
#followUpInterface { background: #14212b !important; border-color: #344954 !important; box-shadow: 0 12px 30px #0003 !important; }
#followUpInterface [style*="color:"] { color: #bfccd4 !important; }
#followUpInterface [style*="border"] { border-color: #354b56 !important; }
#followUpInterface [style*="background:"] { background: #1a2b35 !important; }
#followUpInterface [style*="background:#fff7e8"] { background: #302d25 !important; }
#followUpInterface button { color: #b6ddd1 !important; background: #294039 !important; min-height: 40px; }
#followUpInterface button:hover { background: #38564a !important; color: #f0e3c6 !important; }
#followUpInterface button[onclick="generateNextBatch()"], #followUpInterface button[onclick="sendFollowUp()"] { background: #e6bb78 !important; color: #17212a !important; }
#followUpInterface input, #followUpInterface select { background: #101d27 !important; color: #e3e8e6 !important; }
.storyboard-header .storyboard-meta span { background: #243b3d !important; color: #c4ddd5 !important; }
.storyboard-header button { background: #243b3d !important; color: #c4ddd5 !important; }

/* Studio navigation — opaque enough to read over the cinematic backdrop. */
.astra-workspace { --sidebar-width: 242px; }
.workspace-sidebar { background: linear-gradient(160deg, #151e26, #0d141c 75%); border-right-color: #2b3540; padding-top: 29px; }
.workspace-brand { color: #f1eee6; }
.astra-brand-symbol { background: linear-gradient(150deg, #4c4431, #22282a); color: #f3c680; border: 1px solid #88704666; border-radius: 10px; box-shadow: 0 0 24px #dbaa4810; }
.workspace-brand small { color: #95a4b0; }
.workspace-brand .brand-dot { color: #eebe72; }
.nav-group-label { font-size: 10px; letter-spacing: .06em; color: #8494a2; }
.workspace-nav { gap: 5px; margin-bottom: 22px; }
.nav-item { min-height: 44px; border: 1px solid transparent; color: #a7b7c5; border-radius: 7px; }
.nav-item:hover { background: #1c2a34; color: #e9ece5; }
.nav-item.active { color: #efd2a0; background: linear-gradient(90deg, #d2a65c22, #d2a65c05); border-color: #ba965631; box-shadow: inset 2px 0 #e3b467; }
.nav-active-dot { background: #efc986; box-shadow: 0 0 10px #e4b36388; }
.new-project-btn { font-size: 11px; margin: 30px 0 28px; border-radius: 7px; }
.sidebar-tip { background: linear-gradient(140deg, #28312977, #19232b); border-color: #b19b6536; border-radius: 9px; }
.sidebar-tip strong { color: #e8d9bc; }
.sidebar-tip p { color: #9babb7; }
.sidebar-profile { border-color: var(--border); }
.profile-avatar { background: #263735; color: #a9d9cc; border: 1px solid #48625d; }
.floating-topbar, .rs-topbar { background: #0e1720ed; border-color: #293540; backdrop-filter: blur(16px); }
.workspace-topbar { min-height: 72px; }
.workspace-status { color: #9eb4b8; font-size: 10px; }
.workspace-status > span { background: #7fc9b8; box-shadow: 0 0 8px #7fc9b84d; }
.workspace-edition { border: 1px solid #3a4650; color: #a7b6bf; background: #16212b; }
.content-canvas { padding-top: 27px; }
.center-stage { max-width: 1260px; }
.workspace-page-heading { margin-bottom: 23px; }
.workspace-page-heading .eyebrow { font-size: 9px; letter-spacing: 2px; color: #a0b3bc; }
.workspace-page-heading h1 { font-size: 25px; margin: 6px 0 3px; }
.workspace-page-heading p { font-size: 12px; }

/* The scene lives beside the welcome message; the actual editor stays native. */
.creation-surface.idea-workbench { padding: 0 28px 23px; overflow: hidden; border-color: #3b4348; border-radius: 14px; background: linear-gradient(120deg, #1c2732, #121c27 60%); box-shadow: 0 20px 55px #0003; }
.creation-intro { min-height: 335px; padding: 22px 0 8px; gap: 0; position: relative; }
.creation-intro::before { content: ''; position: absolute; inset: 0 -28px; pointer-events: none; background: radial-gradient(ellipse at 68% 50%, #47797922, transparent 55%); }
.creation-heading { width: 43%; flex-shrink: 0; padding: 20px 0 26px 7px; }
.creation-heading .eyebrow { color: #d4ba90; font-size: 9px; letter-spacing: 1.9px; gap: 8px; }
.creation-heading h2 { font-size: clamp(30px, 2.9vw, 43px); line-height: 1.55; font-weight: 500; letter-spacing: -.04em; margin: 17px 0 13px; }
.creation-heading h2 span { color: #e9bd7f; }
.creation-heading > p { color: #a6b6c3; font-size: 12px; line-height: 1.9; }
.intro-spark { color: #edc588; background: transparent; }
.creation-intro .cinematic-scene { width: 60%; margin: -12px -25px -5px -10px; align-self: stretch; min-height: 335px; }
.creation-intro .cinematic-scene { height: 350px; border: 0; border-radius: 0; background: transparent; }
.creation-intro .cinematic-scene::before { display: none; }
.idea-workbench .creation-heading .eyebrow { color: #d4ba90; }
.idea-workbench .creation-heading > p { color: #b0bdc8; font-size: 13px; }
.block-guide-hint { background: #23333c; color: #aebfca; border-color: #3a5057; }
.workspace-edition { padding: 6px 10px; border-radius: 6px; font-size: 11px; }
.studio-scene-heading { position: absolute; right: 0; top: 20px; font: 9px/1.6 Consolas, monospace; letter-spacing: 1.7px; color: #7d9aa4; z-index: 1; }
.studio-scene-heading::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #77c4b8; margin-right: 7px; }
.studio-coordinates { display: flex; gap: 14px; margin-top: 22px; color: #788c9b; font: 9px/1.7 Consolas, monospace; letter-spacing: 1.5px; }
.studio-coordinates span:first-child { color: #96c9bf; }
.idea-workbench .prompt-composer { position: relative; background: #0d1721e8; border: 1px solid #40505b; box-shadow: 0 7px 25px #0002; border-radius: 10px; }
.composer-topline { color: #c6d0d7; }
.composer-topline label { color: #d1d9db; font-size: 12px; }
.idea-workbench .prompt-composer #objectInput { background: transparent; border: 0; color: #eceee9; min-height: 95px; font-size: 14px; }
.idea-workbench .prompt-composer #objectInput::placeholder { color: #8fa2b1; }
.idea-workbench #objectInput:focus { box-shadow: none; }
.idea-workbench .prompt-composer:focus-within { border-color: #91b9ac; box-shadow: 0 0 0 2px #73b4a611; }
.idea-workbench .composer-toolbar { background: #19263099; border-top-color: #2c3a46; }
.idea-workbench .idea-assistant-toolbar { border-color: #263642; }
.assistant-toolbar-label { color: #95a7b5; }
.idea-workbench .composer-hint, .composer-notes p { color: #8ea0af; }
.idea-chips { border-color: #2c3944; }
.idea-chips > span { color: #9baab5; }
.preview-notice { background: #14282b99; color: #b4c7c8; border-color: #305050; border-radius: 9px; }
.preview-notice strong { color: #a5d5c9; }
.preview-notice p { color: #9baeb7; }
.preview-notice button { color: #d9c099; background: transparent; }
.notice-icon { background: #29433f; color: #a0d9c9; }
.section-heading h2 { font-size: 19px; font-weight: 500; }
.section-heading p { color: #8ea1af; }
.creative-grid { gap: 17px; }
.creative-card { border-color: #35424c; border-radius: 11px; background: #14202b; color: var(--text-primary); box-shadow: inset 0 1px #ffffff06; }
.creative-card:hover { background: #1c2b35; border-color: #748781; color: var(--text-primary); }
.creative-card-body { background: #14202b; border-color: #34424e; }
.creative-card-body h3 { color: #e0e5e4; }
.creative-card-body p { color: #9cabb8; }
.card-category { color: #bfab86; font-size: 9px; letter-spacing: 1.6px; }
.card-pill { background: #24343b; color: #a1b8ba; border: 1px solid #385051; }
.product-art { background: radial-gradient(ellipse at 55% 20%, #72653e, #253c3d 65%, #11232d); }
.product-plinth { background: linear-gradient(140deg, #a39775, #374746); box-shadow: 15px 22px 30px #0007; }
.product-bottle { box-shadow: 15px 18px 28px #0008, inset 3px 0 8px #fff7; }
.art-grid { opacity: .09; }
.art-spark { color: #d8bd81; }
.story-art { background: linear-gradient(150deg, #11202d, #3a6668); }
.story-sun { background: #d9b874; box-shadow: 0 0 45px #dfb15e44; }
.story-mountain.mountain-back { background: #40544f; }
.story-mountain.mountain-front { background: #1c363c; }
.floating-art-label, .story-timecode { color: #ecddbd; }
.workflow-guide { border-color: #293a44; color: #92a5b0; }
.workflow-guide b { color: #d9ba88; background: #26312f; border-color: #4c5446; }
.workflow-guide i { background: #31434b; }
.workspace-footer { border-color: #293741; color: #8b9ca9; }

/* Account, reseller and studio pages keep their task-first layout. */
.auth-center-page { background: radial-gradient(ellipse at 28% 40%, #27404766, transparent 53%), #0b1119; }
.auth-center-page .auth-center-container { width: min(1230px, calc(100% - 64px)); grid-template-columns: 1.15fr 440px; gap: 76px; }
.auth-story h1 { margin: 32px 0 15px; font-size: clamp(32px, 3.2vw, 44px); font-weight: 500; }
.auth-story .cinematic-scene { width: 100%; height: 300px; margin: 0 0 10px; }
.auth-story-steps { grid-template-columns: repeat(3,1fr); gap: 17px; margin-top: 18px; }
.auth-story-step { display: block; }
.auth-story-step > span { background: #21322f; color: #dfbd86; border-color: #4a5042; width: 28px; height: 28px; margin-bottom: 10px; font-size: 10px; border-radius: 6px; }
.auth-story-step strong { font-size: 11px; }
.auth-story-step p { font-size: 10px; }
.auth-story-footer { margin-top: 28px; font-size: 9px; letter-spacing: 1.5px; }
.auth-card { border-top: 2px solid #b49665; box-shadow: 0 25px 65px #0005; border-radius: 12px; }
.auth-link-btn--ghost { background: transparent; }
.profile-summary { border-top-color: #c9a56c; }
.package { position: relative; border-top-color: #a3895f; }
.package:hover { border-color: #c4a46f; box-shadow: 0 12px 40px #0004; }
.package-price { color: #efc686; }
.rs-sidebar { background: #111a23; border-color: var(--border); }
.rs-brand, .rs-brand-name { color: #edece4; }
.rs-brand-mark, .rs-login-symbol { background: #37382e; color: var(--accent); }
.rs-workspace-badge, .rs-user-name, .rs-role { background: #23312f; color: #c5ccb9; border-color: #475143; }
.rs-nav-label, .rs-stat-top, .rs-nav-item { color: #a7b7c5; }
.rs-nav-item:hover, .rs-nav-item.active { background: #343329; color: #edcc97; }
.rs-nav-count { background: #443b2b; color: #f2d29e; }
.rs-stat-highlight, .rs-stat-alert { background: linear-gradient(135deg, #273b3b, #17242d); }
.rs-stat-icon, .rs-security-icon, .rs-security-emblem { background: #2c403c; color: #d6c08f; border-color: #4b655b; }
.rs-stat-value { color: #f3e5ca; }
.rs-positive { color: #9edabe; } .rs-negative { color: #ffafa5; }
.rs-login-story { background: radial-gradient(ellipse at 40% 50%, #334e4d, #101b28 75%); color: #e1e6df; }
.rs-login-story p, .rs-login-benefits p, .rs-login-copyright { color: #afc0c6; }
.rs-login-panel { background: transparent; }
.rs-login-benefits > div, .rs-plan-details, .rs-total-box { background: #14232d99; border-color: var(--border); }
.rs-progress-track, .vs-progress-bar { background: #293c45; }
.rs-progress-fill, .vs-progress-fill { background: linear-gradient(90deg, #72bcad, #e2bd7c); }
.rs-notification, .rs-notification-new, .rs-report-tabs button, .rs-task-chips > * { background: #1a2b34; color: #c7d4d5; border-color: #364a50; }
.rs-v2-overview, .rs-report-stats .rs-stat, .rs-report-stats > div { background: linear-gradient(135deg,#273b3b,#15222d); border-color: #42574f; color: #e4e8df; }
.rs-v2-overview h2, .rs-v2-overview-title { color: #e9dfca; }
.rs-table td, .rs-table td a, .rs-mini-row, .rs-detail-list, .rs-timeline { color: #b5c6ce; }
.rs-table strong, .rs-empty strong, .rs-report-stats strong { color: #e1e6df; }
.rs-body details pre { background: #101e28; color: #b9d3d2; border-color: var(--border); }
.rs-filter, .rs-filter input, .rs-filter select, .rs-recovery-codes,
.rs-recovery-codes code, .rs-detail-list, .rs-product-tag { background: #172a33; color: #c3d5d9; border-color: #3c515a; }
.rs-table td strong, .rs-breadcrumb strong, .rs-login-story h1,
.rs-login-benefits strong, .rs-login-help strong { color: #e4e6da; }
.rs-form label, .rs-form legend, .rs-policy-grid dd, .rs-filter-note,
.rs-detail-list span, .rs-notification p, .rs-timeline p, .rs-note-text,
.rs-security-summary p, .rs-page-heading > div > p:last-child,
.rs-banner p, .rs-login-benefits span { color: #a9c0c8; }
.rs-plan-price, .rs-total-box strong, .rs-link-inline, .rs-audit-details summary { color: #e8c68e; }
.rs-body input::file-selector-button { color: #c4dbd6; background: #213a3d; border-color: #43635e; }
.rs-stat-alert .rs-stat-value { color: #ffba98; }
.rs-form input, .rs-form select, .rs-form textarea { color: #e2e7e4; }
.rs-plan-card input:checked + *, .rs-report-tabs button.active { color: var(--accent); }
.vs-shell { color: var(--text-primary); }
.vs-sidebar-head, .vs-project-head, .vs-card-title { border-color: var(--border); }
.vs-empty-art { background: #233c3e; box-shadow: 0 0 70px #5baa9c18; }
.vs-project-item { color: var(--text-secondary); background: transparent; }
.vs-project-item:hover, .vs-project-item.active { background: #293e3d; border-color: #507769; }
.vs-drop, .vs-step, .vs-audio-info, .vs-render-history { background: #12212c; border-color: #38515a; }
.vs-toast { background: #1b313b; color: var(--text-primary); }
.vs-skeleton { background: linear-gradient(90deg, #21343e, #344950, #21343e); background-size: 200% 100%; }

@media (min-width: 1550px) {
  .creation-intro { min-height: 380px; }
  .creation-intro .cinematic-scene { min-height: 380px; }
}
@media (max-width: 1180px) {
  .astra-workspace { --sidebar-width: 220px; }
  .content-canvas { padding-left: 25px; padding-right: 25px; }
  .creation-heading h2 { font-size: 32px; }
  .creation-surface.idea-workbench { padding-left: 22px; padding-right: 22px; }
  .creation-intro { min-height: 290px; }
  .creation-intro .cinematic-scene { min-height: 290px; }
  .creation-intro .scene-caption { max-width: calc(100% - 155px); font-size: 8px; letter-spacing: .1em; }
  .auth-center-page .auth-center-container { gap: 36px; grid-template-columns: 1fr 410px; }
}
@media (max-width: 760px) {
  .astra-workspace { --sidebar-width: 0px; }
  .workspace-sidebar { width: 250px; }
  .creation-heading h2 { font-size: 34px; }
}
@media (max-width: 880px) {
  .auth-center-page .auth-center-container { grid-template-columns: 1fr; width: min(560px,calc(100% - 32px)); gap: 18px; }
  .auth-story .cinematic-scene { height: 230px; }
  .auth-story h1 { font-size: 31px; }
  .auth-story-steps { display: none; }
  .auth-story > p { display: block; }
}
@media (max-width: 640px) {
  body { background-attachment: scroll; }
  .content-canvas { padding: 22px 15px 0; }
  .mobile-menu-btn, .modal-close { min-width: 44px; min-height: 44px; }
  .workspace-page-heading h1 { font-size: 23px; }
  .workspace-page-heading p { font-size: 11px; }
  .creation-surface.idea-workbench { padding: 0 13px 17px; }
  .creation-intro { flex-direction: column; align-items: stretch; padding: 26px 4px 2px; }
  .creation-heading { width: 100%; padding: 0 6px; }
  .creation-heading h2 { font-size: 32px; line-height: 1.45; margin-top: 12px; }
  .creation-heading p { font-size: 12px; }
  .creation-heading .eyebrow { font-size: 8px; letter-spacing: 1.5px; }
  .studio-coordinates { margin-top: 13px; font-size: 8px; }
  .studio-scene-heading { display: none; }
  .creation-intro .cinematic-scene { width: calc(100% + 22px); height: 245px; min-height: 245px; margin: -5px -11px 2px; }
  .idea-workbench .prompt-composer #objectInput { font-size: 16px; min-height: 112px; }
  .idea-provider-button { max-width: 62%; }
  .idea-workbench .assistant-action-list button { min-height: 38px; font-size: 10px; }
  .idea-workbench .composer-hint { font-size: 11px; }
  .creative-card { overflow: hidden; }
  .preview-notice { align-items: flex-start; }
  .auth-story .cinematic-scene { height: 220px; }
  .auth-card { padding: 25px; }
  .rs-form-row { grid-template-columns: minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
@media print {
  :root { color-scheme: light; --text-primary: #15202b; --text-secondary: #344454; --bg-page: white; --bg-card: white; --border: #ccd3d8; }
  body, .card, .scene-card { background: white !important; color: #15202b !important; box-shadow: none; }
  .cinematic-scene { display: none !important; }
}