/* The product scale owns every dimension and colour. */
#elara-spot-host{width:100%;display:flex;flex-direction:column;align-items:center;gap:var(--sp1)}
#elara-spot .sptx{flex:1;color:var(--ink);font-size:var(--fs-step--1);line-height:var(--lb-step--1)}
#elara-spot .spico,#elara-spot .sptx b{color:var(--gold2)}
#elara-spot .spbtn,#elara-spot .spno{font:inherit;min-height:var(--sp-tap);padding:var(--sp1) var(--sp2);border:var(--bw-hair) solid var(--line2);cursor:pointer;color:var(--ink);background:var(--panel)}
#elara-spot .spbtn{background:var(--gold2);color:var(--navy)}
#elara-spot summary:focus-visible,#elara-spot button:focus-visible{outline:var(--bw-rule) solid var(--gold2);outline-offset:var(--bw-rule)}
body #elara-spot{display:block;width:100%;box-sizing:border-box;margin:0;max-width:var(--measure-wide);padding:0 var(--sp2);border:0;background:none;box-shadow:none}
body #elara-spot summary{cursor:pointer;min-height:var(--sp-tap);display:flex;align-items:center;color:var(--mut);font-size:var(--fs-step--2);line-height:var(--lb-step--2)}
body #elara-spot .spot-content{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp1);padding:var(--sp2);background:var(--panel);border:var(--bw-hair) solid var(--line2)}
body:has(#thread .empty) #elara-spot-host{display:none}
.polish-button,.image-aspect select,.polish-dialog button{display:inline-flex;align-items:center;justify-content:center;min-height:var(--sp-tap);gap:var(--sp1);padding:var(--sp1) var(--sp1half);background:var(--panel);color:var(--ink);border:var(--bw-hair) solid var(--line2);border-radius:0;font:inherit;text-decoration:none;cursor:pointer;white-space:normal}
.polish-button:hover,.polish-button:focus-visible{border-color:var(--gold2)}
.bubble .polish-button{color:var(--ink)}
.polish-button:focus-visible,.polish-dialog summary:focus-visible,.workspace-links summary:focus-visible,.answer-outline summary:focus-visible{outline:var(--bw-rule) solid var(--gold2);outline-offset:var(--bw-rule)}
.image-job-list,.image-job,.context-controls{display:flex;flex-direction:column;gap:var(--sp1half);margin-block:var(--sp2)}
.image-job,.context-controls{padding:var(--sp2);background:var(--panel);border:var(--bw-hair) solid var(--line2);color:var(--ink);font-size:var(--fs-step--1);line-height:var(--lb-step--1)}
.image-job p,.context-controls p{margin:0}.image-job button{align-self:flex-start}
.image-actions{display:flex;flex-wrap:wrap;gap:var(--sp1);margin-block:var(--sp1);scroll-margin-block:var(--sp1);font-size:var(--fs-step--2);line-height:var(--lb-step--2)}
/* Reserve a row for latest-message navigation; no answer or action sits behind it. */
#wrap:not(.empty){padding-bottom:var(--kb,0px)}
#wrap:not(.empty)>.composer{transform:none}
#wrap>#scrolldown{position:relative;inset:auto;align-self:flex-end;flex:0 0 auto;width:var(--sp-tap);height:var(--sp-tap);margin:var(--sp-half) var(--sp2) 0;transform:none;color:var(--ink)}
#wrap>#scrolldown.show{transform:none}
#wrap>#scrolldown .ic{color:inherit}
#wrap>#scrolldown .latest-new{display:none}
#wrap>#scrolldown.m-new{width:auto;padding:0 var(--sp1);gap:var(--sp1)}
#wrap>#scrolldown.m-new::after{content:none}
#wrap>#scrolldown.m-new .latest-new{display:inline;font:var(--w-semi) var(--fs-step--2)/var(--lb-step--2) var(--ff-product)}
.image-aspect{display:flex;align-items:center;justify-content:space-between;gap:var(--sp1);padding:var(--sp1) var(--sp2);font-size:var(--fs-step--1)}
.polish-dialog{box-sizing:border-box;background:var(--panel);color:var(--ink);border:var(--bw-hair) solid var(--gold2);padding:var(--sp3);width:min(var(--measure-wide),calc(100% - var(--sp4)));max-height:calc(100dvh - var(--sp4));overflow:auto;font:var(--fs-step-0)/var(--lb-step-0) var(--ff-product)}
.polish-dialog::backdrop{background:var(--navy)}
.polish-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:var(--sp2);margin-bottom:var(--sp2)}
.polish-dialog h2{font-size:var(--fs-step-2);line-height:var(--lbh-step-2);margin:0}.polish-full-image{display:block;width:100%;height:auto;object-fit:contain}
.attachment-text{white-space:pre-wrap;overflow-wrap:anywhere;font:var(--fs-step--1)/var(--lb-step--1) var(--ff-mono)}
.answer-outline{margin-block:var(--sp2);padding:var(--sp1half);background:var(--panel2);font-size:var(--fs-step--1)}
.answer-outline summary,.workspace-links summary{cursor:pointer;min-height:var(--sp-tap);padding:var(--sp1);box-sizing:border-box;color:var(--ink)}
.answer-outline nav{display:flex;flex-direction:column;gap:var(--sp-half)}.answer-outline button{justify-content:flex-start;text-align:left}
.answer-table{max-width:100%;overflow:auto}.answer-table:focus-visible{outline:var(--bw-rule) solid var(--gold2)}
.source-domain{display:block;color:var(--mut);font-size:var(--fs-step--2);line-height:var(--lb-step--2);overflow-wrap:anywhere}
.context-choice{display:flex;align-items:flex-start;gap:var(--sp1);min-height:var(--sp-tap);padding-block:var(--sp1);overflow-wrap:anywhere}.context-choice input{accent-color:var(--gold2);flex-shrink:0}
.context-controls h3{margin:0;font-size:var(--fs-step-0);line-height:var(--lb-step-0)}
.collaboration-call-status{display:flex;flex-wrap:wrap;gap:var(--sp1);align-items:center;padding:var(--sp1) var(--sp2);background:var(--panel);color:var(--ink);font-size:var(--fs-step--1);line-height:var(--lb-step--1);border-bottom:var(--bw-hair) solid var(--line2)}
.collaboration-call-status>span{flex:1;min-width:0}
.collaboration-call-status .call-actions{display:flex;flex-wrap:wrap;gap:var(--sp1);align-items:center}
/* On a phone the status sentence and the controls share one row, and the
   controls use the same panel colour as the bar, so Mute and Leave read as
   part of the sentence. The sheet that holds the real controls is collapsed
   for the call. Give the actions their own row, the tap floor, and a fill
   that is not the bar. */
