.spaces-shell{display:grid;gap:15px}
.spaces-hero{margin:0}.spaces-hero .btn{flex-shrink:0}
.spaces-heading,.space-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.spaces-tabs{display:flex;background:var(--color-surface-muted,#edf2f4);padding:5px;gap:4px;border-radius:14px;overflow-x:auto;margin-bottom:15px}
.spaces-tabs button{border:0;min-width:80px;flex:1;padding:10px 14px;border-radius:11px;background:transparent;color:var(--color-text,#22313b);font-weight:750;white-space:nowrap}
.spaces-tabs button.active{background:var(--color-surface,#fff);box-shadow:0 2px 8px #00000012}
.spaces-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));gap:12px}
.space-item{border:1px solid var(--color-border,#dce4e7);background:var(--color-surface,#fff);border-radius:15px;padding:15px;display:grid;gap:8px;min-width:0}
.space-item h3{font-size:1.04rem;line-height:1.35;margin:0;overflow-wrap:anywhere}
.space-item p{color:var(--color-text-muted,#72848a);font-size:.89rem;margin:0}
.space-item .btn{width:fit-content}
.space-live-badge{font-size:.74rem;letter-spacing:.08em;font-weight:900;padding:5px 9px;border-radius:8px;background:#ffebef;color:#d43b58}
.space-upcoming-badge{background:#e2f3f1;color:#08765d}
.space-detail{display:grid;gap:12px;max-width:980px;margin-inline:auto;width:100%}
.space-detail[hidden],.space-panel[hidden]{display:none!important}
.space-detail>h2{font-size:clamp(1.4rem,3vw,2rem);margin:0}
.space-detail>h3{margin:12px 0 0;font-size:1.03rem}
.space-detail .studio-muted{margin:0}
.speaker-stage{border-radius:22px;min-height:225px;padding:24px 16px;display:grid;place-items:center;align-content:center;gap:11px;background:linear-gradient(135deg,#0e2330,#193d45);color:#fff;text-align:center}
.speaker-stage h3{font-size:1.2rem;color:#fff;margin:0}
.speaker-stage .studio-kicker{margin:0;color:#71dfb5}
.space-avatar-large{height:112px;width:112px;border-radius:100%;display:grid;place-items:center;font-size:2.5rem;background:#1e6d5d;border:6px solid #239d73;box-shadow:0 0 0 8px #239d7344}
.space-avatar-large.speaking{box-shadow:0 0 0 8px #239d7344,0 0 30px 15px #24df8c66}
.space-people{display:flex;flex-wrap:wrap;gap:11px;max-height:240px;overflow-y:auto}
.space-person{width:95px;display:grid;gap:4px;place-items:center;text-align:center;font-size:.83rem}
.space-person .avatar{height:57px;width:57px;display:grid;place-items:center;border-radius:50%;background:var(--color-surface-muted,#e3eeeb);font-weight:800;font-size:1.25rem;color:var(--color-text,#273b45)}
.space-person small{font-size:.72rem;color:var(--color-text-muted,#72848a)}
.space-person strong{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.space-controls{display:flex;flex-wrap:wrap;gap:8px;padding-block:13px;border-top:1px solid var(--color-border,#ddd);border-bottom:1px solid var(--color-border,#ddd)}
.space-controls .btn{min-height:46px}
.space-reactions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.space-reactions button{background:var(--color-surface-muted,#eaf0f3);border:1px solid var(--color-border,#ccd9dd);font-size:1.35rem;border-radius:50%;width:48px;height:48px}
.space-reactions span{color:var(--color-text-muted,#72848a);font-size:.85rem}
.space-controls button[hidden],.space-tabs[hidden]{display:none}
@media(max-width:640px){.spaces-hero>.btn{width:100%}.space-person{width:72px}.speaker-stage{min-height:215px}.space-controls .btn{flex:1 1 125px}.space-people{max-height:190px}}
.space-report-dialog{border:1px solid var(--color-border,#a8b6ba);border-radius:18px;
 width:min(92vw,540px);max-height:85dvh;overflow:auto;
 padding:clamp(16px,4vw,24px);background:var(--color-surface,#fff);color:var(--color-text,#15262f)}
.space-report-dialog::backdrop{background:#07171dd9}

.space-person{width:108px;min-width:0;overflow:visible}
.space-person-avatar{display:inline-grid;place-items:center;min-height:65px;min-width:65px}
.space-person-avatar .tz-avatar-verified{inline-size:62px;block-size:62px}
.space-person strong{white-space:normal;overflow-wrap:anywhere;text-overflow:clip}
.space-person .tz-identity-name{justify-content:center;max-width:100%}
.space-person .tz-verified-badge{inline-size:19px!important;block-size:19px!important}
.space-avatar-large{overflow:visible;background:transparent;border:0;box-shadow:none!important}
.space-avatar-large .tz-avatar-verified{inline-size:100px;block-size:100px}
.space-avatar-large.speaking .tz-avatar-verified{box-shadow:0 0 0 4px #239d73,0 0 22px 8px #24df8c66}
#spacePopout{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-height:46px}
#spacePopout[hidden]{display:none!important}

/* Blipmood Spaces 2.0: audio-first responsive stage */
.spaces-shell{width:100%;max-width:1230px;gap:20px;padding-bottom:108px}
.spaces-hero{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,310px);gap:30px;align-items:center;padding:clamp(25px,5vw,54px);background:radial-gradient(circle at 85% 0%,#195c6d 0,transparent 45%),radial-gradient(circle at 12% 94%,#146455 0,transparent 48%),linear-gradient(120deg,#071b29,#102d3d);border:1px solid #2f6170;border-radius:26px;box-shadow:0 18px 48px #091e2a21;margin:0}
.spaces-hero:before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#c8fff129 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(125deg,transparent 15%,#000 90%);pointer-events:none}
.spaces-hero-copy{min-width:0}
.spaces-hero .spaces-eyebrow{display:flex;align-items:center;gap:9px;font-size:.72rem;letter-spacing:.15em;font-weight:850;color:#91ffdb;text-transform:uppercase;margin:0 0 18px}
.spaces-signal,.space-stage-pill>span,.space-connection-dot{width:9px;height:9px;flex:none;border-radius:50%;display:inline-block;background:#45e8a5;box-shadow:0 0 0 4px #45e8a530,0 0 16px #45e8a5a6}
.spaces-hero h1{font-size:clamp(2rem,5.1vw,3.7rem)!important;letter-spacing:-.045em;font-weight:850;line-height:1.08}
.spaces-hero h1 span{color:#80e8ca}
.spaces-hero-copy>p:not(.spaces-eyebrow){font-size:clamp(.9rem,1.3vw,1rem);color:#c7dbe2;max-width:55ch;margin:17px 0 22px}
.spaces-hero-tags{display:flex;flex-wrap:wrap;gap:9px}
.spaces-hero-tags span{border:1px solid #ffffff38;background:#ffffff13;border-radius:999px;padding:8px 11px;color:#d4f0ed;font-size:.75rem;font-weight:650}
.spaces-hero-cta{display:grid;gap:12px;justify-items:start;padding:25px;border:1px solid #ffffff3c;border-radius:20px;background:linear-gradient(160deg,#ffffff18,#ffffff09);backdrop-filter:blur(14px)}
.spaces-hero-cta p{font-size:1.08rem;font-weight:780;color:white;margin:0!important}
.spaces-hero-cta small{font-size:.78rem;color:#b1d3d0}
.spaces-hero-icon{width:58px;height:58px;display:grid;place-items:center;font-size:1.9rem;background:#38d99b24;border:1px solid #65f0c26b;border-radius:17px}
.spaces-hero-button,.space-join-button{background:#50e4b1!important;color:#052f2d!important;border-color:#50e4b1!important;font-weight:850!important}
.spaces-hero-button{width:100%;min-height:52px!important;border-radius:12px}
.spaces-hero :is(button,a):focus-visible,.spaces-shell :is(button,a,input,select,textarea):focus-visible{outline:3px solid #40cba4;outline-offset:3px}
.spaces-shell .space-panel{border-radius:20px;border-color:var(--color-border,#dce5e8);box-shadow:0 8px 28px #08202c09;padding:clamp(18px,3vw,27px)}
.spaces-shell .space-panel>h2{font-size:1.35rem}
.spaces-section-kicker{font-size:.72rem;letter-spacing:.11em;font-weight:850;color:var(--color-primary,#087f73);margin:0 0 4px}
.spaces-heading h2{font-size:1.38rem!important;margin:0}
.spaces-tabs{width:max-content;max-width:100%;background:var(--color-surface-muted,#edf3f2);border:1px solid var(--color-border,#d9e3e3);border-radius:14px;padding:5px;gap:4px;margin:17px 0 21px}
.spaces-tabs button{flex:0 1 auto;min-width:95px;font-size:.83rem;transition:background .2s,color .2s}
.spaces-tabs button.active{color:var(--color-primary,#086f65);background:var(--color-surface,#fff);box-shadow:0 3px 14px #001d3017}
.spaces-list{gap:16px}
.space-item{position:relative;overflow:hidden;border-radius:17px;border:1px solid var(--color-border,#d6e1e3);padding:22px;gap:13px;align-content:start;background:var(--color-surface,#fff);box-shadow:0 4px 18px #071e2910;transition:transform .17s,box-shadow .17s,border-color .17s}
.space-item:hover{transform:translateY(-2px);border-color:#54b9a0;box-shadow:0 12px 35px #071e2920}
.space-item:before{content:"";display:block;position:absolute;top:0;inset-inline:0;height:4px;background:linear-gradient(90deg,#14a787,#5bebad,#5eb9d0)}
.space-item h3{font-weight:830;letter-spacing:-.02em;line-height:1.3;font-size:1.13rem}
.space-item p{line-height:1.55}
.space-item .btn{width:100%;border-radius:10px;min-height:46px;justify-content:center;margin-top:5px}
.space-item .space-live-badge{width:max-content}
.space-item .space-item-meta{font-size:.75rem;border-top:1px solid var(--color-border,#dfe9eb);padding-top:10px}
.space-live-badge{background:#ffe6e9;color:#b92249;display:inline-flex;align-items:center;gap:6px;border-radius:999px;font-weight:850;padding:7px 12px}
.space-upcoming-badge{background:#deeee9;color:#197361}
.space-detail{max-width:1140px;gap:17px;padding:clamp(15px,3vw,28px)!important}
.space-topbar{padding-bottom:13px;border-bottom:1px solid var(--color-border,#dbe6e8)}
.space-top-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}
.space-room-heading{display:grid;gap:9px;padding:8px 0}
.space-room-heading h2{font-size:clamp(1.55rem,3.2vw,2.35rem)!important;line-height:1.17;letter-spacing:-.035em;margin:0!important;overflow-wrap:anywhere}
.space-room-heading p{margin:0}
.space-room-heading #spaceDescription{max-width:72ch;font-size:.95rem}
.space-room-heading #spaceMeta{font-size:.8rem}
.space-session-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(235px,.8fr);align-items:start;gap:17px}
.space-stage-column{display:grid;gap:17px;min-width:0}
.speaker-stage{position:relative;isolation:isolate;min-height:350px;padding:21px 24px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;border:1px solid #285b61;border-radius:22px;background:radial-gradient(circle at 50% 48%,#1d615c 0,#153f4a 32%,#0b2635 71%),linear-gradient(140deg,#061823,#123e42);box-shadow:0 16px 46px #052e3c29;color:#fff}
.speaker-stage:before{content:"";position:absolute;inset:15% 12%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#61ffd01e 2%,transparent 70%);filter:blur(18px);pointer-events:none}
.space-stage-top,.space-stage-footer{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.space-stage-pill{display:inline-flex;align-items:center;gap:10px;border:1px solid #96ffdc6e;border-radius:999px;background:#4bfdac21;color:#a9ffde;padding:7px 12px;font-weight:850;font-size:.72rem;letter-spacing:.1em}
.space-stage-frequency{font-size:.7rem;color:#badbd8;letter-spacing:.11em}
.space-stage-content{display:grid;gap:9px;place-items:center;text-align:center;padding:10px 0}
.space-stage-avatar-wrap{position:relative;min-height:145px;display:grid;place-items:center}
.space-avatar-large{height:124px;width:124px;display:grid;place-items:center;position:relative;z-index:1}
.space-avatar-large .tz-avatar-verified{inline-size:106px;block-size:106px}
.space-avatar-large:empty{background:#4eb89955;border-radius:50%}
.space-avatar-large.speaking .tz-avatar-verified{box-shadow:0 0 0 4px #62ebba,0 0 28px 10px #56f5b65e}
.space-waveform{display:flex;align-items:center;justify-content:center;gap:5px;height:28px}
.space-waveform i{width:4px;height:10px;border-radius:5px;background:#80ffd0;animation:space-wave 1.1s ease-in-out infinite alternate;opacity:.75}
.space-waveform i:nth-child(2){animation-delay:.2s}.space-waveform i:nth-child(3){animation-delay:.4s}.space-waveform i:nth-child(4){animation-delay:.6s}.space-waveform i:nth-child(5){animation-delay:.8s}
@keyframes space-wave{from{height:6px;opacity:.45}to{height:23px;opacity:1}}
.speaker-stage .studio-kicker{color:#92ebcc!important;font-size:.69rem;letter-spacing:.15em;margin:4px 0 0}
.speaker-stage h3{font-size:clamp(1.25rem,2.6vw,1.65rem);font-weight:820;line-height:1.25;color:#fff;margin:0;letter-spacing:-.02em}
.space-stage-hint{font-size:.78rem;color:#b2d4d8;margin:0;line-height:1.5}
.space-stage-footer{padding-top:14px;border-top:1px solid #9cd8ce23;color:#c6e1e1;font-size:.73rem}
.space-people-panel{min-width:0;background:var(--color-surface,#fff);border:1px solid var(--color-border,#dce6e6);border-radius:19px;padding:17px}
.space-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:9px;border-bottom:1px solid var(--color-border,#e0e8e7);padding-bottom:11px;margin-bottom:13px}
.space-panel-heading h3{margin:0!important;font-size:1rem;font-weight:850}
.space-panel-heading span{font-size:.74rem;color:var(--color-text-muted,#6f8085);background:var(--color-surface-muted,#edf3f1);padding:5px 9px;border-radius:999px}
.space-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:13px;max-height:360px;overflow-y:auto}
.space-person{width:100%;min-width:0;max-width:100%;padding:10px 5px;border:1px solid var(--color-border,#dfe7e9);border-radius:13px;gap:6px}
.space-person-avatar .tz-avatar-verified{inline-size:57px;block-size:57px}
.space-person strong{font-size:.76rem;line-height:1.3;overflow-wrap:anywhere}
.space-person small{text-transform:capitalize;font-size:.68rem}
.space-person .btn{width:100%;min-height:36px;font-size:.7rem}
.space-audience-panel{min-height:210px}
.space-audience-panel>.studio-muted{margin:-3px 0 14px;font-size:.78rem}
.space-audience-panel .space-people{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:400px}
.space-action-dock{border:1px solid var(--color-border,#d8e4e5);border-radius:20px;padding:17px;background:var(--color-surface,#fff);box-shadow:0 8px 27px #001e3210}
.space-control-context{display:flex;align-items:center;gap:13px;min-width:0}
.space-control-context strong{font-size:.94rem;display:block;margin-bottom:2px}
.space-control-context .studio-muted{font-size:.79rem;line-height:1.45}
.space-connection-dot{background:#9ba6ae;box-shadow:0 0 0 4px #9ba6ae24}
.space-action-dock.is-connected .space-connection-dot{background:#24ca93;box-shadow:0 0 0 5px #24ca9330}
.space-controls{padding:15px 0 0;border:0;gap:9px;align-items:stretch}
.space-controls .btn{display:inline-flex;align-items:center;justify-content:center;border-radius:11px;min-height:45px;white-space:normal;font-size:.86rem;font-weight:760}
.space-controls .space-mic-button{background:var(--color-surface-muted,#edf2f3);border:1px solid var(--color-border,#cedbdc);color:var(--color-text,#273642)}
.space-controls .space-mic-button.is-live{background:#dcf9ea;border:1px solid #46b48a;color:#07593f}
.space-controls .space-end-button{color:#bd3144;border-color:#f2b8c0}
.space-audio-message{display:block;margin:11px 0 0;color:var(--color-text-muted,#62717f);font-size:.78rem;line-height:1.5}
.space-popout-help{font-size:.78rem;color:var(--color-text-muted,#647983);line-height:1.6;margin:0}
.space-reactions{padding:13px 0;gap:9px}
.space-reactions button{height:45px;width:45px;font-size:1.24rem;border-radius:13px;transition:transform .16s}
.space-reactions button:hover{transform:translateY(-2px)}
.spaces-permission-tip{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--color-border,#d9e6e4);background:var(--color-surface-muted,#edf8f3);padding:13px;border-radius:11px;color:var(--color-text,#253744);font-size:.81rem;line-height:1.58}
.spaces-permission-tip>span{font-size:1.1rem}
#spacesCreateForm .studio-action-row{align-items:center}
.spaces-shell [hidden]{display:none!important}
@media(max-width:960px){.space-session-layout{grid-template-columns:minmax(0,1fr)}.space-audience-panel .space-people{grid-template-columns:repeat(auto-fill,minmax(98px,1fr))}}
@media(max-width:700px){.spaces-shell{padding-block:13px 125px;gap:13px}.spaces-hero{grid-template-columns:minmax(0,1fr);padding:25px 19px;gap:20px;border-radius:19px}.spaces-hero-cta{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:15px}.spaces-hero-cta .spaces-hero-icon{width:43px;height:43px;font-size:1.3rem}.spaces-hero-cta p{flex:1;font-size:.92rem}.spaces-hero-cta small{display:none}.spaces-hero-cta .spaces-hero-button{flex:1 1 100%;width:100%}.spaces-hero-tags span{font-size:.7rem}.spaces-tabs{width:100%;justify-content:flex-start;overflow:auto}.spaces-tabs button{min-width:84px;padding:10px 7px;font-size:.79rem}.space-detail{padding:14px!important}.space-session-layout{gap:12px}.speaker-stage{min-height:305px;padding:15px}.space-stage-footer{font-size:.65rem}.space-people-panel{padding:13px}.space-action-dock{position:sticky;bottom:max(7px,env(safe-area-inset-bottom));z-index:7;padding:12px;box-shadow:0 8px 42px #0b283840;backdrop-filter:blur(15px)}.space-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.space-controls .btn{width:100%;min-height:45px;font-size:.8rem}.space-controls .space-join-button{grid-column:1/-1}.space-control-context strong{font-size:.85rem}.space-control-context .studio-muted{font-size:.72rem}.space-audio-message{max-height:85px;overflow:auto}.space-reactions button{width:43px;height:43px}.space-topbar .btn{font-size:.75rem}}
@media(max-width:400px){.space-controls{grid-template-columns:1fr 1fr}.space-controls .btn{padding:7px 5px;font-size:.76rem}.space-people{grid-template-columns:repeat(2,minmax(0,1fr))}.spaces-hero h1{font-size:1.9rem!important}}
@media(prefers-reduced-motion:reduce){.space-waveform i{animation:none}.space-item,.space-reactions button{transition:none}}

/* Clearly delineated active voices, ready speakers, and listeners */
.space-active-panel{border:1px solid #3ab697!important;background:linear-gradient(165deg,var(--color-surface,#fff),var(--color-surface-muted,#f1faf7));box-shadow:0 3px 24px #21a18412}
.space-active-panel .space-panel-heading{border-bottom-color:#54c09c55}
.space-active-panel .space-panel-heading h3{display:inline-flex;align-items:center;gap:9px}
.space-talking-dot{width:9px;height:9px;border-radius:50%;flex:none;background:#12c98a;box-shadow:0 0 0 5px #20bf8630}
.space-active-panel .space-person{border-color:#3cb68b;background:var(--color-surface,#fff)}
.space-panel-description{font-size:.74rem;color:var(--color-text-muted,#6a797e);line-height:1.4;margin:0 0 11px}
.space-empty-group{width:100%;grid-column:1/-1;margin:0!important;padding:10px 8px;font-size:.78rem;color:var(--color-text-muted,#6a7d7b);line-height:1.45}
.space-active-panel .space-people{min-height:52px}
.spaces-shell,.spaces-hero,.space-panel,.space-detail,.space-session-layout,.space-stage-column,
.space-people-panel,.speaker-stage,.space-action-dock,.space-room-heading,.space-topbar,.spaces-heading,
.space-controls,.space-people,.space-person{min-width:0;max-width:100%;box-sizing:border-box}
.space-room-heading h2,.space-room-heading p,.space-item,.space-panel-heading h3,
.space-stage-footer,.space-stage-hint,.space-person,.spaces-hero h1{overflow-wrap:anywhere}
.space-session-layout>*{min-width:0}
.space-people-panel .space-people{grid-template-columns:repeat(auto-fill,minmax(min(100%,96px),1fr));width:100%}
.space-audience-panel .space-people{grid-template-columns:repeat(auto-fill,minmax(min(100%,96px),1fr))}
.space-stage-column .space-people{max-height:300px}
.space-controls>a.btn{max-width:100%;white-space:normal}
.space-topbar>*{min-width:0}
@media(max-width:700px){
 .spaces-shell{max-width:100%;width:100%;padding-inline:10px}
 .spaces-hero{width:100%}
 .space-detail{width:100%;max-width:100%}
 .space-session-layout{grid-template-columns:minmax(0,1fr);width:100%}
 .space-stage-column{width:100%}
 .space-stage-footer{gap:6px}
 .space-people-panel .space-people{grid-template-columns:repeat(auto-fill,minmax(min(100%,90px),1fr))}
 .space-controls{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
 .space-controls .btn{min-width:0;overflow-wrap:anywhere}
 .space-action-dock{max-width:100%;bottom:max(8px,env(safe-area-inset-bottom))}
}
@media(max-width:350px){
 .spaces-shell{padding-inline:8px}
 .speaker-stage{min-height:285px;padding:12px}
 .space-control-context .studio-muted{line-height:1.35}
 .space-people-panel{padding:11px}
}

/* Audio owners in a separate window get a focused, compact control surface. */
.space-popout-mode .spaces-hero,.space-popout-mode #spacesDiscovery,.space-popout-mode #spacesCreate,
.space-popout-mode #spacesStatus{display:none!important}
.space-popout-mode .spaces-shell{width:100%;max-width:730px;padding:10px 12px 50px}
.space-popout-mode .space-detail{width:100%;gap:12px}
.space-popout-mode .space-session-layout{display:grid;grid-template-columns:minmax(0,1fr)}
.space-popout-mode .speaker-stage{min-height:215px;padding:16px}
.space-popout-mode .space-stage-footer{display:none}
.space-popout-mode .space-stage-avatar-wrap{min-height:100px}
.space-popout-mode .space-avatar-large{height:90px;width:90px}
.space-popout-mode .space-avatar-large .tz-avatar-verified{inline-size:84px;block-size:84px}
.space-popout-mode .space-audience-panel{min-height:0}
.space-popout-mode .space-people-panel{padding:12px}
.space-popout-mode .space-action-dock{position:sticky;bottom:max(8px,env(safe-area-inset-bottom));z-index:8}
.space-popout-mode .spaces-shell .space-panel{padding:15px}
@media(max-width:450px){.space-popout-mode .space-room-heading h2{font-size:1.32rem!important}.space-popout-mode .speaker-stage{min-height:180px}.space-popout-mode .space-people{max-height:155px}}

/* Quiet stage: a designed idle state instead of an empty speaker grid.
   Only real voice activity replaces this with speaking participants. */
.space-active-panel .space-no-active-speaker{
 position:relative;isolation:isolate;grid-column:1/-1;display:flex;
 flex-direction:column;align-items:center;justify-content:center;gap:9px;
 width:100%;max-width:100%;min-width:0;min-height:194px;box-sizing:border-box;
 overflow:hidden;text-align:center;padding:24px 18px;border-radius:17px;
 border:1px solid #5de6c450;
 background:
  radial-gradient(ellipse at 52% 6%,#3bd7b730 0%,transparent 46%),
  radial-gradient(circle at 100% 95%,#326cc83a 0%,transparent 45%),
  linear-gradient(135deg,#0a2537 0%,#123846 51%,#092537 100%);
 color:#f4fffd;box-shadow:inset 0 1px 0 #ffffff16,0 11px 25px #092f3422;
}
.space-no-active-speaker::before{
 content:"";position:absolute;z-index:-1;top:5%;left:50%;
 width:min(228px,75%);aspect-ratio:1;border:1px solid #70ecb635;
 border-radius:50%;transform:translateX(-50%);
 box-shadow:0 0 0 27px #74f9c40b,0 0 0 55px #7fdac708;
 pointer-events:none;
}
.space-no-active-speaker::after{
 content:"";position:absolute;z-index:-1;inset:0;opacity:.35;
 background-image:radial-gradient(#b2fff5 1px,transparent 1px);
 background-size:24px 24px;mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);
 pointer-events:none;
}
.space-no-active-icon{
 position:relative;display:grid;place-items:center;flex:none;
 width:67px;height:67px;border-radius:50%;font-size:1.8rem;
 background:linear-gradient(145deg,#45e4bd40,#183e6b90);
 border:1px solid #9df5de80;box-shadow:0 0 0 7px #80efca12,0 12px 28px #0005;
 animation:space-idle-float 4s ease-in-out infinite;
}
.space-no-active-title{font-size:clamp(.97rem,2.2vw,1.13rem);font-weight:850;line-height:1.3;letter-spacing:-.01em;color:#f7fffe}
.space-no-active-description{display:block;max-width:30ch;font-size:.77rem;line-height:1.5;color:#c7e4e5;overflow-wrap:anywhere}
.speaker-stage.is-idle{
 background:radial-gradient(circle at 50% 38%,#245465 0%,#113746 36%,#0b2635 78%);
}
.speaker-stage.is-idle .space-waveform i{animation:none;height:7px;opacity:.4}
.speaker-stage.is-idle .space-avatar-large{
 border:1px solid #8ff5d672!important;border-radius:50%;
 background:linear-gradient(145deg,#5ce5bd26,#326d9659);
 box-shadow:0 0 0 8px #4cf9be12!important;font-size:2.4rem;
}
@keyframes space-idle-float{
 0%,100%{transform:translateY(0)}
 50%{transform:translateY(-5px)}
}
@media(max-width:400px){
 .space-active-panel .space-no-active-speaker{min-height:175px;padding:20px 12px}
 .space-no-active-icon{width:58px;height:58px;font-size:1.65rem}
 .space-no-active-description{font-size:.75rem}
}
@media(prefers-reduced-motion:reduce){
 .space-no-active-icon{animation:none}
}

/* Real-time Spaces clock. Updates once per second from the server start time;
   these are visual counters, not continuously announced screen-reader alerts. */
.space-top-actions{min-width:0;flex-wrap:wrap;gap:8px}
.space-live-clock{
 display:inline-flex;align-items:center;gap:12px;min-width:0;max-width:100%;
 border:1px solid #4ab69b58;border-radius:13px;
 background:linear-gradient(120deg,#0b2838,#144738);color:#f2fffd;
 padding:8px 12px;box-shadow:0 4px 16px #0a352b20;
 font-variant-numeric:tabular-nums;
}
.space-clock-elapsed,.space-clock-remaining{display:grid;gap:2px;min-width:0}
.space-clock-elapsed{grid-template-columns:9px auto;column-gap:7px;align-items:center}
.space-clock-elapsed .space-clock-label{grid-column:2}
.space-clock-elapsed time{grid-column:2}
.space-clock-pulse{grid-row:1/3;width:8px;height:8px;border-radius:50%;
 background:#55e8ac;box-shadow:0 0 0 4px #55e8ac2b;animation:space-clock-pulse 2s ease-in-out infinite}
.space-clock-label{font-size:.57rem;letter-spacing:.12em;font-weight:850;color:#b2e9d9}
.space-live-clock time{display:block;font:800 clamp(.91rem,1.4vw,1.11rem)/1.15 var(--font-body,system-ui);
 letter-spacing:.025em;white-space:nowrap;color:#fff}
.space-clock-divider{align-self:stretch;border-left:1px solid #acdec25c}
.space-live-clock.time-up{background:linear-gradient(115deg,#572735,#472b3a);border-color:#c67c82}
.space-live-clock.time-up .space-clock-pulse{animation:none;background:#ffaaa9;box-shadow:0 0 0 4px #ffaaa91d}
@keyframes space-clock-pulse{50%{opacity:.45;box-shadow:0 0 0 7px #55e8ac12}}
@media(max-width:700px){
 .space-top-actions{width:100%;justify-content:flex-start;gap:8px}
 .space-live-clock{order:2;flex:1 1 180px;justify-content:center;padding:8px 10px;gap:10px}
 .space-top-actions #spaceShare{order:3}
 .space-top-actions #spaceReport{order:4}
 .space-live-clock time{font-size:.98rem}
}
@media(max-width:350px){
 .space-live-clock{flex-basis:100%;justify-content:space-around}
 .space-clock-label{font-size:.55rem}
}
@media(prefers-reduced-motion:reduce){
 .space-clock-pulse{animation:none}
}

/* Unified stage: the illustrated "Speaking now" panel is the ONLY on-air stage.
   The former green stage is absent from the HTML; the first currently talking
   member expands into this same dark-teal panel with full profile and controls. */
.space-active-panel #spacesActiveSpeakers{align-items:stretch;max-height:none;min-width:0}
.space-active-panel .space-speaking-spotlight{
 position:relative;isolation:isolate;grid-column:1/-1;
 width:100%;max-width:100%;min-width:0;min-height:205px;box-sizing:border-box;
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 gap:8px;padding:22px 16px;overflow:hidden;
 text-align:center;border:1px solid #5de6c47a;border-radius:17px;
 background:radial-gradient(ellipse at 52% 6%,#3bd7b730 0%,transparent 46%),
   radial-gradient(circle at 100% 95%,#326cc83a 0%,transparent 45%),
   linear-gradient(135deg,#0a2537 0%,#123846 51%,#092537 100%);
 color:#f4fffd;box-shadow:inset 0 1px 0 #ffffff16,0 11px 25px #092f3422;
}
.space-active-panel .space-speaking-spotlight::before{
 content:"";position:absolute;z-index:-1;top:-20%;left:50%;
 width:min(250px,80%);aspect-ratio:1;border:1px solid #73f5cb4d;
 border-radius:50%;transform:translateX(-50%);
 box-shadow:0 0 0 27px #74f9c40d,0 0 0 55px #7fdac708;pointer-events:none;
}
.space-active-panel .space-speaking-spotlight .space-person-avatar{
 display:grid;place-items:center;position:relative;
 width:96px;height:96px;max-width:100%;margin:3px 0;
 border-radius:50%;box-shadow:0 0 0 6px #62f1bd21,0 0 28px #4af0b85c;
}
.space-active-panel .space-speaking-spotlight .space-person-avatar .tz-avatar-verified{
 inline-size:92px;block-size:92px;max-inline-size:100%;max-block-size:100%;
}
.space-active-panel .space-speaking-spotlight strong{
 color:#fff;font-size:clamp(1rem,2.4vw,1.25rem);font-weight:850;
 max-width:100%;overflow-wrap:anywhere;line-height:1.3;
}
.space-active-panel .space-speaking-spotlight small{
 font-size:.75rem;color:#a6e7d3;font-weight:700;letter-spacing:.025em;
}
.space-speaking-live{display:inline-flex;align-items:center;justify-content:center;
 padding:6px 11px;border-radius:999px;background:#36dba820;
 border:1px solid #70efc085;color:#aaffdb;
 font-size:.67rem;font-weight:850;letter-spacing:.12em;
}
.space-speaking-wave{display:inline-flex;align-items:center;justify-content:center;
 height:28px;gap:5px;max-width:100%;margin-top:3px}
.space-speaking-wave i{display:block;width:4px;height:9px;border-radius:5px;
 background:#83ffd6;animation:space-unified-wave .95s ease-in-out infinite alternate}
.space-speaking-wave i:nth-child(2){animation-delay:.16s}
.space-speaking-wave i:nth-child(3){animation-delay:.3s}
.space-speaking-wave i:nth-child(4){animation-delay:.46s}
.space-speaking-wave i:nth-child(5){animation-delay:.62s}
@keyframes space-unified-wave{from{height:6px;opacity:.45}to{height:23px;opacity:1}}
.space-active-panel .space-speaking-spotlight .btn{
 color:#defaf3;background:#ffffff16;border:1px solid #91d5c178;
 width:auto;max-width:100%;min-height:40px;padding:7px 12px;white-space:normal;
}
.space-active-panel .space-speaking-spotlight .btn:focus-visible{
 outline:3px solid #78ffdc;outline-offset:3px;
}
@media(max-width:400px){
 .space-active-panel .space-speaking-spotlight{min-height:180px;padding:18px 10px}
 .space-active-panel .space-speaking-spotlight .space-person-avatar{width:80px;height:80px}
 .space-active-panel .space-speaking-spotlight .space-person-avatar .tz-avatar-verified{inline-size:78px;block-size:78px}
}
@media(prefers-reduced-motion:reduce){.space-speaking-wave i{animation:none;height:10px}}