/* Phi AI agent: launcher, panel, voice call */
.agent-launch{position:fixed;right:22px;bottom:22px;z-index:80;display:flex;align-items:center;gap:12px;height:60px;padding:0 20px 0 8px;border-radius:999px;border:1px solid rgba(255,184,0,.45);
  background:linear-gradient(135deg,rgba(24,20,10,.96),rgba(10,10,10,.96));color:#f4f1e9;font:inherit;cursor:pointer;box-shadow:0 18px 50px -12px rgba(0,0,0,.9),0 0 0 6px rgba(255,184,0,.06),0 0 40px -8px rgba(255,184,0,.35);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.agent-launch:hover{transform:translateY(-3px)}
.agent-launch:focus-visible{outline:2px solid #FFB800;outline-offset:3px}
.al-txt{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15;text-align:left}
.al-txt b{font-size:15px;font-weight:600;letter-spacing:-.01em}
.al-txt small{font-size:11.5px;color:rgba(244,241,233,.62)}
.agent-launch.open .al-txt b::after{content:" ·  close";color:rgba(244,241,233,.5);font-weight:400}

/* animated orb */
.orb{position:relative;width:44px;height:44px;border-radius:50%;flex:none;background:radial-gradient(circle at 35% 30%,#fff3c4 0%,#ffcf4a 22%,#ffb800 45%,#a86400 80%,#3a2400 100%);box-shadow:0 0 22px rgba(255,184,0,.6),inset 0 -6px 14px rgba(0,0,0,.35)}
.orb i{position:absolute;inset:-5px;border-radius:50%;border:1.5px solid rgba(255,214,110,.55);border-left-color:transparent;border-bottom-color:transparent;animation:orbspin 3.2s linear infinite}
.orb i:nth-child(2){inset:-9px;border-color:rgba(255,184,0,.3);border-right-color:transparent;border-top-color:transparent;animation-duration:5s;animation-direction:reverse}
.orb i:nth-child(3){inset:6px;border:none;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.55),transparent 60%);animation:orbpulse 2.4s ease-in-out infinite}
.orb.sm{width:34px;height:34px}.orb.sm i{inset:-4px}.orb.sm i:nth-child(2){inset:-7px}
.orb.xl{width:132px;height:132px;margin:0 auto}.orb.xl i{inset:-14px;border-width:2px}.orb.xl i:nth-child(2){inset:-28px}
@keyframes orbspin{to{transform:rotate(360deg)}}
@keyframes orbpulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:.9;transform:scale(1.05)}}
@media (prefers-reduced-motion:reduce){.orb i{animation:none}}

