/* Approved companion animation shared by Makro and the standalone preview. */
.companion-preview{background:#202e43}
.companion-preview .everywhere{margin-top:0;padding:40px 0 70px}
.companion-preview .everywhere-heading{margin-bottom:42px}
.companion-preview .everywhere-heading h2{font-size:44px}
.preview-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:24px;color:#d9e3f1;font-size:13px}
.preview-toolbar>a{display:flex;align-items:center;gap:10px}
.preview-toolbar>a>img{border-radius:7px}
.preview-toolbar>a>span{color:#a8b9ce;margin-left:12px;font-size:12px}
.preview-toolbar>div{display:flex;gap:8px}
.preview-toolbar button{color:#dce7f6;background:#ffffff0d;border:1px solid #ffffff16;border-radius:9px;font:inherit;padding:9px 13px;cursor:pointer}
.preview-toolbar button:hover{background:#ffffff1b}
.preview-toolbar button:focus-visible{outline:2px solid #82acfc;outline-offset:4px}
.ew-companion{background:linear-gradient(150deg,#e7f0fc,#edf3fa 62%,#dce7f2)}
.ew-companion h3{font-size:29px;max-width:340px}
.cp-scene{position:absolute;left:20px;right:20px;top:252px;height:285px;text-align:left;pointer-events:none;--cp-ease:cubic-bezier(.22,1,.36,1)}
.cp-speech-caret{display:inline-block;width:1px;height:14px;vertical-align:-2px;background:#7896c6;margin-left:3px;animation:cp-caret 1s steps(1) infinite}
.cp-voice{position:absolute;left:9px;right:9px;top:0;opacity:0;transform:translateY(14px);transition:opacity .55s,transform .85s var(--cp-ease)}
.cp-listening{display:flex;align-items:center;gap:9px;width:max-content;max-width:100%;padding:8px 9px 8px 14px;border-radius:28px;background:linear-gradient(#172741,#0c172a);box-shadow:0 7px 19px #15263d32;color:#cbd8f4;font-size:14px;font-weight:500}
.cp-dismiss{display:grid;place-items:center;width:22px;height:22px;background:#ffffff0c;border-radius:50%;color:#7f93ae;font-size:18px;margin-left:12px;font-weight:400}
.cp-wave{display:flex;align-items:center;gap:2px;height:14px}
.cp-wave i{width:2px;height:5px;border-radius:2px;background:#9bb5e8;animation:cp-wave .6s ease-in-out infinite alternate}
.cp-wave i:nth-child(2){animation-delay:-.3s;height:12px}.cp-wave i:nth-child(3){animation-delay:-.5s;height:9px}.cp-wave i:nth-child(4){animation-delay:-.2s}
.cp-listening{position:absolute;top:168px;left:50%;transform:translateX(-50%);margin:0}
.cp-transcript{width:48px;height:58px;margin:0 auto 20px;padding:16px 20px;overflow:hidden;border-radius:16px;background:#fff;box-shadow:0 10px 25px #2c456e0a;font-size:15px;line-height:1.7;color:#526882;text-align:center;transition:width .32s var(--cp-ease),height .32s var(--cp-ease)}
.cp-transcript-content{width:max-content;max-width:100%;text-wrap:pretty}
.cp-idle-caption{position:absolute;left:0;right:0;top:98px;text-align:center;font-size:14px;color:#778da9;transition:opacity .4s,transform .7s var(--cp-ease)}
.cp-hotkey{position:absolute;top:24px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:12px;color:#9aacbf;font-size:15px;transition:opacity .4s,transform .7s var(--cp-ease)}
.cp-hotkey kbd{display:flex;align-items:center;justify-content:center;height:48px;padding:0 17px;border:1px solid #fff;border-radius:10px;background:linear-gradient(#fff,#f3f6fb);color:#54677f;font:500 14px/1 var(--sans);box-shadow:0 4px 0 #c3d0e0,0 8px 14px #48608010;transform:translateY(0)}
.cp-key-space{min-width:105px;gap:18px}.cp-space-mark{font-size:18px;color:#8b9eb7}
.ew-companion[data-phase=ready] .cp-hotkey kbd{animation:cp-key-press 1.6s ease-in-out both}
.ew-companion:not([data-phase=ready]) .cp-hotkey{opacity:0;transform:translateY(7px)}
.cp-companion{position:absolute;right:12px;bottom:23px;width:64px;height:64px;display:grid;place-items:center;z-index:2}
.cp-mark{width:43px;height:43px;border-radius:12px}
.ew-companion[data-phase=listen] .cp-voice{opacity:1;transform:translateY(0)}
.ew-companion:not([data-phase=ready]) .cp-idle-caption{opacity:0;transform:translateY(5px)}
.cp-profile,.cp-recommendation{position:absolute;left:3px;right:3px;top:88px;translate:0 -50%;padding:18px;opacity:0;transform:translateY(22px) rotate(2deg);transition:opacity .55s,transform .9s var(--cp-ease);box-shadow:0 14px 28px #24476d12}
.cp-profile-person{display:flex;align-items:center;gap:10px}
.cp-profile-person>img{width:39px;height:39px;object-fit:cover;border-radius:50%}
.cp-profile-person strong{display:block;font-size:15px;font-weight:500;color:#42536e}
.cp-profile-person span{display:block;font-size:12px;color:#8493a8;margin-top:3px}
.cp-profile>p{font:500 23px/1.3 'Product Display',var(--display);letter-spacing:-.5px;color:#354a68;margin:20px 0 16px}
.cp-profile-tags{display:flex;gap:5px;flex-wrap:wrap}
.cp-profile-tags>span{font-size:12px;color:#6b84aa;background:#edf3fc;padding:5px 7px;border-radius:5px}
.cp-profile-note{display:flex;align-items:center;gap:5px;font-size:12px;color:#7b94b5;margin-top:18px}
.cp-profile-note svg{width:13px;height:13px}
.cp-recommendation{padding:15px 17px}
.cp-recommendation-top{display:flex;align-items:center;gap:7px;font-size:13px;color:#6480a5}
.cp-recommendation-top>img{width:24px;height:24px;border-radius:50%;object-fit:cover}
.cp-context{margin-left:auto;white-space:nowrap;font-size:11px;background:#eef4fc;padding:5px 6px;border-radius:12px}
.cp-recommendation-copy{font-size:14px;line-height:1.6;color:#3c506f;margin:14px 0}
.cp-recommendation-copy p+p{margin-top:8px}
.cp-why{background:#edf3fc;border-radius:8px;padding:10px 12px;color:#6c83a3;font-size:13px;line-height:1.5}
.cp-why strong{display:block;font-size:12px;font-weight:500;color:#4b72a9;margin-bottom:3px}
.cp-recommendation-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-right:44px;margin-top:14px;font-size:12px;color:#8a9bb0}
.cp-use{display:flex;align-items:center;gap:5px;color:#4874b5;font-size:12px}
.cp-use svg{width:12px;height:12px}
.ew-companion[data-phase=profile] .cp-profile,.ew-companion[data-phase=suggest] .cp-recommendation{opacity:1;transform:translateY(0) rotate(0)}
.ew-companion[data-phase=profile] .cp-companion{z-index:2}
.cp-accessible{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.preview-paused .ew-animate,.preview-paused .cp-scene *,.everywhere.is-background .cp-scene *,.ew-companion:not(.is-visible) .cp-scene *{animation-play-state:paused!important}
@keyframes cp-wave{to{transform:scaleY(.4)}}
@keyframes cp-caret{0%,45%{opacity:1}46%,100%{opacity:0}}
@keyframes cp-key-press{0%,48%,100%{transform:translateY(0);box-shadow:0 4px 0 #c3d0e0,0 8px 14px #48608010}65%,84%{transform:translateY(3px);box-shadow:0 1px 0 #a0a7b0,0 3px 8px #24304612;background:#bfc4cb;border-color:#fff;color:#28313e}}
@media(min-width:1101px) and (max-width:1250px){.cp-scene{left:13px;right:13px}.cp-transcript{font-size:14px}}
@media(max-width:600px){.preview-toolbar{flex-wrap:wrap;padding-block:18px;gap:16px}.preview-toolbar>a>span{font-size:10px;margin-left:2px}.preview-toolbar button{font-size:11px}.companion-preview .everywhere{padding-top:24px}.companion-preview .everywhere-heading h2{font-size:35px}.companion-preview .everywhere-heading>p{font-size:15px}.ew-companion.ew-tall{height:615px}.ew-companion h3{font-size:28px}.cp-scene{top:257px;left:17px;right:17px}}
@media(max-width:360px){.cp-transcript{font-size:14px}.preview-toolbar>a>span{max-width:145px}.cp-scene{left:12px;right:12px}}
@media(max-width:360px){.ew-companion h3{font-size:24px}.cp-recommendation{padding:14px}.cp-recommendation-copy{font-size:13px;margin:12px 0}.cp-context{display:none}.cp-composed{font-size:12px}.cp-profile>p{font-size:21px}}
@media(prefers-reduced-motion:reduce){.cp-scene *{transition:none!important;animation:none!important}}