:root {
    --page: #f7fbf8;
    --bar: rgba(255,255,255,.94);
    --bar-border: #e4e9e7;
    --grid: rgba(74,125,104,.075);
    --text: #101816;
    --muted: #788581;
    --green: #22a34a;
    --green-bright: #67df83;
    --green-soft: rgba(34,163,74,.10);
    --green-line: rgba(47,181,87,.30);
    --button: rgba(255,255,255,.65);
    --button-border: rgba(92,111,105,.18);
    --input: rgba(255,255,255,.96);
    --shadow: 0 16px 42px rgba(30,62,49,.10);
    --danger: #ff4c58;
}

body[data-theme="dark"] {
    --page: #080c10;
    --bar: rgba(15,20,26,.95);
    --bar-border: #242c33;
    --grid: rgba(102,142,125,.075);
    --text: #eef5f1;
    --muted: #84908d;
    --green: #67df83;
    --green-bright: #72f18d;
    --green-soft: rgba(65,211,94,.09);
    --green-line: rgba(65,211,94,.28);
    --button: rgba(22,28,34,.74);
    --button-border: rgba(133,148,143,.19);
    --input: rgba(17,23,30,.97);
    --shadow: 0 18px 48px rgba(0,0,0,.28);
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; }
body {
    margin: 0;
    overflow: hidden;
    background: var(--page);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
}
button, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; }
button, input { -webkit-tap-highlight-color: transparent; }