.agent-nudge{position:fixed;right:22px;bottom:94px;z-index:80;max-width:290px;text-align:left;font:inherit;font-size:14px;line-height:1.45;color:#f4f1e9;background:rgba(22,22,23,.97);border:1px solid rgba(255,184,0,.35);border-radius:18px 18px 6px 18px;padding:14px 16px;cursor:pointer;box-shadow:0 20px 50px -14px rgba(0,0,0,.9);animation:nudge .5s cubic-bezier(.2,.8,.2,1)}
@keyframes nudge{from{opacity:0;transform:translateY(10px)}}

/* panel */
.agent{position:fixed;right:22px;bottom:96px;z-index:81;width:min(410px,calc(100vw - 28px));height:min(640px,calc(100vh - 130px));display:flex;flex-direction:column;
  background:rgba(12,12,13,.97);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:26px;overflow:hidden;
  box-shadow:0 40px 100px -20px rgba(0,0,0,.95),0 0 0 1px rgba(255,184,0,.12);color:#f4f1e9;font-size:14.5px;animation:agin .35s cubic-bezier(.2,.8,.2,1)}
.agent[hidden]{display:none}
@keyframes agin{from{opacity:0;transform:translateY(14px) scale(.98)}}
.ag-head{display:flex;align-items:center;gap:12px;padding:16px 16px 12px;border-bottom:1px solid rgba(255,255,255,.08);background:radial-gradient(120% 140% at 0% 0%,rgba(255,184,0,.16),transparent 60%)}
.ag-who{display:flex;flex-direction:column;flex:1;line-height:1.2}
.ag-who b{font-size:16px}.ag-who small{font-size:12px;color:#7be495}
.ag-lang{font:inherit;font-size:12px;color:#f4f1e9;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px 8px}
.ag-x{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.14);background:none;color:#f4f1e9;font-size:22px;line-height:1;cursor:pointer}
.ag-x:hover{border-color:#FFB800;color:#FFB800}
.ag-note{margin:0;padding:9px 16px;font-size:11.5px;line-height:1.45;color:rgba(244,241,233,.55);border-bottom:1px solid rgba(255,255,255,.06)}
.ag-log{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.ag-msg{display:flex;flex-direction:column;max-width:88%}
.ag-msg.ai{align-self:flex-start}.ag-msg.me{align-self:flex-end;align-items:flex-end}
.ag-bub{padding:11px 14px;border-radius:18px;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
.ag-msg.ai .ag-bub{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07);border-top-left-radius:6px}
.ag-msg.me .ag-bub{background:#FFB800;color:#000;border-top-right-radius:6px;font-weight:500}
.ag-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.ag-links a{font-size:12.5px;padding:5px 11px;border-radius:999px;border:1px solid rgba(255,184,0,.45);color:#ffd36a}
.ag-links a:hover{background:rgba(255,184,0,.12)}
.ag-typing .ag-bub{display:flex;gap:5px;padding:14px}
.ag-typing i{width:7px;height:7px;border-radius:50%;background:#ffd36a;animation:tdot 1s infinite ease-in-out}
.ag-typing i:nth-child(2){animation-delay:.15s}.ag-typing i:nth-child(3){animation-delay:.3s}
@keyframes tdot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.ag-consent{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.ag-consent button{font:inherit;font-size:13px;border-radius:999px;padding:8px 14px;cursor:pointer}
.ag-yes{background:#FFB800;border:1px solid #FFB800;color:#000;font-weight:600}
.ag-no{background:none;border:1px solid rgba(255,255,255,.2);color:#f4f1e9}
.ag-chips{display:flex;gap:6px;overflow-x:auto;padding:0 16px 10px;scrollbar-width:none}
.ag-chips::-webkit-scrollbar{display:none}
.ag-chip{flex:none;font:inherit;font-size:12.5px;padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.03);color:rgba(244,241,233,.85);cursor:pointer}
.ag-chip:hover{border-color:#FFB800;color:#ffd36a}
.ag-form{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid rgba(255,255,255,.08)}
.ag-form input{flex:1;min-width:0;font:inherit;font-size:15px;color:#f4f1e9;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:11px 15px}
.ag-form input:focus{outline:none;border-color:#FFB800}
.ag-mic,.ag-send{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;cursor:pointer;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#f4f1e9}
.ag-send{background:#FFB800;border-color:#FFB800;color:#000}
.ag-mic.on{background:#e5484d;border-color:#e5484d;color:#fff;animation:micpulse 1.2s infinite}
.ag-mic:disabled,.ag-call:disabled{opacity:.4;cursor:not-allowed}
@keyframes micpulse{0%,100%{box-shadow:0 0 0 0 rgba(229,72,77,.5)}50%{box-shadow:0 0 0 8px rgba(229,72,77,0)}}
.ag-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:0 12px 12px}
.ag-call{display:flex;align-items:center;gap:8px;font:inherit;font-size:13px;font-weight:600;padding:9px 14px;border-radius:999px;border:1px solid rgba(123,228,149,.5);background:rgba(123,228,149,.08);color:#9ff0b3;cursor:pointer}
.ag-call:hover:not(:disabled){background:rgba(123,228,149,.16)}
.ag-voice{font:inherit;font-size:12px;color:rgba(244,241,233,.6);background:none;border:none;cursor:pointer;padding:6px}
.ag-voice[aria-pressed=true]{color:#ffd36a}
/* voice call overlay */
.ag-callui{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:30px;text-align:center;
  background:radial-gradient(90% 70% at 50% 35%,rgba(255,184,0,.18),rgba(8,8,8,.98) 70%)}
.ag-callui[hidden]{display:none}
.ag-cstate{margin:34px 0 0;font-size:18px;font-weight:600}
.ag-ccap{min-height:42px;margin:0;font-size:14px;color:rgba(244,241,233,.7);max-width:300px}
.ag-ctime{margin:0;font-size:13px;color:rgba(244,241,233,.5);font-variant-numeric:tabular-nums}
.ag-end{font:inherit;font-weight:600;font-size:14px;padding:13px 28px;border-radius:999px;border:none;background:#e5484d;color:#fff;cursor:pointer}
.ag-callui[data-state=listening] .orb.xl{animation:orbbreath 1.4s ease-in-out infinite}
.ag-callui[data-state=speaking] .orb.xl{animation:orbtalk .5s ease-in-out infinite alternate}
.ag-callui[data-state=thinking] .orb.xl i{animation-duration:1s}
@keyframes orbbreath{0%,100%{transform:scale(.94)}50%{transform:scale(1.04)}}
@keyframes orbtalk{from{transform:scale(.97);filter:brightness(1)}to{transform:scale(1.06);filter:brightness(1.25)}}
@media (max-width:640px){
  .agent-launch{right:12px;bottom:12px;height:56px;padding:0 6px}.al-txt{display:none}
  .agent{right:0;bottom:0;width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .agent-nudge{right:12px;bottom:80px;max-width:calc(100vw - 24px)}
}