/* One Ask conversation, with a full-screen voice presence and shared transcript. */
body.presence-open { overflow: hidden; }
html:has(body.presence-open) { overflow: hidden; }
body.presence-open #app-view { visibility: hidden; }
#ask-voice { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
#ask-voice svg { width: 20px; height: 20px; }
:root[data-theme] body#sam-app #voice-presence {
  box-sizing: border-box; position: fixed; inset: 0; margin: 0;
  width: 100%; max-width: none; height: 100dvh; max-height: none;
  padding: max(20px, env(safe-area-inset-top)) 20px max(37px, env(safe-area-inset-bottom));
  border: 0; border-radius: 0; background: var(--sam-color-canvas, #F7F4EE);
  color: var(--sam-color-text); overflow: hidden;
  visibility: visible;
  grid-template-rows: auto minmax(0, 1fr) auto auto minmax(0, auto) auto;
  gap: 0; font-family: var(--font-body, "Instrument Sans", sans-serif);
}
#voice-presence[open] { display: grid; }
#voice-presence:not([open]) { display: none !important; }
#voice-presence::backdrop { background: var(--sam-color-canvas, #F7F4EE); }
#voice-presence [hidden] { display: none !important; }
:root[data-theme] body#sam-app #voice-presence button {
  min-width: 44px; min-height: 44px; margin: 0; padding: 8px;
  font: inherit; font-size: 1rem; line-height: 1.3; text-transform: none;
  letter-spacing: normal; cursor: pointer; touch-action: manipulation;
}
#voice-presence button:focus-visible, #voice-presence input:focus-visible { outline: 3px solid #6862b6; outline-offset: 4px; }
:root[data-theme] body#sam-app #voice-presence svg { width: 24px; height: 24px; flex-shrink: 0; }
:root[data-theme] body#sam-app #voice-presence .presence-circle {
  display: grid; place-items: center; flex: 0 0 49px; width: 49px; height: 49px;
  border-radius: 50%; border: 1px solid #deddda; background: #fff; color: #171719;
  box-shadow: 0 3px 14px #27232704;
}
#voice-presence .presence-utilities { grid-row:1; display: flex; justify-content: space-between; align-items: center; }
#presence-menu svg path:first-child { transform: translateY(3px); }
#presence-menu svg path:nth-child(2) { transform-origin: 4px 12px; transform: translateY(3px) scaleX(.625); }
#presence-menu svg path:last-child { display: none; }
:root[data-theme] body#sam-app #voice-presence .presence-utility { width: 46px; height: 46px; }
#voice-presence .presence-stage { grid-row:4; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:0; padding:16px 0 8px; background:transparent; }
#presence-orb { --orb-size: 168px; --orb-speed: 1; --orb-color-from: #818cf8; --orb-color-to: #22d3ee; flex-shrink:0; opacity:1; pointer-events:none; }
#voice-presence #presence-state { margin: 18px 0 0; font-size: .875rem; line-height: 1.5; color: var(--sam-color-text-secondary); }
#voice-presence #presence-state[data-label-hidden="true"] { position: absolute; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }
#voice-presence #presence-detail { max-width: 34rem; margin: 8px 0 0; text-align: center; font-size: .875rem; line-height: 1.5; }
#voice-presence #presence-detail:empty { display: none; }
#voice-presence #presence-retry { margin-top: 12px; background: #fff; border: 1px solid #deddda; border-radius: 22px; color: #252329; }
#voice-presence .presence-transcript { grid-area:2 / 1; position:relative; z-index:1; width: min(100%, 640px); justify-self: center; min-height: 0; overflow-y: auto; overflow-anchor:none; overscroll-behavior: contain; scrollbar-width: thin; padding: 12px 4px 20px; scroll-padding: 16px; background:transparent; }
#voice-presence .presence-transcript:has(.ask-empty-state):not(:has(.transcript-entry, .chat-bubble, .ask-answer-card)) { padding: 0; }
:root[data-theme] body#sam-app #voice-presence #chat-messages { display: flex; flex-direction: column; gap: 18px; height: auto; min-height: 0; max-height: none; overflow: visible; margin: 0; padding: 0; background: none; border: 0; box-shadow: none; }
#voice-presence .ask-empty-state { display: none; }
:root[data-theme] body#sam-app #voice-presence :is(.transcript-entry, .chat-bubble, .ask-answer-card) { width: 100%; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; color: var(--sam-color-text); font-size: 1rem; line-height: 1.65; }
#voice-presence .transcript-entry p { margin: 4px 0; }
#voice-presence .speaker { display: block; font-size: .75rem; font-weight: 600; letter-spacing: .02em; color: var(--sam-color-text-secondary); }
#voice-presence .transcript-entry.user, #voice-presence .chat-bubble.user { padding-left: 24px; border-left: 2px solid #bdb6cf; }
#voice-presence .presence-interim { margin: 16px 0 0; padding-left: 24px; border-left: 2px solid #bdb6cf; color: var(--sam-color-text-secondary); font-size: 1rem; line-height: 1.65; }
#voice-presence .ask-source-link { font-size: .75rem; color: var(--sam-color-text-secondary); }
:root[data-theme] body#sam-app #voice-presence [data-written-only="true"], :root[data-theme] body#sam-app #voice-presence .presence-readable-card { padding: 16px; border: 1px solid var(--sam-color-border, #c5becd); border-radius: 12px; background: var(--sam-color-surface, #fff); }
#voice-presence #presence-follow { grid-row:3; justify-self: center; color: var(--sam-color-text); background: transparent; border: 0; text-decoration: underline; }
#voice-presence .presence-bottom { grid-row:6; width: min(100%, 365px); justify-self: center; display: flex; align-items: center; gap: 7px; padding-top: 12px; }
#voice-presence .presence-composer { display: flex; align-items: center; flex: 1; min-width: 0; min-height: 49px; border-radius: 999px; border: 1px solid #deddda; background: #ffffffd9; box-shadow: 0 3px 16px #27232704; }
:root[data-theme] body#sam-app #voice-presence .presence-composer button { border: 0; background: transparent; color: #202024; padding: 0; border-radius: 999px; flex-shrink: 0; }
:root[data-theme] body#sam-app #voice-presence #presence-type { flex: 1; text-align: left; color: #737177; white-space: normal; font-size: 1.05rem; }
#presence-mark img { display: block; margin: auto; object-fit: contain; }
:root[data-theme] body#sam-app #voice-presence .presence-end { background: #131315; color: #fff; border-color: #343437; }
#presence-mute .presence-mic-off { display: none; }
#presence-mute[aria-pressed="true"] .presence-mic-on { display: none; }
#presence-mute[aria-pressed="true"] .presence-mic-off { display: block; }
:root[data-theme] body#sam-app #voice-presence #presence-mute[aria-pressed="true"] { background: #e9e4f3; border: 2px solid #756986; }
#voice-presence button:disabled { opacity: .5; cursor: default; }
#voice-presence #presence-typing { grid-row:5; width: min(100%, 640px); justify-self: center; min-height:0; max-height:50dvh; overflow-y:auto; padding-top: 8px; }
#voice-presence .presence-typing-heading { display: flex; justify-content: space-between; align-items: center; font-size: .875rem; }
#presence-hide-typing { border: 0; background: transparent; color: inherit; }
:root[data-theme] body#sam-app #voice-presence #chat-form { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
#voice-presence #chat-form > label { position: absolute; clip-path: inset(50%); }
:root[data-theme] body#sam-app #voice-presence #chat-input { min-height: 49px; max-height: 16dvh; height: 3.3rem; resize: none; padding: 12px; font-size: 1rem; }
:root[data-theme] body#sam-app #voice-presence .ask-composer-row { display: flex; flex-direction: row; align-items: stretch; gap: 8px; }
#voice-presence .ask-composer-row textarea { flex: 1; min-width: 0; }
#voice-presence .ask-composer-row button { width: auto; flex: 0 0 auto; }
#voice-presence:has(#presence-typing:not([hidden])) .presence-stage { display:block; padding:4px 0; max-height:20dvh; overflow-y:auto; text-align:center; }
#voice-presence:has(#presence-typing:not([hidden])) #presence-orb { display:none; }
#voice-presence:has(#presence-typing:not([hidden])) #presence-state { margin:0; }
:root[data-theme] body#sam-app #voice-presence .ask-composer-controls { display:flex; align-items:center; gap:8px; margin:8px 0 0; }
#voice-presence .ask-composer-controls #ask-voice { display:none; }
#voice-presence .ask-composer-controls .ask-send { margin-left:auto; }
#voice-presence .presence-sheet { position: absolute; z-index: 3; top: max(80px, calc(env(safe-area-inset-top) + 60px)); right: 20px; left: 20px; width: min(calc(100% - 40px), 400px); max-height: calc(100% - 180px); overflow-y: auto; padding: 18px; border: 1px solid var(--sam-color-border, #ddd8e1); border-radius: 20px; background: var(--sam-color-surface, #fff); box-shadow: 0 12px 40px #251d3220; }
#voice-presence #presence-settings { left: auto; }
#voice-presence .presence-attachment-sheet { top: auto; bottom: max(106px, calc(env(safe-area-inset-bottom) + 80px)); left: 50%; transform: translateX(-50%); }
#voice-presence .presence-sheet header { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
#voice-presence .presence-sheet h2 { margin: 0; font-size: 1.05rem; }
#voice-presence .presence-sheet button { background: transparent; border: 0; border-radius: 8px; color: var(--sam-color-text); text-align: left; }
#voice-presence .presence-sheet > button { display: flex; align-items: center; gap: 12px; width: 100%; }
#voice-presence .presence-sheet input[type="range"] { width: 100%; min-height: 44px; accent-color: #7263a7; }
#voice-presence .presence-check { display: flex; align-items: center; gap: 12px; min-height: 48px; font-size: 1rem; }
#voice-presence .presence-check input { flex: 0 0 44px; min-width: 44px; min-height: 44px; width: 44px; height: 44px; accent-color: #7263a7; }
#voice-presence .presence-note { font-size: .875rem; line-height: 1.55; color: var(--sam-color-text-secondary); }
#voice-presence[data-reading="true"] #presence-orb,
#voice-presence:has(.presence-transcript :is(.transcript-entry, .chat-bubble, .ask-answer-card, .presence-interim:not([hidden]))) #presence-orb { opacity:.55; }
#voice-presence[data-reading="true"] .presence-transcript { max-height: none; }
@media (max-height: 600px) {
  :root[data-theme] body#sam-app #voice-presence { padding-top: 10px; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
  #voice-presence .presence-stage { display:grid; grid-template-columns:88px minmax(0, 1fr); align-content:center; gap:4px 16px; padding:6px 0; max-height:max(100px, 34dvh); overflow-y:auto; }
  #presence-orb { --orb-size: 88px; }
  #voice-presence .presence-stage #presence-orb { grid-column:1; grid-row:1 / span 3; }
  #voice-presence #presence-state { margin: 0; grid-column: 2; text-align: left; }
  #voice-presence #presence-detail { max-width: none; margin: 0; grid-column: 2; text-align: left; }
  #voice-presence #presence-retry { grid-column: 2; }
  #voice-presence .presence-transcript { padding: 4px 0; }
  #voice-presence .presence-sheet { top: 62px; max-height: calc(100% - 80px); }
  #voice-presence[data-typing="true"] .presence-transcript { max-height: none; }
}
@media (max-width: 359px) {
  :root[data-theme] body#sam-app #voice-presence { padding-inline: 12px; }
  #voice-presence .presence-bottom { gap: 6px; }
  :root[data-theme] body#sam-app #voice-presence #presence-type { font-size: .875rem; }
}
@media (prefers-reduced-motion: reduce) {
  #voice-presence *, #voice-presence *::before, #voice-presence *::after { scroll-behavior: auto !important; transition: none !important; }
}