.legacy-ui { position: fixed; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.live-app { width: 100%; height: 100%; min-height: 100dvh; display: flex; flex-direction: column; }

.topbar {
    position: relative; z-index: 50; height: 82px; flex: 0 0 82px; display: flex; align-items: center; justify-content: space-between;
    padding: 0 38px; background: var(--bar); border-bottom: 1px solid var(--bar-border); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
}
.brand-wrap { display: flex; align-items: center; gap: 13px; }
.brand-mark {
    width: 49px; height: 49px; border-radius: 50%; display: grid; place-items: center; color: var(--green);
    border: 1px solid var(--green-line); background: rgba(255,255,255,.34);
}
body[data-theme="dark"] .brand-mark { background: rgba(7,16,12,.34); }
.brand-mark svg { width: 25px; height: 25px; }
.brand-name { font-size: 17px; font-weight: 750; letter-spacing: -.02em; }
.brand-status { display: flex; align-items: center; gap: 7px; margin-top: 2px; color: var(--muted); font-size: 12px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #72d994; box-shadow: 0 0 0 3px rgba(114,217,148,.08); }
.top-actions { display: flex; align-items: center; gap: 9px; }
.end-button, .theme-button, .voice-button {
    height: 50px; border-radius: 16px; border: 1px solid var(--button-border); background: var(--button); color: var(--text);
    display: inline-flex; align-items: center; justify-content: center; transition: .18s ease; box-shadow: 0 4px 18px rgba(0,0,0,.025);
}
.end-button { min-width: 95px; gap: 9px; color: #ff4c58; border-color: rgba(255,76,88,.25); background: rgba(255,240,241,.72); }
.end-button.is-call-start { color: #1fa84a; border-color: rgba(31,168,74,.25); background: rgba(239,251,243,.82); }
.end-button.is-active { color: #ff4c58; border-color: rgba(255,76,88,.25); background: rgba(255,240,241,.72); }
.end-button.is-starting { color: #d8941a; border-color: rgba(216,148,26,.28); background: rgba(255,246,225,.72); }
.end-button:disabled { opacity: .62; cursor: wait; transform: none; }
body[data-theme="dark"] .end-button { background: rgba(82,23,30,.28); }
body[data-theme="dark"] .end-button.is-call-start { color: #70e789; border-color: rgba(87,214,112,.25); background: rgba(25,74,38,.25); }
body[data-theme="dark"] .end-button.is-active { color: #ff6670; border-color: rgba(255,76,88,.30); background: rgba(82,23,30,.28); }
body[data-theme="dark"] .end-button.is-starting { color: #f5c965; background: rgba(77,55,16,.28); border-color: rgba(245,201,101,.24); }
.end-button svg { width: 20px; height: 20px; }
.end-button:hover, .theme-button:hover, .voice-button:hover { transform: translateY(-1px); }
.theme-button { width: 50px; }
.theme-button svg { width: 23px; height: 23px; }
body[data-theme="light"] .moon-icon { display: none; }
body[data-theme="dark"] .sun-icon { display: none; }
.voice-button { width: 94px; gap: 7px; }
.voice-button svg { width: 21px; height: 21px; }
.voice-button-label { font-size: 12px; font-weight: 650; }

.stage { position: relative; flex: 1; min-height: 0; overflow: hidden; background: var(--page); }
.grid-background {
    position: absolute; inset: 0; opacity: 1;
    background-image: linear-gradient(to right, var(--grid) 1px, transparent 1px), linear-gradient(to bottom, var(--grid) 1px, transparent 1px);
    background-size: 51px 51px; mask-image: linear-gradient(to bottom, black 0%, black 78%, transparent 100%);
}
.ambient { position: absolute; pointer-events: none; border-radius: 50%; filter: blur(42px); }
.ambient-one { width: 610px; height: 610px; left: 50%; top: 42%; transform: translate(-50%,-50%); background: radial-gradient(circle, rgba(74,197,112,.14) 0, rgba(74,197,112,.07) 31%, transparent 70%); }
.ambient-two { width: 500px; height: 320px; left: 50%; top: 62%; transform: translate(-50%,-50%); background: radial-gradient(ellipse, rgba(101,205,137,.10), transparent 72%); }
body[data-theme="dark"] .ambient-one { background: radial-gradient(circle, rgba(44,160,76,.17) 0, rgba(44,160,76,.06) 35%, transparent 70%); }
body[data-theme="dark"] .ambient-two { background: radial-gradient(ellipse, rgba(45,174,84,.09), transparent 72%); }

.welcome-screen {
    position: absolute; inset: 0; z-index: 10; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
    padding: 30px 18px 90px;
}
.welcome-screen[hidden] { display: none; }
.welcome-mark { position: relative; width: 198px; height: 198px; display: grid; place-items: center; margin-bottom: 6px; }
.welcome-ring { position: absolute; border-radius: 50%; pointer-events: none; }
.ring-a { inset: 12px; border: 1px solid var(--green-line); animation: ringPulse 3.4s ease-in-out infinite; }
.ring-b { inset: 34px; border: 1px dashed rgba(91,166,113,.25); }
.welcome-ring.ring-a::after { content: ""; position: absolute; width: 45%; height: 45%; left: 0; bottom: 7px; border-left: 2px solid var(--green); border-bottom: 2px solid var(--green); border-radius: 0 0 0 100%; transform: rotate(-25deg); }
.welcome-face { width: 124px; height: 124px; border-radius: 50%; display: flex; align-items: center; justify-content: center; gap: 18px; position: relative; background: radial-gradient(circle at 44% 32%, #fff, #e5f3ea 55%, #d3eadb 100%); border: 1px solid rgba(76,169,106,.24); box-shadow: 0 0 45px rgba(73,183,102,.12), inset 0 0 26px rgba(255,255,255,.62); }
body[data-theme="dark"] .welcome-face { background: radial-gradient(circle at 44% 30%, #173522 0, #0c2013 45%, #06100a 100%); border-color: rgba(84,205,107,.28); box-shadow: 0 0 45px rgba(62,214,91,.12), inset 0 0 22px rgba(77,220,106,.08); }
.welcome-face span { width: 8px; height: 22px; border-radius: 50%; background: var(--green); box-shadow: 0 0 11px rgba(34,170,77,.13); }
.welcome-face i { position: absolute; width: 23px; height: 4px; left: 50%; bottom: 35px; transform: translateX(-50%); border-radius: 4px; background: var(--green); font-style: normal; }
.welcome-title { font-size: 31px; font-weight: 790; letter-spacing: -.045em; }
.welcome-subtitle { margin-top: 5px; color: var(--muted); font-size: 13px; }
.welcome-actions { display: grid; grid-template-columns: repeat(2, minmax(185px, 225px)); gap: 12px; margin-top: 25px; }
.start-choice {
    min-height: 72px; padding: 10px 14px; border: 1px solid var(--button-border); border-radius: 19px; display: flex; align-items: center; gap: 11px; text-align: left;
    color: var(--text); background: color-mix(in srgb, var(--input) 70%, transparent); box-shadow: var(--shadow); transition: .18s ease; backdrop-filter: blur(16px);
}
.start-choice:hover { transform: translateY(-2px); border-color: var(--green-line); }
.start-choice.primary { border-color: var(--green-line); background: var(--green-soft); }
.choice-icon { flex: 0 0 41px; width: 41px; height: 41px; display: grid; place-items: center; border-radius: 13px; color: var(--green); background: var(--green-soft); border: 1px solid var(--green-line); }
.choice-icon svg { width: 22px; height: 22px; }
.start-choice span:last-child { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.start-choice strong { font-size: 13px; }
.start-choice small { color: var(--muted); font-size: 10px; }
.welcome-note { margin-top: 13px; max-width: 440px; color: var(--muted); font-size: 10px; line-height: 1.55; }

.center-ui { position: absolute; left: 50%; top: 45.5%; transform: translate(-50%,-50%); z-index: 3; width: min(360px,80vw); display: flex; flex-direction: column; align-items: center; text-align: center; }
.center-ui[hidden] { display: none; }

.trustyen-orb {
    position: relative;
    width: 240px;
    height: 240px;
    display: grid;
    place-items: center;
    isolation: isolate;
    transition: transform .45s cubic-bezier(.2,.75,.2,1);
}
.trustyen-orb-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
    filter: drop-shadow(0 18px 38px rgba(34,163,74,.08));
}
.svg-core {
    fill: url(#trustyenCoreLight);
    stroke: rgba(42,178,88,.24);
    stroke-width: 1.2;
    transform-origin: 110px 110px;
    transition: fill .35s ease, stroke .35s ease, transform .28s ease, filter .35s ease;
}
body[data-theme="dark"] .svg-core {
    fill: url(#trustyenCoreDark);
    stroke: rgba(106,239,135,.34);
}
.svg-orbit, .svg-halo {
    fill: none;
    transform-origin: 110px 110px;
    transition: stroke .35s ease, opacity .35s ease, stroke-width .35s ease;
}
.svg-orbit { stroke: rgba(44,181,88,.24); stroke-width: 1.25; }
.orbit-a { stroke-dasharray: 92 26 13 32; animation: orbitSlow 9s linear infinite; }
.orbit-b { stroke: rgba(76,196,106,.18); stroke-dasharray: 8 14; animation: orbitReverse 7.5s linear infinite; }
.orbit-c { stroke: rgba(109,220,133,.15); stroke-dasharray: 2 11; animation: orbitSlow 5.7s linear infinite reverse; }
.svg-halo { stroke: rgba(50,184,95,.10); stroke-width: 12; opacity: .8; }
.halo-a { animation: haloBreath 3.8s ease-in-out infinite; }
.halo-b { stroke-width: 7; opacity: .52; animation: haloBreath 2.8s ease-in-out infinite reverse; }
.svg-face { transform-origin: 110px 110px; transition: transform .2s ease; }
.svg-eye { fill: #22a34a; transform-origin: center; transition: fill .35s ease, transform .18s ease; }
body[data-theme="dark"] .svg-eye { fill: #76f395; }
.svg-mouth { fill: none; stroke: #22a34a; stroke-width: 4; stroke-linecap: round; transform-box: fill-box; transform-origin: center; transition: stroke .35s ease, stroke-width .18s ease; }
body[data-theme="dark"] .svg-mouth { stroke: #76f395; }
.svg-particles circle { fill: #38d77c; opacity: .24; animation: particleFloat 3.8s ease-in-out infinite; }
.svg-particles circle:nth-child(2) { animation-delay: -.9s; opacity: .34; }
.svg-particles circle:nth-child(3) { animation-delay: -1.8s; opacity: .28; }
.svg-particles circle:nth-child(4) { animation-delay: -2.7s; opacity: .22; }
.orb-state-glow {
    position: absolute; inset: 26%; border-radius: 50%; pointer-events: none; z-index: -1;
    background: radial-gradient(circle, rgba(63,215,117,.11), transparent 70%);
    filter: blur(15px); opacity: .72; transition: .35s ease;
}

/* Reactive AI states */
.trustyen-orb[data-state="idle"] .svg-core { transform: scale(1); }
.trustyen-orb[data-state="idle"] .svg-face { transform: translateY(0); }
.trustyen-orb[data-state="connecting"], .trustyen-orb[data-state="thinking"] { transform: translateY(-2px); }
.trustyen-orb[data-state="connecting"] .svg-orbit, .trustyen-orb[data-state="thinking"] .svg-orbit { stroke: rgba(124,105,255,.58); }
.trustyen-orb[data-state="connecting"] .orb-state-glow, .trustyen-orb[data-state="thinking"] .orb-state-glow { background: radial-gradient(circle, rgba(124,105,255,.20), rgba(71,154,255,.08) 42%, transparent 72%); opacity: 1; }
.trustyen-orb[data-state="connecting"] .svg-core { animation: coreThink 1.7s ease-in-out infinite; }
.trustyen-orb[data-state="thinking"] .svg-core { animation: coreThink 1.18s ease-in-out infinite; }
.trustyen-orb[data-state="thinking"] .orbit-a { animation-duration: 3.2s; }
.trustyen-orb[data-state="thinking"] .orbit-b { animation-duration: 2.5s; }
.trustyen-orb[data-state="thinking"] .svg-face { animation: faceThink 1.18s ease-in-out infinite; }
.trustyen-orb[data-state="thinking"] .svg-eye { transform: scaleY(.76); }
.trustyen-orb[data-state="thinking"] .svg-mouth { stroke: #8f7cff; stroke-dasharray: 10 8; animation: mouthThink .75s ease-in-out infinite; }
.trustyen-orb[data-state="listening"] .svg-core { transform: scale(1.035); filter: drop-shadow(0 0 22px rgba(79,223,255,.22)); }
.trustyen-orb[data-state="listening"] .svg-halo { stroke: rgba(75,220,255,.34); }
.trustyen-orb[data-state="listening"] .orb-state-glow { background: radial-gradient(circle, rgba(65,219,255,.22), rgba(55,186,255,.06) 45%, transparent 74%); opacity: 1; }
.trustyen-orb[data-state="listening"] .orbit-a { stroke: rgba(76,223,255,.72); animation-duration: 3.8s; }
.trustyen-orb[data-state="listening"] .orbit-b { stroke: rgba(71,180,255,.34); animation-duration: 2.2s; }
.trustyen-orb[data-state="listening"] .svg-eye { fill: #2bcdf2; animation: eyeListen .55s ease-in-out infinite; }
.trustyen-orb[data-state="listening"] .svg-mouth { stroke: #2bcdf2; animation: mouthListen .8s ease-in-out infinite; }
.trustyen-orb[data-state="speaking"] .svg-core { transform: scale(1.075); filter: drop-shadow(0 0 32px rgba(65,224,111,.26)); }
.trustyen-orb[data-state="speaking"] .svg-halo { stroke: rgba(69,224,112,.42); animation: speakHalo .95s ease-in-out infinite; }
.trustyen-orb[data-state="speaking"] .orb-state-glow { background: radial-gradient(circle, rgba(62,230,115,.25), rgba(106,92,255,.08) 48%, transparent 75%); opacity: 1; animation: speakGlow 1s ease-in-out infinite; }
.trustyen-orb[data-state="speaking"] .orbit-a { stroke: url(#trustyenEnergy); animation-duration: 2.2s; }
.trustyen-orb[data-state="speaking"] .orbit-b { stroke: rgba(83,226,125,.4); animation-duration: 1.65s; }
.trustyen-orb[data-state="speaking"] .svg-face { animation: faceSpeak .42s ease-in-out infinite alternate; }
.trustyen-orb[data-state="speaking"] .svg-eye { fill: #64f18a; animation: eyeSpeak .72s ease-in-out infinite; }
.trustyen-orb[data-state="speaking"] .svg-mouth { stroke: #64f18a; stroke-width: 5; animation: mouthSpeak .19s ease-in-out infinite alternate; }
.trustyen-orb[data-state="offline"] { opacity: .72; }
.trustyen-orb[data-state="offline"] .svg-orbit { stroke: rgba(125,136,132,.2); animation-play-state: paused; }
.trustyen-orb[data-state="offline"] .svg-core { filter: grayscale(.24); }
.trustyen-orb[data-state="offline"] .orb-state-glow { opacity: .15; }

.center-ui h1 { margin: 7px 0 7px; font-size: 21px; line-height: 1.15; font-weight: 760; letter-spacing: -.035em; }
.connection-state { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }
.connection-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); }
.connection-dot.connecting { animation: pulseDot 1.2s ease-in-out infinite; }
.connection-dot.offline { background: #a2aaa7; }
.voice-wave { height: 27px; margin-top: 13px; display: flex; align-items: center; gap: 4px; }
.voice-wave span { display: block; width: 3px; border-radius: 5px; background: var(--green); transform-origin: center; animation: wave 1.05s ease-in-out infinite; }
.voice-wave.is-idle span { animation-play-state: paused; opacity: .30; }
.voice-wave span:nth-child(1) { height: 8px; animation-delay: -.4s; } .voice-wave span:nth-child(2) { height: 11px; animation-delay: -.32s; }
.voice-wave span:nth-child(3) { height: 15px; animation-delay: -.24s; } .voice-wave span:nth-child(4) { height: 21px; animation-delay: -.16s; }
.voice-wave span:nth-child(5) { height: 25px; animation-delay: -.08s; } .voice-wave span:nth-child(6) { height: 18px; }
.voice-wave span:nth-child(7) { height: 25px; animation-delay: -.07s; } .voice-wave span:nth-child(8) { height: 20px; animation-delay: -.14s; }
.voice-wave span:nth-child(9) { height: 14px; animation-delay: -.21s; } .voice-wave span:nth-child(10) { height: 18px; animation-delay: -.28s; }
.voice-wave span:nth-child(11) { height: 10px; animation-delay: -.35s; }

.media-controls { position: absolute; z-index: 12; left: 50%; bottom: 78px; transform: translateX(-50%); display: flex; gap: 12px; }
.media-button { width: 67px; height: 75px; padding: 9px 5px 8px; border-radius: 19px; border: 1px solid var(--button-border); background: var(--button); color: #63726e; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; box-shadow: var(--shadow); transition: .18s ease; }
body[data-theme="dark"] .media-button { color: #a9b6b2; }
.media-button svg { width: 23px; height: 23px; }
.media-button span { font-size: 10px; line-height: 1; }
.media-button:not(:disabled):hover { transform: translateY(-2px); }
.media-button:disabled { opacity: .45; }
.media-button.active { color: var(--green); border-color: var(--green-line); background: var(--green-soft); box-shadow: 0 0 0 1px var(--green-line), 0 0 26px rgba(45,174,78,.08); }
.mic-button { color: var(--green); border-color: var(--green-line); background: var(--green-soft); }
.mic-button.active svg { filter: drop-shadow(0 0 4px rgba(45,174,78,.22)); }

.message-fab {
    position: absolute; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 22;
    width: 56px; height: 56px; border: 1px solid var(--button-border); border-radius: 18px; display: grid; place-items: center;
    color: #06170b; background: #21a448; box-shadow: 0 10px 26px rgba(24,83,42,.20); transition: .18s ease;
}
body[data-theme="dark"] .message-fab { background: #63d878; }
.message-fab:hover { transform: translateY(-2px) scale(1.02); }
.message-fab svg { width: 25px; height: 25px; }

.composer-popover {
    position: absolute; z-index: 26; right: 18px; bottom: 84px; width: min(390px, calc(100% - 36px));
    padding: 9px; border: 1px solid var(--button-border); border-radius: 19px; background: color-mix(in srgb, var(--input) 96%, transparent);
    box-shadow: 0 18px 50px rgba(24,45,35,.18); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
.composer-popover[hidden] { display: none; }
.composer-top { display: flex; align-items: center; justify-content: space-between; padding: 2px 4px 7px; color: var(--muted); font-size: 10px; font-weight: 720; text-transform: uppercase; letter-spacing: .08em; }
.composer-close { width: 27px; height: 27px; border: 1px solid var(--button-border); border-radius: 9px; color: var(--muted); background: transparent; font-size: 18px; line-height: 1; }
.composer-row { display: flex; align-items: center; gap: 6px; padding: 5px 5px 5px 10px; border: 1px solid var(--button-border); border-radius: 15px; background: var(--input); }
.composer-row input { flex: 1; min-width: 0; height: 45px; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 15px; }
.composer-row input::placeholder { color: #7f8d89; }
.composer-row button { flex: 0 0 45px; width: 45px; height: 45px; border: 0; border-radius: 13px; display: grid; place-items: center; color: #06170b; background: #21a448; }
body[data-theme="dark"] .composer-row button { background: #63d878; }
.composer-row button:disabled { opacity: .55; }
.composer-row button svg { width: 21px; height: 21px; }

.voice-popover { position: absolute; z-index: 60; top: 14px; right: 20px; width: min(360px, calc(100vw - 30px)); padding: 16px; border: 1px solid var(--button-border); border-radius: 20px; background: color-mix(in srgb, var(--input) 94%, transparent); box-shadow: 0 18px 50px rgba(23,42,34,.18); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.voice-popover[hidden] { display: none; }
.voice-popover-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.voice-popover-title { font-size: 15px; font-weight: 760; letter-spacing: -.02em; }
.voice-popover-subtitle { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.popover-close { width: 30px; height: 30px; border: 1px solid var(--button-border); border-radius: 10px; background: transparent; color: var(--muted); font-size: 20px; line-height: 1; }
.voice-options { margin-top: 13px; display: grid; gap: 8px; }
.voice-option { position: relative; display: grid; grid-template-columns: 38px 1fr 22px; align-items: center; gap: 10px; min-height: 58px; padding: 9px 11px; border: 1px solid var(--button-border); border-radius: 14px; background: rgba(255,255,255,.26); cursor: pointer; transition: .18s ease; }
body[data-theme="dark"] .voice-option { background: rgba(255,255,255,.025); }
.voice-option:hover { transform: translateY(-1px); }
.voice-option.selected { border-color: var(--green-line); background: var(--green-soft); }
.voice-option input { position: absolute; opacity: 0; pointer-events: none; }
.voice-option-icon { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; color: var(--green); background: var(--green-soft); border: 1px solid var(--green-line); }
.voice-option-icon svg { width: 20px; height: 20px; }
.voice-option-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.voice-option-copy strong { font-size: 13px; } .voice-option-copy small { font-size: 11px; color: var(--muted); }
.voice-check { opacity: 0; color: var(--green); font-weight: 850; transform: scale(.7); transition: .15s ease; }
.voice-option.selected .voice-check { opacity: 1; transform: scale(1); }
.voice-save-note { display:none; min-height: 17px; margin-top: 10px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.voice-current-selection {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 7px;
    padding: 5px 9px;
    border: 1px solid var(--green-line);
    border-radius: 999px;
    background: var(--green-soft);
    color: var(--green);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .02em;
}
.voice-option.selected::after {
    content: 'Selected';
    position: absolute;
    right: 34px;
    top: 7px;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--green);
    opacity: .9;
}

.floating-video {
    position: absolute; z-index: 28; right: 18px; bottom: 118px; width: 300px; height: 230px; min-width: 190px; min-height: 145px;
    border: 1px solid var(--button-border); border-radius: 18px; overflow: hidden; background: #07100a; box-shadow: 0 18px 48px rgba(0,0,0,.24); resize: none;
    user-select: none; touch-action: none;
}
.floating-video[hidden] { display: none; }
.floating-head { height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 0 8px 0 11px; background: rgba(11,17,14,.90); color: #ecf5ee; border-bottom: 1px solid rgba(255,255,255,.08); cursor: grab; touch-action: none; }
.floating-head:active { cursor: grabbing; }
.floating-title { min-width: 0; display: flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.live-mini-dot { width: 7px; height: 7px; border-radius: 50%; background: #69e986; box-shadow: 0 0 0 4px rgba(105,233,134,.08); }
.floating-actions { display: flex; gap: 5px; }
.mini-btn { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; background: rgba(255,255,255,.06); color: #e8f2eb; }
.mini-btn:hover { background: rgba(255,255,255,.10); }
.mini-btn.danger { color: #ff858d; }
.mini-btn svg { width: 16px; height: 16px; }
.video-viewport { position: relative; width: 100%; height: calc(100% - 38px); background: #050807; overflow: hidden; }
.video-viewport video { width: 100%; height: 100%; display: block; object-fit: cover; background: #050807; }
#screenVideo { object-fit: contain; background: #050807; }
.video-badge { position: absolute; left: 9px; bottom: 9px; padding: 4px 7px; border-radius: 7px; color: #0a170d; background: #72e989; font-size: 8px; font-weight: 850; letter-spacing: .08em; }
.resize-handle { position: absolute; width: 17px; height: 17px; right: 0; bottom: 0; cursor: nwse-resize; touch-action: none; }
.resize-handle::after { content: ""; position: absolute; right: 4px; bottom: 4px; width: 8px; height: 8px; border-right: 2px solid rgba(255,255,255,.45); border-bottom: 2px solid rgba(255,255,255,.45); }

.chat-panel {
    position: absolute; z-index: 24; right: 18px; bottom: 182px; width: 380px; height: 360px; min-width: 280px; min-height: 170px;
    display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--button-border); border-radius: 21px; background: color-mix(in srgb, var(--input) 93%, transparent);
    box-shadow: 0 18px 48px rgba(24,45,35,.18); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); touch-action: none;
}
.chat-panel[hidden] { display: none; }
.chat-panel-head { flex: 0 0 44px; display: flex; align-items: center; justify-content: space-between; padding: 8px 10px 8px 13px; border-bottom: 1px solid var(--button-border); cursor: grab; touch-action: none; }
.chat-panel-head:active { cursor: grabbing; }
.chat-panel-title { display: flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 760; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.chat-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px var(--green-soft); }
.chat-count { padding: 2px 6px; border: 1px solid var(--button-border); border-radius: 999px; font-size: 8px; letter-spacing: 0; text-transform: none; }
.chat-head-actions { display: flex; align-items: center; gap: 4px; }
.chat-clear { border: 0; background: transparent; color: var(--muted); font-size: 10px; padding: 4px 6px; border-radius: 7px; }
.chat-clear:hover { color: var(--text); background: var(--green-soft); }
.chat-clear.icon-only { font-size: 19px; line-height: 1; }
.chat-messages { min-height: 0; flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 10px 11px 14px; scrollbar-width: thin; touch-action: pan-y; }
.chat-message { display: flex; flex-direction: column; margin: 8px 0 10px; max-width: 91%; }
.chat-message.user { margin-left: auto; align-items: flex-end; } .chat-message.assistant { margin-right: auto; align-items: flex-start; }
.chat-message-meta { display: flex; align-items: center; gap: 7px; margin: 0 4px 5px; color: var(--muted); font-size: 9px; }
.chat-bubble { max-width: 100%; border-radius: 16px; padding: 9px 11px; border: 1px solid var(--button-border); background: rgba(255,255,255,.56); }
body[data-theme="dark"] .chat-bubble { background: rgba(20,28,35,.84); }
.chat-message.user .chat-bubble { border-color: rgba(38,157,73,.20); background: var(--green-soft); }
.message-scroll { max-height: 225px; overflow-y: auto; overflow-wrap: anywhere; scrollbar-width: thin; touch-action: pan-y; }
.message-chunk { font-size: 12px; line-height: 1.55; }
.message-chunk + .message-chunk { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--button-border); }
.chat-bubble a { color: var(--green); text-decoration: underline; text-underline-offset: 2px; }
.tool-event { display: flex; align-items: flex-start; gap: 6px; margin-top: 8px; padding: 7px 8px; border-radius: 10px; border: 1px solid var(--button-border); background: rgba(255,255,255,.24); color: var(--muted); font-size: 9px; line-height: 1.4; }
body[data-theme="dark"] .tool-event { background: rgba(255,255,255,.025); }
.tool-event-dot { width: 6px; height: 6px; flex: 0 0 6px; margin-top: 3px; border-radius: 50%; background: var(--green); }
.tool-event-detail { min-width: 0; overflow-wrap: anywhere; opacity: .86; }
.grounding-card { margin-top: 8px; padding: 9px; border-radius: 12px; border: 1px solid var(--green-line); background: var(--green-soft); }
.grounding-head { display: flex; align-items: center; gap: 6px; color: var(--green); font-size: 10px; }
.grounding-mark { width: 16px; height: 16px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--green-line); font-size: 10px; }
.grounding-query { margin-top: 6px; color: var(--muted); font-size: 9px; line-height: 1.45; }
.grounding-sources { display: grid; gap: 5px; margin-top: 7px; }
.source-card { display: grid; grid-template-columns: 22px 1fr; gap: 7px; align-items: start; padding: 7px 8px; border-radius: 9px; border: 1px solid var(--button-border); text-decoration: none; background: rgba(255,255,255,.45); color: var(--text); }
body[data-theme="dark"] .source-card { background: rgba(255,255,255,.03); }
.source-icon { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 7px; color: var(--green); background: var(--green-soft); }
.source-card strong { display: block; font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.source-card small { display: block; margin-top: 2px; color: var(--muted); font-size: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.status-pill { position: absolute; left: 50%; bottom: 13px; transform: translateX(-50%); z-index: 15; max-width: min(60vw, 520px); padding: 5px 9px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--button-border); border-radius: 999px; background: color-mix(in srgb, var(--input) 84%, transparent); color: var(--muted); font-size: 9px; backdrop-filter: blur(12px); pointer-events: none; }
.status-pill[hidden] { display: none; }
#statusPillDot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }

@keyframes wave { 0%,100% { transform: scaleY(.65); opacity: .75; } 50% { transform: scaleY(1); opacity: 1; } }
@keyframes pulseDot { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes ringPulse { 0%,100% { transform: scale(.98); opacity: .65; } 50% { transform: scale(1.02); opacity: 1; } }
@keyframes speakingRing { 0%,100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes mouthTalk { from { transform: translateX(-50%) scaleX(.78); } to { transform: translateX(-50%) scaleX(1.08); } }
@keyframes eyeTalk { 0%,100% { transform: scaleY(.92); } 50% { transform: scaleY(1.08); } }

@keyframes orbitSlow { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes orbitReverse { from { transform: rotate(360deg); } to { transform: rotate(0deg); } }
@keyframes haloBreath { 0%,100% { transform: scale(.97); opacity: .48; } 50% { transform: scale(1.035); opacity: .92; } }
@keyframes particleFloat { 0%,100% { transform: translate3d(0,0,0) scale(.85); opacity: .18; } 50% { transform: translate3d(0,-7px,0) scale(1.12); opacity: .62; } }
@keyframes coreThink { 0%,100% { transform: scale(.985); } 50% { transform: scale(1.055); } }
@keyframes faceThink { 0%,100% { transform: translateY(1px) scale(.995); } 50% { transform: translateY(-1px) scale(1.01); } }
@keyframes mouthThink { 0%,100% { opacity: .42; transform: scaleX(.72); } 50% { opacity: 1; transform: scaleX(1.05); } }
@keyframes eyeListen { 0%,100% { transform: scaleY(.96); } 50% { transform: scaleY(1.15); } }
@keyframes mouthListen { 0%,100% { transform: scaleY(.9); } 50% { transform: scaleY(1.7); } }
@keyframes speakHalo { 0%,100% { transform: scale(.97); opacity: .52; } 50% { transform: scale(1.10); opacity: .95; } }
@keyframes speakGlow { 0%,100% { transform: scale(.92); } 50% { transform: scale(1.14); } }
@keyframes faceSpeak { from { transform: translateY(-.5px) scale(1); } to { transform: translateY(1px) scale(1.015); } }
@keyframes eyeSpeak { 0%,100% { transform: scaleY(.93); } 50% { transform: scaleY(1.08); } }
@keyframes mouthSpeak { 0%,100% { transform: scaleY(.8) scaleX(.92); } 50% { transform: scaleY(1.55) scaleX(1.10); } }

@media (max-width: 700px) {
    .topbar { height: 74px; flex-basis: 74px; padding: 0 15px; }
    .brand-mark { width: 44px; height: 44px; } .brand-name { font-size: 17px; } .brand-status { font-size: 11px; }
    .end-button { width: 49px; min-width: 49px; height: 47px; border-radius: 15px; } .end-button span { display: none; }
    .voice-button { width: 49px; height: 47px; border-radius: 15px; } .voice-button-label { display: none; }
    .theme-button { width: 49px; height: 47px; border-radius: 15px; }
    .welcome-screen { padding-bottom: 80px; }
    .welcome-mark { width: 176px; height: 176px; }
    .welcome-face { width: 110px; height: 110px; } .welcome-face i { bottom: 31px; }
    .welcome-title { font-size: 27px; } .welcome-subtitle { font-size: 12px; }
    .welcome-actions { width: min(390px, 100%); grid-template-columns: 1fr; gap: 9px; margin-top: 21px; }
    .start-choice { min-height: 68px; }
    .center-ui { top: 41%; width: 100%; }
    .trustyen-orb { width: 184px; height: 184px; } .center-ui h1 { font-size: 20px; margin-top: 5px; }
    .connection-state { font-size: 13px; } .voice-wave { margin-top: 11px; }
    .media-controls { bottom: 80px; gap: 9px; }
    .media-button { width: 62px; height: 63px; border-radius: 17px; gap: 4px; } .media-button svg { width: 22px; height: 22px; } .media-button span { font-size: 9px; }
    .message-fab { right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); width: 54px; height: 54px; border-radius: 17px; }
    .composer-popover { right: 8px; bottom: 76px; width: calc(100% - 16px); }
    .voice-popover { top: 9px; right: 9px; width: min(350px, calc(100vw - 18px)); }
    .floating-video { right: 11px; bottom: 154px; width: 230px; height: 177px; min-width: 180px; min-height: 138px; }
    .chat-panel { right: 9px; bottom: 148px; width: calc(100% - 18px); height: 300px; min-width: 250px; }
    .message-scroll { max-height: 200px; }
    .status-pill { max-width: calc(100% - 30px); }
}

@media (max-width: 390px) {
    .trustyen-orb { width: 166px; height: 166px; }
    .media-controls { bottom: 78px; } .media-button { width: 60px; height: 61px; }
    .floating-video { width: 210px; height: 162px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}


/* V3 custom settings + full-body reactive Trustyen avatar */
.settings-button{width:50px;height:50px;border-radius:16px;border:1px solid var(--button-border);background:var(--button);color:var(--text);display:inline-flex;align-items:center;justify-content:center;transition:.18s ease;box-shadow:0 4px 18px rgba(0,0,0,.025)}
.settings-button svg{width:22px;height:22px}.settings-button:hover{transform:translateY(-1px) rotate(7deg)}
kbd{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:7px;border:1px solid var(--button-border);background:var(--button);color:var(--text);font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:inset 0 -1px 0 rgba(0,0,0,.08)}
.welcome-note strong{color:var(--text)}
.stage:not(.call-active) .media-controls{display:none}.stage:not(.call-active) #messageFab{display:none}.stage.call-active #messageFab{display:grid}
.trustyen-orb{width:min(340px,58vw);height:min(430px,64vh);max-height:430px;cursor:pointer;user-select:none;-webkit-user-select:none}.trustyen-orb-svg{overflow:visible;filter:drop-shadow(0 28px 50px rgba(33,78,63,.13))}.trustyen-orb::after{content:'Tap Trustyen';position:absolute;left:50%;bottom:-4px;transform:translate(-50%,12px);padding:5px 9px;border-radius:999px;border:1px solid var(--button-border);color:var(--muted);background:color-mix(in srgb,var(--input) 74%,transparent);font-size:8px;letter-spacing:.08em;text-transform:uppercase;opacity:0;pointer-events:none;transition:.25s ease}.trustyen-orb:hover::after{opacity:.8;transform:translate(-50%,0)}
.avatar-ground{fill:rgba(30,53,45,.10);transform-origin:130px 340px;animation:avatarGround 2.5s ease-in-out infinite}.avatar-halo{fill:none;stroke:var(--green-line);transform-origin:130px 175px}.avatar-halo-a{stroke-width:9;opacity:.20;animation:avatarHalo 3.5s ease-in-out infinite}.avatar-halo-b{stroke-width:2;opacity:.26;stroke-dasharray:4 13;animation:avatarOrbit 16s linear infinite reverse}.avatar-orbit{fill:none;stroke:color-mix(in srgb,var(--green) 58%,#60bfff 42%);stroke-linecap:round;opacity:.40;transform-origin:130px 176px}.avatar-orbit-a{stroke-width:1.2;animation:avatarOrbit 7.4s linear infinite}.avatar-orbit-b{stroke-width:1;opacity:.22;animation:avatarOrbit 11s linear infinite reverse}.avatar-orbit-c{stroke-width:.8;opacity:.18;animation:avatarOrbit 14s linear infinite}.avatar-particles circle{fill:var(--green-bright);opacity:.34;animation:avatarParticle 3.8s ease-in-out infinite}.avatar-particles circle:nth-child(2){animation-delay:-.7s}.avatar-particles circle:nth-child(3){animation-delay:-1.2s}.avatar-particles circle:nth-child(4){animation-delay:-2s}.avatar-particles circle:nth-child(5){animation-delay:-2.6s}.avatar-particles circle:nth-child(6){animation-delay:-3.1s}
.avatar-character{transform-origin:130px 220px}.avatar-body{transform-origin:130px 210px}.avatar-face-shell{fill:url(#avatarCoreLight);stroke:color-mix(in srgb,var(--green) 34%,#fff 66%);stroke-width:1.15}body[data-theme="dark"] .avatar-face-shell{fill:url(#avatarCoreDark);stroke:color-mix(in srgb,var(--green) 54%,#fff 20%)}.avatar-neck,.avatar-torso,.avatar-arm,.avatar-leg,.avatar-foot{fill:url(#avatarSuit);stroke:rgba(44,93,75,.22);stroke-width:1}body[data-theme="dark"] .avatar-neck,body[data-theme="dark"] .avatar-torso,body[data-theme="dark"] .avatar-arm,body[data-theme="dark"] .avatar-leg,body[data-theme="dark"] .avatar-foot{fill:url(#avatarSuitDark);stroke:rgba(138,181,167,.18)}.avatar-hand{fill:color-mix(in srgb,var(--green) 22%,#d8e6e1 78%);stroke:rgba(53,103,85,.2);stroke-width:1}.avatar-chest-line,.avatar-collar,.avatar-brow,.avatar-nose{fill:none;stroke:color-mix(in srgb,var(--green) 72%,#8ca99c 28%);stroke-linecap:round;stroke-linejoin:round}.avatar-chest-line{stroke-width:1.1;opacity:.42}.avatar-collar{stroke-width:1.2;opacity:.58}.avatar-core-gem{fill:var(--green);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--green) 68%,transparent));animation:gemPulse 1.6s ease-in-out infinite}.avatar-eye-white{fill:rgba(255,255,255,.78)}.avatar-eye-pupil{fill:var(--green);transform-origin:center;animation:avatarBlink 4.6s ease-in-out infinite}.avatar-brow{stroke-width:2;opacity:.62}.avatar-nose{stroke-width:1.45;opacity:.45}.avatar-mouth{fill:none;stroke:var(--green);stroke-width:3.5;stroke-linecap:round;transform-origin:130px 169px}.avatar-smile-highlight{fill:none;stroke:rgba(255,255,255,.46);stroke-width:1.2;stroke-linecap:round}.avatar-ear{fill:none;stroke:color-mix(in srgb,var(--green) 35%,#8ca99c 65%);stroke-width:2}.avatar-ear-jewel{fill:#ffd66e;opacity:0}.avatar-mic-bars{opacity:0;fill:var(--green)}.avatar-hair{fill:color-mix(in srgb,var(--green) 22%,#202c28 78%)}body[data-theme="dark"] .avatar-hair{fill:#0b1110}.avatar-hair-female{display:none}.avatar-hair-male{display:block}.avatar-thought-bubbles{opacity:0;transform-origin:187px 86px}.thought-dot{fill:color-mix(in srgb,#9b7cff 70%,var(--green) 30%)}.ear-wave{fill:none;stroke:#60ddff;stroke-width:1.8;stroke-linecap:round;opacity:0}
.trustyen-orb[data-voice="female"] .avatar-hair-male{display:none}.trustyen-orb[data-voice="female"] .avatar-hair-female{display:block}.trustyen-orb[data-voice="female"] .avatar-ear-jewel{opacity:.95}.trustyen-orb[data-voice="male"] .avatar-ear-jewel{opacity:0}
.trustyen-orb[data-state="connecting"] .avatar-character{animation:avatarFloat 1.4s ease-in-out infinite}.trustyen-orb[data-state="connecting"] .avatar-orbit{stroke:#8c72ff;opacity:.72}.trustyen-orb[data-state="connecting"] .avatar-core-gem{animation-duration:.7s}
.trustyen-orb[data-state="thinking"] .avatar-head{animation:avatarThinkHead 1.6s ease-in-out infinite}.trustyen-orb[data-state="thinking"] .avatar-character{animation:avatarThinkBody 2.2s ease-in-out infinite}.trustyen-orb[data-state="thinking"] .avatar-thought-bubbles{opacity:1;animation:thoughtRise 1.4s ease-in-out infinite}.trustyen-orb[data-state="thinking"] .avatar-mouth{stroke:#a07cff;stroke-dasharray:5 4;animation:avatarThinkMouth .8s ease-in-out infinite}.trustyen-orb[data-state="thinking"] .avatar-core-gem{fill:#9e7bff}
.trustyen-orb[data-state="listening"] .avatar-character{animation:avatarListen .9s ease-in-out infinite}.trustyen-orb[data-state="listening"] .avatar-ear-waves .ear-wave{opacity:1;animation:earPulse .85s ease-in-out infinite}.trustyen-orb[data-state="listening"] .avatar-mic-bars{opacity:1}.trustyen-orb[data-state="listening"] .avatar-mic-bars rect{animation:barTalk .55s ease-in-out infinite alternate}.trustyen-orb[data-state="listening"] .avatar-mic-bars rect:nth-child(2){animation-delay:-.23s}.trustyen-orb[data-state="listening"] .avatar-mic-bars rect:nth-child(3){animation-delay:-.38s}.trustyen-orb[data-state="listening"] .avatar-eye-pupil{fill:#42d8ff;animation:listenEyes .7s ease-in-out infinite}
.trustyen-orb[data-state="speaking"] .avatar-character{animation:avatarSpeakBody .32s ease-in-out infinite alternate}.trustyen-orb[data-state="speaking"] .avatar-head{animation:avatarSpeakHead .32s ease-in-out infinite alternate}.trustyen-orb[data-state="speaking"] .avatar-mouth{stroke:var(--green-bright);stroke-width:4.8;animation:avatarTalk .16s ease-in-out infinite alternate}.trustyen-orb[data-state="speaking"] .avatar-eye-pupil{animation:speakEyes 1.8s ease-in-out infinite}.trustyen-orb[data-state="speaking"] .avatar-halo-a{animation:avatarSpeakHalo .62s ease-in-out infinite}.trustyen-orb[data-state="speaking"] .avatar-core-gem{animation-duration:.44s}.trustyen-orb[data-state="speaking"] .avatar-mic-bars{opacity:1}.trustyen-orb[data-state="speaking"] .avatar-mic-bars rect{animation:barTalk .19s ease-in-out infinite alternate}.trustyen-orb[data-state="idle"] .avatar-core-gem{animation-duration:2.1s}.trustyen-orb[data-state="idle"] .avatar-character{animation:avatarIdle 3.8s ease-in-out infinite}.trustyen-orb[data-state="offline"]{opacity:.75}.trustyen-orb[data-state="offline"] .avatar-orbit,.trustyen-orb[data-state="offline"] .avatar-halo{opacity:.10;animation-play-state:paused}
.trustyen-orb[data-action="dance"] .avatar-character{animation:danceCharacter .55s ease-in-out infinite}.trustyen-orb[data-action="dance"] .avatar-arm-left{animation:danceArmLeft .55s ease-in-out infinite;transform-origin:91px 236px}.trustyen-orb[data-action="dance"] .avatar-arm-right{animation:danceArmRight .55s ease-in-out infinite;transform-origin:169px 236px}.trustyen-orb[data-action="wave"] .avatar-arm-right{animation:waveArm .55s ease-in-out infinite;transform-origin:169px 236px}.trustyen-orb[data-action="happy"] .avatar-mouth{animation:happyMouth .8s ease-in-out infinite}.trustyen-orb[data-action="happy"] .avatar-eye-pupil{animation:happyEyes .8s ease-in-out infinite}.trustyen-orb[data-action="spin"] .avatar-character{animation:characterSpin 1.7s ease-in-out infinite}
.settings-overlay{position:fixed;inset:0;z-index:89;background:rgba(3,8,7,.42);backdrop-filter:blur(4px)}.settings-overlay[hidden]{display:none}.settings-panel{position:fixed;z-index:90;top:0;right:0;width:min(430px,100vw);height:100dvh;overflow:auto;overscroll-behavior:contain;padding:26px 20px max(28px,env(safe-area-inset-bottom));background:color-mix(in srgb,var(--input) 96%,transparent);border-left:1px solid var(--button-border);box-shadow:-22px 0 60px rgba(0,0,0,.14);transform:translateX(102%);transition:transform .18s ease;backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px)}.settings-panel[hidden]{display:block;visibility:hidden;pointer-events:none}.settings-panel.open{transform:translateX(0);visibility:visible;pointer-events:auto}.settings-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--button-border)}.settings-kicker{color:var(--green);font-size:8px;font-weight:800;letter-spacing:.17em}.settings-head h2{margin:4px 0 0;font-size:24px;letter-spacing:-.04em}.settings-head p{margin:6px 0 0;color:var(--muted);font-size:11px;line-height:1.5}.settings-section{padding:18px 0;border-bottom:1px solid var(--button-border)}.settings-section-title{margin-bottom:10px;font-size:12px;font-weight:800}.settings-subtitle{margin:14px 0 7px;color:var(--muted);font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:.1em}.settings-row{display:flex;gap:8px}.theme-choice,.small-action,.clear-settings-button{border:1px solid var(--button-border);border-radius:12px;background:var(--button);color:var(--text);min-height:38px;padding:0 13px;font-size:11px;font-weight:700;transition:.15s ease}.theme-choice{flex:1}.theme-choice.active,.small-action.primary-action{border-color:var(--green-line);background:var(--green-soft);color:var(--green)}.theme-choice:hover,.small-action:hover{transform:translateY(-1px)}.color-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.color-field{display:grid;grid-template-columns:1fr 42px;align-items:center;gap:8px;padding:8px;border:1px solid var(--button-border);border-radius:12px;background:rgba(255,255,255,.18);font-size:9px;color:var(--muted)}body[data-theme="dark"] .color-field{background:rgba(255,255,255,.02)}.color-field input{width:34px;height:28px;padding:0;border:0;background:transparent}.settings-input-label{display:grid;gap:6px;margin:7px 0;color:var(--muted);font-size:9px}.settings-input-label input,.custom-instruction{width:100%;border:1px solid var(--button-border);border-radius:12px;background:var(--input);color:var(--text);outline:none}.settings-input-label input{height:38px;padding:0 11px;font-size:11px}.custom-instruction{min-height:122px;resize:vertical;padding:11px;font-size:11px;line-height:1.55}.settings-input-label input:focus,.custom-instruction:focus{border-color:var(--green-line);box-shadow:0 0 0 3px var(--green-soft)}.file-picker{display:flex;justify-content:space-between;align-items:center;min-height:38px;padding:0 11px;border:1px dashed var(--green-line);border-radius:12px;color:var(--green);background:var(--green-soft);font-size:10px;font-weight:700;cursor:pointer}.file-picker input{display:none}.settings-inline-actions{display:flex;gap:8px;margin-top:8px}.settings-inline-actions .small-action{flex:1}.settings-status,.settings-help{color:var(--muted);font-size:9px;line-height:1.5}.settings-status{margin-top:7px;min-height:14px}.language-options{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-height:270px;overflow:auto;margin-top:8px;padding-right:2px}.language-option{display:flex;align-items:center;justify-content:space-between;gap:5px;min-width:0;padding:9px;border:1px solid var(--button-border);border-radius:10px;color:var(--text);background:var(--button);text-align:left}.language-option strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px}.language-option span{color:var(--muted);font-size:7px;font-family:ui-monospace,monospace}.language-option.active{border-color:var(--green-line);background:var(--green-soft)}.language-empty{grid-column:1 / -1;padding:14px;text-align:center;color:var(--muted);font-size:10px}.selection-chip{width:max-content;max-width:100%;padding:6px 9px;border-radius:999px;background:var(--green-soft);border:1px solid var(--green-line);color:var(--green);font-size:9px;font-weight:750}.style-options{display:grid;grid-template-columns:1fr 1fr;gap:7px}.style-option{min-height:57px;padding:9px;border:1px solid var(--button-border);border-radius:12px;background:var(--button);color:var(--text);text-align:left;display:flex;flex-direction:column;gap:3px}.style-option strong{font-size:10px}.style-option small{color:var(--muted);font-size:8px;line-height:1.35}.style-option.active{border-color:var(--green-line);background:var(--green-soft)}.shortcut-line{display:flex;align-items:center;gap:6px;margin:7px 0}.shortcut-line small{color:var(--muted);margin-left:4px;font-size:9px}.clear-settings-button{width:100%;color:#ff6873;border-color:rgba(255,104,115,.24);background:rgba(255,104,115,.07)}.clear-settings-button:hover{background:rgba(255,104,115,.12)}
.voice-avatar-mini{position:relative;width:30px;height:30px;flex:0 0 30px;border-radius:11px;display:grid;place-items:center;background:var(--green-soft);border:1px solid var(--green-line);overflow:hidden}.voice-avatar-mini::before{content:'';width:15px;height:17px;border-radius:48% 48% 42% 42%;background:color-mix(in srgb,var(--green) 24%,#e8f1ee 76%);border:1px solid var(--green-line)}.voice-avatar-mini::after{content:'';position:absolute;width:19px;height:8px;top:4px;border-radius:9px 9px 5px 5px;background:#27332f}.voice-avatar-mini span{position:absolute;bottom:6px;width:8px;height:2px;border-radius:999px;background:var(--green);z-index:2}.female-mini::after{width:22px;height:19px;top:2px;border-radius:13px 13px 7px 7px;background:#2d242b}
@keyframes avatarOrbit{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes avatarHalo{0%,100%{transform:scale(.98);opacity:.12}50%{transform:scale(1.04);opacity:.32}}@keyframes avatarParticle{0%,100%{transform:translateY(0) scale(.86);opacity:.17}50%{transform:translateY(-8px) scale(1.18);opacity:.62}}@keyframes avatarGround{0%,100%{transform:scaleX(.94);opacity:.24}50%{transform:scaleX(1.04);opacity:.48}}@keyframes gemPulse{0%,100%{transform:scale(.82);opacity:.78}50%{transform:scale(1.12);opacity:1}}@keyframes avatarBlink{0%,43%,48%,100%{transform:scaleY(1)}45%,46%{transform:scaleY(.08)}}@keyframes avatarIdle{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes avatarFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes avatarThinkHead{0%,100%{transform:rotate(0) translateY(0)}50%{transform:rotate(-4deg) translateY(-1px)}}@keyframes avatarThinkBody{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes thoughtRise{0%,100%{transform:translate(0,4px) scale(.86);opacity:.2}50%{transform:translate(2px,-6px) scale(1.02);opacity:1}}@keyframes avatarThinkMouth{0%,100%{transform:scaleX(.78);opacity:.42}50%{transform:scaleX(1.04);opacity:1}}@keyframes avatarListen{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes earPulse{0%,100%{transform:scale(.82);opacity:.12}50%{transform:scale(1.08);opacity:.95}}@keyframes barTalk{from{transform:scaleY(.55);transform-origin:center bottom}to{transform:scaleY(1.45);transform-origin:center bottom}}@keyframes listenEyes{0%,100%{transform:translateX(-1px) scaleY(.92)}50%{transform:translateX(1px) scaleY(1.08)}}@keyframes avatarSpeakBody{from{transform:translateY(-1px) scale(1)}to{transform:translateY(2px) scale(1.014)}}@keyframes avatarSpeakHead{from{transform:translateY(0) scale(1)}to{transform:translateY(1px) scale(1.01)}}@keyframes avatarTalk{0%,100%{transform:translateY(0) scale(.83,.72)}50%{transform:translateY(1px) scale(1.13,1.6)}}@keyframes speakEyes{0%,100%{transform:scaleY(.94)}35%{transform:scaleY(1.06)}50%{transform:scaleY(.12)}54%{transform:scaleY(1)}}@keyframes avatarSpeakHalo{0%,100%{transform:scale(.98);opacity:.18}50%{transform:scale(1.08);opacity:.45}}@keyframes danceCharacter{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-10px) rotate(-3deg)}75%{transform:translateY(-10px) rotate(3deg)}}@keyframes danceArmLeft{0%,100%{transform:rotate(16deg)}50%{transform:rotate(-28deg)}}@keyframes danceArmRight{0%,100%{transform:rotate(-16deg)}50%{transform:rotate(28deg)}}@keyframes waveArm{0%,100%{transform:rotate(-5deg)}30%{transform:rotate(-45deg)}60%{transform:rotate(-25deg)}}@keyframes happyMouth{0%,100%{transform:translateY(0) scaleX(.86)}50%{transform:translateY(2px) scaleX(1.18)}}@keyframes happyEyes{0%,100%{transform:scaleY(.92)}50%{transform:scaleY(.44)}}@keyframes characterSpin{0%,100%{transform:rotateY(0) scale(1)}50%{transform:rotateY(12deg) scale(1.02)}}
@media(max-width:700px){.settings-button{width:49px;height:47px;border-radius:15px}.trustyen-orb{width:min(280px,73vw);height:min(350px,51vh)}.center-ui{top:44%}.settings-panel{width:min(100vw,430px);padding:max(16px,env(safe-area-inset-top)) 14px max(20px,env(safe-area-inset-bottom))}.language-options,.style-options{grid-template-columns:1fr}.color-grid{grid-template-columns:1fr 1fr}.settings-head h2{font-size:21px}}
@media(max-width:390px){.trustyen-orb{width:250px;height:320px}.welcome-note{max-width:330px}}


/* V6 hybrid human/robot face avatar */
.trustyen-orb{
    width:min(300px,58vw);
    height:min(300px,58vw);
    min-width:230px;
    min-height:230px;
    cursor:pointer;
}
.trustyen-orb-svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 24px 44px rgba(25,90,78,.18));}
.hybrid-halo{fill:url(#hybridHalo);opacity:.52;transform-origin:120px 120px;}
.hybrid-halo-a{animation:hybridHaloPulse 3.6s ease-in-out infinite;}
.hybrid-halo-b{opacity:.26;animation:hybridHaloPulse 2.2s ease-in-out infinite reverse;}
.hybrid-ring,.hybrid-orbit{fill:none;transform-origin:120px 120px;}
.hybrid-ring{stroke:color-mix(in srgb,var(--green) 50%,#7db9ff 50%);}
.hybrid-ring-a{stroke-width:1.5;opacity:.42;stroke-dasharray:4 12 38 14;animation:hybridOrbit 9s linear infinite;}
.hybrid-ring-b{stroke-width:.9;opacity:.28;stroke-dasharray:2 8;animation:hybridOrbit 14s linear infinite reverse;}
.hybrid-orbit{stroke:color-mix(in srgb,var(--green) 50%,#ae8cff 50%);stroke-linecap:round;}
.hybrid-orbit-a{stroke-width:1.15;opacity:.32;animation:hybridOrbit 8.5s linear infinite;}
.hybrid-orbit-b{stroke-width:.8;opacity:.22;animation:hybridOrbit 12s linear infinite reverse;}
.avatar-character{transform-origin:120px 120px;}
.hybrid-face{stroke:rgba(43,69,67,.22);stroke-width:1.2;}
.human-base{transition:fill .35s ease,stroke .35s ease;}
.male-face.human-base{fill:url(#hybridHumanMale);}
.female-face.human-base{fill:url(#hybridHumanFemale);display:none;}
.hybrid-hair{transition:opacity .2s ease;}
.hybrid-hair-male{fill:url(#hybridHairMale);}
.hybrid-hair-female{fill:url(#hybridHairFemale);display:none;}
.trustyen-orb[data-voice="female"] .male-face{display:none;}
.trustyen-orb[data-voice="female"] .female-face{display:block;}
.trustyen-orb[data-voice="female"] .hybrid-hair-male{display:none;}
.trustyen-orb[data-voice="female"] .hybrid-hair-female{display:block;}
.robot-surface{fill:url(#hybridRobot);opacity:.96;transition:fill .35s ease;}
body[data-theme="dark"] .robot-surface{fill:url(#hybridRobotDark);}
.robot-jaw{fill:none;stroke:rgba(210,244,238,.25);stroke-width:1.1;}
.robot-panel,.robot-circuit,.robot-brow,.hybrid-split,.robot-ear{fill:none;stroke:var(--green);stroke-linecap:round;stroke-linejoin:round;}
.robot-panel{stroke-width:1.05;opacity:.33;}
.robot-circuit{stroke-width:1.5;opacity:.56;}
.robot-brow{stroke-width:2.2;opacity:.62;}
.robot-circuit-dot,.robot-ear-core,.status-node{fill:var(--green-bright);}
.robot-circuit-dot{opacity:.76;filter:drop-shadow(0 0 4px var(--green));}
.hybrid-split{stroke:color-mix(in srgb,var(--green) 66%,#a680ff 34%);stroke-width:2;opacity:.72;stroke-dasharray:5 5;}
.hybrid-jaw-line{fill:none;stroke:rgba(124,95,90,.28);stroke-width:1.2;}
.robot-eye-frame{fill:none;stroke:#bdfde9;stroke-width:1.3;opacity:.62;}
.robot-pupil{fill:var(--green-bright);filter:drop-shadow(0 0 7px var(--green-bright));transform-origin:center;}
.hybrid-brow,.hybrid-nose,.human-ear{fill:none;stroke:#6d5146;stroke-width:1.55;stroke-linecap:round;opacity:.58;}
.hybrid-eye-white{fill:#fffdf8;stroke:rgba(100,76,69,.25);stroke-width:1;}
.hybrid-human-pupil{fill:#293437;transform-origin:center;}
.robot-ear{fill:url(#hybridRobot);stroke-width:1.3;}
.robot-ear-core{opacity:.86;filter:drop-shadow(0 0 7px var(--green));}
.hybrid-mouth path{fill:none;stroke-linecap:round;}
.mouth-human{stroke:#9a5c55;stroke-width:2;opacity:.75;}
.mouth-robot{stroke:var(--green);stroke-width:2;opacity:.72;}
.mouth-line{stroke:color-mix(in srgb,var(--green) 58%,#d07076 42%);stroke-width:1.15;opacity:.34;}
.status-node{opacity:.55;filter:drop-shadow(0 0 4px var(--green));}
.status-line{fill:none;stroke:var(--green-line);stroke-width:1.1;opacity:.45;}
.hybrid-thought-bubbles{opacity:0;transform-origin:190px 42px;}
.hybrid-ear-waves{opacity:0;}
.hybrid-ear-wave{fill:none;stroke:var(--green);stroke-width:2.1;stroke-linecap:round;opacity:0;}
.hybrid-ear-wave.outer{stroke-width:1.3;}

body[data-theme="dark"] .hybrid-brow,
body[data-theme="dark"] .hybrid-nose,
body[data-theme="dark"] .human-ear{stroke:#e4b7a5;opacity:.46;}
body[data-theme="dark"] .hybrid-jaw-line{stroke:rgba(244,189,169,.2);}
body[data-theme="dark"] .hybrid-eye-white{fill:#fcffff;}

.trustyen-orb[data-state="connecting"] .avatar-character{animation:hybridFloat 1.3s ease-in-out infinite;}
.trustyen-orb[data-state="thinking"] .avatar-character{animation:hybridThink 1.65s ease-in-out infinite;}
.trustyen-orb[data-state="thinking"] .hybrid-thought-bubbles{opacity:1;animation:thoughtOrbit 1.4s ease-in-out infinite;}
.trustyen-orb[data-state="thinking"] .robot-pupil{animation:thinkScan .72s ease-in-out infinite alternate;}
.trustyen-orb[data-state="thinking"] .hybrid-human-pupil{animation:thinkHumanEye .9s ease-in-out infinite alternate;}
.trustyen-orb[data-state="listening"] .hybrid-ear-waves{opacity:1;}
.trustyen-orb[data-state="listening"] .hybrid-ear-wave{animation:earWave .8s ease-in-out infinite;}
.trustyen-orb[data-state="listening"] .hybrid-ear-wave.outer{animation-delay:.18s;}
.trustyen-orb[data-state="listening"] .robot-pupil{animation:listenScan .68s ease-in-out infinite alternate;}
.trustyen-orb[data-state="listening"] .hybrid-human-pupil{animation:listenHumanEye .62s ease-in-out infinite alternate;}
.trustyen-orb[data-state="speaking"] .avatar-character{animation:hybridSpeak .27s ease-in-out infinite alternate;}
.trustyen-orb[data-state="speaking"] .hybrid-mouth{animation:mouthTalk .16s ease-in-out infinite alternate;transform-origin:120px 162px;}
.trustyen-orb[data-state="speaking"] .robot-pupil{animation:speakRobotEye 1.3s ease-in-out infinite;}
.trustyen-orb[data-state="speaking"] .hybrid-human-pupil{animation:speakHumanEye 1.6s ease-in-out infinite;}
.trustyen-orb[data-state="speaking"] .status-node{animation:statusPulse .42s ease-in-out infinite alternate;}
.trustyen-orb[data-state="speaking"] .robot-circuit-dot{animation:statusPulse .22s ease-in-out infinite alternate;}

/* Natural blinking: applies to both character presentations. */
.hybrid-human-pupil,.robot-pupil{animation:hybridBlink 5.2s ease-in-out infinite;}
.trustyen-orb[data-state="speaking"] .hybrid-human-pupil,
.trustyen-orb[data-state="speaking"] .robot-pupil,
.trustyen-orb[data-state="listening"] .hybrid-human-pupil,
.trustyen-orb[data-state="listening"] .robot-pupil,
.trustyen-orb[data-state="thinking"] .hybrid-human-pupil,
.trustyen-orb[data-state="thinking"] .robot-pupil{animation-name:hybridBlinkState;}

.trustyen-orb[data-action="dance"] .avatar-character{animation:faceDance .52s ease-in-out infinite;}
.trustyen-orb[data-action="wave"] .avatar-character{animation:faceWave .75s ease-in-out infinite;}
.trustyen-orb[data-action="happy"] .hybrid-mouth{animation:faceHappy .65s ease-in-out infinite;transform-origin:120px 162px;}
.trustyen-orb[data-action="spin"] .avatar-character{animation:faceSpin 1.55s ease-in-out infinite;}
.trustyen-orb[data-action="dance"] .hybrid-halo-a,
.trustyen-orb[data-action="happy"] .hybrid-halo-a{animation-duration:.8s;}

@keyframes hybridHaloPulse{0%,100%{transform:scale(.94);opacity:.35}50%{transform:scale(1.06);opacity:.68}}
@keyframes hybridOrbit{to{transform:rotate(360deg)}}
@keyframes hybridFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px) rotate(-1deg)}}
@keyframes hybridThink{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-3px) rotate(-1.2deg)}70%{transform:translateY(2px) rotate(1deg)}}
@keyframes thoughtOrbit{0%,100%{transform:translate(0,0) scale(.96)}50%{transform:translate(2px,-5px) scale(1.03)}}
@keyframes thinkScan{0%{transform:translateX(-2px)}100%{transform:translateX(3px)}}
@keyframes thinkHumanEye{0%{transform:translateX(-2px)}100%{transform:translateX(2px)}}
@keyframes earWave{0%,100%{opacity:.22;transform:scale(.88)}50%{opacity:1;transform:scale(1.04)}}
@keyframes listenScan{0%{transform:translateX(-3px)}100%{transform:translateX(3px)}}
@keyframes listenHumanEye{0%{transform:translateX(-2px)}100%{transform:translateX(1px)}}
@keyframes hybridSpeak{0%{transform:translateY(0) scale(1)}100%{transform:translateY(-1.5px) scale(1.012)}}
@keyframes mouthTalk{0%{transform:scaleY(.72)}100%{transform:scaleY(1.18)}}
@keyframes speakRobotEye{0%,100%{transform:scale(1)}45%{transform:scale(1.1)}}
@keyframes speakHumanEye{0%,100%{transform:translateX(0)}50%{transform:translateX(2px)}}
@keyframes statusPulse{0%{opacity:.35}100%{opacity:1}}
@keyframes hybridBlink{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.12)}}
@keyframes hybridBlinkState{0%,32%,36%,100%{transform:scaleY(1)}34%{transform:scaleY(.11)}}
@keyframes faceDance{0%,100%{transform:rotate(0) translateY(0) scale(1)}25%{transform:rotate(-5deg) translateY(-2px) scale(1.02)}50%{transform:rotate(5deg) translateY(-4px) scale(1.035)}75%{transform:rotate(-3deg) translateY(-2px) scale(1.02)}}
@keyframes faceWave{0%,100%{transform:rotate(0) translateY(0)}25%{transform:rotate(-4deg) translateY(-2px)}50%{transform:rotate(4deg) translateY(-1px)}75%{transform:rotate(-2deg) translateY(-2px)}}
@keyframes faceHappy{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes faceSpin{0%{transform:rotateY(0)}50%{transform:rotateY(180deg) scale(.96)}100%{transform:rotateY(360deg)}}

/* The shortcut/help sentence is a desktop hint only. */
@media(max-width:700px){
    .welcome-note{display:none !important;}
    .trustyen-orb{width:min(272px,76vw);height:min(272px,76vw);min-width:220px;min-height:220px;}
}
@media(max-width:390px){
    .trustyen-orb{width:242px;height:242px;min-width:242px;min-height:242px;}
}

@media(prefers-reduced-motion:reduce){
    .hybrid-halo,.hybrid-ring,.hybrid-orbit,.avatar-character,.hybrid-thought-bubbles,.hybrid-ear-wave,.hybrid-mouth,.hybrid-human-pupil,.robot-pupil,.status-node,.robot-circuit-dot{animation:none !important;}
}

/* =========================================================
   TRUSTYEN SIMPLE ROBOT FACE — FINAL UI OVERRIDES
   ========================================================= */

/* Only show the compact text-chat launcher after a call starts. */
.stage:not(.call-active) .message-fab { display: none; }

.trustyen-orb {
    width: 252px !important;
    height: 252px !important;
    display: grid;
    place-items: center;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}

.trustyen-orb-svg.simple-robot-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
    filter: drop-shadow(0 18px 34px rgba(49, 120, 145, .16));
}

.simple-robot-halo,
.simple-robot-orbit {
    fill: none;
    transform-origin: 120px 120px;
}

.simple-robot-halo.halo-a {
    stroke: rgba(72, 203, 255, .15);
    stroke-width: 10;
    opacity: .7;
    animation: trustyenHaloBreath 3s ease-in-out infinite;
}

.simple-robot-halo.halo-b {
    stroke: rgba(127, 109, 255, .12);
    stroke-width: 6;
    opacity: .7;
    animation: trustyenHaloBreath 2.35s ease-in-out infinite reverse;
}

.simple-robot-orbit {
    stroke: rgba(68, 198, 255, .18);
    stroke-width: 1.3;
    stroke-dasharray: 56 15 8 24;
    animation: trustyenOrbit 8s linear infinite;
}

.simple-robot-character {
    transform-box: fill-box;
    transform-origin: 50% 54%;
}

.simple-robot-head {
    fill: url(#robotFaceShell);
    stroke: rgba(72, 91, 108, .46);
    stroke-width: 2;
}

body[data-theme="dark"] .simple-robot-head {
    fill: url(#robotFaceDark);
    stroke: rgba(154, 185, 205, .27);
}

.simple-robot-visor {
    fill: rgba(12, 25, 35, .82);
    stroke: rgba(146, 211, 230, .26);
    stroke-width: 1.2;
}

.simple-robot-ear {
    fill: rgba(129, 151, 166, .72);
    stroke: rgba(53, 86, 104, .42);
    stroke-width: 1.5;
}

body[data-theme="dark"] .simple-robot-ear {
    fill: #293946;
    stroke: rgba(150, 184, 201, .22);
}

.simple-robot-ear-line,
.simple-robot-antenna,
.simple-robot-nose,
.simple-robot-mouth,
.simple-robot-mouth-inner,
.simple-robot-brow,
.simple-robot-soundwaves {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.simple-robot-ear-line {
    stroke: rgba(106, 225, 255, .62);
    stroke-width: 2.2;
}

.simple-robot-antenna {
    stroke: rgba(110, 138, 155, .82);
    stroke-width: 2.5;
}

.simple-robot-antenna-dot {
    fill: #56d6ff;
    filter: url(#robotGlow);
}

.simple-robot-antenna-glow {
    fill: rgba(73, 210, 255, .08);
}

.simple-robot-brow {
    stroke: rgba(176, 204, 218, .68);
    stroke-width: 2.4;
}

.simple-robot-eye .eye-frame {
    fill: rgba(72, 96, 110, .22);
    stroke: rgba(183, 223, 236, .28);
    stroke-width: 1;
}

.simple-robot-eye .eye-glow {
    fill: rgba(91, 213, 255, .20);
    transition: fill .2s ease;
}

.simple-robot-eye .eye-pupil {
    fill: #8ce9ff;
    transform-box: fill-box;
    transform-origin: center;
}

.simple-robot-status circle {
    fill: #72d8f4;
    opacity: .45;
}

.simple-robot-mouth {
    stroke: rgba(174, 211, 225, .84);
    stroke-width: 3.2;
    transform-box: fill-box;
    transform-origin: center;
}

.simple-robot-mouth-inner {
    stroke: rgba(83, 118, 136, .38);
    stroke-width: 2;
    opacity: .75;
}

.simple-robot-neck {
    fill: rgba(95, 116, 129, .66);
}

body[data-theme="dark"] .simple-robot-neck {
    fill: #25313c;
}

.simple-robot-thinking,
.simple-robot-soundwaves {
    opacity: 0;
    pointer-events: none;
}

.simple-robot-thinking circle {
    fill: #9a83ff;
}

.simple-robot-soundwaves path {
    stroke: #55dfff;
    stroke-width: 2.3;
    opacity: .7;
}

/* Idle: gentle breathing + natural blink. */
.trustyen-orb[data-state="idle"] .simple-robot-character {
    animation: trustyenIdleFace 3.8s ease-in-out infinite;
}
.trustyen-orb[data-state="idle"] .eye-pupil {
    animation: trustyenBlink 4.8s ease-in-out infinite;
}

/* Connecting/thinking: purple intelligence pulse + scanning eyes. */
.trustyen-orb[data-state="connecting"] .simple-robot-character,
.trustyen-orb[data-state="thinking"] .simple-robot-character {
    animation: trustyenThinkFace 1.25s ease-in-out infinite;
}
.trustyen-orb[data-state="connecting"] .simple-robot-orbit,
.trustyen-orb[data-state="thinking"] .simple-robot-orbit {
    stroke: rgba(152, 124, 255, .48);
}
.trustyen-orb[data-state="connecting"] .simple-robot-thinking,
.trustyen-orb[data-state="thinking"] .simple-robot-thinking {
    opacity: 1;
    animation: trustyenThought 1.35s ease-in-out infinite;
}
.trustyen-orb[data-state="thinking"] .eye-pupil {
    animation: trustyenThinkEyes .78s ease-in-out infinite alternate;
}
.trustyen-orb[data-state="thinking"] .simple-robot-mouth {
    stroke: #9a83ff;
    stroke-dasharray: 6 7;
    animation: trustyenThinkMouth .7s ease-in-out infinite;
}

/* Listening: cyan hearing waves + attentive eyes. */
.trustyen-orb[data-state="listening"] .simple-robot-character {
    animation: trustyenListenFace .85s ease-in-out infinite;
}
.trustyen-orb[data-state="listening"] .simple-robot-soundwaves {
    opacity: 1;
}
.trustyen-orb[data-state="listening"] .simple-robot-soundwaves path {
    animation: trustyenSoundWave .8s ease-in-out infinite;
}
.trustyen-orb[data-state="listening"] .simple-robot-soundwaves path:nth-child(2) { animation-delay: -.18s; }
.trustyen-orb[data-state="listening"] .simple-robot-soundwaves path:nth-child(3) { animation-delay: -.32s; }
.trustyen-orb[data-state="listening"] .simple-robot-soundwaves path:nth-child(4) { animation-delay: -.5s; }
.trustyen-orb[data-state="listening"] .eye-pupil {
    fill: #44dcff;
    animation: trustyenListenEyes .65s ease-in-out infinite alternate;
}
.trustyen-orb[data-state="listening"] .simple-robot-mouth {
    stroke: #44dcff;
    animation: trustyenListenMouth 1s ease-in-out infinite;
}

/* Speaking: unmistakably blue eyes + animated mouth and energy. */
.trustyen-orb[data-state="speaking"] .simple-robot-character {
    animation: trustyenSpeakFace .27s ease-in-out infinite alternate;
}
.trustyen-orb[data-state="speaking"] .simple-robot-head {
    filter: drop-shadow(0 0 12px rgba(63, 187, 255, .16));
}
.trustyen-orb[data-state="speaking"] .eye-glow {
    fill: rgba(42, 187, 255, .70);
}
.trustyen-orb[data-state="speaking"] .eye-pupil {
    fill: #36c8ff;
    filter: url(#robotGlow);
    animation: trustyenSpeakEyes 1.2s ease-in-out infinite;
}
.trustyen-orb[data-state="speaking"] .simple-robot-mouth {
    stroke: #4ecaff;
    stroke-width: 4.4;
    animation: trustyenSpeakMouth .16s ease-in-out infinite alternate;
}
.trustyen-orb[data-state="speaking"] .simple-robot-mouth-inner {
    opacity: .25;
}
.trustyen-orb[data-state="speaking"] .simple-robot-status circle {
    fill: #49cfff;
    animation: trustyenStatusBlink .42s ease-in-out infinite alternate;
}
.trustyen-orb[data-state="speaking"] .simple-robot-halo.halo-a {
    stroke: rgba(70, 194, 255, .34);
    animation-duration: .82s;
}

.trustyen-orb[data-state="offline"] {
    opacity: .72;
}
.trustyen-orb[data-state="offline"] .simple-robot-orbit {
    opacity: .18;
    animation-play-state: paused;
}

/* Tap while idle: playful face-only reactions. */
.trustyen-orb[data-action="dance"] .simple-robot-character {
    animation: trustyenDanceFace .52s ease-in-out infinite;
}
.trustyen-orb[data-action="wave"] .simple-robot-head {
    animation: trustyenWaveFace .62s ease-in-out infinite;
}
.trustyen-orb[data-action="happy"] .simple-robot-mouth {
    animation: trustyenHappyMouth .62s ease-in-out infinite;
}
.trustyen-orb[data-action="spin"] .simple-robot-character {
    animation: trustyenSpinFace 1.45s ease-in-out infinite;
}

/* Small robot button for manual text chat. */
.message-fab {
    width: 50px;
    height: 50px;
    border-radius: 16px;
    color: #07141d;
    background: linear-gradient(145deg, #84edff, #59caff 55%, #7e72ff);
    border: 1px solid rgba(105, 220, 255, .4);
    box-shadow: 0 12px 28px rgba(59, 171, 219, .22), 0 0 0 1px rgba(255,255,255,.06) inset;
}
body[data-theme="dark"] .message-fab {
    color: #061219;
    background: linear-gradient(145deg, #8cf1ff, #49bfff 55%, #796bff);
}
.message-fab svg { width: 29px; height: 29px; }
.message-fab:hover { transform: translateY(-2px) scale(1.04); }

/* Desktop text chat lives at the right corner; user opens it manually. */
@media (min-width: 701px) {
    .chat-panel {
        right: 18px !important;
        bottom: 128px !important;
    }
    .composer-popover {
        right: 18px !important;
        bottom: 72px !important;
    }
    .message-fab {
        right: 18px !important;
        bottom: 18px !important;
    }
}

/* Phone: don't automatically expose the text composer. Keep only the small face launcher. */
@media (max-width: 700px) {
    .trustyen-orb {
        width: min(214px, 66vw) !important;
        height: min(214px, 66vw) !important;
        min-width: 190px !important;
        min-height: 190px !important;
    }
    .message-fab {
        right: 12px !important;
        bottom: max(12px, env(safe-area-inset-bottom)) !important;
        width: 44px !important;
        height: 44px !important;
        border-radius: 14px !important;
    }
    .message-fab svg { width: 25px; height: 25px; }
    .composer-popover {
        right: 8px !important;
        left: 8px !important;
        bottom: 64px !important;
        width: auto !important;
    }
    .chat-panel {
        right: 8px !important;
        left: 8px !important;
        bottom: 116px !important;
        width: auto !important;
        height: 300px !important;
    }
}

@media (max-width: 390px) {
    .trustyen-orb {
        width: 198px !important;
        height: 198px !important;
        min-width: 198px !important;
        min-height: 198px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .simple-robot-svg *,
    .simple-robot-svg *::before,
    .simple-robot-svg *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}

@keyframes trustyenHaloBreath {
    0%,100% { opacity: .45; transform: scale(.96); }
    50% { opacity: .85; transform: scale(1.03); }
}
@keyframes trustyenOrbit { to { transform: rotate(360deg); } }
@keyframes trustyenIdleFace {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-2px); }
}
@keyframes trustyenBlink {
    0%, 38%, 44%, 100% { transform: scaleY(1); }
    41% { transform: scaleY(.12); }
}
@keyframes trustyenThinkFace {
    0%,100% { transform: translateY(0) rotate(-.4deg); }
    50% { transform: translateY(-3px) rotate(.7deg); }
}
@keyframes trustyenThought {
    0%,100% { opacity: .25; transform: translate(0, 2px); }
    50% { opacity: 1; transform: translate(1px, -2px); }
}
@keyframes trustyenThinkEyes {
    0% { transform: translateX(-3px); }
    100% { transform: translateX(3px); }
}
@keyframes trustyenThinkMouth {
    0%,100% { opacity: .6; transform: scaleX(.8); }
    50% { opacity: 1; transform: scaleX(.98); }
}
@keyframes trustyenListenFace {
    0%,100% { transform: translateX(0); }
    50% { transform: translateX(-2px); }
}
@keyframes trustyenSoundWave {
    0%,100% { opacity: .22; transform: scale(.88); }
    50% { opacity: .95; transform: scale(1.08); }
}
@keyframes trustyenListenEyes {
    0% { transform: translateX(-2px); }
    100% { transform: translateX(2px); }
}
@keyframes trustyenListenMouth {
    0%,100% { transform: scaleX(.95); }
    50% { transform: scaleX(.82); }
}
@keyframes trustyenSpeakFace {
    from { transform: translateY(0); }
    to { transform: translateY(-1.5px); }
}
@keyframes trustyenSpeakEyes {
    0%,100% { transform: translateX(-1px) scale(1); }
    50% { transform: translateX(2px) scale(1.08); }
}
@keyframes trustyenSpeakMouth {
    from { transform: scaleY(.78); }
    to { transform: scaleY(1.18); }
}
@keyframes trustyenStatusBlink {
    from { opacity: .35; }
    to { opacity: 1; }
}
@keyframes trustyenDanceFace {
    0%,100% { transform: rotate(0deg) translateY(0); }
    25% { transform: rotate(-4deg) translateY(-3px); }
    75% { transform: rotate(4deg) translateY(-3px); }
}
@keyframes trustyenWaveFace {
    0%,100% { transform: rotate(0); }
    50% { transform: rotate(4deg); }
}
@keyframes trustyenHappyMouth {
    0%,100% { transform: scaleX(1) scaleY(1); }
    50% { transform: scaleX(1.14) scaleY(1.12); }
}
@keyframes trustyenSpinFace {
    0%,55% { transform: rotateY(0); }
    100% { transform: rotateY(360deg); }
}