/* ---------- AI chat illustration ([vw_ai_chat], inc/ai-chat.php) ---------- */
/* Default state is the finished answer (no JS, builder preview, reduced motion). ai-chat.js adds .is-run and animates it in. */

.vw-aic {
	--aic-ink: #F1F0F1;
	--aic-body: rgba(241, 240, 241, .86);
	--aic-muted: rgba(241, 240, 241, .6);
	--aic-faint: rgba(241, 240, 241, .5);
	--aic-line: rgba(241, 240, 241, .14);
	--aic-ease: cubic-bezier(.16, 1, .3, 1);
	position: relative;
	overflow: hidden;
	isolation: isolate;
	padding-bottom: 20px;
	border-radius: var(--vw-r-panel, 28px);
	background: var(--vw-pupil, #0A0A0F);
	border: 1px solid rgba(241, 240, 241, .08);
	color: var(--aic-ink);
	font-family: var(--vw-font-body, 'Instrument Sans', Arial, sans-serif);
	text-align: left;
	-webkit-user-select: none;
	user-select: none;
}
.vw-aic b { font-family: var(--vw-font-head, Poppins, Arial, sans-serif); font-weight: 600; color: var(--aic-ink); }

/* Brand glows behind everything */
.vw-aic-amb { position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.vw-aic-amb-1 { left: 25%; top: -210px; width: 70%; height: 380px; background: radial-gradient(closest-side, rgba(86, 82, 255, .42), rgba(86, 82, 255, 0)); animation: vw-aic-drift 9s ease-in-out infinite; }
.vw-aic-amb-2 { left: -20%; top: -150px; width: 60%; height: 320px; background: radial-gradient(closest-side, rgba(236, 42, 230, .2), rgba(236, 42, 230, 0)); animation: vw-aic-drift 11s ease-in-out infinite reverse; }
.vw-aic-amb-3 { right: -23%; bottom: -200px; width: 70%; height: 360px; background: radial-gradient(closest-side, rgba(90, 47, 214, .22), rgba(90, 47, 214, 0)); }
@keyframes vw-aic-drift { 50% { transform: translate(-18px, 10px) scale(1.06); } }

/* Window bar */
.vw-aic-bar { display: flex; align-items: center; gap: 10px; height: 54px; padding: 0 14px 0 18px; border-bottom: 1px solid rgba(241, 240, 241, .08); background: rgba(241, 240, 241, .02); }
.vw-aic-logo { flex: none; display: block; width: 32px; height: 32px; border-radius: 50%; }
.vw-aic-who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.vw-aic-who b { font-size: 13.5px; line-height: 1.3; }
.vw-aic-status { display: flex; align-items: center; gap: 5px; font-size: 11px; line-height: 1.2; letter-spacing: .01em; color: var(--aic-faint); }
.vw-aic-status i { width: 5px; height: 5px; border-radius: 50%; background: #4ADE80; }
.vw-aic-tools { display: flex; gap: 6px; margin-left: auto; }
.vw-aic-tool { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: rgba(241, 240, 241, .06); color: var(--aic-muted); }

/* Search box */
.vw-aic-field { position: relative; display: flex; align-items: center; gap: 12px; height: 54px; margin: 16px 20px 0; padding: 0 7px 0 18px; box-sizing: border-box; border-radius: 999px; background: rgba(28, 27, 35, .92); border: 1px solid var(--aic-line); outline: 3px solid rgba(164, 140, 255, 0); outline-offset: 2px; transition: border-color .3s ease, outline-color .35s var(--aic-ease); }
.vw-aic-search { flex: none; display: grid; place-items: center; color: rgba(241, 240, 241, .42); }
.vw-aic-input { position: relative; flex: 1; min-width: 0; height: 24px; overflow: hidden; font-size: 14.5px; line-height: 24px; white-space: nowrap; }
.vw-aic-ph { position: absolute; left: 0; top: 0; color: rgba(241, 240, 241, .42); opacity: 0; transition: opacity .25s ease; }
.vw-aic-line { position: absolute; left: 0; right: 0; top: 0; display: block; overflow: hidden; text-overflow: ellipsis; color: var(--aic-ink); } /* out of flow, so the question never widens the card on phones */
.vw-aic-caret { display: none; width: 2px; height: 17px; margin-left: 1px; vertical-align: -3px; border-radius: 1px; background: #FFFFFF; }
.vw-aic-askwrap { position: relative; flex: none; width: 84px; height: 40px; }
.vw-aic-ask { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 100%; border-radius: 999px; background: #F1F0F1; color: #0A0A0F; font-family: var(--vw-font-head, Poppins, Arial, sans-serif); font-size: 13.5px; font-weight: 500; transition: background-color .25s ease, color .25s ease, transform .3s cubic-bezier(.3, 1.6, .5, 1); }
.vw-aic-ring { position: absolute; inset: 0; border-radius: 999px; border: 2px solid #FFFFFF; opacity: 0; pointer-events: none; }
.vw-aic-ring-2 { border-color: rgba(164, 140, 255, .7); }
.vw-aic-load { position: absolute; left: 28px; right: 28px; bottom: -1px; height: 2px; overflow: hidden; border-radius: 2px; opacity: 0; transition: opacity .3s ease; }
.vw-aic-load span { display: block; width: 40%; height: 2px; background: linear-gradient(90deg, rgba(90, 47, 214, 0), #8A4CF0, #EC2AE6, rgba(236, 42, 230, 0)); transform: translateX(-100%); }
.vw-aic-fring { position: absolute; left: var(--fx, 50%); top: var(--fy, 50%); width: 32px; height: 32px; margin: -16px 0 0 -16px; border-radius: 50%; border: 2px solid #A48CFF; box-sizing: border-box; opacity: 0; pointer-events: none; }

/* Answer */
.vw-aic-answer { padding: 20px 28px 0; transition: opacity .45s ease; }
.vw-aic-label { display: flex; align-items: center; gap: 7px; height: 20px; font-size: 13px; font-weight: 600; letter-spacing: .01em; color: #C9BDF2; }
.vw-aic-label svg { width: 13px; height: 13px; color: #A48CFF; }
.vw-aic-body { position: relative; margin-top: 10px; }
.vw-aic-think { position: absolute; left: 0; right: 0; top: 0; height: 22px; pointer-events: none; }
.vw-aic-think span { position: absolute; left: 0; top: 3px; white-space: nowrap; font-size: 13.5px; font-weight: 500; color: transparent; background: linear-gradient(90deg, rgba(241, 240, 241, .38) 0%, rgba(241, 240, 241, .38) 35%, #FFFFFF 50%, rgba(241, 240, 241, .38) 65%, rgba(241, 240, 241, .38) 100%) 0 0 / 200% 100%; -webkit-background-clip: text; background-clip: text; opacity: 0; transform: translateY(4px); transition: opacity .24s ease, transform .24s var(--aic-ease); animation: vw-aic-shim 1.5s linear infinite; }
.vw-aic-skel { position: absolute; left: 0; right: 0; top: 32px; display: flex; flex-direction: column; gap: 10px; pointer-events: none; }
.vw-aic-skel i { display: block; height: 12px; border-radius: 6px; background: linear-gradient(90deg, rgba(241, 240, 241, .06) 0%, rgba(241, 240, 241, .06) 35%, rgba(164, 140, 255, .22) 50%, rgba(241, 240, 241, .06) 65%, rgba(241, 240, 241, .06) 100%) 0 0 / 200% 100%; opacity: 0; transition: opacity .3s ease; animation: vw-aic-shim 1.5s linear infinite; }
.vw-aic-skel i:nth-child(2) { width: 92%; }
.vw-aic-skel i:nth-child(3) { width: 64%; }
@keyframes vw-aic-shim { from { background-position: 150% 0; } to { background-position: -50% 0; } }
.vw-aic-para { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--aic-body); text-wrap: pretty; }
.vw-aic-cite { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box; border-radius: 999px; background: rgba(164, 140, 255, .16); color: #D9CFFF; font-size: 10px; font-weight: 600; line-height: 1; vertical-align: 1px; }

.vw-aic-rec { position: relative; margin-top: 14px; padding: 14px 16px 13px; border-radius: 20px; background: linear-gradient(#13112E, #13112E) padding-box, linear-gradient(120deg, #2A27F3, #8A4CF0 55%, #EC2AE6) border-box; border: 1.5px solid transparent; }
.vw-aic-rec-glow { position: absolute; inset: 0; border-radius: 19px; background: radial-gradient(90% 120% at 100% 0%, rgba(164, 140, 255, .26), rgba(164, 140, 255, 0) 60%); pointer-events: none; }
.vw-aic-rec-sweep { position: absolute; inset: 0; overflow: hidden; border-radius: 19px; pointer-events: none; }
.vw-aic-rec-sweep span { position: absolute; top: 0; bottom: 0; left: 0; width: 55%; background: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .09) 50%, rgba(255, 255, 255, 0)); transform: translateX(-130%); }
.vw-aic-rec-top { position: relative; display: flex; align-items: center; gap: 10px; }
.vw-aic-rec-top b { font-size: 16px; line-height: 1.3; color: #FFFFFF; }
.vw-aic-tag { margin-left: auto; padding: 3px 9px; border-radius: 999px; background: linear-gradient(120deg, #2A27F3, #5A2FD6); color: #FFFFFF; font-size: 10.5px; font-weight: 600; letter-spacing: .02em; white-space: nowrap; }
.vw-aic-rec-meta { position: relative; margin-top: 1px; font-size: 12px; color: var(--aic-muted); }
.vw-aic-rec-desc { position: relative; margin: 7px 0 0; font-size: 13.5px; line-height: 1.55; color: var(--aic-body); }
.vw-aic-chips { position: relative; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; font-size: 11px; }
.vw-aic-chips > span { display: flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; background: rgba(241, 240, 241, .04); border: 1px solid var(--aic-line); color: rgba(241, 240, 241, .75); }
.vw-aic-chips i { width: 6px; height: 6px; border-radius: 50%; }
.vw-aic-d1 { background: #8A6BFF; }
.vw-aic-d2 { background: #5B6BFF; }
.vw-aic-d3 { background: #EC2AE6; }
.vw-aic-also { margin-top: 14px; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--aic-faint); }
.vw-aic-alts { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.vw-aic-alt { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; background: rgba(241, 240, 241, .035); border: 1px solid rgba(241, 240, 241, .09); font-size: 13px; line-height: 1.45; color: rgba(241, 240, 241, .75); }
.vw-aic-num { flex: none; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: rgba(241, 240, 241, .1); color: rgba(241, 240, 241, .8); font-size: 10px; font-weight: 600; }

.vw-aic-src { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; font-size: 11px; }
.vw-aic-src-l { margin-right: 2px; color: var(--aic-faint); }
.vw-aic-pill { padding: 3px 10px; border-radius: 999px; border: 1px solid var(--aic-line); color: rgba(241, 240, 241, .7); }

/* Mouse pointer */
.vw-aic-cursor { position: absolute; left: 0; top: 0; z-index: 5; width: 24px; height: 24px; pointer-events: none; opacity: 0; transition: opacity .35s ease; will-change: transform; } /* moved frame by frame by ai-chat.js */
.vw-aic-cur-in { position: absolute; left: 0; top: 0; width: 24px; height: 24px; transform-origin: 3px 3px; }
.vw-aic-cursor svg { position: absolute; overflow: visible; opacity: 0; }
.vw-aic-cur-arrow { left: 0; top: 0; }
.vw-aic-cur-ibeam { left: -6.5px; top: -6.5px; }
.vw-aic-cur-hand { left: -4.4px; top: .4px; }
.vw-aic-cursor[data-shape="arrow"] .vw-aic-cur-arrow,
.vw-aic-cursor[data-shape="ibeam"] .vw-aic-cur-ibeam,
.vw-aic-cursor[data-shape="hand"] .vw-aic-cur-hand { opacity: 1; }

/* ---- Playing (.is-run): everything starts hidden and the script brings it in ---- */
.vw-aic.is-run .vw-aic-ph { opacity: 1; }
.vw-aic.is-run.is-typing .vw-aic-ph { opacity: 0; transition-duration: 0s; }
.vw-aic.is-run .vw-aic-line { right: auto; overflow: visible; text-overflow: clip; transform: translateX(var(--shift, 0)); transition: transform .12s linear; }
.vw-aic.is-caret .vw-aic-caret { display: inline-block; animation: vw-aic-blink 1s steps(1) infinite; }
@keyframes vw-aic-blink { 50% { visibility: hidden; } }
.vw-aic.is-run .vw-aic-ask { background: rgba(241, 240, 241, .1); color: rgba(241, 240, 241, .45); }
.vw-aic.is-run.is-ready .vw-aic-ask { background: #F1F0F1; color: #0A0A0F; }
.vw-aic.is-run .vw-aic-ask.is-hover { background: #FFFFFF; transform: scale(1.07); }
.vw-aic.is-run .vw-aic-ask.is-press { background: #A48CFF; transform: scale(.86); transition-duration: .09s; }
.vw-aic.is-click .vw-aic-ring { animation: vw-aic-ring .7s var(--aic-ease) both; }
.vw-aic.is-click .vw-aic-ring-2 { animation: vw-aic-ring2 .78s var(--aic-ease) .13s both; }
@keyframes vw-aic-ring { from { opacity: 1; transform: scale(.85); } to { opacity: 0; transform: scale(2.2); } }
@keyframes vw-aic-ring2 { from { opacity: .7; transform: scale(.85); } to { opacity: 0; transform: scale(2.8); } }
.vw-aic.is-fhover .vw-aic-field { border-color: rgba(241, 240, 241, .28); }
.vw-aic.is-focus .vw-aic-field { border-color: #A48CFF; outline-color: rgba(164, 140, 255, .24); }
.vw-aic.is-fclick .vw-aic-fring { animation: vw-aic-fring .6s var(--aic-ease) both; }
@keyframes vw-aic-fring { from { opacity: .9; transform: scale(.45); } to { opacity: 0; transform: scale(1.7); } }
.vw-aic.is-loading .vw-aic-load { opacity: 1; }
.vw-aic.is-loading .vw-aic-load span { animation: vw-aic-bar 1.1s cubic-bezier(.45, 0, .2, 1) infinite; }
@keyframes vw-aic-bar { to { transform: translateX(250%); } }

.vw-aic.is-run .vw-aic-label,
.vw-aic.is-run .vw-aic-rec,
.vw-aic.is-run .vw-aic-tag,
.vw-aic.is-run .vw-aic-chips > span,
.vw-aic.is-run .vw-aic-also,
.vw-aic.is-run .vw-aic-alt,
.vw-aic.is-run .vw-aic-src > span,
.vw-aic.is-run .vw-aic-cite { opacity: 0; transition: opacity .32s ease, transform .5s var(--aic-ease), filter .32s ease; }
.vw-aic.is-run .vw-aic-label { transform: translateY(4px); }
.vw-aic.is-run .vw-aic-rec { transform: translateY(12px) scale(.98); }
.vw-aic.is-run .vw-aic-tag,
.vw-aic.is-run .vw-aic-alt,
.vw-aic.is-run .vw-aic-chips > span,
.vw-aic.is-run .vw-aic-src > span { transform: translateY(6px); }
.vw-aic.is-run .vw-aic-cite { transform: scale(.6); }
.vw-aic.is-run .vw-aic-w { display: inline-block; opacity: 0; filter: blur(5px); transform: translateY(4px); transition: opacity .32s ease, filter .32s ease, transform .32s var(--aic-ease); }
.vw-aic.is-run .vw-aic-rec-glow { opacity: 0; transition: opacity .6s ease .3s; }
.vw-aic.is-run .is-in.is-in { opacity: 1; filter: none; transform: none; }
.vw-aic.is-run .vw-aic-rec.is-in .vw-aic-rec-glow { opacity: 1; }
.vw-aic.is-sweep .vw-aic-rec-sweep span { animation: vw-aic-sweep 1.2s cubic-bezier(.45, 0, .2, 1) both; }
@keyframes vw-aic-sweep { to { transform: translateX(130%); } }
.vw-aic.is-t1 .vw-aic-think-1,
.vw-aic.is-t2 .vw-aic-think-2 { opacity: 1; transform: none; }
.vw-aic.is-skel .vw-aic-skel i { opacity: 1; }
.vw-aic.is-skel .vw-aic-skel i:nth-child(2) { transition-delay: .08s; }
.vw-aic.is-skel .vw-aic-skel i:nth-child(3) { transition-delay: .16s; }
/* Between loops: the answer and the question fade out together, the box returns to its empty look, then the reset happens unseen */
.vw-aic.is-fade .vw-aic-answer,
.vw-aic.is-fade .vw-aic-line { opacity: 0; transition: opacity .6s ease; }
.vw-aic.is-fade .vw-aic-ph,
.vw-aic.is-run.is-fade .vw-aic-ph { opacity: 1; transition: opacity .45s ease .2s; }
.vw-aic.is-fade .vw-aic-ask,
.vw-aic.is-run.is-fade .vw-aic-ask { background: rgba(241, 240, 241, .1); color: rgba(241, 240, 241, .45); transition-duration: .5s; }
.vw-aic.is-reset,
.vw-aic.is-reset * { transition: none !important; }

/* Phones: the Ask button keeps only its arrow */
@media (max-width: 520px) {
	.vw-aic { border-radius: 22px; padding-bottom: 18px; }
	.vw-aic-bar { padding: 0 10px 0 14px; }
	.vw-aic-tool { width: 30px; height: 30px; }
	.vw-aic-field { margin: 12px 14px 0; height: 50px; padding: 0 5px 0 14px; gap: 10px; }
	.vw-aic-input { font-size: 14px; }
	.vw-aic-askwrap { width: 40px; }
	.vw-aic-ask-t { display: none; }
	.vw-aic-answer { padding: 18px 18px 0; }
	.vw-aic-para { font-size: 14px; }
	.vw-aic-rec { padding: 14px 14px 12px; }
	.vw-aic-rec-top { flex-wrap: wrap; row-gap: 6px; }
	.vw-aic-tag { padding: 3px 8px; font-size: 10px; }
	.vw-aic-rec-top b { font-size: 15.5px; }
	.vw-aic-rec-desc { font-size: 13px; }
	.vw-aic-alt { font-size: 12.5px; }
}

/* ---------- pre-filled question, source chips, highlight and #1 badge ---------- */
.vw-aic-field { height: auto; min-height: 54px; padding-top: 6px; padding-bottom: 6px; border-radius: 27px; }
.vw-aic-input { height: auto; overflow: visible; white-space: normal; }
.vw-aic-ph { display: none; }
.vw-aic-line,
.vw-aic.is-run .vw-aic-line { position: relative; left: auto; right: auto; top: auto; display: block; overflow: visible; text-overflow: clip; transform: none; transition: none; }
.vw-aic.is-caret .vw-aic-caret { display: inline; width: 0; height: auto; margin-left: 2px; vertical-align: baseline; border-radius: 0; background: none; border-left: 2px solid #FFFFFF; }

/* Reading sources */
.vw-aic-read { position: absolute; left: 0; right: 0; top: 0; display: flex; flex-direction: column; gap: 9px; pointer-events: none; transition: opacity .2s ease; }
.vw-aic-read-t { display: flex; align-items: center; gap: 8px; height: 22px; opacity: 0; transform: translateY(4px); transition: opacity .2s ease, transform .3s var(--aic-ease); }
.vw-aic-read-l { white-space: nowrap; font-size: 13.5px; font-weight: 500; color: transparent; background: linear-gradient(90deg, rgba(241, 240, 241, .45) 0%, rgba(241, 240, 241, .45) 35%, #FFFFFF 50%, rgba(241, 240, 241, .45) 65%, rgba(241, 240, 241, .45) 100%) 0 0 / 200% 100%; -webkit-background-clip: text; background-clip: text; animation: vw-aic-shim 1.2s linear infinite; }
.vw-aic-read-c { padding: 2px 7px; border-radius: 999px; background: rgba(164, 140, 255, .16); color: #D9CFFF; font-size: 10.5px; font-weight: 600; line-height: 1.3; font-variant-numeric: tabular-nums; }
.vw-aic-read-s { display: flex; flex-wrap: wrap; gap: 6px; font-size: 11px; }
.vw-aic-read-s > span { display: flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; background: rgba(241, 240, 241, .04); border: 1px solid var(--aic-line); color: rgba(241, 240, 241, .75); opacity: 0; transform: translateY(6px) scale(.9); transition: opacity .2s ease, transform .4s cubic-bezier(.3, 1.5, .5, 1); }
.vw-aic-read-s i { width: 6px; height: 6px; border-radius: 50%; }
.vw-aic-d4 { background: #C9BDF2; }
.vw-aic.is-read .vw-aic-read-t { opacity: 1; transform: none; }
.vw-aic.is-readout .vw-aic-read { opacity: 0; }
.vw-aic:not(.is-read) .vw-aic-read { visibility: hidden; } /* never shows in the finished answer */

/* "Your business" highlight in the answer: full in the finished answer, sweeps in while playing */
.vw-aic-hl { padding: 0 3px; border-radius: 5px; background: linear-gradient(100deg, rgba(90, 47, 214, .6), rgba(236, 42, 230, .45)) no-repeat 0 0 / 100% 100%; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.vw-aic.is-run .vw-aic-hl { background-size: 0% 100%; transition: background-size .55s cubic-bezier(.65, 0, .35, 1); }
.vw-aic.is-run.is-hl .vw-aic-hl { background-size: 100% 100%; }

/* #1 badge on the recommendation card, and a bigger rise */
.vw-aic-rank { flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(120deg, #2A27F3, #8A4CF0 55%, #EC2AE6); color: #FFFFFF; font-family: var(--vw-font-head, Poppins, Arial, sans-serif); font-size: 11px; font-weight: 700; line-height: 1; }
.vw-aic.is-run .vw-aic-rank { opacity: 0; transform: scale(.4) rotate(-25deg); transition: opacity .2s ease .15s, transform .55s cubic-bezier(.3, 1.6, .5, 1) .15s; }
.vw-aic.is-run .vw-aic-rec { transform: translateY(20px) scale(.96); transition: opacity .3s ease, transform .6s var(--aic-ease); }

/* Between runs only the answer fades; the question stays in the box */
.vw-aic.is-afade .vw-aic-answer { opacity: 0; transition: opacity .4s ease; }

@media (max-width: 520px) {
.vw-aic-field { height: auto; min-height: 50px; padding-top: 4px; padding-bottom: 4px; border-radius: 25px; }
.vw-aic-input { line-height: 21px; }
.vw-aic-read-l { font-size: 13px; }
}

/* ---------- transitions: longer fades, gentle easing, no overshoot ---------- */
.vw-aic { --aic-soft: cubic-bezier(.22, 1, .36, 1); }
.vw-aic.is-run .vw-aic-label,
.vw-aic.is-run .vw-aic-tag,
.vw-aic.is-run .vw-aic-chips > span,
.vw-aic.is-run .vw-aic-also,
.vw-aic.is-run .vw-aic-alt,
.vw-aic.is-run .vw-aic-src > span,
.vw-aic.is-run .vw-aic-cite { transition: opacity .55s ease, transform .8s var(--aic-soft), filter .55s ease; }
.vw-aic.is-run .vw-aic-w { filter: blur(6px); transform: translateY(5px); transition: opacity .6s ease, filter .6s ease, transform .7s var(--aic-soft); }
.vw-aic.is-run .vw-aic-rec { transform: translateY(24px) scale(.97); transition: opacity .6s ease, transform 1.1s var(--aic-soft); }
.vw-aic.is-run .vw-aic-rec-glow { transition: opacity 1s ease .4s; }
.vw-aic.is-sweep .vw-aic-rec-sweep span { animation-duration: 1.8s; }
.vw-aic-read-t { transition: opacity .45s ease, transform .6s var(--aic-soft); }
.vw-aic-read-s > span { transform: translateY(8px) scale(.97); transition: opacity .5s ease, transform .7s var(--aic-soft); }
.vw-aic-read { transition: opacity .4s ease; }
.vw-aic-read-l { animation-duration: 1.8s; }
.vw-aic.is-run .vw-aic-hl { transition: background-size 1s cubic-bezier(.65, 0, .35, 1); }
.vw-aic.is-run .vw-aic-rank { transform: scale(.6); transition: opacity .5s ease .3s, transform .8s var(--aic-soft) .3s; }
.vw-aic.is-afade .vw-aic-answer { transition: opacity .7s ease; }
.vw-aic.is-loading .vw-aic-load span { animation-duration: 1.6s; }

/* ---------- loop restart: the answer drifts up and fades, then the box eases back to its ready state ---------- */
.vw-aic.is-afade .vw-aic-answer { opacity: 0; transform: translateY(-8px); filter: blur(3px); transition: opacity .9s ease, transform 1s var(--aic-soft), filter .9s ease; }
.vw-aic-field { transition: border-color .6s ease, outline-color .7s var(--aic-soft); }