/* Fullscreen is progressive enhancement; the page-sized mode always works. */
#open-avatar-mode { min-height:44px; padding:8px 12px; border:1px solid #51463b; border-radius:22px; background:#24221f; color:#f0d8c2; white-space:nowrap; font-size:12px; }
.topbar-actions { display:flex; align-items:center; gap:12px; }
body.avatar-mode-open { overflow:hidden; background:#000; }
body.avatar-mode-open #bridge { visibility:hidden; }
#avatar-mode { position:fixed; z-index:80; left:0; right:0; top:var(--avatar-top,0px); height:var(--avatar-height,100dvh); background:#000; color:#e8e8e8; display:flex; flex-direction:column; overflow:hidden; padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); }
#avatar-mode[hidden] { display:none; }
#avatar-mode:fullscreen { top:0; height:100dvh; }
.avatar-top { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-shrink:0; }
#avatar-mode button { min-height:44px; border-radius:24px; padding:9px 15px; background:#171717; color:#ddd; border:1px solid #303030; font-size:13px; }
#avatar-mode button:hover { background:#232323; }
#avatar-mode button:focus-visible { outline:2px solid #e7b88f; outline-offset:3px; }
#avatar-mode button:disabled { opacity:.4; }
#avatar-identity { font-size:12px; letter-spacing:2px; color:#7f7f7f; }
#living-avatar { flex:1; min-height:0; display:grid; place-items:center; width:100%; overflow:hidden; }
.living-avatar-art { display:block; width:min(90vw,calc(var(--avatar-height,100dvh) * .73),760px); height:100%; max-height:100%; object-fit:contain; aspect-ratio:1; }
#living-avatar svg { stroke:none; stroke-width:1; }
#living-avatar[data-state="error"] { filter:saturate(.5); }
.avatar-bottom { flex-shrink:0; width:min(100%,680px); margin:0 auto; text-align:center; }
#avatar-status { min-height:22px; font-size:12px; color:#b2b2b2; line-height:1.5; margin:4px 0 10px; }
.avatar-controls { display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; }
#avatar-mode #avatar-speak { min-width:140px; min-height:58px; background:#e6d2be; color:#211a14; font-size:17px; font-weight:600; border:0; }
#avatar-mode #avatar-speak[aria-pressed="true"] { background:#cd5c4c; color:#fff; }
.avatar-small-controls { display:flex; justify-content:center; gap:8px; margin-top:8px; }
#avatar-mode .avatar-small-controls button { font-size:11px; color:#8d8d8d; border-color:transparent; background:transparent; }
#avatar-asset-note { font-size:10px; color:#6e6e6e; margin-top:6px; line-height:1.4; }
#avatar-text-panel { max-height:min(48vh,calc(var(--avatar-height,100dvh) - 210px)); overflow:auto; text-align:left; margin-bottom:10px; padding:12px; border:1px solid #292929; border-radius:18px; background:#0d0d0d; }
.avatar-text-heading { display:flex; align-items:center; justify-content:space-between; font-size:12px; color:#999; }
.avatar-text-heading span { min-width:0; overflow-wrap:anywhere; }
#avatar-transcript { font-size:14px; line-height:1.6; max-height:16vh; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; margin:8px 0; }
#avatar-mode .composer-area { padding:0; }
#avatar-mode .composer { background:#151515; border-color:#393939; box-shadow:none; }
#avatar-mode .composer textarea { font-size:16px; }
#avatar-mode .composer-note { display:none; }
#avatar-mode #voice-record, #avatar-mode #choose-context { display:none; }
#avatar-mode #speech-player { max-width:100%; }
#avatar-mode .composer-tools>span { font-size:10px; }
.avatar-typing #living-avatar { min-height:0; }
@media(max-width:700px) { .topbar-actions { gap:6px; } #open-avatar-mode { font-size:10px; padding:8px 10px; } .topbar-actions .runtime-badge { display:none; } }
@media(orientation:landscape) and (max-height:550px) {
  #avatar-mode { padding-top:max(5px,env(safe-area-inset-top)); padding-bottom:max(5px,env(safe-area-inset-bottom)); }
  .avatar-top { position:absolute; top:max(5px,env(safe-area-inset-top)); left:max(10px,env(safe-area-inset-left)); right:max(10px,env(safe-area-inset-right)); z-index:1; }
  #avatar-identity { display:none; }
  #living-avatar { padding-bottom:94px; }
  .living-avatar-art { width:min(70vw,calc(var(--avatar-height,100dvh) * .9)); }
  .avatar-bottom { position:absolute; bottom:max(5px,env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); width:min(94%,680px); }
  #avatar-status { margin:0 0 4px; }
  #avatar-mode #avatar-speak { min-height:46px; }
  .avatar-small-controls { margin-top:0; }
  .avatar-typing .avatar-top { position:relative; top:auto; left:auto; right:auto; }
  .avatar-typing #living-avatar { display:none; }
  .avatar-typing .avatar-bottom { position:relative; bottom:auto; left:auto; transform:none; margin:auto auto 0; min-height:0; max-height:calc(100% - 52px); display:flex; flex-direction:column; }
  .avatar-typing #avatar-text-panel { flex:1; min-height:0; max-height:none; }
}
@media(prefers-reduced-motion:reduce) { #living-avatar * { animation:none!important; transition:none!important; } }

/* M006 Android keyboard: prioritize the composer within the visual viewport. */
#avatar-mode.avatar-keyboard-open { padding-top:4px; padding-bottom:4px; }
#avatar-mode.avatar-keyboard-open .avatar-top,
#avatar-mode.avatar-keyboard-open #living-avatar,
#avatar-mode.avatar-keyboard-open #avatar-status,
#avatar-mode.avatar-keyboard-open .avatar-controls,
#avatar-mode.avatar-keyboard-open .avatar-small-controls,
#avatar-mode.avatar-keyboard-open #avatar-asset-note { display:none; }
#avatar-mode.avatar-keyboard-open .avatar-bottom { flex:1; min-height:0; display:flex; flex-direction:column; justify-content:flex-end; }
#avatar-mode.avatar-keyboard-open #avatar-text-panel { display:flex; flex-direction:column; min-height:0; max-height:100%; overflow:auto; }
#avatar-mode.avatar-keyboard-open #avatar-composer-host { flex-shrink:0; }
#avatar-mode.avatar-keyboard-open #avatar-transcript { max-height:18vh; overflow:auto; }
#avatar-mode.avatar-keyboard-open .composer-area { flex-shrink:0; }