/* Eidolon 2.0 creative workspaces */
:root{--studio-bg:#101419;--studio-panel:#171d24;--studio-line:#ffffff20;--studio-accent:#e5c78e;--studio-text:#f2eee5;--studio-muted:#adb6bb}
[hidden]{display:none!important}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #a5d8eb;outline-offset:3px}
.welcome{max-width:1120px;width:calc(100% - 64px)}.welcome h1{font-size:clamp(48px,6vw,86px);line-height:1.03}.welcome .intro{max-width:650px;font-size:17px;margin:20px auto 30px}.tool-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;text-align:left}.tool-card{display:flex;flex-direction:column;gap:12px;text-align:left;padding:24px;border:1px solid #e4cf9c35;border-radius:16px;background:linear-gradient(135deg,#18202be8,#0a0e12ed);color:#ece8df;min-width:0;transition:border-color .2s,transform .2s}.tool-card:hover{border-color:#e4cf9c;transform:translateY(-3px)}.tool-card .tool-art{font-size:47px;color:#baa3e8;line-height:1.2}.tool-card .compose-art{color:#9dd0c4}.tool-card .scenes-art{color:#e5c78e}.tool-card strong{font:27px Georgia,serif}.tool-card>span:not(.tool-art):not(.eyebrow){font-size:14px;line-height:1.55;color:#c1c8ca;min-height:44px}.tool-card b{font-size:13px;color:#e5c78e;font-weight:500;margin-top:4px}.welcome .local-promise{margin-top:22px}.welcome .eyebrow{letter-spacing:.2em}
.workspace{position:fixed;inset:80px 24px 16px;z-index:25;display:flex;flex-direction:column;color:var(--studio-text);background:linear-gradient(125deg,#151b22f8,#0e1117fa);border:1px solid #c3c5c530;border-radius:16px;overflow:hidden;box-shadow:0 12px 70px #0008;font-family:Arial,sans-serif;font-size:14px}.workspace-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px 12px}.workspace .eyebrow{font-size:10px;color:var(--studio-accent);margin:0 0 6px}.workspace .project-name{font:30px Georgia,serif;color:var(--studio-text);background:none;border:0;border-bottom:1px solid transparent;width:min(60vw,500px);padding:0}.workspace button,.canvas-tools button,.wide-modal button,.file-button{border:1px solid var(--studio-line);background:#202832;color:var(--studio-text);border-radius:7px;min-height:38px;padding:8px 13px;font-size:13px;line-height:1.35}.workspace button:hover,.wide-modal button:hover{background:#2e3844;border-color:#e5c78e80}.workspace button.primary{background:#ddc28b;color:#191d21;border-color:#ddc28b;font-weight:bold}.workspace button[aria-pressed=true]{background:#3b3b32;color:#f5dda9;border-color:#b6a477}.workspace h2{font:28px Georgia,serif;margin:4px 0 15px}.workspace h3{font:18px Georgia,serif;margin:15px 0 12px}.workspace p{line-height:1.6}.workspace .hint,.wide-modal .hint{font-size:13px;color:var(--studio-muted);line-height:1.5;margin:12px 0}.transport-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 24px;background:#0d111980;border-block:1px solid var(--studio-line)}.workspace label,.wide-modal label{display:flex;flex-direction:column;gap:7px;font-size:12px;color:#c3cace;text-transform:none;letter-spacing:.02em;min-width:110px}.workspace input:not([type=range]):not([type=file]),.workspace select,.wide-modal input:not([type=range]),.wide-modal select{color:#f1eee6;background:#111821;border:1px solid #ffffff28;border-radius:5px;padding:8px;min-height:36px;width:100%;font:14px Arial,sans-serif}.transport-bar label{min-width:80px;width:110px}.workspace input[type=range],.wide-modal input[type=range]{width:100%;accent-color:#e0c994;min-width:80px}.workspace output,.wide-modal output{font:11px monospace;color:#e5c78e}.transport-bar #composeStatus,.transport-bar #sceneStatus{font-size:12px;color:#b2cabd;margin-right:auto;max-width:260px;line-height:1.4}.workspace-tabs{display:flex;gap:5px;padding:10px 24px;border-bottom:1px solid var(--studio-line);flex-wrap:wrap}.workspace-tabs button{border-color:transparent;background:transparent;min-width:85px}.workspace-body{padding:20px 24px;overflow:auto;min-height:0;flex:1;scrollbar-color:#52616c #131a22;scrollbar-width:thin}.workspace-foot{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 24px;border-top:1px solid var(--studio-line);font-size:12px;color:#aebbbd}.control-row{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:8px 0 16px}.control-row label{width:140px}.control-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:15px;margin:16px 0}.sequence-scroll,.piano-scroll{overflow:auto;max-height:390px;border:1px solid #ffffff20;border-radius:8px;background:#0e141c;scrollbar-color:#667581 #121922}.sequence-grid{display:grid;grid-template-columns:115px repeat(var(--steps),minmax(33px,1fr));gap:5px;min-width:calc(125px + var(--steps)*38px);padding:10px}.sequence-grid .track-label{position:sticky;left:0;z-index:2;background:#19212c;font-size:11px;padding:10px 8px;display:flex;align-items:center;color:#d1d7d9}.sequence-grid .note{border-radius:5px;padding:0;min-width:30px;min-height:38px;background:#1b2430;border:1px solid #ffffff0d;color:#191c20;font-size:10px}.sequence-grid .note.on{background:color-mix(in srgb,#d7ba81 calc(var(--velocity,.8)*100%),#344453);box-shadow:inset 0 0 10px #e0c89020}.sequence-grid .note.selected{outline:2px solid #b5a5ed;outline-offset:0}.sequence-grid .note.current{border:2px solid #faf8ef;box-shadow:0 0 8px #f9f0da77}.sequence-grid .ruler{font-size:10px;color:#b9bdc4;text-align:center;padding:7px 0}.sequence-grid .note:nth-child(4n){border-right-color:#c6bea052}.piano-scroll{max-height:320px}.piano .note{min-height:25px}.piano .track-label{padding:4px 8px}.inspector{border-top:1px solid #ffffff20;margin-top:18px}.generation{border:1px solid #ffffff20;border-radius:8px;padding:15px;background:#161e29;margin:18px 0}.generation summary{cursor:pointer;color:#e6d4ae;font-size:15px}.mixer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}.mixer-channel{border:1px solid #ffffff20;background:#1a222d;border-radius:10px;padding:15px}.mixer-channel label{margin-bottom:14px}.mixer-channel .control-row{gap:5px}.song-list{display:grid;gap:10px}.song-section{display:flex;align-items:center;gap:10px;border:1px solid #ffffff25;border-left:4px solid #ad99d5;background:#19222c;border-radius:7px;padding:13px;flex-wrap:wrap}.song-section strong{flex:1;min-width:130px}.song-section label{width:75px;min-width:75px}.file-button{display:inline-flex!important;cursor:pointer;gap:8px;max-width:300px}.file-button input[type=file]{width:100%;font-size:11px;color:#bcc7cd;min-height:26px}.library-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #ffffff20}.library-row strong{margin-right:auto}.library-row button{min-height:38px}
.scenes-layout{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(400px,1.2fr);gap:24px}.video-stage{position:sticky;top:0;align-self:start;text-align:center}.video-stage canvas#scenePreview{display:block;width:auto;max-width:100%;height:360px;max-height:50vh;margin:0 auto 16px;background:#03050a;object-fit:contain;border:1px solid #ffffff20;border-radius:5px}.video-stage label{text-align:left}.video-stage #sceneWave{width:100%;height:90px;margin-top:14px;border-radius:6px}.scene-clip{display:flex;gap:6px;align-items:center;padding:8px;margin-bottom:8px;border:1px solid #ffffff20;border-left:4px solid #8cbfb1;border-radius:7px;background:#17252c}.scene-clip.selected{border-color:#e1c38e}.scene-clip>button:first-child{flex:1;text-align:left}.scene-clip small{display:block;color:#c4ccc9;margin-top:4px}.scene-editor h2{font-size:23px;margin-top:22px}.scene-editor h3{margin-top:24px}
.canvas-tools{position:fixed;z-index:22;top:83px;left:25px;right:25px;display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:10px;background:#10171de8;border:1px solid #ffffff20;border-radius:8px;font:12px Arial,sans-serif}.canvas-tools .file-button{min-height:38px;display:block!important}.canvas-tools #canvasSourceStatus{color:#bdcdc9;margin-left:auto;line-height:1.5}.is-active:not(.is-compose):not(.is-scenes) .source-card{top:158px}.wide-modal{max-width:950px;width:calc(100% - 30px);padding:35px}.wide-modal .control-grid{grid-template-columns:repeat(3,1fr)}.wide-modal h3{font:21px Georgia,serif;margin-top:28px}.wide-modal p{font-size:14px;line-height:1.6}.look-browser{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.look-card{display:flex;flex-direction:column;gap:8px;text-transform:capitalize}.look-card canvas{width:100%;height:80px;object-fit:cover;border-radius:4px}.is-scenes .chrome:not(.topbar),.is-scenes .interpretation,.is-scenes .world-rail,.is-scenes .source-card,.is-scenes .studio-actions,.is-scenes .transport,.is-scenes .analysis{visibility:hidden!important;pointer-events:none!important}.is-scenes .topbar,.is-compose .topbar{opacity:1!important;visibility:visible!important;pointer-events:auto!important}.is-compose .world-rail,.is-compose .analysis{visibility:hidden!important}.is-compose .canvas-tools,.is-scenes .canvas-tools{display:none!important}#canvasParticles{position:fixed;inset:0;pointer-events:none;z-index:2}.consent-banner{z-index:90!important;max-width:850px;margin:auto;box-shadow:0 8px 35px #0008}.is-compose .consent-banner,.is-scenes .consent-banner{bottom:18px}.consent-banner button{min-height:40px}.high-contrast .workspace{--studio-bg:#000;--studio-panel:#111;--studio-muted:#fff;background:#000;border:2px solid #fff}.high-contrast .workspace button{border-color:#fff;color:#fff}.high-contrast .workspace button.primary{color:#000}
@media(min-width:1500px){.workspace{left:max(24px,calc((100vw - 1550px)/2));right:max(24px,calc((100vw - 1550px)/2))}.workspace-body{padding:24px 32px}}
@media(max-width:760px){.welcome{position:relative!important;inset:auto!important;transform:none!important;margin:125px auto 100px;width:calc(100% - 32px);padding:0!important}.welcome h1{font-size:52px}.welcome .intro{font-size:15px;margin:18px auto 25px}.tool-cards{grid-template-columns:1fr;gap:12px}.tool-card{padding:18px;display:grid;grid-template-columns:45px 1fr;gap:8px 14px}.tool-card .tool-art{grid-row:1/5;font-size:36px;align-self:center}.tool-card .eyebrow{font-size:9px}.tool-card strong{font-size:23px}.tool-card>span:not(.tool-art):not(.eyebrow){min-height:0;font-size:13px}.tool-card b{font-size:12px}.experience:not(.is-active){overflow:auto;height:100dvh}.experience:not(.is-active) .site-footer{position:relative;inset:auto;padding:20px;justify-content:center}.workspace{inset:87px 6px 6px;border-radius:10px}.workspace-head{padding:12px}.workspace .project-name{font-size:24px;width:57vw}.workspace-head button{font-size:12px;padding:8px}.transport-bar{padding:10px;gap:6px}.transport-bar label{width:88px;min-width:70px}.transport-bar #composeStatus,.transport-bar #sceneStatus{width:100%;max-width:none;order:10;margin-top:4px}.workspace-tabs{padding:7px;display:grid;grid-template-columns:repeat(3,1fr);gap:3px}.workspace-tabs button{min-width:0;font-size:12px;padding:7px;min-height:34px}.workspace-body{padding:14px 10px}.workspace .control-row{gap:8px}.control-row label{width:calc(50% - 8px);min-width:115px}.workspace .control-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace-foot{padding:8px 10px}.workspace-foot span{display:none}.workspace-foot button{width:100%}.sequence-grid{grid-template-columns:82px repeat(var(--steps),35px);min-width:calc(92px + var(--steps)*40px)}.sequence-grid .track-label{font-size:10px}.sequence-scroll{max-height:330px}.mixer-grid{grid-template-columns:1fr}.mixer-channel{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mixer-channel h3,.mixer-channel .control-row{grid-column:1/-1}.mixer-channel label{min-width:0;margin:0}.scenes-layout{display:block}.video-stage{position:relative}.video-stage canvas#scenePreview{height:265px;max-height:35vh}.video-stage #sceneWave{height:65px}.scene-editor{margin-top:20px}.scene-clip{gap:4px}.scene-clip button{padding:7px;min-height:40px}.canvas-tools{top:85px;left:8px;right:8px;gap:5px;padding:8px}.canvas-tools button,.canvas-tools .file-button{font-size:11px;padding:7px;min-height:34px}.canvas-tools #canvasSourceStatus{width:100%;margin:0}.is-active:not(.is-compose):not(.is-scenes) .source-card{top:218px}.wide-modal{padding:24px 18px}.wide-modal .control-grid{grid-template-columns:1fr}.look-browser{grid-template-columns:repeat(2,1fr)}.consent-banner{left:10px!important;right:10px!important;bottom:10px!important;padding:13px!important;font-size:12px}.consent-banner p{font-size:12px!important}.consent-banner strong{font-size:13px!important}}
@media(prefers-reduced-motion:reduce){.tool-card{transition:none}.tool-card:hover{transform:none}}

@media(min-width:761px){.welcome{position:relative!important;inset:auto!important;transform:none!important;margin:115px auto 95px}.experience:not(.is-active){overflow:auto;height:100dvh}.experience:not(.is-active) .site-footer{position:relative;inset:auto;padding:20px;justify-content:center}}

.workspace .workspace-head .project-name{font:30px Georgia,serif;background:transparent;border:0;padding:0;width:min(58vw,500px);color:#f2eee5}.workspace .transport-bar{flex-shrink:0}.workspace .workspace-tabs{flex-shrink:0}@media(max-width:760px){.workspace .workspace-head .project-name{font-size:23px}}

.sequence-grid .note.sustain{background:#d7ba8140;border-block-color:#d7ba8160}.workspace label:has(input[type=range]){position:relative}

.studio-help{max-width:650px;color:#f7f0df;background:#101520;border:1px solid #686151;padding:28px;border-radius:16px;line-height:1.65}.studio-help li{margin:12px 0}.studio-help::backdrop{background:#000b}

.is-active:not(.is-compose):not(.is-scenes) .source-card,.is-active:not(.is-compose):not(.is-scenes) .analysis{top:calc(var(--canvas-bottom,145px) + 10px)}
@media(max-width:760px){.is-active:not(.is-compose):not(.is-scenes) .analysis{top:calc(var(--canvas-bottom,200px) + 85px)}.is-active:not(.is-compose):not(.is-scenes) .studio-actions{top:calc(var(--canvas-bottom,200px) + 168px)}}

.experience:not(.is-active){overflow-x:hidden}

/* Keep animated decoration outside the scrolling document geometry. */
.visual-layers{position:fixed;inset:0;overflow:hidden;contain:paint;isolation:isolate;pointer-events:none;z-index:-1}
.experience:not(.is-active) .site-footer{flex-wrap:wrap;left:0;right:0;box-sizing:border-box;width:100%}
.site-footer .forge-parent{flex-basis:100%;text-align:center;line-height:1.6}