/* Product demo styles, shared by the product pages. Generated from assets/css/site.css by tools/extract_demo.py */
@keyframes appear {from{opacity:.3;translate:0 6px}to{opacity:1;translate:0 0}}
@keyframes rise-in {from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes phone-enter {from{opacity:0;transform:translateY(50px) rotate(0)}to{opacity:1;transform:translateY(0) rotate(-9deg)}}
@keyframes slip-float {0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(-2deg)}}
@keyframes hub-breathe {0%,100%{box-shadow:0 0 0 10px var(--background)}50%{box-shadow:0 0 0 16px color-mix(in srgb,var(--accent) 35%,transparent)}}
@keyframes action-shift {0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes data-flow {from{transform:translateX(-100%)}to{transform:translateX(400%)}}
@keyframes menu-in {from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes xh-rise { from { opacity: 0; transform: translateY(18px); } }
@keyframes xh-text { from { opacity: 0; transform: translateY(10px); filter: blur(4px); } }
@keyframes xh-card { from { opacity: 0; transform: translate(-24px, 18px) scale(.94); filter: blur(6px); } }
@keyframes xh-photo-in { from { opacity: 0; transform: translateY(30px) rotate(-3deg); } }
@keyframes xh-dash { to { background-position: 12px 0; } }
@keyframes xh-pop { from { opacity: 0; transform: scale(.2) rotate(-30deg); } }
@keyframes xh-meter { from { width: 48%; } }
@keyframes xh-timer { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.app-window { --ink: #141419; --raise: #1D1D25; --raise2: #24242E; --line: #2E2E39; --t: #F7F7FA; --t-mut: rgba(247,247,250,.74); --t-dim: rgba(247,247,250,.5);
  --ok: #3DD6B5; --warn: #F2B14C; --bad: #F07A7E; --hue: color-mix(in srgb, var(--app) 52%, #fff);
  margin-top: 18px; background: var(--ink); color: var(--t); border-radius: 22px; overflow: hidden; box-shadow: 0 40px 90px -40px rgb(20 20 25 / .65), 0 2px 4px rgb(20 20 25 / .08); }
.app-window *, .app-window *::before, .app-window *::after { border-color: var(--line); }
.app-window p { color: inherit; }
.app-window h4 { font-weight: 600; }
.app-window .aw-bar { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.app-window .aw-url { font-family: var(--font-mono); font-size: 12px; background: var(--raise); color: var(--t-mut); padding: 6px 12px; border-radius: 8px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-window .aw-tag { margin-left: auto; font-size: 12px; color: var(--t-dim); white-space: nowrap; }
.app-window .aw-reset { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: none; color: var(--t-mut); padding: 6px 10px; border-radius: 8px; font-size: 12px; cursor: pointer; }
.app-window .aw-reset:hover { color: var(--t); border-color: var(--t-dim); }
.app-window .aw-body { display: grid; grid-template-columns: 184px minmax(0, 1fr); min-height: 560px; }
.app-window .aw-side { border-right: 1px solid var(--line); padding: 20px 12px; display: flex; flex-direction: column; gap: 3px; }
.app-window .aw-lock { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 15px; line-height: 1.1; letter-spacing: -.03em; margin: 0 8px 18px; }
.app-window .aw-lock svg { color: var(--hue); flex-shrink: 0; }
.app-window .aw-lock span { display: block; font-weight: 400; color: var(--t-dim); }
.app-window .aw-nav { text-align: left; border: 0; background: none; padding: 9px 10px; border-radius: 9px; font-size: 13.5px; color: var(--t-mut); cursor: pointer; display: flex; align-items: center; gap: 9px; }
.app-window .aw-nav:hover { color: var(--t); background: color-mix(in srgb, var(--raise) 60%, transparent); }
.app-window .aw-nav[aria-current="page"] { background: var(--raise2); color: var(--t); }
.app-window .aw-nav[aria-current="page"] svg { color: var(--hue); }
.app-window .aw-main { padding: 26px 30px 30px; min-width: 0; }
.app-window .aw-pane { animation: xh-text .45s both; }
.app-window .aw-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.app-window .aw-h { font-size: 21px; letter-spacing: -.02em; line-height: 1.2; }
.app-window .aw-sub { font-family: var(--font-mono); font-size: 11.5px; color: var(--t-dim); margin-top: 6px; }
.app-window .aw-label { display: block; font-size: 12px; color: var(--t-dim); margin: 0 0 10px; }
.app-window .aw-pills { display: inline-flex; gap: 4px; padding: 3px; border-radius: 11px; background: var(--raise); }
.app-window .aw-pill { border: 0; background: none; color: var(--t-mut); font-size: 12.5px; padding: 6px 12px; border-radius: 8px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.app-window .aw-pill[aria-pressed="true"] { background: var(--t); color: var(--ink); font-weight: 600; }
.app-window .aw-pill small { font-size: 10px; opacity: .7; }
.app-window .aw-btn { display: inline-flex; align-items: center; gap: 8px; border: 0; background: var(--t); color: var(--ink); font-size: 13px; font-weight: 600; padding: 10px 16px; border-radius: 10px; cursor: pointer; transition: transform .15s, opacity .2s; }
.app-window .aw-btn:hover:not(:disabled) { transform: translateY(-1px); }
.app-window .aw-btn:disabled { opacity: .38; cursor: not-allowed; }
.app-window .aw-btn.ghost { background: transparent; color: var(--t); border: 1px solid var(--line); }
.app-window .aw-btn.hue { background: var(--hue); }
.app-window .aw-select { background: var(--raise); color: var(--t); border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-size: 12.5px; max-width: 100%; }
.app-window .aw-hint { font-family: var(--font-mono); font-size: 11.5px; color: var(--t-dim); }
.app-window .aw-table-wrap { overflow-x: auto; }
.app-window .aw-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.app-window .aw-table th { font-weight: 500; color: var(--t-dim); font-size: 11.5px; text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.app-window .aw-table td { padding: 12px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.app-window .aw-table td.r, .app-window .aw-table th.r { text-align: right; }
.app-window .aw-table tbody tr { animation: xh-text .4s both; }
.app-window .aw-log { background: #0D0D11; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; font-family: var(--font-mono); font-size: 12px; line-height: 1.5; height: 150px; overflow: auto; color: var(--t-mut); }
.app-window .aw-log > div { padding: 3px 0; animation: xh-text .35s both; }
.app-window .aw-log .lt { color: var(--t-dim); margin-right: 10px; }
.app-window .aw-log .ok { color: var(--ok); }
.app-window .aw-log .warn { color: var(--warn); }
.app-window .aw-log .bad { color: var(--bad); }
.app-window .aw-log .hue { color: var(--hue); }
.app-window .aw-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.app-window .aw-kpi { background: var(--raise); border-radius: 14px; padding: 14px 16px; }
.app-window .aw-kpi > span { display: block; font-size: 12px; color: var(--t-dim); }
.app-window .aw-kpi > strong { display: block; font-family: var(--font-mono); font-size: 24px; font-weight: 400; margin-top: 6px; letter-spacing: -.02em; }
.app-window .aw-kpi > em { display: block; font-size: 12px; margin-top: 4px; color: var(--t-dim); }
.app-window .aw-kpi > em.up { color: var(--ok); }
.app-window .aw-kpi > em.down { color: var(--warn); }
.app-window .aw-prog { height: 4px; border-radius: 4px; background: var(--raise2); overflow: hidden; }
.app-window .aw-prog i { display: block; height: 100%; width: 0; background: var(--hue); transition: width .5s ease; }
.app-window .aw-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.app-window .aw-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.app-window .aw-card { background: var(--raise); border-radius: 16px; padding: 18px; min-width: 0; }
.app-window .aw-card-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--t-mut); margin-bottom: 14px; }
.app-window .aw-card-h strong { color: var(--t); font-size: 14px; display: inline-flex; align-items: center; gap: 8px; }
.app-window .aw-card-h img { height: 18px; width: auto; }
.app-window .aw-toggle { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; color: var(--t-mut); cursor: pointer; user-select: none; }
.app-window .aw-toggle input { appearance: none; width: 34px; height: 20px; border-radius: 20px; background: var(--raise2); border: 1px solid var(--line); position: relative; cursor: pointer; transition: background .2s; flex-shrink: 0; }
.app-window .aw-toggle input::after { content: ''; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: var(--t-mut); transition: transform .2s, background .2s; }
.app-window .aw-toggle input:checked { background: var(--hue); border-color: var(--hue); }
.app-window .aw-toggle input:checked::after { transform: translateX(14px); background: var(--ink); }
.app-window .cn-ov { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; }
.app-window .cn-kicker { display: block; font-size: 12px; color: var(--t-dim); margin-bottom: 6px; }
.app-window .cn-lead { font-size: 15px; color: var(--t-mut); margin-bottom: 14px; }
.app-window .cn-lead b { color: var(--t); font-weight: 600; font-family: var(--font-mono); }
.app-window .cn-bar { display: flex; height: 12px; border-radius: 6px; overflow: hidden; gap: 2px; margin-bottom: 10px; background: var(--raise); }
.app-window .cn-bar i { display: block; flex-basis: 0; transition: flex-grow 1s cubic-bezier(.2,.7,.2,1); }
.app-window .cn-legend { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 4px 16px; font-size: 12px; color: var(--t-mut); margin: 0 0 22px; }
.app-window .cn-legend > div { display: flex; justify-content: space-between; gap: 8px; }
.app-window .cn-legend dt { display: flex; align-items: center; gap: 7px; }
.app-window .cn-legend dt i { width: 10px; height: 4px; border-radius: 2px; }
.app-window .cn-legend dd { margin: 0; font-family: var(--font-mono); color: var(--t); }
.app-window .cn-chart { width: 100%; height: 140px; display: block; overflow: visible; }
.app-window .cn-chart .gl line { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.app-window .cn-chart .ln { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; transition: d .8s ease; }
.app-window .cn-chart .ln-rev { stroke: var(--hue); stroke-dashoffset: 0; transition: d .8s ease, stroke-dashoffset 1.2s ease; }
.app-window .cn-chart .ln-units { stroke: rgba(247,247,250,.35); stroke-dasharray: 4 4; }
.app-window .cn-chart .ar { fill: color-mix(in srgb, var(--hue) 14%, transparent); transition: d .8s ease, opacity .8s; }
.app-window .cn-axis { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 10.5px; color: var(--t-dim); margin-top: 8px; }
.app-window .cn-top { margin-top: 26px; }
.app-window .cn-top li { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(80px, 1fr) 50px 90px; align-items: center; gap: 14px; padding: 10px 8px; border-radius: 10px; transition: background .5s; }
.app-window .cn-top .nm { font-size: 13.5px; min-width: 0; }
.app-window .cn-top .nm em { display: block; font-size: 11.5px; color: var(--t-dim); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app-window .cn-top .tr { height: 6px; border-radius: 6px; background: var(--raise2); overflow: hidden; }
.app-window .cn-top .tr i { display: block; height: 100%; background: var(--hue); border-radius: 6px; transition: width .8s cubic-bezier(.2,.7,.2,1); }
.app-window .cn-top .od, .app-window .cn-top .rv { font-family: var(--font-mono); font-size: 12.5px; text-align: right; }
.app-window .cn-gov { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.app-window .cn-cells { display: flex; gap: 3px; }
.app-window .cn-cells i { width: 14px; height: 22px; border-radius: 4px; background: var(--raise2); transition: background .3s; }
.app-window .cn-cells i.on { background: var(--hue); }
.app-window .cn-ord tr.rc { cursor: pointer; }
.app-window .cn-ord tr.rc:hover td { background: color-mix(in srgb, var(--raise) 70%, transparent); }
.app-window .cn-ord .chev { width: 24px; color: var(--t-dim); transition: transform .2s; }
.app-window .cn-ord .chev svg { transition: transform .2s; }
.app-window .cn-ord .oid { font-family: var(--font-mono); }
.app-window .cn-ord .och { font-size: 11.5px; color: var(--t-dim); margin-top: 2px; }
.app-window .cn-ord .raw { font-family: var(--font-mono); font-size: 11px; color: var(--t-dim); margin-right: 8px; }
.app-window .cn-det td { padding: 0 !important; background: color-mix(in srgb, var(--raise) 55%, transparent); }
.app-window .cn-det[hidden] { display: none !important; }
.app-window .cn-det-in { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 24px; padding: 18px 20px 20px 44px; animation: xh-text .35s both; }
.app-window .cn-tl li { display: flex; align-items: center; gap: 10px; font-size: 12.5px; padding: 5px 0; color: var(--t-dim); }
.app-window .cn-tl li svg { color: var(--t-dim); opacity: .5; }
.app-window .cn-tl li span { margin-left: auto; font-family: var(--font-mono); font-size: 11px; color: var(--t-dim); }
.app-window .cn-kv { display: flex; justify-content: space-between; gap: 14px; font-size: 12.5px; padding: 6px 0; color: var(--t-dim); }
.app-window .cn-kv b { color: var(--t); font-weight: 500; text-align: right; }
.app-window .ds-chart-card { position: relative; background: var(--raise); border-radius: 16px; padding: 16px 16px 10px; margin: 16px 0; }
.app-window .ds-legend { display: flex; gap: 18px; flex-wrap: wrap; font-size: 12px; color: var(--t-mut); margin-bottom: 10px; }
.app-window .ds-legend span { display: inline-flex; align-items: center; gap: 7px; }
.app-window .ds-legend i { width: 14px; height: 3px; border-radius: 2px; }
.app-window .ds-chart { width: 100%; height: 190px; display: block; cursor: crosshair; }
.app-window .ds-chart path { transition: d .7s ease; }
.app-window .ds-tip { position: absolute; pointer-events: none; background: #0D0D11; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; font-family: var(--font-mono); font-size: 11.5px; line-height: 1.5; white-space: nowrap; }
.app-window .ds-tip .p { color: var(--hue); }
.app-window .ds-tip .q { color: var(--warn); }
.app-window .ds-wf { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 18px; }
.app-window .ds-wf-row { display: grid; grid-template-columns: 200px minmax(0, 1fr) 110px; align-items: center; gap: 16px; font-size: 13.5px; }
.app-window .ds-wf-row .bar { position: relative; height: 26px; border-radius: 7px; background: var(--raise); overflow: hidden; }
.app-window .ds-wf-row .bar i { position: absolute; top: 0; bottom: 0; left: var(--l, 0%); width: 0; border-radius: 7px; transition: width .7s cubic-bezier(.2,.7,.2,1), left .7s cubic-bezier(.2,.7,.2,1); }
.app-window .ds-wf-row .v { font-family: var(--font-mono); text-align: right; }
.app-window .ds-callout { background: color-mix(in srgb, var(--warn) 10%, transparent); color: var(--t-mut); border-radius: 12px; padding: 14px 16px; font-size: 13.5px; }
.app-window .ds-callout b { color: var(--warn); font-family: var(--font-mono); }
.app-window .rv-conf { width: 90px; height: 6px; border-radius: 6px; background: var(--raise2); overflow: hidden; }
.app-window .rv-conf i { display: block; height: 100%; background: var(--ok); border-radius: 6px; transition: width .5s, background .3s; }
.app-window .rv-res { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0; }
.app-window .ph { background: #0B0B0E; border: 1px solid var(--line); border-radius: 26px; padding: 14px; min-width: 0; }
.app-window .ph-top { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--t-dim); margin-bottom: 12px; padding: 0 4px; }
.app-window .ph-top img { height: 18px; width: auto; }
.app-window .ph-item { display: flex; gap: 12px; align-items: center; background: var(--raise); border-radius: 14px; padding: 10px; }
.app-window .ph-item img { width: 46px; height: 56px; object-fit: cover; border-radius: 8px; }
.app-window .ph-item strong { display: block; font-size: 13.5px; }
.app-window .ph-item span { font-size: 12px; color: var(--t-dim); }
.app-window .ph-item .pr { margin-left: auto; font-family: var(--font-mono); font-size: 13px; }
.app-window .ph-body { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.app-window .ph-status { background: var(--raise); border-radius: 14px; padding: 12px 14px; font-size: 13px; animation: xh-text .4s both; }
.app-window .ph-status strong { display: block; font-size: 14px; margin-bottom: 2px; }
.app-window .ph-status span { color: var(--t-dim); font-size: 12.5px; }
.app-window .ph-status.ok strong { color: var(--ok); }
.app-window .ph-status.bad strong { color: var(--bad); }
.app-window .ph-status.hue strong { color: var(--hue); }
.app-window .ph-btn { width: 100%; justify-content: center; }
.app-window .sys-rows { display: flex; flex-direction: column; gap: 8px; }
.app-window .sys-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; background: var(--raise2); border-radius: 10px; padding: 10px 12px; animation: xh-text .4s both; }
.app-window .sys-row .k { color: var(--t-dim); }
.app-window .sys-empty { font-size: 13px; color: var(--t-dim); padding: 18px 4px; }
.app-window .ly-meter { height: 8px; border-radius: 8px; background: var(--raise2); overflow: hidden; margin-top: 10px; }
.app-window .ly-meter i { display: block; height: 100%; width: 0; background: var(--hue); border-radius: 8px; transition: width .8s cubic-bezier(.2,.7,.2,1); }
.app-window .ly-bal { display: flex; align-items: baseline; gap: 10px; }
.app-window .ly-bal strong { font-family: var(--font-mono); font-size: 30px; font-weight: 400; letter-spacing: -.02em; }
.app-window .ly-bal span { font-size: 12px; color: var(--t-dim); }
.app-window .ly-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.app-window .ly-actions .aw-btn { justify-content: center; padding: 10px 8px; font-size: 12.5px; }
.app-window .crm-flow { display: flex; flex-direction: column; gap: 8px; }
.app-window .crm-step { display: flex; align-items: center; gap: 12px; background: var(--raise2); border-radius: 12px; padding: 11px 13px; font-size: 13px; transition: background .3s, color .3s; color: var(--t-mut); }
.app-window .crm-step svg { flex-shrink: 0; color: var(--t-dim); }
.app-window .crm-step.run { background: color-mix(in srgb, var(--hue) 16%, var(--raise2)); color: var(--t); }
.app-window .crm-step.run svg { color: var(--hue); }
.app-window .crm-step.done { color: var(--t); }
.app-window .crm-step.done svg { color: var(--ok); }
.app-window .crm-step.stop { color: var(--t); }
.app-window .crm-step.stop svg { color: var(--bad); }
.app-window .crm-step select { margin-left: auto; padding: 5px 8px; font-size: 12px; }
.app-window .crm-mail { background: #FBF8FA; color: #1A1A20; border-radius: 14px; overflow: hidden; }
.app-window .crm-mail-h { padding: 10px 14px; border-bottom: 1px solid #ECE6EE; font-size: 12px; color: #5B5B66; }
.app-window .crm-mail-h b { color: #1A1A20; font-weight: 600; }
.app-window .crm-mail-b { padding: 16px 14px; display: flex; gap: 14px; align-items: center; }
.app-window .crm-mail-b img { width: 64px; height: 78px; object-fit: cover; border-radius: 10px; }
.app-window .crm-mail-b strong { display: block; font-size: 16px; letter-spacing: -.02em; line-height: 1.25; }
.app-window .crm-mail-b p { color: #5B5B66; font-size: 12.5px; margin-top: 6px; }
.app-window .crm-mail-b .cta { display: inline-block; margin-top: 10px; background: #1A1A20; color: #fff; font-size: 12px; padding: 7px 12px; border-radius: 8px; }
.app-window .crm-badge { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--hue); background: color-mix(in srgb, var(--hue) 12%, transparent); padding: 6px 10px; border-radius: 8px; }
@media (max-width: 1100px) {
  .app-window .aw-body { grid-template-columns: 150px minmax(0,1fr); }
  .app-window .cn-ov, .app-window .aw-split { grid-template-columns: minmax(0,1fr); }
  .app-window .ds-wf-row { grid-template-columns: 150px minmax(0,1fr) 96px; }
}
@media (max-width: 760px) {
  .app-window { border-radius: 16px; margin-inline: -8px; }
  .app-window .aw-tag { display: none; }
  .app-window .aw-body { grid-template-columns: minmax(0,1fr); min-height: 0; }
  .app-window .aw-side { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); padding: 10px; gap: 4px; }
  .app-window .aw-lock { display: none; }
  .app-window .aw-nav { white-space: nowrap; }
  .app-window .aw-main { padding: 18px 16px 20px; }
  .app-window .aw-kpis, .app-window .rv-res { grid-template-columns: minmax(0,1fr); gap: 8px; }
  .app-window .cn-top li { grid-template-columns: minmax(0,1fr) 44px 80px; }
  .app-window .cn-top .tr { display: none; }
  .app-window .cn-det-in { grid-template-columns: minmax(0,1fr); padding: 14px; }
  .app-window .ds-wf-row { grid-template-columns: minmax(0,1fr) 92px; gap: 6px 12px; }
  .app-window .ds-wf-row .bar { grid-column: 1 / -1; grid-row: 2; }
  .app-window .ly-actions { grid-template-columns: minmax(0,1fr); }
}
@keyframes fs-flow { to { stroke-dashoffset: -14; } }
@keyframes xo-nudge { 50% { transform: translateY(3px); } }
@keyframes xh-skipbob { 50% { transform: translateY(4px); } }
@keyframes cl-flash { 0% { opacity: 0; } 12% { opacity: 1; } 22% { opacity: .2; } 32% { opacity: .85; } 100% { opacity: 0; } }
@keyframes cl-glow { 0%, 100% { filter: none; } 20% { filter: drop-shadow(0 0 30px #FF7AC6) brightness(1.4); } }
@keyframes cw-move { to { transform: translateX(-50%); } }
@keyframes pt-attract { 40% { transform: translateY(-6px); } }
@keyframes pt-sweep { to { transform: translateX(120%); } }
@keyframes pt-spark { 0% { opacity: 0; transform: scale(.4); } 30% { opacity: 1; transform: scale(1.6); } 100% { opacity: 0; transform: scale(2.4); } }
@keyframes pt-pulse { 50% { box-shadow: 0 0 0 10px color-mix(in srgb, var(--c) 12%, transparent), 0 0 40px var(--c); } }
@keyframes cl-thunder { 0% { opacity: 0; } 8% { opacity: .9; } 18% { opacity: .15; } 30% { opacity: .55; } 100% { opacity: 0; } }
@keyframes cl-thunder2 { 0% { opacity: 0; } 6% { opacity: 1; } 12% { opacity: .1; } 20% { opacity: .85; } 28% { opacity: .25; } 40% { opacity: .7; } 100% { opacity: 0; } }
@keyframes cl-wordflash { 0%, 100% { filter: none; } 8% { filter: brightness(1.7) drop-shadow(0 0 28px rgb(255 122 198 / .8)); } 18% { filter: brightness(1.05); } 30% { filter: brightness(1.45) drop-shadow(0 0 18px rgb(255 122 198 / .6)); } }
@keyframes cl-baseflash { 8% { color: rgb(255 255 255 / .22); } 30% { color: rgb(255 255 255 / .14); } }
@keyframes cl-boltglow { 0%, 100% { filter: drop-shadow(0 0 6px #FF7AC6); } 50% { filter: drop-shadow(0 0 22px #FF7AC6) brightness(1.3); } }
@keyframes cl-ctaglow { 50% { box-shadow: 0 0 34px 2px rgb(255 122 198 / .45); } }
.app-window .aw-hintbar { display: flex; align-items: center; gap: 10px; padding: 10px 16px; font-size: 13px; color: var(--t-mut); background: color-mix(in srgb, var(--hue) 9%, transparent); border-bottom: 1px solid var(--line); }
.app-window .aw-hintbar svg { color: var(--hue); flex-shrink: 0; }
.app-window .aw-hintbar b { color: var(--t); font-weight: 600; }