body:is(.m-mobile,.m-touch) #collaborationCallStatus{flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:var(--sp-half)}
body:is(.m-mobile,.m-touch) #collaborationCallStatus>[role=status]{flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:is(.m-mobile,.m-touch) #collaborationCallStatus .call-actions{flex-wrap:nowrap;width:100%}
body:is(.m-mobile,.m-touch) #collaborationCallStatus .call-actions .polish-button{flex:1;min-width:var(--sp-tap);min-height:var(--sp-tap);padding-inline:var(--sp1);background:var(--panel2);color:var(--ink);border:var(--bw-rule) solid var(--gold2)}
/* Shared content keeps usable space on phones. Existing call controls and
   type sizes remain intact; only duplicate chrome and spacing are reduced. */
body.m-mobile:has(#roomVideos.layout-side.on)>header,
body.m-mobile:has(#roomVideos.layout-side.on) .chat-site-nav,
body.m-mobile:has(#roomVideos.layout-side.on) #bar{display:none}
body.m-mobile:has(#roomVideos.layout-side.on) #roomStrip{padding:var(--sp-half) var(--sp1)}
body.m-mobile:has(#roomVideos.layout-side.on) #roomStrip .rs-live,
body.m-mobile:has(#roomVideos.layout-side.on) #roomStrip #roomRail{display:none}
body.m-mobile:has(#roomVideos.layout-side.on) #roomStrip .rs-actions{flex-wrap:nowrap}
body.m-mobile:has(#roomVideos.layout-side.on) .collaboration-call-status{padding:var(--sp-half) var(--sp1);flex-wrap:nowrap}
body.m-mobile:has(#roomVideos.layout-side.on) .collaboration-call-status>span{min-width:0}
body.m-mobile:has(#roomVideos.layout-side.on) .collaboration-call-status .polish-button{padding-inline:var(--sp1)}
body.m-mobile #roomVideos.vc-stage.layout-side{padding-top:calc(var(--sp-tap) + var(--sp1));gap:var(--sp-half)}
body.m-mobile #roomVideos.layout-side .vc-views{top:var(--sp-half);left:var(--sp1);right:var(--sp1)}
body.m-mobile #roomVideos.layout-side .vc-pane{gap:var(--sp-half)}
body.m-mobile #roomVideos.layout-side .vc-pane .vc-rail{height:calc(var(--sp-tap) + var(--sp1half))}
body.m-mobile #roomVideos.layout-side .vc-pane .vc-rail .rv-t{width:100%;height:100%;min-width:0}
@media(orientation:portrait){
 body.m-mobile:has(#roomVideos.layout-side.on) #roomWorkspace.rw-active{grid-template-rows:minmax(0,1fr) minmax(calc(var(--sp5) * 2),.25fr) auto}
 body.m-mobile #roomVideos.vc-stage.layout-side{grid-template-rows:minmax(0,1fr) var(--bw-rule) calc(var(--sp5) * 2)}
 body.m-mobile #roomVideos.layout-side .vc-pane{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,35%);grid-template-rows:minmax(0,1fr)}
 body.m-mobile #roomVideos.layout-side .vc-pane .side-main{grid-column:1;grid-row:1}
 body.m-mobile #roomVideos.layout-side .vc-pane .vc-rail{grid-column:2;grid-row:1;height:100%;padding:0}
}
/* A room owns the working canvas. Navigation stays one action away and never
   changes the user's saved sidebar preference or the room's media state. */
body.collaboration-focus>header,body.collaboration-focus .chat-site-nav,
body.collaboration-focus #bar,body.collaboration-focus #side,
body.collaboration-focus #sideHandle,body.collaboration-focus #scrim{display:none}
body.collaboration-navigation>header,body.m-mobile.collaboration-navigation:has(#roomVideos.on)>header{display:block}
body.collaboration-navigation .chat-site-nav,body.m-mobile.collaboration-navigation:has(#roomVideos.on) .chat-site-nav,
body.collaboration-navigation #bar,body.m-mobile.collaboration-navigation:has(#roomVideos.on) #bar{display:flex}
body.collaboration-workspace #roomStrip.open{padding:var(--sp-half) var(--sp1)}
body.collaboration-workspace #roomStrip.open .rs-head,
body.m-mobile.collaboration-workspace #roomStrip.open .rs-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:'navigation title actions';gap:var(--sp-half);align-items:center}
body.collaboration-workspace #roomNavigationToggle{grid-area:navigation;min-width:var(--sp-tap);width:var(--sp-tap);height:var(--sp-tap);padding:0;color:var(--ink)}
body.collaboration-workspace #roomNavigationToggle .ic{color:inherit}
body.collaboration-workspace #roomStrip.open .rm-title{grid-area:title;min-width:0;max-width:none;letter-spacing:var(--tr-none)}
body.collaboration-workspace #roomStrip.open .rs-actions{grid-area:actions;flex-wrap:nowrap;gap:var(--sp-half);margin:0}
body.collaboration-workspace #roomStrip.open #roomToggle,
body.collaboration-workspace #roomStrip.open #roomClose{min-width:var(--sp-tap);min-height:var(--sp-tap);padding-inline:var(--sp1)}
body.collaboration-workspace #roomStrip.open #roomQuickVoice button{min-width:var(--sp-tap);min-height:var(--sp-tap)}
body.collaboration-workspace #roomStrip.open .rs-live,
body.collaboration-workspace #roomStrip.open #roomRail,
body.collaboration-workspace #roomStrip.open #roomMind,
body.collaboration-workspace #roomStrip.open #roomHeadInvite{display:none}
body:has(#collaborationCallStatus) #roomStrip #roomQuickVoice{display:none}
body.collaboration-workspace #roomStrip .room-control-icon{display:none}
@media(max-width:640px){
 body.collaboration-workspace #roomStrip.open .room-control-label{position:absolute;width:var(--bw-hair);height:var(--bw-hair);overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 body.collaboration-workspace #roomStrip.open .rs-chev{display:none}
 body.collaboration-workspace #roomStrip.open .room-control-icon{display:inline-flex;color:inherit}
 body.collaboration-workspace #roomStrip.open #roomToggle,
 body.collaboration-workspace #roomStrip.open #roomClose,
 body.collaboration-workspace #roomStrip.open #roomQuickVoice button{display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--sp-tap);height:var(--sp-tap);min-width:var(--sp-tap);min-height:var(--sp-tap);padding:0;gap:0}
 body.collaboration-workspace #roomStrip.open #roomQuickVoice{margin:0;gap:var(--sp-half)}
}
@media(orientation:portrait) and (min-height:640px){
 body.m-mobile.collaboration-focus:has(#roomVideos.layout-side.on) #roomWorkspace.rw-active{grid-template-rows:minmax(calc(var(--sp10) * 3 + var(--sp5)),1fr) minmax(calc(var(--sp5) * 2),1fr) auto}
}
/* Avatar fills identify people; text uses the surface's readable ink. The
   dynamic room renderer supplies inline colours, so these text roles win. */
body .room-msg .a-author{color:var(--ink)!important}
body .room-msg.assistant .a-author{color:var(--cyan-soft)!important}
body .room-msg .a-verify>span:not(.rx-ico){color:var(--ink)!important}
body .room-msg .a-checked{color:var(--mut)}
body.light .room-msg.assistant .a-author{color:var(--paper-cyan)!important}
body.light .room-msg .room-mention{color:var(--paper-gold)}
body .side-foot{padding:var(--sp-half) var(--sp1);flex-shrink:0;background:var(--panel);pointer-events:auto}body .side-foot .workspace-links{font:var(--fs-step--1)/var(--lb-step--1) var(--ff-product)}
body .side-foot .workspace-links[open]{max-height:var(--panel-max-h);overflow:auto}
/* Secondary text stays readable when the resource drawer is expanded. */
body .side-foot .ec-copy{opacity:1}
body.light .side-foot .ec-lkn{color:var(--gold)}
body.light .side-foot .ec-lksub{color:var(--paper-cyan)}
body.light .side-foot .ec-copy a{color:var(--paper-cyan)}
body .side-card{background:var(--panel);color:var(--mut)}
body .side-acct,body .acctpill{padding:var(--sp1) var(--sp1half)}
body.light .side-card .ce{color:var(--paper-cyan)}
body.light .side-card b{color:var(--gold)}
body.light .empty .cvtrust a{color:var(--paper-cyan)}
/* Icon strokes need their own light-surface ink: .ic sets a direct colour. */
body.light #bar #menuBtn .ic,body.light #bar .iconbtn .ic,body.light #bar .modelbtn .ic,
body.light .composer #attachBtn .ic,body.light .composer #toolsBtn .ic,body.light .composer #mic .ic,
body.light #acctmenu button .ic,body.light .toolsmenu .tmrow .ic,
body.light .chatmenu button:not(.del) .ic{color:var(--paper-gold)}
body.light .ci-show .ic{color:var(--paper-cyan)}
/* Create's warm palette needs its on-surface ink, including in dark mode. */
body.create-studio.light .hnav-b.on,body.create-studio.light .ci-show .t span{color:var(--goldink)}
html.create-studio body .side-card .ce,html.create-studio body .side-card b,
html.create-studio body .side-foot .ec-lksub{color:var(--goldink)}
body.create-studio.light .side-foot .ec-lkn{color:var(--goldink)}
body.create-studio #hist .hgroup{background:var(--panel2)}
body #thread .empty .cvlight{background:none;padding:0 var(--sp2) var(--sp2)}body #thread .empty .cvlwrap{padding:0;max-width:var(--measure-wide)}
body #thread .empty .cvlhead{display:none}body #thread .empty .onbcard{margin-block:var(--sp1);padding:var(--sp1half);background:var(--panel)}
.landing-ideas{margin-block:var(--sp2);color:var(--ink)}
.landing-ideas>summary{display:flex;align-items:center;gap:var(--sp1);min-height:var(--sp-tap);width:fit-content;padding:0 var(--sp1half);cursor:pointer;list-style:none;font:var(--w-medium) var(--fs-step--1)/var(--lb-step--1) var(--ff-product);border:var(--bw-hair) solid var(--line2);background:var(--panel)}
.landing-ideas>summary::-webkit-details-marker{display:none}.landing-ideas>summary::after{content:'+';color:var(--gold2)}.landing-ideas[open]>summary::after{content:'−'}
.landing-ideas>summary:hover{border-color:var(--gold2)}.landing-ideas>summary:focus-visible{outline:var(--bw-rule) solid var(--gold2);outline-offset:var(--bw-rule)}
.landing-ideas:not([open])>.elara-suggestions{display:none}
/* Founder 2026-09-21: the personal greeting keeps its gold glow and dark photographic scrim. */
#wrap.empty .empty:not(.atelier){flex:0 0 auto;min-height:100%;overflow:visible}
body #thread .empty .cvlight{flex:0 0 auto;overflow:visible}
body .empty .cvhero,body.m-mobile .empty .cvhero{display:grid;aspect-ratio:auto;max-height:none;min-height:calc(var(--sp-tap) * 4)}
body .empty .cvhero .cvscrim{position:relative;inset:auto;min-width:0;background:linear-gradient(90deg,color-mix(in srgb,var(--chrome) 90%,transparent),color-mix(in srgb,var(--chrome) 82%,transparent) 60%,color-mix(in srgb,var(--chrome) 65%,transparent));}
body .empty .cvhero .cvtxt{box-sizing:border-box;padding:var(--sp3);color:var(--paper)}
body .empty .cvhero .cvquote .cvqa{color:var(--gold2)}
.empty .cvh1 .cvname{color:var(--gold2);text-shadow:var(--glow-gold);animation:greetingNameGlow var(--dur-breath) ease-in-out infinite}
@keyframes greetingNameGlow{0%,100%{text-shadow:var(--glow-gold)}50%{text-shadow:var(--glow-gold-hi)}}
body .composer #toolChips{flex-wrap:nowrap;overflow:auto;max-width:100%;scrollbar-width:thin;padding-block:var(--sp-half);height:auto}
body .composer #toolChips:empty{display:none}
body .composer #toolsBtn{min-width:var(--sp-tap);min-height:var(--sp-tap)}
body .composer #toolChips .toolchip{flex-shrink:0}body .composer #toolChips::after{display:none}
.suggestion-entry{position:relative;display:flex;align-items:stretch;gap:var(--sp-half);min-width:0}.suggestion-entry .suggestion-card{flex:1;min-width:0}
.suggestion-options{flex-shrink:0;position:relative}.suggestion-options summary{cursor:pointer;list-style:none;min-height:var(--sp-tap);min-width:var(--sp-tap);display:flex;align-items:center;justify-content:center}
.suggestion-options[open]{z-index:var(--z-menu)}.suggestion-options .suggestion-controls{position:absolute;right:0;top:100%;width:var(--card-min);max-width:calc(100vw - var(--sp4));padding:var(--sp1);display:flex;flex-direction:column;gap:var(--sp-half);background:var(--panel);border:var(--bw-hair) solid var(--gold2)}
@media(max-width:640px){
 body .composer .pill{gap:var(--sp-half)}body .composer textarea#inp{font-size:var(--fs-step-0)}
 .polish-dialog{padding:var(--sp2)}.image-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.image-actions .polish-button{min-width:0;word-break:normal;overflow-wrap:normal}
}
@media(prefers-reduced-motion:reduce){.polish-dialog,.image-job,.answer-outline{animation:none;transition:none;scroll-behavior:auto}}
@media(prefers-reduced-motion:reduce){.empty .cvh1 .cvname{animation:none;text-shadow:var(--glow-gold)}}
