.demo{position:relative}.demo .panel{border-radius:var(--radius-2xl)}.demo__body{position:relative;min-height:var(--demo-h, 560px)}.demo__bar{display:flex;align-items:center;gap:14px;padding:10px 14px;border-top:1px solid var(--line);background:#ffffff04;flex-wrap:wrap}.demo__transport{display:flex;gap:6px}.demo__btn{display:inline-flex;align-items:center;gap:7px;height:32px;padding-inline:11px;border-radius:8px;border:1px solid var(--line-strong);color:var(--ink);font-size:.8125rem;font-weight:550;background:#ffffff08;transition:background-color var(--dur-fast),border-color var(--dur-fast)}.demo__btn:hover{background:#ffffff12}.demo__btn:focus-visible{outline:none;box-shadow:0 0 0 2px var(--obsidian),0 0 0 4px #7aa2ff}.demo__btn[disabled]{opacity:.45;pointer-events:none}.demo__btn--play{min-width:92px;background:var(--ink);color:var(--paper);border-color:transparent}.demo__btn--play:hover{background:#fff}.demo__progress{flex:1;min-width:200px;display:grid;gap:6px}.demo__progress input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:16px;background:transparent;cursor:pointer}.demo__progress input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,var(--ai) var(--p, 0%),rgb(255 255 255 / .12) var(--p, 0%))}.demo__progress input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:linear-gradient(to right,var(--ai) var(--p, 0%),rgb(255 255 255 / .12) var(--p, 0%))}.demo__progress input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #8b7fff59}.demo__progress input[type=range]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #8b7fff59}.demo__progress input[type=range]:focus-visible{outline:none}.demo__progress input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px #7aa2ff}.demo__chapters{display:flex;gap:4px;list-style:none;padding:0;overflow-x:auto;scrollbar-width:none}.demo__chapters::-webkit-scrollbar{display:none}.demo__chapters button{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:3px 7px;border-radius:6px;white-space:nowrap}.demo__chapters button:hover{color:var(--ink);background:#ffffff0d}.demo__chapters button.is-done{color:var(--ink-2)}.demo__chapters button.is-active{color:var(--ink);background:#8b7fff29}.demo__chapters button:focus-visible{outline:none;box-shadow:0 0 0 2px #7aa2ff}.demo__toolbar{display:flex;gap:8px;align-items:center}.demo__foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:8px 14px;border-top:1px solid var(--line);font-family:var(--font-mono);font-size:.6875rem;color:var(--muted)}@media(max-width:640px){.demo__btn-label{display:none}.demo__progress{order:3;flex-basis:100%}}.seg{display:inline-flex;padding:3px;gap:2px;border-radius:9px;background:#ffffff0f;border:1px solid var(--line)}.seg button{height:26px;padding-inline:10px;border-radius:6px;font-size:.75rem;font-weight:550;color:var(--muted);white-space:nowrap}.seg button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.seg button:focus-visible{outline:none;box-shadow:0 0 0 2px #7aa2ff}.d-card{background:var(--obsidian-2, #11141b);border:1px solid var(--line);border-radius:14px}.d-label{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.d-pill{display:inline-flex;align-items:center;gap:6px;height:22px;padding-inline:8px;border-radius:999px;font-size:.6875rem;font-weight:600;font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;color:var(--c, var(--muted));background:color-mix(in srgb,var(--c, #9aa0ab) 14%,transparent);border:1px solid color-mix(in srgb,var(--c, #9aa0ab) 30%,transparent)}.c-signal{--c: #ff5a5a}.c-ai{--c: #a99fff}.c-transit{--c: #f5b54a}.c-done{--c: #4ade80}.c-muted{--c: #9aa0ab}.d-mono{font-family:var(--font-mono);font-feature-settings:"zero","tnum"}.d-caret:after{content:"";display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:-.15em;background:currentColor;animation:d-blink 1s steps(1) infinite}@keyframes d-blink{50%{opacity:0}}.d-enter{animation:d-enter var(--dur-slow) var(--ease-out-expo) both}@keyframes d-enter{0%{opacity:0;transform:translateY(8px) scale(.985)}}.d-pop{animation:d-pop .42s var(--ease-spring) both}@keyframes d-pop{0%{opacity:0;transform:scale(.9)}}.d-ring{position:relative}.d-ring:before,.d-ring:after{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid var(--c, #ff3b3b);animation:d-ring 1.6s var(--ease-out) infinite;pointer-events:none}.d-ring:after{animation-delay:.8s}@keyframes d-ring{0%{transform:scale(1);opacity:.7}to{transform:scale(1.9);opacity:0}}@media(prefers-reduced-motion:reduce){.d-caret:after,.d-ring:before,.d-ring:after{animation:none;display:none}}
