/* Homepage task replay. Motion explains state; it never executes a business task. */
.agent-demo { --agent-muted:#9ca6b4; --agent-line:#ffffff12; --agent-accent:#acd5ff; --agent-ease:cubic-bezier(.23,1,.32,1); width:min(1080px,calc(100% - 80px)); margin:auto; color:#e7ebf0; background:#111317; border:1px solid #343a45; border-radius:16px; overflow:clip; box-shadow:0 28px 70px #0005; text-align:left }
.agent-demo *, .agent-demo *:before, .agent-demo *:after { box-sizing:border-box }
.agent-demo button { font-family:inherit; cursor:pointer }
.agent-demo :is(button,a,summary):focus-visible, .agent-scene:focus-visible { outline:2px solid var(--agent-accent); outline-offset:-3px }
.agent-topbar { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:12px 20px; border-bottom:1px solid var(--agent-line); background:linear-gradient(115deg,#1c2028,#15181e 60%) }
.agent-brand { display:flex; align-items:center; gap:12px; font-size:15px; font-weight:550 }
.agent-brand img { width:36px; height:36px; object-fit:contain; flex-shrink:0 }
.agent-brand small { display:block; color:var(--agent-muted); font-size:10px; font-weight:400; margin-top:3px }
.agent-brand small span { padding-inline:5px; color:#697586 }
.agent-topbar-meta { display:flex; align-items:center; gap:18px }
.agent-demo-label { color:#a3acb9; font-size:10px }
.agent-live-badge { display:inline-flex; align-items:center; gap:7px; color:#c0cfe0; font-size:10px; border:1px solid #3c4655; padding:5px 9px; border-radius:20px; background:#222934 }
.agent-status-light { width:5px; height:5px; border-radius:50%; background:#a4c9f0 }
.agent-demo[data-playing=true] .agent-status-light { background:#b2ebce }
.agent-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:8px 20px; border-bottom:1px solid var(--agent-line); background:#14171c }
.agent-chapters { display:flex; gap:5px; min-width:0 }
.agent-chapters button { position:relative; background:none; border:1px solid transparent; color:#a7b0be; padding:10px 12px; font-size:11px; min-height:44px; border-radius:8px; white-space:nowrap }
.agent-chapters button>span { color:#7f8b9c; font-size:9px; margin-right:7px; font-variant-numeric:tabular-nums }
.agent-chapters button[aria-selected=true] { color:#d9eaff; border-color:#526680; background:#263446 }
.agent-chapters button[aria-selected=true]>span { color:#b0cff4 }
.agent-play { flex-shrink:0; min-height:44px; min-width:96px; padding:9px 16px; border:1px solid #e1e9f7; border-radius:8px; background:#e1e9f7; color:#1d2939; font-size:11px; font-weight:550; transition:transform 120ms var(--agent-ease) }
.agent-play[hidden] { display:none }
.agent-scene { display:grid; grid-template-columns:minmax(0,1fr) 320px; outline:none }
.agent-conversation { min-width:0; padding:16px 20px 0; background:radial-gradient(ellipse at 70% 15%,#202d411d,transparent 60%) }
.agent-thread-label { display:flex; justify-content:space-between; gap:12px; color:#94a0b2; font-size:10px; margin-bottom:12px }
.agent-thread-label>span:last-child { font-size:9px; letter-spacing:.07em; color:#808b9b }
.agent-user-message { position:relative; margin-left:36px; padding:12px 16px; background:linear-gradient(110deg,#263445,#202a39); border:1px solid #46586e; border-radius:14px 14px 4px 14px; color:#e3eaf4; box-shadow:0 8px 20px #0002 }
.agent-speaker { position:absolute; left:-37px; top:16px; display:grid; place-items:center; width:26px; height:26px; border:1px solid #3c4656; border-radius:50%; color:#b5c3d5; background:#202731; font-size:10px }
.agent-user-message>p { font-size:13px; line-height:1.9; margin:0 }.agent-user-message strong { font-weight:500; color:#bedcfd; white-space:nowrap }
.agent-attachment { display:inline-flex; align-items:center; gap:10px; margin-top:11px; padding:5px 12px 5px 5px; background:#17202b; border:1px solid #425169; border-radius:7px; font-size:10px }
.agent-attachment .goods-art { width:32px; height:32px; border-radius:4px }.agent-attachment small { display:block; font-size:9px; color:#a3afc0 }
.agent-answer { margin-top:16px }
.agent-answer>header { display:flex; align-items:center; gap:10px }.agent-answer>header img { width:28px; height:28px; object-fit:contain }
.agent-answer>header strong { font-size:13px; font-weight:550 }.agent-answer>header>span { font-size:9px; color:#acb9cb; border:1px solid #3c4655; border-radius:5px; padding:2px 6px }
.agent-answer>p { margin:8px 0 12px 38px; font-size:12px; line-height:1.9; color:#bbc4d0 }
.agent-team { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; list-style:none; padding:0; margin:0 0 12px 38px }
.agent-team li { position:relative; display:grid; grid-template-columns:22px minmax(0,1fr); gap:4px 8px; align-items:start; min-width:0; padding:12px; border:1px solid #343d4a; border-radius:9px; background:#1b2028; overflow:hidden }
.agent-team li[data-state=active] { background:#1d2c3d; border-color:#7092b8; box-shadow:inset 0 1px #c6e5ff12 }
.agent-team li[data-state=done] { border-color:#344c49; background:#192423 }
.agent-team li:after { content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:linear-gradient(90deg,transparent,#a6d1ff,transparent); transform:translateX(-100%); animation:agent-handoff 1.8s linear infinite; animation-play-state:paused; opacity:0 }
.agent-team li[data-state=active]:after { opacity:.9 }
.agent-role-number { display:inline-grid; place-items:center; width:22px; height:22px; border-radius:6px; background:#2a3443; border:1px solid #43516a; color:#bed7f6; font-size:9px; font-variant-numeric:tabular-nums }
.agent-team li[data-state=done] .agent-role-number { background:#243a34; color:#add5c3; border-color:#3c5a4c }
.agent-team strong { display:block; font-size:12px; font-weight:500; color:#e1e7ef }.agent-team small { display:block; font-size:9px; color:#a2aec0; margin-top:3px }
.agent-role-state { display:block; grid-column:2; font-size:9px; color:#abd3c0; margin-top:2px }
.agent-team [data-state=pending] .agent-role-state { color:#98a4b4 }.agent-team [data-state=active] .agent-role-state { color:#bddbff }
.agent-update { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:16px; margin-left:38px; padding:16px; border:1px solid #3b4758; background:#191f28; border-radius:10px; overflow:hidden }
.agent-update-copy { min-width:0 }
.agent-update-label { color:#adcff4; font-size:10px }
.agent-update h3 { font-size:19px; line-height:1.55; font-weight:520; letter-spacing:-.03em; margin:8px 0 }
.agent-update-copy>p { font-size:11px; line-height:1.95; color:#aab7c9; margin:0 }
.agent-visual { min-width:0; align-self:center; background:#10161e; border:1px solid #46556b; border-radius:8px; overflow:hidden; box-shadow:0 9px 20px #0003 }
.agent-visual-chrome { display:flex; align-items:center; justify-content:space-between; gap:6px; padding:8px 9px; color:#9eb1c8; background:#253142; border-bottom:1px solid #3e4a5d; font-size:7px; letter-spacing:.07em }
.agent-window-dots { display:flex; gap:3px }.agent-window-dots i { display:block; width:3px; height:3px; background:#92a3ba; border-radius:50% }
.agent-visual-panel { position:relative; height:156px; overflow:hidden }
.agent-visual-panel[hidden] { display:none }
.visual-dispatch { padding:17px 15px 10px; text-align:center; background:radial-gradient(ellipse at 50% 0,#2a425a,#131b26 80%) }
.dispatch-source { position:relative; display:inline-block; padding:6px 12px; border:1px solid #617e9f; background:#23364c; border-radius:5px; font-size:10px; color:#d4e8fd; z-index:1 }
.dispatch-source>span { margin-left:7px; font-size:7px; color:#aac5e2 }
.dispatch-branches { position:relative; display:flex; justify-content:space-between; gap:10px; margin-top:21px }
.dispatch-branches:before { content:''; position:absolute; top:-12px; left:15%; right:15%; height:12px; border:1px solid #4b6786; border-bottom:0; border-radius:5px 5px 0 0 }
.dispatch-source:after { content:''; position:absolute; top:100%; left:50%; width:1px; height:11px; background:#8cb6e4 }
.dispatch-branches>span { position:relative; flex:1; border:1px solid #455e7b; padding:4px; border-radius:5px; background:#1d2a3b; font-size:8px; color:#aecceb; animation:agent-node 2.4s var(--agent-ease) infinite; animation-play-state:paused }
.dispatch-branches>span:nth-child(2) { animation-delay:.25s }.dispatch-branches>span:nth-child(3) { animation-delay:.5s }
.dispatch-branches small { display:block; font-size:8px; color:#d7e4f1 }
.visual-dispatch>p { margin-top:11px; color:#93a9c2; font-size:8px }
.visual-research { padding:11px 10px }
.research-query { display:flex; justify-content:space-between; gap:4px; padding:4px 7px; border:1px solid #40536a; background:#202e40; border-radius:4px; font-size:7px; color:#bdd1e8 }
.research-query>span:last-child { color:#9baec5 }
.research-candidates { display:flex; gap:7px; margin-top:11px }
.research-candidates>div { min-width:0; flex:1; border:1px solid #4a5665; border-radius:5px; overflow:hidden; background:#25303d; color:#c5d3e3; font-size:7px; text-align:center }
.research-candidates .goods-art { width:70px; max-width:100%; aspect-ratio:1; margin:auto; border-radius:0; background-color:#ebe5d9 }.research-candidates>div>span:last-child { display:block; padding:5px 0 }
.research-scan { position:absolute; top:47px; bottom:10px; left:-20%; width:20%; background:linear-gradient(90deg,transparent,#b6dbff38,transparent); border-right:1px solid #d4edff7a; animation:agent-scan 2.5s linear infinite; animation-play-state:paused; pointer-events:none }
.visual-product { display:flex; align-items:center; gap:12px; padding:15px 12px; background:#18212c }
.visual-product>.goods-art { flex:0 1 100px; max-width:39%; border-radius:5px }
.product-fields { flex:1; min-width:0; color:#cad9eb; font-size:9px }
.product-fields>div { margin-top:10px; overflow:hidden }.product-fields small { display:block; font-size:7px; color:#9db1ca }
.product-fields i { position:relative; display:block; height:4px; margin-top:4px; background:#526b87; border-radius:4px; transform-origin:left; animation:agent-field 2.6s var(--agent-ease) infinite; animation-play-state:paused }
.product-fields>div:nth-of-type(2) i { width:76%; animation-delay:.2s }.product-fields>div:nth-of-type(3) i { width:88%; animation-delay:.4s }
.visual-studio { padding:0 9px 8px; background:#e8e4db; color:#3b413d }
.studio-mini-nav { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:8px 0; border-bottom:1px solid #b8bdb0; font-size:6px; letter-spacing:.06em }.studio-mini-nav>span { font-size:5px }
.studio-mini-hero { display:flex; align-items:center; min-height:96px; animation:agent-assemble 3s var(--agent-ease) infinite; animation-play-state:paused }
.studio-mini-hero>div { flex:1; padding-left:3px }.studio-mini-hero .goods-art { width:92px; max-width:43%; flex-shrink:0; border-radius:0 }
.studio-mini-hero small { display:block; font-size:5px; letter-spacing:.04em; color:#6b7462 }.studio-mini-hero strong { display:block; margin:5px 0; font-weight:550; font-size:14px; line-height:1.5; letter-spacing:-.03em }.studio-mini-hero>div>span { font-size:6px; color:#6c7565 }
.studio-mini-sections { display:flex; gap:5px; padding-top:6px; border-top:1px solid #b8bdb0 }.studio-mini-sections>span { flex:1; font-size:6px; text-align:center; padding:4px 2px; background:#d6dace; border-radius:3px; animation:agent-assemble 3s var(--agent-ease) infinite; animation-play-state:paused }
.studio-mini-sections>span:nth-child(1) { animation-delay:.15s }.studio-mini-sections>span:nth-child(2) { animation-delay:.3s }.studio-mini-sections>span:nth-child(3) { animation-delay:.45s }
.visual-result { display:flex; flex-direction:column; justify-content:center; gap:12px; padding:15px; background:radial-gradient(ellipse at top,#29453c,#16251f) }
.visual-result>strong { font-size:13px; font-weight:500; color:#d7f1e3 }
.visual-result>div { display:flex; gap:7px }.visual-result>div>span { flex:1; min-width:0; padding:8px 5px; font-size:8px; border:1px solid #517363; border-radius:5px; background:#2c463b; color:#a0cdb6 }.visual-result small { display:block; margin-top:5px; font-size:7px; color:#dcf0e3 }
.visual-result>p { color:#a8c5b5; font-size:8px }
.agent-work-caption { display:flex; align-items:center; gap:8px; grid-column:1/-1; border-top:1px solid #394556; padding-top:11px; color:#abc2df; font-size:9px }
.agent-working-dots { display:flex; gap:3px; flex-shrink:0 }.agent-working-dots i { width:3px; height:3px; background:#a9d1ff; border-radius:50%; animation:agent-dot 1.2s var(--agent-ease) infinite; animation-play-state:paused }
.agent-working-dots i:nth-child(2) { animation-delay:.15s }.agent-working-dots i:nth-child(3) { animation-delay:.3s }
.agent-phase-meter { width:54px; height:3px; flex-shrink:0; margin-left:auto; background:#3c4a5d; border-radius:5px; overflow:hidden }.agent-phase-meter>span { display:block; height:100%; background:#b8d9ff; transform:scaleX(0); transform-origin:left }
.agent-results { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:16px 0 18px 38px }
.agent-results>a { position:relative; min-height:60px; padding:10px 12px; border:1px solid #3c4756; border-radius:8px; background:#1c232d; font-size:11px; color:#d1e0f4 }
.agent-results>a>span:first-child { display:block; color:#9baec9; font-size:8px; margin-bottom:5px; letter-spacing:.04em }.agent-results>a>span:last-child { position:absolute; right:10px; bottom:10px; color:#a6bddb }
.agent-confirmation { display:flex; align-items:flex-start; gap:8px; padding:12px 0 17px; margin-left:38px; border-top:1px solid #313a47 }.agent-confirmation-dot { width:5px; height:5px; flex-shrink:0; border-radius:50%; background:#d7ba86; margin-top:7px }.agent-confirmation p { color:#b7bdc5; font-size:10px; line-height:1.9; margin:0 }
.agent-activity { min-width:0; padding:16px 20px; background:#171b21; border-left:1px solid #343c47 }
.agent-activity-header { display:flex; justify-content:space-between; align-items:center; gap:8px }.agent-activity-header h3 { font-size:13px; font-weight:500; margin:0 }.agent-activity-header>span { font-size:9px; color:#a8b5c7 }
.agent-progress { height:3px; background:#333f50; margin:16px 0 18px; overflow:hidden; border-radius:3px }.agent-progress>span { display:block; height:100%; background:#accff8; transform-origin:left; transform:scaleX(.6) }
.agent-demo[data-motion=true] .agent-progress>span { transition:transform 260ms var(--agent-ease) }
.agent-log { display:grid; gap:7px }
.agent-log details { position:relative; border:1px solid transparent; border-radius:8px; padding:0 9px }
.agent-log details[data-state=active] { background:#243247; border-color:#587697 }.agent-log details[data-state=done] { background:#1b262a }
.agent-log summary { display:grid; grid-template-columns:10px 1fr auto; align-items:start; gap:8px; list-style:none; cursor:pointer; padding:11px 0; font-size:11px; color:#d5dfed; min-height:44px }
.agent-log summary::-webkit-details-marker { display:none }.agent-log summary>span:nth-child(2):after { content:' +'; color:#a0b0c6; margin-left:3px }.agent-log details[open] summary>span:nth-child(2):after { content:' −' }
.agent-log summary small { display:block; font-size:9px; color:#a3b1c5; margin-top:4px; float:left; width:100% }
.agent-log-dot { display:block; width:6px; height:6px; margin-top:6px; border-radius:50%; border:1px solid #759189; background:#a0c8b8 }
.agent-log-state { font-size:9px; color:#afd3c5; white-space:nowrap; padding-top:1px }
.agent-log details[data-state=active] .agent-log-dot { background:#bfddff; border-color:#bfddff; box-shadow:0 0 0 4px #b6d9ff12; animation:agent-dot 1.5s var(--agent-ease) infinite; animation-play-state:paused }
.agent-log details[data-state=active] .agent-log-state { color:#c1dfff }
.agent-log details[data-state=pending] .agent-log-dot { background:transparent; border-color:#6c7a8d }.agent-log details[data-state=pending] .agent-log-state { color:#94a2b6 }
.agent-log details>p { font-size:10px; line-height:1.95; color:#b3c4dc; padding:0 0 12px 18px; margin:0 }
.agent-artifact { display:block; border:1px solid #68705f; border-radius:9px; overflow:hidden; background:#e1e3d7; margin-top:22px; color:#37402f }
.agent-artifact-head { display:flex; justify-content:space-between; gap:6px; padding:9px 11px; font-size:8px; border-bottom:1px solid #b4bba7 }
.agent-artifact-body { display:flex; align-items:center; background:#e8e4db; padding:6px 8px; min-height:110px }.agent-artifact-body .goods-art { width:42%; border-radius:0; flex-shrink:0 }
.agent-artifact-body>div { padding:5px 7px }.agent-artifact-body small { display:block; font-size:6px; letter-spacing:.05em; color:#626c55 }.agent-artifact-body strong { display:block; font-size:17px; line-height:1.55; font-weight:550; letter-spacing:-.04em; margin:7px 0 }.agent-artifact-body>div>span { font-size:8px; color:#5b634e }
.agent-artifact footer { display:flex; justify-content:space-between; padding:8px 11px; font-size:9px; border-top:1px solid #b5bfab }
.agent-demo-footer { display:flex; justify-content:space-between; gap:14px; padding:11px 25px; border-top:1px solid #343e4d; background:#171d26; color:#a5b3c7; font-size:9px }.agent-demo-footer>span:last-child { color:#98a7bd; flex-shrink:0 }
.agent-bottom-note { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-top:20px; color:#a5aaa1; font-size:12px }.agent-bottom-note .text-action { font-size:12px }
/* Explanatory loops run only during an explicitly playing scene, never at rest. */
.agent-demo[data-playing=true][data-motion=true] :is(.agent-team li[data-state=active]:after,.dispatch-branches>span,.research-scan,.product-fields i,.studio-mini-hero,.studio-mini-sections>span,.agent-working-dots i,.agent-log details[data-state=active] .agent-log-dot) { animation-play-state:running }
.agent-demo[data-motion=false] *, .agent-demo[data-motion=false] *:after { animation:none!important }
@keyframes agent-handoff { to { transform:translateX(100%) } }
@keyframes agent-node { 0%,100% { opacity:.65; transform:translateY(0) } 30%,65% { opacity:1; transform:translateY(-3px) } }
@keyframes agent-scan { to { transform:translateX(600%) } }
@keyframes agent-field { 0%,12% { transform:scaleX(.2); opacity:.4 } 50%,100% { transform:scaleX(1); opacity:1 } }
@keyframes agent-assemble { 0%,8% { transform:translateY(9px); opacity:.4 } 38%,100% { transform:translateY(0); opacity:1 } }
@keyframes agent-dot { 0%,100% { opacity:.4; transform:translateY(0) } 50% { opacity:1; transform:translateY(-2px) } }
@media(hover:hover) and (pointer:fine) {
  .agent-demo a:hover { border-color:#88acd7 }.agent-play:hover { background:#f2f6fc }.agent-play:active { transform:scale(.97) }.agent-chapters button:hover { color:#edf5ff; background:#27354a }.agent-log summary:hover { color:#fff }
}
@media(max-width:1100px) {
  .agent-scene { grid-template-columns:minmax(0,1fr) 290px }.agent-conversation { padding-inline:22px }.agent-user-message { margin-left:36px }.agent-answer>p,.agent-team,.agent-update,.agent-results,.agent-confirmation { margin-left:0 }.agent-chapters button { padding-inline:8px }.agent-chapters button>span { margin-right:3px }.agent-activity { padding-inline:15px }.agent-update { gap:12px; padding:12px }.agent-update h3 { font-size:17px }.agent-update-copy>p { font-size:10px }.agent-team li { padding-inline:9px }
}
@media(max-width:800px) {
  .agent-demo { width:calc(100% - 48px) }.agent-toolbar { padding-inline:16px; flex-wrap:wrap; gap:8px }.agent-chapters { flex:1 }.agent-chapters button { flex:1; padding-inline:8px }.agent-chapters button>span { display:none }.agent-play { margin-left:auto }.agent-scene { grid-template-columns:1fr }.agent-conversation { padding:22px 25px 0 }.agent-activity { border-left:0; border-top:1px solid #343c47; padding:22px 25px; display:grid; grid-template-columns:1fr 220px; column-gap:26px; align-items:start }.agent-activity-header,.agent-progress { grid-column:1/-1 }.agent-progress { margin-bottom:12px }.agent-artifact { margin-top:0 }.agent-update { grid-template-columns:1fr 1fr }.agent-update h3 { font-size:19px }.agent-update-copy>p { font-size:11px }.agent-topbar-meta { align-items:flex-end; flex-direction:column; gap:6px }
}
@media(max-width:560px) {
  .agent-demo { width:calc(100% - 32px); border-radius:14px }.agent-topbar { padding:16px; flex-wrap:wrap; gap:12px }.agent-topbar-meta { flex-direction:row; align-items:center; flex-wrap:wrap; gap:8px }.agent-demo-label { font-size:8px }.agent-live-badge { font-size:8px; padding:4px 7px }.agent-brand { font-size:13px }.agent-brand img { width:30px; height:30px }.agent-chapters { flex-basis:100%; gap:0 }.agent-chapters button { font-size:10px; padding-inline:4px }.agent-toolbar { padding:8px 10px 10px }.agent-play { min-height:44px; font-size:10px; padding-block:7px }.agent-conversation { padding:16px 15px 0 }.agent-thread-label { font-size:9px; margin-bottom:15px }.agent-thread-label>span:last-child { display:none }.agent-user-message { margin-left:25px; padding:12px }.agent-user-message>p { font-size:12px; line-height:1.9 }.agent-speaker { left:-28px; top:14px; width:22px; height:22px; font-size:9px }.agent-user-message strong { white-space:normal }.agent-answer { margin-top:22px }.agent-answer>p { font-size:11px }.agent-team { gap:6px; margin-bottom:14px }.agent-team li { padding:10px 7px }.agent-role-number { width:20px; height:20px; font-size:8px }.agent-team strong { font-size:10px }.agent-team small { font-size:8px }.agent-role-state { font-size:8px }.agent-update { display:flex; flex-direction:column; gap:14px; padding:12px }.agent-update h3 { font-size:18px; margin-block:6px }.agent-update-copy>p { font-size:11px }.agent-visual { width:100% }.agent-visual-panel { height:160px }.agent-work-caption { font-size:8px; width:100%; gap:6px }.agent-phase-meter { width:30px }.agent-results { gap:6px; margin-top:14px; margin-bottom:16px }.agent-results>a { font-size:10px; padding:9px 7px 22px }.agent-results>a>span:last-child { right:8px; bottom:5px }.agent-results>a>span:first-child { font-size:7px }.agent-activity { display:block; padding:20px 16px }.agent-artifact { margin-top:20px }.agent-artifact-body .goods-art { width:42%; max-width:125px }.agent-artifact-body strong { font-size:18px }.agent-demo-footer { padding:12px 16px; flex-direction:column; gap:3px }.agent-bottom-note { display:block; font-size:11px }.agent-bottom-note .text-action { display:inline-flex; margin-top:6px }
}
@media(max-width:560px) {
  .agent-team li { display:block }
  .agent-role-number { margin-bottom:8px }
  .agent-role-state { margin-top:8px }
}
@media(prefers-reduced-motion:reduce) { .agent-demo *, .agent-demo *:before, .agent-demo *:after { animation:none!important; transition:none!important } }
.keyboard-input .agent-demo *, .keyboard-input .agent-demo *:before, .keyboard-input .agent-demo *:after { animation:none!important; transition:none!important }