.authPage{margin:0;background:#111419;color:#eef0ff;font:16px system-ui;min-height:100vh;display:grid;place-items:center}.authCard{width:min(420px,85vw);padding:30px;background:#1b202a;border-radius:16px}.authCard label{display:block;margin:18px 0}.authCard input{display:block;box-sizing:border-box;width:100%;margin-top:7px;padding:12px;background:#101319;color:white;border:1px solid #626a80;border-radius:7px}.authCard button,.alphaPanel button{padding:10px 14px;border-radius:7px;border:1px solid #606782;background:#242a37;color:white;cursor:pointer}.authCard nav{display:flex;gap:10px}.authCard [hidden]{display:none}.alphaPanel{position:fixed;left:8px;top:100px;width:230px;bottom:12px;z-index:15;background:#191d26;border:1px solid #3a4357;border-radius:12px;padding:12px;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;font:14px system-ui;color:#eef0ff}.alphaPanel summary{cursor:pointer;font-weight:bold}.alphaPanel:not([open]){bottom:auto}.alphaPanel #loungeMessages{overflow:auto;flex:1;min-height:100px;max-height:42vh}.alphaPanel #loungeMessages p{overflow-wrap:anywhere;border-bottom:1px solid #353c4b;padding-bottom:8px}.alphaPanel textarea{box-sizing:border-box;width:100%;min-height:70px}.onlinePerson{display:block;margin:4px 0}.onlinePerson::before{content:'●';color:#61d785;margin-right:7px}.alphaDialog{background:#191d26;color:#eef0ff;width:min(1100px,90vw);max-height:85vh;border:1px solid #65708a;border-radius:12px;font:15px system-ui}.alphaDialog::backdrop{background:#000b}.alphaDialog img{max-width:200px;max-height:260px}.alphaDialog .historyGrid{display:flex;flex-wrap:wrap;gap:20px}.alphaDialog article{max-width:220px;overflow-wrap:anywhere}.alphaDialog table{width:100%;border-collapse:collapse}.alphaDialog td,.alphaDialog th{text-align:left;padding:8px;border-bottom:1px solid #424958}.alphaDialog button{margin:4px}.alphaPanel #alphaNotice{color:#ffc7b7}.alphaDialog pre{white-space:pre-wrap;overflow-wrap:anywhere}@media(min-width:1500px){body:has(.alphaPanel[open]) main{margin-left:250px}}@media(max-width:1499px){.alphaPanel{top:auto;bottom:10px;width:260px;max-height:70vh}.alphaPanel:not([open]){bottom:10px;top:auto}}

/* Keep the tester lounge usable while the studio waits for generation. */
.alphaPanel{z-index:1001}


.adminTabs{display:flex;gap:8px;margin:16px 0}.adminTabs .active{background:#aebcff;color:#101419}.alphaDialog button:disabled{opacity:.4;cursor:not-allowed}.alphaDialog section{overflow-x:auto}

.chatPinned{border:1px solid #66749b;border-radius:8px;padding:10px;background:#29324b;overflow-wrap:anywhere;max-height:180px;overflow:auto;flex-shrink:0}.chatPinned p{white-space:pre-wrap;margin-bottom:0}.alphaPanel [hidden]{display:none!important}

/* Wider group chat, with the center reduced to about 60% on desktop. */
.loungeActions{flex-shrink:0}.loungeActions>div{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.loungeActions summary{font-size:13px}
@media(min-width:1500px){
 body:has(.alphaPanel[open]){--lounge-width:calc(40vw + 14px)}
 .alphaPanel[open]{width:var(--lounge-width);overflow:hidden}
 body:has(.alphaPanel[open]) main{margin-left:calc(var(--lounge-width) + 20px);margin-right:0;max-width:none}
 .alphaPanel[open] #loungeMessages{max-height:none;min-height:80px;flex:1;overflow-y:auto}
 .alphaPanel[open]>form{flex-shrink:0;display:flex;align-items:end;gap:8px}
 .alphaPanel[open]>form textarea{flex:1;min-width:0;min-height:70px;max-height:160px}
 .alphaPanel[open]>summary,.alphaPanel[open]>.chatPinned{flex-shrink:0}
}

/* Dock the group conversation without reducing the Studio workspace. */
body:has(.alphaPanel[open]) main{margin-left:auto;margin-right:auto;max-width:1600px}
body .alphaPanel,body .alphaPanel[open],body .alphaPanel:not([open]){position:fixed;top:auto;left:8px;right:8px;bottom:8px;width:auto;max-height:none;margin:0}
body .alphaPanel[open]{height:min(340px,48vh);display:flex;gap:8px;overflow:hidden}
body .alphaPanel:not([open]){height:auto;display:block}
.alphaPanel:not([open])>.chatTools,.alphaPanel:not([open])>.chatBody{display:none}
.chatTools{position:absolute;right:10px;top:6px;display:flex;gap:6px}.chatTools button{padding:5px 10px;font-size:12px}
.alphaPanel>summary{padding-right:240px;min-height:30px;flex-shrink:0}
.chatBody{display:grid;grid-template-columns:minmax(200px,25%) minmax(0,1fr);gap:16px;flex:1;min-height:0}
.chatSide{overflow:auto;min-height:0}.chatSide .onlinePerson{display:inline-block;margin-right:12px}.chatSide>p{margin:8px 0}.chatSide .chatPinned{max-height:130px}
.chatThread{display:flex;flex-direction:column;min-height:0;min-width:0;gap:5px}
body .alphaPanel[open] #loungeMessages{max-height:none;min-height:0;flex:1;overflow:auto}
.chatThread>form{display:flex;gap:8px;align-items:end;flex-shrink:0}.chatThread>form textarea{min-height:46px;height:46px;max-height:100px;flex:1;min-width:0}
.chatThread #alphaNotice{margin:0}.chatThread #alphaNotice:empty{display:none}.chatThread>button{align-self:flex-start;padding:4px 8px}
body.chatPopout>header,body.chatPopout>main,body.chatPopout>.busyOverlay{display:none!important}
body.chatPopout .alphaPanel[open]{height:calc(100dvh - 16px);max-height:none;top:8px}
@media(max-width:650px){.chatBody{grid-template-columns:minmax(0,1fr)}.chatSide{max-height:85px}.chatTools{position:static;flex-shrink:0}.alphaPanel>summary{padding-right:0}.chatThread{min-height:100px}body .alphaPanel[open]{height:55vh}}

/* Compact dock with measured clearance and account controls at page top. */
body:not(.chatPopout){padding-bottom:var(--chat-dock-space,260px)}
.studioAccountBar{position:relative;z-index:1002;background:#191d26;padding:6px 16px;border-bottom:1px solid #3a4357}
.studioAccountBar .loungeActions>div{display:flex;flex-wrap:wrap;gap:6px;padding:8px 0}
.studioAccountBar summary{cursor:pointer;font-size:13px;font-weight:600}
body .alphaPanel[open]{height:min(250px,38vh);padding:8px 12px;gap:6px}
body .alphaPanel[open]::details-content{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
.alphaPanel .chatBody{flex:1;min-height:0;height:100%;padding-top:4px}
.alphaPanel .chatThread{height:100%;min-height:0}
.alphaPanel .chatThread>form{margin:0;align-items:stretch}
.alphaPanel .chatThread>form textarea{height:42px;min-height:42px;max-height:80px}
.alphaPanel .chatSide .chatPinned{max-height:110px;padding:8px}
body.chatPopout .alphaPanel[open]{top:54px;height:calc(100dvh - 62px)}
@media(max-width:650px){body .alphaPanel[open]{height: min(320px,50vh)}.alphaPanel .chatBody{height:auto;grid-template-rows:auto minmax(0,1fr)}.chatSide{max-height:65px}.chatThread{min-height:0}}

.alphaPanel #loungeMessages .chatMessage{display:block;max-width:none;padding:6px 0;border-bottom:1px solid #353c4b;margin:0}
.chatMessageMeta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.chatMessageMeta strong{font-size:12px;overflow-wrap:anywhere}
.alphaPanel .chatMessageMeta button{flex-shrink:0;padding:3px 8px;margin:0;font-size:11px;line-height:1.3}
.chatMessageText{display:block;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:5px;line-height:1.45}

/* Minimized lounge keeps presence and MOTD on the left, clear of bottom errors. */
body:not(.chatPopout) .alphaPanel.chatFolded[open]{top:150px;bottom:auto;left:8px;right:auto;width:min(270px,calc(100vw - 16px));height:auto;max-height:calc(100dvh - 240px);overflow:auto;display:block}
body .alphaPanel.chatFolded>summary{padding-right:0;min-height:0;margin-bottom:8px}
body .alphaPanel.chatFolded>summary::marker{content:'▸ '}
body .alphaPanel.chatFolded[open]::details-content{display:block;overflow:visible}
body .alphaPanel.chatFolded .chatTools,body .alphaPanel.chatFolded .chatThread{display:none}
body .alphaPanel.chatFolded .chatBody{display:block;height:auto;padding-top:0}
body .alphaPanel.chatFolded .chatSide{height:auto;max-height:none;overflow:visible}
body .alphaPanel.chatFolded .chatSide .chatPinned{max-height:180px;overflow:auto}

/* The lounge lives inside the scrolling page banner, never over the workspace. */
body:not(.chatPopout)>header{position:static;height:auto;min-height:84px;flex-wrap:wrap;gap:16px;align-items:flex-start}
body:not(.chatPopout){padding-bottom:0}
body:not(.chatPopout) aside{top:0}
body:not(.chatPopout) header .alphaPanel.headerLounge[open],body:not(.chatPopout) header .alphaPanel.headerLounge.chatFolded[open]{position:static;inset:auto;width:auto;flex:1 1 500px;min-width:0;height:auto;max-height:none;margin:0;padding:0;border:0;background:transparent;display:block;overflow:visible}
body header .headerLounge>summary{display:inline-block;padding:8px 14px;margin:0 0 8px;min-height:0;border:1px solid #626a80;border-radius:8px;cursor:pointer;font-size:14px;list-style:none}
body header .headerLounge>summary::marker{content:''}
body header .headerLounge>summary.hasUnread{background:#adbdff;color:#131b36;border-color:#adbdff}
body header .headerLounge[open]::details-content{display:block;overflow:visible}
body header .headerLounge .chatTools{position:static;float:right;margin:0 0 8px}
body header .headerLounge .chatBody{display:block;height:auto;clear:both}
body header .headerLounge .chatSide{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:flex-start;overflow:visible;max-height:none}
body header .headerLounge .chatSide>div:first-child{flex:0 1 220px}
body header .headerLounge .chatSide .chatPinned{flex:1 1 300px;min-width:0;max-height:100px;overflow:auto;margin:0;padding:8px 12px}
body header .headerLounge .chatPinned strong{font-size:13px;letter-spacing:normal;color:inherit}
body header .headerLounge .chatPinned p{margin:4px 0;white-space:pre-wrap}
body header .headerLounge .onlinePerson{display:inline-block;margin:4px 12px 4px 0;font-size:13px}
body header .headerLounge .chatThread{height:280px;margin-top:12px}
body header .headerLounge.chatFolded .chatThread,body header .headerLounge.chatFolded .chatTools{display:none}
@media(max-width:650px){body header .headerLounge .onlinePerson{display:inline-block}body header .headerLounge .chatSide .chatPinned{flex-basis:100%}}
/* Open at the bottom; minimized chat is represented only by the banner button. */
body:not(.chatPopout){padding-bottom:var(--chat-dock-space,270px)}
body:not(.chatPopout) .alphaPanel.chatFolded[open]{display:none}
body:not(.chatPopout) .alphaPanel[open]:not(.chatFolded){position:fixed;top:auto;left:8px;right:8px;bottom:8px;width:auto;height:min(250px,38vh);max-height:none;display:flex;overflow:hidden}
body:not(.chatPopout)>header{position:static;height:auto;min-height:84px;gap:24px;align-items:center;justify-content:flex-start}
.bannerLounge{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px 16px;min-width:0}
header .bannerLounge>strong{font-size:14px;letter-spacing:normal;color:inherit}
.bannerPeople{display:flex;flex-wrap:wrap;gap:6px 12px}
header .bannerPeople .onlinePerson{display:inline-block;font-size:13px;margin:0}
.bannerChatButton{grid-column:1;justify-self:start;font-weight:600}
.bannerChatButton.hasUnread{background:#17452b;color:#c7ffda;border-color:#53dc86;box-shadow:0 0 12px #42df7977}
body #error{z-index:1100}
@media(max-width:650px){body:not(.chatPopout) .alphaPanel[open]:not(.chatFolded){height:min(320px,50vh)}}
/* Popup minimization collapses its conversation, never opens a second dock. */
body.chatPopout .alphaPanel.chatFolded[open]{height:auto;bottom:auto;display:block}
body.chatPopout .alphaPanel.chatFolded .chatBody,body.chatPopout .alphaPanel.chatFolded .chatTools{display:none}
body.chatPopout .alphaPanel.chatFolded>summary{padding-right:0;cursor:pointer}





/* Studio help opens separately from the image workspace. */
header .studioHelpLink{margin-left:auto;order:10;color:#b7c5ff;font-weight:800;letter-spacing:.04em;text-decoration:underline;white-space:nowrap;padding:8px 0}

/* Studio help opens separately from the image workspace. */
header .studioHelpLink{margin-left:auto;order:10;color:#b7c5ff;font-weight:800;letter-spacing:.04em;text-decoration:underline;white-space:nowrap;padding:8px 0}

/* Single Studio help action */
body>header a.studioHelpLink{display:inline-flex;align-items:center;justify-content:center;align-self:center;margin-left:auto;padding:12px 20px;min-height:44px;border:1px solid #aebcff;border-radius:9px;background:#b3bcfa;color:#111827;font-size:18px;font-weight:700;line-height:1.3;text-decoration:none;white-space:nowrap}
body>header a.studioHelpLink:hover{background:#cad0ff}
body>header a.studioHelpLink:focus-visible{outline:3px solid #eef0ff;outline-offset:3px}

/* Emphasize the first editing step. */
.referenceControls>legend{font-size:20px;font-weight:700;line-height:1.4;padding:0 10px;color:#edf0ff}

/* Ellie Studio branding: keep the logo, presence and help clear at every width. */
body:not(.chatPopout)>header{padding:12px 24px;gap:18px 28px;flex-wrap:wrap}
header .studioBrand{display:flex;align-items:center;gap:12px;flex:0 1 430px;min-width:0;max-width:100%}
header .studioBrandLogo{display:block;width:380px;max-width:calc(100% - 50px);height:auto;object-fit:contain}
header .studioAlpha{flex:none;margin:0;font-size:9px;color:#a9adbd}
header .bannerLounge{flex:0 1 auto;min-width:0}
@media(max-width:700px){body:not(.chatPopout)>header{padding:12px 16px;gap:16px}header .studioBrand{flex-basis:100%}header .studioBrandLogo{width:340px}body>header a.studioHelpLink{font-size:14px;padding:10px 12px}header .bannerLounge{flex:1 1 200px}}
header a.voiceStudioLink{order:9;margin-left:auto;padding:10px 14px;border:1px solid #697794;border-radius:9px;color:#d0d7ff;text-decoration:none;font-weight:600}body>header a.studioHelpLink{margin-left:0}

.fileManagementChoices{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}.managedVoiceSection{margin:24px 0}.managedVoiceFile{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:18px 0;border-top:1px solid #424958}.managedVoiceFile audio{width:min(480px,100%)}.managedVoiceFile label{display:flex;gap:8px;align-items:center}.managedVoiceFile input[type=checkbox]{width:18px;height:18px;margin:0}.managedVoiceFile p{margin:0;color:#b1bbd1}.managedVoiceFile a{color:#c3ceff}

.alphaDialog .managedVoiceSection{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.managedVoiceSection>h3{grid-column:1/-1}.alphaDialog .managedVoiceFile{max-width:none;min-width:0}.managedVoiceFile audio{max-width:100%}

body:not(.chatPopout) .alphaPanel>summary{padding-right:0;}
body:not(.chatPopout) .alphaPanel>summary>.chatTools{position:static;display:inline-flex;vertical-align:middle;margin-left:16px;gap:6px;}
body:not(.chatPopout) .alphaPanel.chatFolded>summary>.chatTools{display:none;}

.chatTools .chatStudioLinks{display:inline-flex;margin-left:24px;gap:8px;align-items:center}.chatTools .chatStudioLinks a{display:inline-block;margin:0;padding:5px 10px;border:1px solid #606782;border-radius:7px;background:#242a37;color:#eef0ff;font:12px system-ui;text-decoration:none;}

/* Studio navigation stays beneath online names, beside the header chat toggle. */
header .bannerLounge{order:2;max-width:100%;}
header .bannerActions{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;margin-top:6px;}
header .bannerActions a.bannerStudioSwitch{order:0;margin:0;padding:10px 14px;border:1px solid #697794;border-radius:9px;color:#d0d7ff;text-decoration:none;font-weight:600;white-space:nowrap;}
body>header a.studioHelpLink{margin-left:auto;order:10;}
body.voiceStudio>header>nav{margin-left:auto;order:10;}

/* Keep Studio navigation buttons adjacent in the shared header. */
header .studioLinksTogether{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:10px;}


#studioSystemNotice{position:fixed;top:0;left:0;right:0;z-index:10000;background:#663b12;color:#fff4ce;border-bottom:2px solid #ffc45c;padding:14px 24px;text-align:center;font-weight:600}#studioSystemNotice[hidden]{display:none}.studioRestartDetails{white-space:pre-wrap}


/* Release badge and compact patch history link. */
.studioRelease{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;flex-shrink:0}
.studioRelease .studioAlpha{font-size:14px;padding:5px 11px;line-height:1.3;margin:0}
.studioRelease .studioPatchNotes{font-size:12px;line-height:1.3;white-space:nowrap;color:#b7c5ff;text-decoration:underline;text-underline-offset:3px}
.studioRelease .studioPatchNotes:hover{color:#fff}.studioRelease .studioPatchNotes:focus-visible{outline:2px solid #b7c5ff;outline-offset:4px}
header .studioBrandLogo{max-width:calc(100% - 86px)}

/* Compact help is a utility, never an active studio choice. */
body>header a.studioHelpLink{background:transparent!important;color:#b7c5ff!important;border:1px solid #46516a!important;font-size:12px!important;font-weight:500!important;letter-spacing:normal!important;min-height:0!important;padding:7px 10px!important;border-radius:6px;white-space:nowrap;text-decoration:none;order:10}
body>header a.studioHelpLink:hover{background:#222630!important}
body>header .studioHeaderUtilities{display:flex;align-items:center;gap:14px;margin-left:auto;order:10;max-width:100%}
body>header .studioHeaderUtilities .studioHelpLink{margin:0!important;order:0}
body>header .studioHeaderUtilities .studioResources{margin:0;padding:16px 18px;border:1px solid #3c465d;border-radius:12px;background:#191e28;min-width:235px;order:1}
body>header .studioResources>strong{font-size:14px}
body>header .resourceRows>div{display:flex;gap:18px;margin:8px 0;font-size:13px}body>header .resourceRows b{width:35px}body>header .studioResources>small{display:block;font-size:12px;margin-top:12px;color:#a9b2c8}
@media(max-width:700px){body>header .studioHeaderUtilities{flex-wrap:wrap;margin-left:0}}