.mobile-touch-hint{display:none}
@media (max-width:760px) and (pointer:coarse){
  body[data-live=true]{background:#050505;overflow:hidden}
  body[data-live=true] .stage{display:block;max-width:none;min-height:100dvh;padding:0;margin:0}
  body[data-live=true] .screen,body[data-mode=girlfriend][data-live=true] .screen{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;aspect-ratio:auto!important;border-radius:0;background:#050505;box-shadow:none;z-index:1;user-select:none;-webkit-user-select:none;transition:transform .38s cubic-bezier(.18,1.35,.3,1),border-radius .38s cubic-bezier(.18,1.35,.3,1),box-shadow .38s ease}
  body[data-live=true] .screen video,body[data-mode=girlfriend][data-live=true] .screen video{width:100%;height:100%;object-fit:cover}
  body[data-live=true] .screen[data-ratio="16:9"] video,body[data-live=true] .screen[data-ratio="1:1"] video{object-fit:contain}
  body[data-mobile-touch=holding] .screen,body[data-mode=girlfriend][data-mobile-touch=holding] .screen{transform:scale(.965);border-radius:22px;box-shadow:0 0 0 1px #ffffff24,0 24px 60px #000c;transition-duration:.24s}
  body[data-live=true] .screen .preview-label{display:none}
  body[data-live=true] .masthead,body[data-mode=girlfriend][data-live=true] .masthead{position:fixed;top:0;left:0;right:0;z-index:4;height:auto;min-height:calc(70px + env(safe-area-inset-top));padding:calc(18px + env(safe-area-inset-top)) 20px 12px;border:0;background:linear-gradient(#000a,transparent);pointer-events:none}
  body[data-live=true] .masthead .brand{display:none}
  body[data-live=true] .masthead nav{pointer-events:auto;gap:9px}
  body[data-live=true] .connection,body[data-mode=girlfriend][data-live=true] .connection{position:static;margin:0 4px 0 0;font-size:9px;letter-spacing:.8px;color:#f4f3ef}
  body[data-live=true] #micToggle,body[data-live=true] #fullscreen{display:none}
  body[data-live=true] #soundToggle,body[data-live=true] #settingsToggle{position:relative;width:36px;height:36px;border:1px solid #ffffff38;background:#0007;backdrop-filter:blur(14px)}
  body[data-live=true] #soundToggle[aria-pressed=true]::after{content:'';position:absolute;width:22px;height:1.5px;border-radius:2px;background:#fff;transform:rotate(-43deg);box-shadow:0 0 2px #000}
  body[data-live=true] .voice-stage,body[data-mode=girlfriend][data-live=true] .voice-stage{position:fixed;inset:0;z-index:3;width:100%;min-width:0;max-width:none;padding:0;margin:0;pointer-events:none;text-align:center}
  body[data-live=true] .companion-heading,body[data-live=true] .voice-stage>.privacy,body[data-live=true] #status,body[data-live=true] .conversation-starters{display:none}
  body[data-live=true] .transcript-state,body[data-mode=girlfriend][data-live=true] .transcript-state{position:absolute;left:24px;right:24px;bottom:calc(38dvh + env(safe-area-inset-bottom));margin:0;color:#fff9;font-size:10px;font-weight:600;letter-spacing:1.1px;text-shadow:0 2px 10px #000;text-transform:none}
  body[data-live=true] .transcript,body[data-mode=girlfriend][data-live=true] .transcript,body[data-live=true] .transcript[data-long=true]{position:absolute;left:8vw;right:8vw;bottom:calc(23dvh + env(safe-area-inset-bottom));max-height:14dvh;min-height:0;margin:0;color:#fff;font-family:"PingFang SC","Hiragino Sans",Arial,sans-serif;font-size:clamp(23px,6.4vw,34px);font-weight:600;line-height:1.35;letter-spacing:-.4px;text-shadow:0 2px 24px #000e,0 0 4px #000b;overflow:auto;text-wrap:balance}
  body[data-live=true] .mobile-touch-hint{display:none}
  body[data-live=true] .voice-pill,body[data-mode=girlfriend][data-live=true] .voice-pill{position:fixed;left:50%;right:auto;bottom:calc(32px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:10px;width:176px;min-width:176px;height:64px;min-height:64px;padding:0 20px;margin:0;border:1px solid #ffffffa3;border-radius:999px;background:radial-gradient(ellipse at 50% 0%,#ffffff35,#2a2628e8 62%,#171519f2);box-shadow:0 0 0 4px #ffffff14,0 14px 34px #000b,inset 0 1px 1px #ffffff4a;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);pointer-events:auto;touch-action:none;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none;transform:translateX(-50%);transition:transform .36s cubic-bezier(.18,1.35,.3,1),box-shadow .25s ease,background .25s ease}
  body[data-live=true] .voice-pill::after{content:attr(data-hint);position:static;transform:none;white-space:nowrap;color:#fffd;font-size:13px;font-weight:650;letter-spacing:.04em;text-shadow:0 2px 10px #000}
  body[data-mobile-touch=holding] .voice-pill{transform:translateX(-50%) translateY(3px) scale(.95);box-shadow:0 0 0 7px #ffffff29,0 6px 20px #000b,inset 0 2px 7px #0007;background:radial-gradient(ellipse at 50% 20%,#f5d9e077,#5a3c48f0 68%,#30202bef)}
  body[data-live=true] .voice-pill .voice-copy,body[data-live=true] .voice-pill .voice-badge{display:none}
  body[data-live=true] .voice-pill .wave{width:28px;height:32px;flex:none}
  body[data-live=true] #retryVoice:not([hidden]){position:fixed;bottom:calc(90px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);padding:8px 14px;border-radius:20px;background:#000b;pointer-events:auto}
  body[data-live=true] .stage-actions,body[data-mode=girlfriend][data-live=true] .stage-actions{position:fixed;inset:auto 0 calc(48px + env(safe-area-inset-bottom));display:block;margin:0;pointer-events:none}
  body[data-live=true] .stage-actions #start{display:none}
  body[data-live=true] .stage-actions button,body[data-mode=girlfriend][data-live=true] .stage-actions button{position:fixed;bottom:calc(48px + env(safe-area-inset-bottom));width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border:1px solid #ffffff6b;border-radius:50%;background:#111a;color:transparent;font-size:0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);pointer-events:auto}
  body[data-live=true] .stage-actions #stop{left:24px;border-color:#e6adb35c}
  body[data-live=true] .stage-actions #stop::after{content:'×';color:#f2cbcf;font:300 31px/1 Arial,sans-serif}
  body[data-live=true] .stage-actions #keyboardToggle{right:24px;left:auto}
  body[data-live=true] .stage-actions #keyboardToggle::after{content:'Aa';color:#fff;font:600 15px/1 Arial,sans-serif;letter-spacing:-.04em}
  body[data-live=true] #directionForm:not([hidden]){position:fixed;left:14px;right:14px;bottom:calc(82px + env(safe-area-inset-bottom));width:auto;padding:0;margin:0;pointer-events:auto}
  body[data-live=true] #directionForm .command{margin:0;background:#101010e8;backdrop-filter:blur(16px)}
  body[data-live=true] .footer{display:none}
  body[data-live=true] .screen .resume{display:none}
}
@media (max-width:760px) and (pointer:coarse) and (prefers-reduced-motion:reduce){body[data-live=true] .screen,body[data-live=true] .voice-pill{transition:none}}
@media (max-width:760px) and (pointer:coarse){
  /* iOS Safari zooms the entire visual viewport when a focused field is below 16px. */
  body #directionForm .command textarea,
  body dialog input,
  body dialog textarea,
  body dialog select{font-size:16px}
  body:not([data-live=true]){background:#050505;overflow:hidden}
  body:not([data-live=true]) .stage,body[data-mode=girlfriend]:not([data-live=true]) .stage{display:block;max-width:none;min-height:100dvh;padding:0;margin:0}
  body:not([data-live=true]) .screen,body[data-mode=girlfriend]:not([data-live=true]) .screen{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;aspect-ratio:auto!important;border-radius:0;background:#050505;box-shadow:none;z-index:1}
  body:not([data-live=true]) .screen video,body[data-mode=girlfriend]:not([data-live=true]) .screen video{width:100%;height:100%;object-fit:cover}
  body:not([data-mode=girlfriend]) .screen[data-call-phase=idle]:not([data-user-image=true]) .default-director-poster{display:block}
  body:not([data-live=true]) .screen .preview-label{display:none}
  body:not([data-live=true]) .masthead,body[data-mode=girlfriend]:not([data-live=true]) .masthead{position:fixed;top:0;left:0;right:0;z-index:4;height:auto;min-height:calc(70px + env(safe-area-inset-top));padding:calc(18px + env(safe-area-inset-top)) 20px 12px;border:0;background:linear-gradient(#000a,transparent);pointer-events:none}
  body:not([data-live=true]) .masthead .brand{font-size:20px;letter-spacing:-.5px;pointer-events:auto}
  body:not([data-live=true]) .masthead nav{pointer-events:auto;gap:9px}
  body:not([data-live=true]) .connection,body[data-mode=girlfriend]:not([data-live=true]) .connection{position:static;margin:0 4px 0 0;font-size:9px;letter-spacing:.8px;color:#f4f3ef}
  body:not([data-live=true]) #clock,body:not([data-live=true]) #micToggle,body:not([data-live=true]) #fullscreen{display:none}
  body:not([data-live=true]) #soundToggle,body:not([data-live=true]) #settingsToggle{width:36px;height:36px;border:1px solid #ffffff38;background:#0007;backdrop-filter:blur(14px)}
  body:not([data-live=true]) .voice-stage,body[data-mode=girlfriend]:not([data-live=true]) .voice-stage{position:fixed;inset:0;z-index:3;width:100%;min-width:0;max-width:none;padding:0;margin:0;pointer-events:none;text-align:center}
  body:not([data-live=true]) .voice-stage>.privacy,body:not([data-live=true]) #status,body:not([data-live=true]) .conversation-starters{display:none}
  body:not([data-live=true]) .caption-stack[data-phase=ended]{display:none}
  body:not([data-live=true]) .caption-stack[data-phase=idle]{display:none}
  body:not([data-live=true]) .transcript-state,body[data-mode=girlfriend]:not([data-live=true]) .transcript-state{position:absolute;left:24px;right:24px;bottom:calc(38dvh + env(safe-area-inset-bottom));margin:0;color:#fff9;font-size:10px;font-weight:600;letter-spacing:1.1px;text-shadow:0 2px 10px #000;text-transform:none}
  body:not([data-live=true]) .transcript,body[data-mode=girlfriend]:not([data-live=true]) .transcript{position:absolute;left:8vw;right:8vw;bottom:calc(23dvh + env(safe-area-inset-bottom));max-height:14dvh;min-height:0;margin:0;color:#fff;font-family:"PingFang SC","Hiragino Sans",Arial,sans-serif;font-size:clamp(23px,6.4vw,34px);font-weight:600;line-height:1.35;letter-spacing:-.4px;text-shadow:0 2px 24px #000e,0 0 4px #000b;overflow:auto;text-wrap:balance}
  body[data-mode=girlfriend]:not([data-live=true]) .companion-heading{position:fixed;top:calc(84px + env(safe-area-inset-top));left:22px;right:22px;display:block;margin:0;pointer-events:auto;text-align:left}
  body[data-mode=girlfriend]:not([data-live=true]) .companion-heading h1{font-size:34px;color:#fff;text-shadow:0 2px 12px #000;margin:0}
  body[data-mode=girlfriend]:not([data-live=true]) .back-to-director{display:block;position:absolute;right:0;top:4px;padding:8px 11px;border:1px solid #ffffff6b;border-radius:20px;background:#1515159c;color:#fff;font-size:11px;pointer-events:auto;backdrop-filter:blur(12px)}
  body[data-mode=girlfriend]:not([data-live=true]) .companion-heading p{display:none}
  body:not([data-live=true]) .voice-pill,body[data-mode=girlfriend]:not([data-live=true]) .voice-pill{display:none}
  body:not([data-live=true]) .voice-pill .voice-copy,body:not([data-live=true]) .voice-pill .voice-badge{display:none}
  body:not([data-live=true]) .voice-pill .wave{width:32px;height:32px}
  body:not([data-live=true])[data-keyboard-open=true] .voice-pill{display:none}
  body:not([data-live=true]) .stage-actions,body[data-mode=girlfriend]:not([data-live=true]) .stage-actions{position:fixed;inset:auto 0 calc(32px + env(safe-area-inset-bottom));display:block;margin:0;pointer-events:none}
  body:not([data-live=true]) .stage-actions #stop{display:none}
  body:not([data-live=true]) .stage-actions #start,body[data-mode=girlfriend]:not([data-live=true]) .stage-actions #start{position:fixed;left:50%;right:auto;bottom:calc(32px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:10px;width:176px;min-width:176px;height:64px;min-height:64px;padding:0 18px;margin:0;border:1px solid #ffffffa3;border-radius:999px;background:radial-gradient(ellipse at 50% 0%,#ffffff35,#2a2628e8 62%,#171519f2);color:#fff;font-size:14px;font-weight:650;letter-spacing:.04em;text-align:center;box-shadow:0 0 0 4px #ffffff14,0 14px 34px #000b,inset 0 1px 1px #ffffff4a;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);pointer-events:auto;touch-action:manipulation;transform:translateX(-50%);transition:transform .36s cubic-bezier(.18,1.35,.3,1),box-shadow .25s ease,background .25s ease}
  body:not([data-live=true]) .stage-actions #start::before{content:'';width:10px;height:10px;flex:none;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #ffffff26,0 0 13px #fff8}
  body[data-mode=girlfriend]:not([data-live=true]) .stage-actions #start{border-color:#f4bfc999;color:#fff}
  body[data-mode=girlfriend]:not([data-live=true]) .stage-actions #start::before{background:#ffd2dd;box-shadow:0 0 0 4px #f8a7c13d,0 0 13px #ffc3d3}
  body:not([data-live=true]) .stage-actions #start:disabled{opacity:.88}
  body:not([data-live=true]) .stage-actions #start:active:not(:disabled){transform:translateX(-50%) translateY(3px) scale(.95);box-shadow:0 0 0 7px #ffffff29,0 6px 20px #000b,inset 0 2px 7px #0007}
  body:not([data-live=true]) .stage-actions #keyboardToggle,body[data-mode=girlfriend]:not([data-live=true]) .stage-actions #keyboardToggle{position:fixed;right:24px;bottom:calc(42px + env(safe-area-inset-bottom));display:grid;place-items:center;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border:1px solid #ffffff6b;border-radius:50%;background:#0009;color:transparent;font-size:0;backdrop-filter:blur(14px);pointer-events:auto}
  body:not([data-live=true]) .stage-actions #keyboardToggle::after{content:'Aa';color:#fff;font:600 15px/1 Arial,sans-serif;letter-spacing:-.04em}
  body:not([data-live=true]) #directionForm:not([hidden]){position:fixed;left:14px;right:14px;bottom:calc(92px + env(safe-area-inset-bottom));width:auto;padding:0;margin:0;pointer-events:auto}
  body:not([data-live=true]) #directionForm .command{margin:0;background:#101010e8;backdrop-filter:blur(16px)}
  body:not([data-live=true]) #retryVoice:not([hidden]){position:fixed;bottom:calc(160px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);padding:8px 14px;border-radius:20px;background:#000b;pointer-events:auto}
  body:not([data-live=true]) .footer{display:none}
}
@media (max-width:760px) and (pointer:coarse){
  body[data-mode=girlfriend][data-call-phase=dialing] .masthead{display:none}
  body[data-mode=girlfriend][data-call-phase=dialing] .voice-stage .companion-heading,
  body[data-mode=girlfriend][data-call-phase=dialing] .voice-stage .transcript-state,
  body[data-mode=girlfriend][data-call-phase=dialing] .voice-stage .transcript,
  body[data-mode=girlfriend][data-call-phase=dialing] .voice-stage .voice-pill,
  body[data-mode=girlfriend][data-call-phase=dialing] .voice-stage #keyboardToggle,
  body[data-mode=girlfriend][data-call-phase=dialing] .voice-stage #directionForm{display:none}
  body[data-mode=girlfriend][data-call-phase=dialing] .stage-actions #stop{display:grid;place-items:center;position:fixed;left:24px;right:auto;bottom:calc(42px + env(safe-area-inset-bottom));width:44px;min-width:44px;height:44px;min-height:44px;padding:0;margin:0;border:1px solid #f3b2bf88;border-radius:50%;background:#6d2637dd;color:transparent;font-size:0;transform:none;box-shadow:0 9px 26px #0008;pointer-events:auto}
  body[data-mode=girlfriend][data-call-phase=dialing] .stage-actions #stop::after{content:'×';color:#fff;font:300 35px/1 Arial,sans-serif}
  body[data-mode=girlfriend][data-call-phase=dialing] .call-hud{bottom:calc(30% + env(safe-area-inset-bottom));gap:9px}
  body[data-mode=girlfriend][data-call-phase=dialing] .call-hud strong{font-size:25px}
}
@media (max-width:760px) and (pointer:coarse){
  body:not([data-mode=girlfriend]):not([data-live=true]) .connection{display:none}
  body:not([data-mode=girlfriend]):not([data-live=true]) .mode-link{padding:8px 10px;font-size:11px;pointer-events:auto;background:#171717a8;backdrop-filter:blur(12px)}
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .masthead,
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .voice-stage .transcript-state,
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .voice-stage .transcript,
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .voice-stage #keyboardToggle,
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .voice-stage #directionForm{display:none}
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .stage-actions #stop{display:grid;place-items:center;position:fixed;left:24px;right:auto;bottom:calc(42px + env(safe-area-inset-bottom));width:44px;min-width:44px;height:44px;min-height:44px;padding:0;margin:0;border:1px solid #ffffff78;border-radius:50%;background:#222b;color:transparent;font-size:0;transform:none;pointer-events:auto}
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .stage-actions #stop::after{content:'×';color:#fff;font:300 35px/1 Arial,sans-serif}
  body:not([data-mode=girlfriend])[data-call-phase=dialing] .call-hud{bottom:calc(30% + env(safe-area-inset-bottom))}
  body[data-live=true] .connection,body[data-mode=girlfriend][data-live=true] .connection{display:flex;align-items:center;gap:6px;white-space:nowrap}
  body[data-live=true] #clock,body[data-mode=girlfriend][data-live=true] #clock{display:inline-block;margin-left:2px;padding-left:8px;border-left:1px solid #ffffff6b;color:#fff;font-size:10px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
  body[data-live=true] .caption-stack,body[data-mode=girlfriend][data-live=true] .caption-stack{position:fixed;left:50%;bottom:calc(154px + env(safe-area-inset-bottom));width:min(82vw,510px);max-height:min(27dvh,220px);display:flex;flex-direction:column;align-items:center;gap:5px;transform:translateX(-50%);pointer-events:none}
  body[data-live=true] .caption-stack[data-phase=idle]{display:none}
  body[data-mode=girlfriend][data-live=true] .caption-stack{left:auto;right:8vw;bottom:calc(150px + env(safe-area-inset-bottom));width:min(68vw,380px);transform:none;align-items:flex-end}
  body[data-mode=girlfriend][data-live=true] .reply-stack[data-phase=partial],
  body[data-mode=girlfriend][data-live=true] .reply-stack[data-phase=final],
  body[data-mode=girlfriend][data-live=true] .reply-stack[data-phase=error]{position:fixed;left:9vw;bottom:calc(206px + env(safe-area-inset-bottom));display:block;width:min(76vw,480px);padding:10px 14px 11px;border:1px solid #eca2b68c;border-left:2px solid #efa6bbd9;border-radius:14px 14px 14px 4px;background:#090a0e59;color:#fff;text-align:left;box-shadow:0 7px 24px #0006;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);pointer-events:none}
  body[data-mode=girlfriend][data-live=true] .reply-stack[data-phase=error]{background:#090a0e80;border-color:#ffffff52}
  body[data-mode=girlfriend][data-live=true] .reply-stack span{display:block;font-size:10px;font-weight:600;color:#ffd7e2;margin-bottom:3px;text-shadow:0 1px 5px #000}
  body[data-mode=girlfriend][data-live=true] .reply-stack p{margin:0;max-height:4.3em;overflow:hidden;font-size:clamp(14px,3.8vw,18px);line-height:1.45;font-weight:550;text-shadow:0 1px 6px #000,0 0 14px #0009;overflow-wrap:anywhere}
  body[data-live=true] .caption-stack[data-phase=waiting] .transcript-state{font-size:11px;color:#fffd}
  body[data-live=true] .caption-stack[data-phase=visual] .transcript-state{color:#fffd}
  body[data-live=true] .caption-stack .transcript-state,body[data-mode=girlfriend][data-live=true] .caption-stack .transcript-state{position:static;inset:auto;width:100%;margin:0;color:#fff;background:none;font-size:11px;font-weight:600;line-height:1.35;letter-spacing:.04em;text-shadow:0 2px 8px #000,0 0 18px #000c}
  body[data-live=true] .caption-stack .transcript,body[data-mode=girlfriend][data-live=true] .caption-stack .transcript,body[data-live=true] .caption-stack .transcript[data-long=true],body[data-mode=girlfriend][data-live=true] .caption-stack .transcript[data-long=true]{position:static;inset:auto;width:100%;max-height:2.9em;min-height:0;padding:0;margin:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;color:#fff;font-size:clamp(17px,4.7vw,22px);font-weight:600;line-height:1.43;letter-spacing:.01em;text-shadow:0 2px 6px #000,0 0 18px #000;overflow:hidden;overflow-wrap:anywhere;text-wrap:balance;white-space:normal;text-overflow:clip}
  body[data-live=true] .caption-stack .transcript:empty{display:none}
  body[data-live=true] .caption-stack[data-phase=sent] .transcript{font-size:clamp(16px,4.4vw,20px);color:#fff}
  body[data-live=true] .caption-stack[data-phase=error] .transcript{font-size:clamp(15px,4vw,18px);font-weight:500}
  body[data-live=true] .caption-stack[data-phase=visual] .transcript{max-height:4.3em;font-size:clamp(16px,4.3vw,20px);font-weight:550}
  body[data-mode=girlfriend][data-live=true] .caption-stack .transcript-state{display:none}
  body[data-mode=girlfriend][data-live=true] .caption-stack .transcript,
  body[data-mode=girlfriend][data-live=true] .caption-stack .transcript[data-long=true]{width:max-content;max-width:100%;max-height:calc(4.5em + 22px);padding:10px 14px;border:1px solid #ffffff24;border-radius:17px 17px 5px 17px;background:#151319dc;color:#fff;text-align:left;text-wrap:wrap;font-size:clamp(14px,3.8vw,18px);font-weight:500;line-height:1.5;text-shadow:none;box-shadow:0 7px 22px #0008;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  body[data-mode=girlfriend][data-live=true] .caption-stack[data-phase=sent] .transcript{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
  body[data-mode=girlfriend][data-live=true] .caption-stack[data-process=organizing] .transcript::after{content:' ···';color:#ffd7e2;white-space:nowrap}
}
