:root{--bg: #0D1B2A;--bg-soft: #112236;--gold: #C9A84C;--gold-bright: #E0BD5E;--gold-soft: rgba(201, 168, 76, .18);--gold-faint: rgba(201, 168, 76, .08);--text: #F5F0E8;--text-muted: rgba(245, 240, 232, .65);--text-dim: rgba(245, 240, 232, .45);--user-bubble: #1B2A3F;--danger: #C04B4B;--danger-bright: #D86060;--warn: #D4A24A;--font-display: "Playfair Display", Georgia, serif;--font-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 22px;--radius-pill: 999px;--shadow-md: 0 8px 28px rgba(0, 0, 0, .35)}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100vh}body{background:var(--bg);background:radial-gradient(ellipse 80% 60% at 50% -10%,rgba(201,168,76,.14),transparent 60%),radial-gradient(ellipse 70% 50% at 50% 110%,rgba(201,168,76,.06),transparent 60%),var(--bg);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}.app{width:100%;max-width:720px;margin:0 auto;padding:28px 24px 56px;display:flex;flex-direction:column;gap:24px}.app__header{display:flex;align-items:center;justify-content:space-between;gap:16px}.app__brand{display:inline-flex;align-items:center;gap:10px}.app__brand-mark{color:var(--gold);font-size:1.4rem;line-height:1}.app__logo{height:36px;width:auto;display:block}.app__controls{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.app__brand-name{font-family:var(--font-display);font-weight:600;font-size:1.35rem;letter-spacing:.02em}.app__main{display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center}.app__subtitle{font-family:var(--font-display);font-style:italic;color:var(--text-muted);font-size:1.05rem;margin:0}@media (max-width: 540px){.app{padding:20px 16px 48px;gap:18px}.app__brand-name{font-size:1.15rem}.app__logo{height:28px}}.avatar{position:relative;width:380px;max-width:100%;aspect-ratio:1 / 1.05;display:flex;flex-direction:column;align-items:center;justify-content:center}.avatar__video{width:100%;height:100%;object-fit:cover;object-position:center bottom;background:transparent;position:relative;z-index:1}.avatar__ring{position:absolute;top:12%;right:12%;bottom:12%;left:12%;border-radius:50%;background:radial-gradient(circle,var(--gold-soft) 0%,transparent 70%);opacity:0;z-index:0;transition:opacity .4s ease}.avatar--speaking .avatar__ring{animation:pulse-ring 1.6s ease-in-out infinite;opacity:1}@keyframes pulse-ring{0%,to{box-shadow:0 0 #c9a84c00;transform:scale(1)}50%{box-shadow:0 0 0 28px #c9a84c00;transform:scale(1.04)}}.avatar--speaking .avatar__ring{box-shadow:0 0 #c9a84c66}.avatar__title{text-align:center;font-size:.85rem;font-weight:600;letter-spacing:.04em;color:#e8c84a;margin:6px 0 0;z-index:2}.avatar__overlay{position:absolute;bottom:14%;left:50%;transform:translate(-50%);background:#0d1b2ad9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--gold-soft);color:var(--text);padding:8px 14px;border-radius:var(--radius-pill);font-size:.85rem;letter-spacing:.02em;display:inline-flex;align-items:center;gap:8px;z-index:2}@media (max-width: 540px){.avatar{width:300px}}.spinner{width:14px;height:14px;border:2px solid rgba(245,240,232,.25);border-top-color:var(--gold);border-radius:50%;animation:spin .9s linear infinite;display:inline-block}.spinner--on-button{border-color:#0d1b2a40;border-top-color:var(--bg)}@keyframes spin{to{transform:rotate(360deg)}}.call-btn{display:inline-flex;align-items:center;gap:10px;padding:13px 28px;border-radius:var(--radius-pill);font-family:var(--font-body);font-weight:600;font-size:1rem;letter-spacing:.01em;transition:background-color .25s ease,color .25s ease,transform .15s ease,box-shadow .25s ease;box-shadow:var(--shadow-md);min-width:180px;justify-content:center}.call-btn:hover:not(:disabled){transform:translateY(-1px)}.call-btn:active:not(:disabled){transform:translateY(0)}.call-btn--start{background:var(--gold);color:#1a1208}.call-btn--start:hover:not(:disabled){background:var(--gold-bright)}.call-btn--connecting{background:#c9a84c59;color:var(--text);cursor:not-allowed}.call-btn--end{background:var(--danger);color:var(--text)}.call-btn--end:hover:not(:disabled){background:var(--danger-bright)}.lang{display:inline-flex;align-items:center;gap:8px;padding:8px 12px 8px 14px;border:1px solid var(--gold-soft);background:#0d1b2a99;border-radius:var(--radius-pill);color:var(--text);transition:border-color .2s ease}.lang:hover{border-color:var(--gold)}.lang__icon{color:var(--gold);flex-shrink:0}.lang__select{background:transparent;border:none;outline:none;color:var(--text);font-family:var(--font-body);font-size:.92rem;font-weight:500;-moz-appearance:none;appearance:none;-webkit-appearance:none;padding-right:6px;cursor:pointer}.lang__select:disabled{opacity:.5;cursor:not-allowed}.lang__select option{background:var(--bg-soft);color:var(--text)}.agent-switch{display:inline-flex;padding:4px;gap:2px;background:#0d1b2a99;border:1px solid var(--gold-soft);border-radius:var(--radius-pill)}.agent-switch__btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--radius-pill);color:var(--text-muted);font-family:var(--font-body);font-size:.85rem;font-weight:500;letter-spacing:.01em;transition:background-color .2s ease,color .2s ease}.agent-switch__btn:hover:not(:disabled):not(.agent-switch__btn--active){color:var(--text)}.agent-switch__btn--active{background:var(--gold);color:#1a1208}.agent-switch__btn:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 540px){.agent-switch__btn span{display:none}.agent-switch__btn{padding:6px 10px}}.app[data-agent=drinks]{--gold: #C77B4A;--gold-bright: #E59969;--gold-soft: rgba(199, 123, 74, .2);--gold-faint: rgba(199, 123, 74, .08);--bg-soft: #1A1A2E;--user-bubble: #2A1F2E}.app[data-agent=drinks] .app__brand-mark{font-size:1.2rem}.transcript{width:100%;max-height:260px;overflow-y:auto;background:#0d1b2a80;border:1px solid rgba(201,168,76,.15);border-radius:var(--radius-md);padding:16px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth;text-align:start}.transcript--latest{max-height:none;overflow:visible}.transcript--latest .bubble{animation:bubble-in .25s ease-out}@keyframes bubble-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.transcript::-webkit-scrollbar{width:8px}.transcript::-webkit-scrollbar-track{background:transparent}.transcript::-webkit-scrollbar-thumb{background:var(--gold-soft);border-radius:4px}.transcript--empty{align-items:center;justify-content:center;color:var(--text-dim);font-style:italic;font-family:var(--font-display);min-height:80px;max-height:none;text-align:center}.bubble{max-width:78%;padding:10px 14px;border-radius:var(--radius-md);display:flex;flex-direction:column;gap:4px;text-align:start}.bubble--agent{align-self:flex-end;background:var(--gold);color:#1a1208;border-bottom-right-radius:4px}.bubble--user{align-self:flex-start;background:var(--user-bubble);color:var(--text);border-bottom-left-radius:4px}.transcript--ar .bubble--agent{align-self:flex-start;border-bottom-right-radius:var(--radius-md);border-bottom-left-radius:4px}.transcript--ar .bubble--user{align-self:flex-end;border-bottom-left-radius:var(--radius-md);border-bottom-right-radius:4px}.bubble__meta{display:flex;align-items:center;gap:8px;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;opacity:.7}.bubble--agent .bubble__meta{color:#1a1208b3}.bubble__time{font-variant-numeric:tabular-nums}.bubble__text{font-size:.95rem;line-height:1.45;word-break:break-word}.toast{position:fixed;bottom:22px;inset-inline-end:22px;background:var(--bg-soft);border:1px solid var(--danger);color:var(--text);padding:12px 14px 12px 16px;border-radius:var(--radius-md);box-shadow:var(--shadow-md);display:flex;align-items:center;gap:12px;max-width:360px;z-index:100;animation:toast-in .25s ease-out}@keyframes toast-in{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.toast__text{font-size:.9rem;flex:1}.toast__close{color:var(--text-muted);padding:2px;display:inline-flex;align-items:center;border-radius:4px}.toast__close:hover{color:var(--text)}.mic-warning{display:flex;align-items:center;gap:12px;background:#d4a24a1f;border:1px solid rgba(212,162,74,.4);color:var(--text);padding:12px 16px;border-radius:var(--radius-md);font-size:.9rem}.mic-warning__text{flex:1}.mic-warning__close{color:var(--text-muted);padding:2px;display:inline-flex;align-items:center;border-radius:4px}.mic-warning__close:hover{color:var(--text)}.error-card-wrapper{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;width:100%}.error-card{background:var(--bg-soft);border:1px solid var(--gold);border-radius:var(--radius-lg);padding:32px;max-width:480px;width:100%;box-shadow:var(--shadow-md);text-align:start}.error-card__icon{color:var(--gold);margin-bottom:12px}.error-card__title{font-family:var(--font-display);font-weight:600;font-size:1.6rem;margin:0 0 12px}.error-card__body{color:var(--text-muted);margin:0 0 14px}.error-card__body code{background:#c9a84c1f;color:var(--gold-bright);padding:2px 6px;border-radius:4px}.error-card__code{background:#0d1b2ab3;border:1px solid rgba(201,168,76,.2);color:var(--gold-bright);padding:12px;border-radius:var(--radius-sm);margin:0 0 14px;overflow-x:auto}.error-card__hint{color:var(--text-dim);font-size:.88rem;font-style:italic;margin:0}.qr-card{display:flex;align-items:center;gap:18px;padding:16px 20px;border:1px solid rgba(201,168,76,.22);border-radius:var(--radius-md);background:var(--gold-faint);width:100%;max-width:360px}.qr-card__code{flex-shrink:0;padding:8px;border-radius:var(--radius-sm);background:#0d1b2a99;line-height:0}.qr-card__text{display:flex;flex-direction:column;gap:4px}.qr-card__label{font-size:.8rem;color:var(--text-muted);letter-spacing:.02em}.qr-card__link{font-family:var(--font-display);font-weight:600;font-size:.95rem;color:var(--gold-bright);text-decoration:none;letter-spacing:.01em;word-break:break-all}.qr-card__link:hover{text-decoration:underline}