/* Team Communications: screens and the call room. Uses the portal's existing colours and fonts. */
.cc-row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--warm-white);border:1px solid var(--border);border-radius:14px;padding:12px 16px;margin-bottom:10px}
.cc-row h3{font-size:1rem;margin:0 0 2px;font-weight:500}.cc-row .small{margin:0}
.cc-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cc-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-bottom:22px}
.cc-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.cc-tabs button[aria-selected=true]{background:var(--sage-strong);color:#fff;border-color:var(--sage-strong)}
.cc-field{display:block;margin:0 0 12px}.cc-field>span{display:block;font-size:.78rem;color:var(--ink-mute);margin-bottom:4px}
.cc-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:560px){.cc-two{grid-template-columns:1fr}}
.cc-people{max-height:220px;overflow:auto;border:1px solid var(--border);border-radius:12px;padding:6px}
.cc-people label{display:flex;gap:8px;align-items:center;padding:6px 8px;border-radius:8px;cursor:pointer}.cc-people label:hover{background:var(--sage-pale)}
.cc-ring{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:300;background:#2c3b31;color:#fff;border-radius:16px;padding:14px 18px;display:flex;gap:14px;align-items:center;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:94vw}
.cc-ring .btn-primary,.cc-ring .btn-ghost{padding:8px 16px}.cc-ring .btn-ghost{color:#fff;border-color:rgba(255,255,255,.5);background:transparent}
.cc-cal-day{margin:0 0 16px}.cc-cal-day h3{font-size:.9rem;font-weight:500;color:var(--ink-mute);margin:0 0 6px}
.cc-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--sage);margin-right:6px}
/* ===== call room ===== */
#ccRoom{--bg:#0e1511;--panel:#16201a;--panel2:#1d2a22;--line:rgba(255,255,255,.09);--tx:#eef4ef;--mut:#a9bbae;--sage:#7A9E87;--glow:#9be0b4;--red:#e5484d;--amber:#e0a93b;
  position:fixed;inset:0;z-index:400;background:radial-gradient(1200px 700px at 20% -10%,#1b2a21 0%,transparent 60%),radial-gradient(900px 600px at 110% 110%,#17261e 0%,transparent 55%),var(--bg);color:var(--tx);font-family:var(--sans);display:flex;flex-direction:column;overflow:hidden}
#ccRoom *{box-sizing:border-box}
#ccRoom video{transform:none!important}   /* never mirrored: you see yourself the way everyone else sees you */
#ccRoom .cci{width:22px;height:22px;display:block}
#ccRoom .cc-vh{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
#ccRoom button{font:inherit;color:inherit}
#ccRoom :focus-visible{outline:2px solid var(--glow);outline-offset:2px}
/* top bar */
#ccRoom .cc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;flex:0 0 auto}
#ccRoom .cc-title{display:flex;align-items:baseline;gap:12px;min-width:0}#ccRoom .cc-title b{font-weight:500;font-size:1.02rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ccRoom .cc-time{font-variant-numeric:tabular-nums;color:var(--mut);font-size:.85rem}
#ccRoom .cc-badge{display:inline-flex;align-items:center;gap:7px;border-radius:99px;padding:6px 13px 6px 10px;font-size:.78rem;border:1px solid var(--line);background:rgba(255,255,255,.04);cursor:pointer}
#ccRoom .cc-badge .cci{width:17px;height:17px}
#ccRoom .cc-badge.on{background:rgba(70,160,105,.16);border-color:rgba(155,224,180,.45);color:#d8f6e3}
#ccRoom .cc-badge.on .cci{animation:cc-shield 3.2s ease-in-out infinite}
#ccRoom .cc-badge.part{background:rgba(224,169,59,.14);border-color:rgba(224,169,59,.5);color:#f6e3b4}
@keyframes cc-shield{0%,100%{transform:scale(1)}50%{transform:scale(1.14)}}
/* stage */
#ccRoom .cc-main{flex:1;display:flex;min-height:0;gap:12px;padding:0 14px}
#ccRoom .cc-stage{flex:1;min-width:0;position:relative;overflow:hidden}
#ccRoom .cc-tile{position:absolute;border-radius:18px;overflow:hidden;background:#1c2a22;box-shadow:0 8px 30px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.06);transition:left .38s cubic-bezier(.2,.8,.2,1),top .38s cubic-bezier(.2,.8,.2,1),width .38s cubic-bezier(.2,.8,.2,1),height .38s cubic-bezier(.2,.8,.2,1),box-shadow .25s,opacity .3s,transform .3s}
#ccRoom .cc-stage.instant .cc-tile{transition:none}
#ccRoom .cc-tile.fresh{transition:none;opacity:0;transform:scale(.94)}
#ccRoom .cc-tile.gone{display:none}
#ccRoom .cc-tile.pip{box-shadow:0 10px 34px rgba(0,0,0,.55),0 0 0 2px rgba(255,255,255,.14);border-radius:14px}
#ccRoom .cc-media{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#203126,#16221b)}
#ccRoom .cc-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#0b100d}
#ccRoom .cc-tile.share .cc-media video,#ccRoom .cc-tile.big .cc-media video{object-fit:contain}
#ccRoom .cc-tile.share .cc-media{background:#0b100d}
#ccRoom .cc-avwrap{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
#ccRoom .cc-avatar{--h:140;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;flex:0 0 auto;font-weight:500;font-size:.92rem;color:#fff;background:linear-gradient(145deg,hsl(var(--h) 38% 46%),hsl(var(--h) 36% 33%));box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
#ccRoom .cc-avatar.xl{width:clamp(48px,22%,92px);aspect-ratio:1;height:auto;font-size:clamp(1.2rem,3.2vw,2.2rem)}
#ccRoom .cc-tile.small .cc-avatar.xl{width:44px;font-size:1.1rem}
#ccRoom .cc-tile.hasvideo .cc-avwrap{display:none}
/* the ring that shows who is speaking: it lights, nothing moves */
#ccRoom .cc-tile::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 0 var(--glow);transition:box-shadow .25s}
#ccRoom .cc-tile.speaking::after{box-shadow:inset 0 0 0 3px var(--glow),inset 0 0 22px rgba(155,224,180,.35)}
#ccRoom .cc-chip{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:7px;max-width:calc(100% - 20px);background:rgba(8,14,10,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:99px;padding:4px 11px 4px 9px;font-size:.78rem;z-index:2}
#ccRoom .cc-nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ccRoom .cc-mutei{display:none;color:#ff9a9d}#ccRoom .cc-tile.muted .cc-mutei{display:flex}#ccRoom .cc-mutei .cci,#ccRoom .cc-lk .cci{width:15px;height:15px}
#ccRoom .cc-lk{display:flex;color:#9be0b4}
#ccRoom .cc-eq{display:none;align-items:flex-end;gap:2px;height:13px}#ccRoom .cc-tile.speaking:not(.muted) .cc-eq{display:flex}
#ccRoom .cc-eq i{width:3px;background:var(--glow);border-radius:2px;animation:cc-eq .9s ease-in-out infinite}#ccRoom .cc-eq i:nth-child(1){height:5px;animation-delay:-.2s}#ccRoom .cc-eq i:nth-child(2){height:12px;animation-delay:-.5s}#ccRoom .cc-eq i:nth-child(3){height:8px;animation-delay:-.8s}
@keyframes cc-eq{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(1)}}#ccRoom .cc-eq i{transform-origin:bottom}
#ccRoom .cc-tools{position:absolute;top:8px;right:8px;display:flex;gap:6px;opacity:0;transition:opacity .2s;z-index:3}
#ccRoom .cc-tile:hover .cc-tools,#ccRoom .cc-tile:focus-within .cc-tools,#ccRoom .cc-tools:focus-within{opacity:1}
@media(hover:none){#ccRoom .cc-tools{opacity:.9}}
#ccRoom .cc-tb{width:34px;height:34px;border-radius:50%;border:0;background:rgba(8,14,10,.62);backdrop-filter:blur(8px);cursor:pointer;display:flex;align-items:center;justify-content:center}
#ccRoom .cc-tb:hover{background:rgba(8,14,10,.85)}#ccRoom .cc-tb.on{background:var(--sage);color:#0c1a12}#ccRoom .cc-tb .cci{width:17px;height:17px}
#ccRoom .cc-tile.small .cc-chip{font-size:.7rem;left:6px;bottom:6px;padding:3px 8px}#ccRoom .cc-tile.small .cc-tools{display:none}
/* dock + controls */
#ccRoom .cc-dock{flex:0 0 auto;display:flex;justify-content:center;padding:12px 12px max(14px,env(safe-area-inset-bottom))}
#ccRoom .cc-bar{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:99px;background:rgba(24,36,29,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);box-shadow:0 14px 40px rgba(0,0,0,.4);max-width:100%}
#ccRoom .cc-sep{width:1px;height:26px;background:var(--line);margin:0 2px}
#ccRoom .cc-ctl{position:relative;width:52px;height:52px;border-radius:50%;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:var(--tx);transition:background .2s,transform .15s,box-shadow .2s}
#ccRoom .cc-ctl:hover{background:rgba(255,255,255,.18);transform:translateY(-2px)}#ccRoom .cc-ctl:active{transform:scale(.92)}
#ccRoom .cc-ctl:disabled{opacity:.4;cursor:not-allowed;transform:none}
#ccRoom .cc-ctl .cc-ico-off{display:none}#ccRoom .cc-ctl.off .cc-ico-on{display:none}#ccRoom .cc-ctl.off .cc-ico-off{display:block}
#ccRoom #bMic.off,#ccRoom #bCam.off{background:var(--red);color:#fff}
#ccRoom #bView.off{background:rgba(155,224,180,.2);color:var(--glow)}
#ccRoom #bShare.active{background:var(--glow);color:#0c1a12}
#ccRoom .cc-ctl.active:not(#bShare){background:rgba(155,224,180,.22);color:var(--glow)}
#ccRoom .cc-ctl.open{background:rgba(255,255,255,.22)}
#ccRoom .cc-ctl.hang{background:var(--red);color:#fff;width:64px;border-radius:99px;margin-left:4px}#ccRoom .cc-ctl.hang:hover{background:#f05a5f}
#ccRoom .cc-ctl.pop .cci{animation:cc-pop .42s cubic-bezier(.3,1.6,.5,1)}
@keyframes cc-pop{0%{transform:scale(.55) rotate(-18deg);opacity:.3}60%{transform:scale(1.18) rotate(4deg)}100%{transform:scale(1) rotate(0);opacity:1}}
#ccRoom #bMic.speak:not(.off){box-shadow:0 0 0 3px rgba(155,224,180,.5);animation:cc-ring 1.2s ease-out infinite}
@keyframes cc-ring{0%{box-shadow:0 0 0 0 rgba(155,224,180,.55)}100%{box-shadow:0 0 0 12px rgba(155,224,180,0)}}
#ccRoom .cc-dot{position:absolute;top:-2px;right:-2px;min-width:19px;height:19px;border-radius:99px;background:var(--amber);color:#1b1304;font-size:.7rem;font-weight:600;font-style:normal;display:flex;align-items:center;justify-content:center;padding:0 5px;animation:cc-pop .4s}
#ccRoom .cc-dot[hidden]{display:none}
#ccRoom .cc-ctl[data-tip]::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%,4px);background:rgba(4,8,6,.92);color:#fff;font-size:.74rem;padding:4px 9px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
#ccRoom .cc-ctl[data-tip]:hover::after,#ccRoom .cc-ctl[data-tip]:focus-visible::after{opacity:1;transform:translate(-50%,0)}
#ccRoom .cc-morewrap{position:relative}
#ccRoom .cc-menu{position:absolute;bottom:calc(100% + 14px);right:0;min-width:210px;background:var(--panel2);border:1px solid var(--line);border-radius:16px;padding:6px;box-shadow:0 18px 44px rgba(0,0,0,.5);animation:cc-rise .18s ease-out;z-index:20}
#ccRoom .cc-menu[hidden]{display:none}
#ccRoom .cc-menu button{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:0;border-radius:10px;padding:10px 12px;cursor:pointer}
#ccRoom .cc-menu button:hover{background:rgba(255,255,255,.08)}#ccRoom .cc-menu .bad{color:#ff9a9d}#ccRoom .cc-menu .cci{width:19px;height:19px}
@keyframes cc-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* side panel */
#ccRoom .cc-side{width:min(360px,100%);flex:0 0 auto;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:20px;min-height:0;overflow:hidden;animation:cc-slide .25s cubic-bezier(.2,.8,.2,1)}
#ccRoom .cc-side[hidden]{display:none}
@keyframes cc-slide{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
#ccRoom .cc-tabs{display:flex;gap:4px;padding:10px 10px 0;border-bottom:1px solid var(--line)}
#ccRoom .cc-tabs button[data-tab]{display:inline-flex;align-items:center;gap:7px;background:none;border:0;border-bottom:2px solid transparent;padding:9px 12px;cursor:pointer;color:var(--mut);font-size:.9rem}
#ccRoom .cc-tabs button[data-tab].on{color:var(--tx);border-bottom-color:var(--glow)}#ccRoom .cc-tabs .cci{width:18px;height:18px}
#ccRoom .cc-count{font-weight:500;font-size:.72rem;color:var(--mut);background:rgba(255,255,255,.08);border-radius:99px;padding:1px 7px}#ccRoom .cc-count:empty{display:none}
#ccRoom .cc-x{margin-left:auto;background:none;border:0;cursor:pointer;color:var(--mut);padding:8px;border-radius:50%}#ccRoom .cc-x:hover{background:rgba(255,255,255,.08)}
#ccRoom .cc-pane{flex:1;min-height:0;overflow:auto;padding:10px}#ccRoom .cc-pane[hidden]{display:none}
#ccRoom .chatpane{display:flex;flex-direction:column;padding:0}
#ccRoom .cc-group{margin-bottom:14px}#ccRoom .cc-group.wait{background:rgba(224,169,59,.09);border:1px solid rgba(224,169,59,.3);border-radius:14px;padding:8px}
#ccRoom .cc-ghead{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 8px;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--mut)}#ccRoom .cc-ghead b{font-weight:500}
#ccRoom .cc-prow{display:flex;align-items:center;gap:10px;padding:7px 6px;border-radius:12px}#ccRoom .cc-prow:hover{background:rgba(255,255,255,.05)}
#ccRoom .cc-pn{flex:1;min-width:0;display:flex;flex-direction:column}#ccRoom .cc-pn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ccRoom .cc-tag{font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;background:rgba(255,255,255,.1);border-radius:6px;padding:1px 6px;color:var(--mut);margin-left:4px}#ccRoom .cc-tag.host{background:rgba(155,224,180,.18);color:var(--glow)}
#ccRoom .cc-code{font-family:ui-monospace,monospace;font-size:.7rem;color:var(--amber);margin-top:2px}
#ccRoom .cc-st{display:flex;color:var(--mut)}#ccRoom .cc-st.off{color:#ff9a9d}#ccRoom .cc-st .cci{width:17px;height:17px}
#ccRoom .cc-ib{width:32px;height:32px;border-radius:50%;border:0;background:rgba(255,255,255,.07);cursor:pointer;display:flex;align-items:center;justify-content:center}#ccRoom .cc-ib:hover{background:rgba(229,72,77,.35)}#ccRoom .cc-ib .cci{width:16px;height:16px}
#ccRoom .cc-admit{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:99px;background:var(--glow);color:#0c1a12;font-weight:500;padding:7px 13px;cursor:pointer;font-size:.84rem}#ccRoom .cc-admit .cci{width:16px;height:16px}#ccRoom .cc-admit:hover{filter:brightness(1.08)}
#ccRoom .cc-warn{font-size:.8rem;color:#f6e3b4;background:rgba(224,169,59,.1);border-radius:10px;padding:8px 10px;margin:4px 0}
/* chat */
#ccRoom .cc-chatnote{display:flex;gap:8px;align-items:center;margin:0;padding:9px 12px;font-size:.74rem;color:var(--mut);border-bottom:1px solid var(--line)}#ccRoom .cc-chatnote .cci{width:15px;height:15px;flex:0 0 auto}
#ccRoom .cc-log{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:4px}
#ccRoom .cc-empty{margin:auto;text-align:center;color:var(--mut);font-size:.9rem}#ccRoom .cc-empty .cci{width:34px;height:34px;margin:0 auto 6px;opacity:.6}
#ccRoom .cc-msg{display:flex;flex-direction:column;align-items:flex-start;max-width:88%;animation:cc-rise .2s ease-out}#ccRoom .cc-msg small{font-size:.7rem;color:var(--mut);margin:8px 6px 3px}#ccRoom .cc-msg.cont{margin-top:0}
#ccRoom .cc-bubble{background:#26362c;border-radius:16px 16px 16px 5px;padding:8px 13px;font-size:.9rem;line-height:1.4;overflow-wrap:anywhere;white-space:pre-wrap}
#ccRoom .cc-msg.mine{align-self:flex-end;align-items:flex-end}#ccRoom .cc-msg.mine .cc-bubble{background:#4a7c5d;border-radius:16px 16px 5px 16px}
#ccRoom .cc-chat{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}
#ccRoom .cc-chat input{flex:1;min-width:0;background:#101812;color:var(--tx);border:1px solid var(--line);border-radius:99px;padding:11px 16px;font:inherit}
#ccRoom .cc-send{width:44px;height:44px;border-radius:50%;border:0;background:var(--glow);color:#0c1a12;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:0 0 auto}#ccRoom .cc-send:hover{filter:brightness(1.08)}
/* someone at the door */
#ccRoom .cc-knocks{position:absolute;top:64px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:30;width:min(440px,calc(100% - 24px))}
#ccRoom .cc-knock{display:flex;align-items:center;gap:12px;background:var(--panel2);border:1px solid rgba(155,224,180,.4);border-radius:18px;padding:10px 12px;box-shadow:0 14px 40px rgba(0,0,0,.5);animation:cc-drop .35s cubic-bezier(.3,1.4,.5,1);transition:opacity .5s}
#ccRoom .cc-knock.out{opacity:0}#ccRoom .cc-knock div{flex:1;min-width:0;display:flex;flex-direction:column}#ccRoom .cc-knock span{font-size:.78rem;color:var(--mut)}
@keyframes cc-drop{from{opacity:0;transform:translateY(-18px) scale(.95)}to{opacity:1;transform:none}}
/* banners */
#ccRoom .cc-banner{position:absolute;top:58px;left:50%;transform:translateX(-50%);z-index:25;padding:9px 18px;border-radius:99px;font-size:.86rem;box-shadow:0 10px 30px rgba(0,0,0,.4);animation:cc-drop .3s;max-width:calc(100% - 24px)}
#ccRoom .cc-banner.warn{background:#5e4513;color:#fbe6b0}#ccRoom .cc-banner.bad{background:#6e2a2a;color:#ffd2d3}#ccRoom .cc-banner.ok{background:#1f4a32;color:#d6f4e1}
/* before joining and waiting screens */
#ccRoom.cc-pre-screen{align-items:center;justify-content:center;overflow:auto;padding:18px}
#ccRoom .cc-pre{width:min(960px,100%);display:grid;grid-template-columns:1.15fr 1fr;gap:22px;background:var(--panel);border:1px solid var(--line);border-radius:26px;padding:22px;box-shadow:0 30px 80px rgba(0,0,0,.45);animation:cc-rise .3s ease-out}
@media(max-width:820px){#ccRoom .cc-pre{grid-template-columns:1fr}}
#ccRoom .cc-pre-view{position:relative;aspect-ratio:16/10;border-radius:20px;overflow:hidden;background:linear-gradient(160deg,#203126,#16221b);display:flex;align-items:center;justify-content:center}
#ccRoom .cc-pre-view video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}#ccRoom .cc-pre-view.live video{display:block}#ccRoom .cc-pre-view.live .cc-pre-avatar{display:none}
#ccRoom .cc-pre-avatar{text-align:center;color:var(--mut);font-size:.88rem}#ccRoom .cc-pre-avatar .cc-avatar.xl{width:84px;font-size:2rem;margin:0 auto 8px}
#ccRoom .cc-pre-btns{display:flex;gap:12px;justify-content:center;margin-top:14px}
#ccRoom .cc-toggle{cursor:pointer}#ccRoom .cc-toggle .cc-ico-off{display:none}
#ccRoom .cc-toggle:has(input:checked) .cc-ico-on{display:none}#ccRoom .cc-toggle:has(input:checked) .cc-ico-off{display:block}
#ccRoom .cc-toggle:has(input:checked){background:var(--red);color:#fff}
#ccRoom .cc-toggle.cam .cc-ico-off{display:block}#ccRoom .cc-toggle.cam .cc-ico-on{display:none}
#ccRoom .cc-toggle.cam:has(input:checked){background:var(--glow);color:#0c1a12}#ccRoom .cc-toggle.cam:has(input:checked) .cc-ico-off{display:block}#ccRoom .cc-toggle.cam:has(input:checked) .cc-ico-on{display:none}
#ccRoom .cc-toggle:has(input:focus-visible){outline:2px solid var(--glow);outline-offset:2px}
#ccRoom .cc-pre-form h2{font-family:var(--serif);font-weight:400;font-size:1.9rem;margin:2px 0 0}
#ccRoom .cc-sub{color:var(--mut);font-size:.86rem;margin:2px 0 12px}
#ccRoom .cc-field{display:block;margin:10px 0}#ccRoom .cc-field>span{display:block;font-size:.76rem;color:var(--mut);margin-bottom:5px}
#ccRoom select,#ccRoom .cc-field select{width:100%;background:#101812;color:var(--tx);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font:inherit}
#ccRoom .cc-testrow{display:flex;gap:8px;flex-wrap:wrap}
#ccRoom .cc-chipbtn{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:99px;padding:8px 15px;cursor:pointer;font-size:.86rem}#ccRoom .cc-chipbtn:hover{background:rgba(255,255,255,.15)}#ccRoom .cc-chipbtn .cci{width:17px;height:17px}
#ccRoom .cc-primary{display:inline-flex;align-items:center;gap:9px;background:var(--glow);color:#0c1a12;border:0;border-radius:99px;padding:13px 28px;font-weight:600;font-size:1rem;cursor:pointer;box-shadow:0 10px 26px rgba(155,224,180,.25)}#ccRoom .cc-primary:hover{filter:brightness(1.07);transform:translateY(-1px)}
#ccRoom .cc-meter{height:7px;border-radius:5px;background:#101812;overflow:hidden;margin:10px 0 4px}#ccRoom .cc-meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,#4f9e6d,var(--glow));transition:width .08s}
#ccRoom .cc-diag{list-style:none;padding:0;margin:10px 0 14px;display:flex;flex-wrap:wrap;gap:6px}#ccRoom .cc-diag li{display:inline-flex;align-items:center;gap:7px;font-size:.74rem;background:rgba(255,255,255,.06);border-radius:99px;padding:4px 11px}
#ccRoom .cc-diag li i{width:8px;height:8px;border-radius:50%;background:var(--mut)}#ccRoom .cc-diag li.ok i{background:#5fd18a}#ccRoom .cc-diag li.bad i{background:var(--red)}#ccRoom .cc-diag li.wait i{animation:cc-blink 1s infinite}
@keyframes cc-blink{50%{opacity:.25}}
#ccRoom .cc-pre-go{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
#ccRoom .cc-note{border-radius:12px;padding:10px 14px;font-size:.86rem;margin:6px 0 8px}#ccRoom .cc-note.warn{background:rgba(224,169,59,.14);color:#fbe6b0;border:1px solid rgba(224,169,59,.35)}
#ccRoom .cc-status{margin:auto;text-align:center;max-width:420px;padding:36px 30px;background:var(--panel);border:1px solid var(--line);border-radius:26px;animation:cc-rise .3s}
#ccRoom .cc-status h2{font-family:var(--serif);font-weight:400;font-size:1.7rem;margin:14px 0 6px}#ccRoom .cc-status p{color:var(--mut);margin:0 0 18px}
#ccRoom .cc-spin{display:flex;justify-content:center;gap:7px;height:20px}#ccRoom .cc-spin i{width:11px;height:11px;border-radius:50%;background:var(--glow);animation:cc-bounce 1.1s ease-in-out infinite}#ccRoom .cc-spin i:nth-child(2){animation-delay:.15s}#ccRoom .cc-spin i:nth-child(3){animation-delay:.3s}
@keyframes cc-bounce{0%,80%,100%{transform:translateY(0);opacity:.5}40%{transform:translateY(-9px);opacity:1}}
/* small screens: the panel becomes a sheet and controls tighten */
@media(max-width:760px){
  #ccRoom .cc-main{padding:0 8px;position:relative}
  #ccRoom .cc-side{position:absolute;inset:0 8px 0 8px;width:auto;z-index:10;border-radius:18px}
  #ccRoom .cc-bar{gap:6px;padding:7px 9px}#ccRoom .cc-ctl{width:44px;height:44px}#ccRoom .cc-ctl.hang{width:54px}#ccRoom .cc-ctl .cci{width:20px;height:20px}#ccRoom .cc-sep{display:none}
  #ccRoom .cc-top{padding:10px 12px}#ccRoom .cc-badge span{display:none}#ccRoom .cc-badge{padding:7px}
  #ccRoom .cc-knocks{top:52px}
}
@media(max-width:400px){#ccRoom .cc-ctl{width:40px;height:40px}#ccRoom .cc-bar{gap:4px}}
.cc-reduce *,.cc-reduce{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){#ccRoom *{animation:none!important;transition:none!important}}