/* Cypress: white, midnight blue, and restrained holographic accents. */
:root{--holo-cyan:#63d5e6;--holo-lilac:#a39be1;--line:#dfe5f0;background:#f6f8fc}
body{background:radial-gradient(ellipse at 8% 10%,#e5effa80,transparent 42%),radial-gradient(ellipse at 95% 45%,#ebe8f770,transparent 40%),#f6f8fc}
.site-header{background:#ffffffed;border-bottom:1px solid #dce3f1;box-shadow:0 3px 22px #24356b04;backdrop-filter:blur(16px)}
.site-header:after{content:"";position:absolute;height:1px;left:24px;right:24px;bottom:-1px;background:linear-gradient(90deg,transparent,#87cde766,#a99be266,transparent);pointer-events:none}
.brand{display:flex;align-items:center;flex-shrink:0}
.cypress-wordmark{display:block;position:relative;width:194px;height:36px;overflow:hidden;mix-blend-mode:multiply}
.cypress-wordmark img{position:absolute;display:block;width:300px;max-width:none;height:auto;left:-42px;top:-9px}
.header-divider{background:linear-gradient(180deg,transparent,#cdd5e9,transparent);height:28px}
.studio-label{color:#536381;letter-spacing:.2px}
.studio-label small{background:linear-gradient(120deg,#edfaff,#f0eefd);border-color:#d9e1f3;color:#5c6896}
.header-actions .primary{background:linear-gradient(120deg,#293580,#3b428f);border-color:#343e8a;box-shadow:inset 0 1px 0 #ffffff24,0 3px 10px #29358012}
.header-actions .primary:hover{background:linear-gradient(120deg,#202b69,#343a80);box-shadow:0 4px 15px #29358026}
.brand-menu-links{box-shadow:0 16px 40px #1d2d581a;border-top:2px solid #9ccde1}
.studio-eyebrow{display:flex;align-items:center;gap:7px;color:#71819e;letter-spacing:1.8px}
.studio-eyebrow:before{content:"";width:6px;height:6px;transform:rotate(45deg);border:1px solid #66a7cb;background:#a5dae944;box-shadow:0 0 8px #8ed4e22e}
.workspace-intro h1{color:#222c46}
.free-badge{background:linear-gradient(120deg,#f0f5fd,#f2effa);border-color:#dde4f3;color:#405183}
.panel{border-color:#dce3ef;box-shadow:0 5px 24px #22356b05,inset 0 1px 0 #fff}
.preview-heading{position:relative;background:linear-gradient(110deg,#fff,#fafbff);border-radius:14px 14px 0 0}
#presetBar>span{color:#7a8aaa;font-size:8px;letter-spacing:1.5px}
.scene-name{color:#28334e}
.preview-badge{color:#688599}
.preview-badge i{color:#58aebe;box-shadow:0 0 0 3px #74c2d815,0 0 8px #87cee426}
.asset-summary{background:linear-gradient(110deg,#f4f7fc,#f8f7fd);border-color:#e3e9f4}
.asset-summary>span{background:linear-gradient(135deg,#e6f2f9,#eae9f7);color:#627b9e;border-color:#d6e2f0}
.preview-well{position:relative;border:1px solid #ccd9ec;border-radius:11px;box-shadow:0 0 0 3px #eaf0fa66;overflow:hidden}
.preview-well:before,.preview-well:after{content:"";position:absolute;width:16px;height:16px;pointer-events:none;z-index:2;border-color:#a6d5e299}
.preview-well:before{left:8px;top:8px;border-left:1px solid;border-top:1px solid;color:#91bed280}
.preview-well:after{right:8px;bottom:8px;border-right:1px solid;border-bottom:1px solid;color:#b0a5db80}
.stage-top{color:#93a5be}
.inspector-tabs{background:linear-gradient(110deg,#fafcff,#f8f8fd);border-bottom-color:#e2e7f2}
.inspector-tabs button{position:relative;border-radius:8px}
.inspector-tabs button[aria-selected="true"]{background:linear-gradient(125deg,#eaf2fb,#eeecf8);border-color:#dbe3f1;box-shadow:inset 0 1px 0 #fff;color:#293580}
.inspector-tabs button[aria-selected="true"]:after{content:"";position:absolute;left:22%;right:22%;bottom:0;height:2px;background:linear-gradient(90deg,#6bc9df,#a89bdc);border-radius:2px}
.upload{background:linear-gradient(#ffffffab,#ffffffab),linear-gradient(90deg,#cbdcee55 1px,transparent 1px),linear-gradient(#cbdcee55 1px,transparent 1px),#f8faff;background-size:auto,20px 20px,20px 20px,auto;border:1px dashed #c9d5e8;box-shadow:inset 0 0 28px #edf2fd66}
.upload:hover,.upload.over{border-color:#799fc8;background-color:#eff5fc}
.upload-icon{background:linear-gradient(135deg,#e7f3f9,#ece8fa);border:1px solid #dbe3f3;color:#52689b;box-shadow:0 2px 12px #7192b50d}
.asset-kind{background:#f2f5fa;border:1px solid #e5eaf3}
.asset-kind button[aria-pressed="true"]{border-color:#d8e2f1;box-shadow:0 2px 7px #304a7c09}
.scene-switch button,.background-options button{border-color:#e0e6f0;transition:background .18s,border-color .18s,box-shadow .18s}
.scene-switch button:hover,.background-options button:hover{border-color:#a6bcd8;background:#f7faff}
.scene-switch button.selected,.background-options button.selected{background:linear-gradient(115deg,#eff6fd,#f2effb);border-color:#95a9d1;box-shadow:inset 3px 0 0 #93c9df,0 2px 8px #29358005}
.scene-icon{background:linear-gradient(135deg,#edf5fc,#efecf8);border:1px solid #e0e6f4;color:#7689b7}
.scene-switch button.selected .scene-icon{color:#3d5895;background:linear-gradient(135deg,#dff1fa,#e8e3f7)}
.choice-dot{box-shadow:0 0 0 3px #f3f6fb}
.shape-settings,.sample-disclosure,.model-settings{border-color:#e4eaf4}
.playback{background:linear-gradient(180deg,transparent,#fcfdff)}
.timeline input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right,#5266a2 0 var(--scrub-progress,0%),#e5eaf3 var(--scrub-progress,0%) 100%)}
.timeline input[type=range]::-webkit-slider-thumb{background:#40558f;box-shadow:0 0 0 1px #bacbe3,0 0 6px #8fcee72b}
.studio-footer{background:linear-gradient(115deg,#f4f8fc88,#f5f2fb55);border-top-color:#dfe6f1}
.footer-wordmark .cypress-wordmark{transform:scale(.78);transform-origin:left center;margin-right:-42px}
.brand-footer-copy p{margin-top:3px}
.brand-footer-bottom{border-top-color:#e4eaf3}
dialog{border-color:#dce5f4;box-shadow:0 20px 80px #1f31542e}
@media(max-width:1050px){.header-actions{gap:15px}.site-header{gap:12px}.cypress-wordmark{width:174px}.cypress-wordmark img{width:275px;left:-39px;top:-7px}}
@media(max-width:759px){.site-header{padding-top:8px;padding-bottom:7px}.cypress-wordmark{width:174px;height:34px}.header-divider{height:24px}.header-actions{border-top-color:#e8edf6}.studio-label{font-size:13px}.preview-well{box-shadow:0 0 0 2px #eaf0fa66}.studio-eyebrow{font-size:8px}.brand-footer-main{gap:7px}}

/* Local desktop layout refinement: cap the preview column by usable height,
   so ultrawide windows do not stretch the square fan canvas into a black strip. */
@media(min-width:1051px){
 :root{--studio-content-width:calc(clamp(520px,100dvh - 150px,840px) + 446px)}
 .workspace{width:100%;max-width:var(--studio-content-width);margin-inline:auto;grid-template-columns:minmax(0,1fr) 380px}
 .workspace-intro,.studio-footer{width:100%;max-width:var(--studio-content-width);margin-inline:auto}
}