/* 4.4 UI modes: full / mini / floating (see modules/ui-modes.js) */
:root{--sc-bubble-size:72px;--sc-bubble-right:16px;--sc-bubble-bottom:calc(140px + env(safe-area-inset-bottom,0px))}

/* mode switch on Home */
.sc-mode-switch{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:2px auto 8px}
.sc-mode-btn{appearance:none;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;padding:6px 12px;min-height:36px;font-size:.85rem;cursor:pointer}
.sc-mode-btn[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}

/* MINI: small Secret at the top, compact heading, more room for the chat */
body.ui-mini.sc-home #view h1{font-size:1.15rem;margin:.2rem 0}

/* FLOATING: Secret's own living body becomes a round bubble, on every in-app page */
body.ui-floating.sc-inapp .stage,
body.ui-floating.sc-inapp .stage.small,
body.ui-floating.sc-inapp .stage.hidden-stage{
  display:block;position:fixed;right:var(--sc-bubble-right);bottom:var(--sc-bubble-bottom);
  width:var(--sc-bubble-size);margin:0;border-radius:50%;overflow:hidden;background:#000;
  border:1px solid #1e3550;box-shadow:0 6px 24px rgba(0,0,0,.65),0 0 18px rgba(95,227,240,.18);
  z-index:6;transition:none}
body.ui-floating.sc-inapp.sc-listening .stage{border-color:var(--gold);box-shadow:0 6px 24px rgba(0,0,0,.65),0 0 22px rgba(255,199,102,.45)}
.sc-bubble-hit{display:none}
body.ui-floating.sc-inapp .sc-bubble-hit{
  display:block;position:fixed;right:var(--sc-bubble-right);bottom:var(--sc-bubble-bottom);
  width:var(--sc-bubble-size);height:var(--sc-bubble-size);border-radius:50%;border:0;padding:0;
  background:transparent;z-index:7;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.sc-bubble-hit.dragging{cursor:grabbing}
/* the in-flow space the big stage used is gone, so give the Home heading a little air */
body.ui-floating.sc-inapp.sc-home #view h1{margin-top:1rem}
/* keep the live voice transcript clear of the bubble */
body.ui-floating.sc-inapp .sc-voice-live{left:16px;transform:none;width:calc(100% - 120px)}