@layer components{.ca-win{--hn-claude: #D97757;position:relative;width:100%;max-width:46rem;margin:0 auto;text-align:left}.ca-win .bars{gap:.375rem}.ca-win .bar{grid-template-columns:6rem minmax(0,1fr) 5.5rem;grid-template-areas:"label track value";align-items:center;column-gap:.75rem;font-size:var(--text-caption)}.ca-win .bar-track{height:.5rem}.ca-win .bar-track i{border-radius:999px}.ca-win .loop-ctl{--ctl: 1.75rem;top:.25rem;right:.5rem;bottom:auto;left:auto;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.ca-win .loop-ctl{color:var(--color-ink-deep)}.ca-win .loop-ring-t{stroke:#1a1f2e2e}.ca-win .loop-ring-p{stroke:var(--color-ink-deep)}.ca-win .loop-ctl .loop-ico-pause .ico{width:1rem;height:1rem}.ca-win .loop-ctl .loop-ico-play .ico{width:.75rem;height:.75rem}.ca-win .hn-chat{width:100%;height:auto}.ca-win .hn-view{padding:1.25rem 1.75rem .5rem}.ca-win .hn-flow{gap:1.25rem}.ca-win :is(.hn-m-a,.hn-m-r) .hn-body{gap:.5rem}.ca-role{display:inline-flex;align-items:center;gap:.375rem;color:var(--color-brand-ink);font-weight:600}.ca-role .ico{width:.875rem;height:.875rem;stroke-width:2}.ca-read{display:flex;align-items:center;gap:.5rem;color:var(--color-ink)}.ca-read .ico{flex:none;width:.875rem;height:.875rem;stroke-width:2;color:var(--color-brand)}.ca-win .hn-skill .hn-search{padding-top:.125rem}.ca-win .hn-search:last-child{padding-bottom:0;border-bottom:0}.ca-from{margin-left:.25rem;padding-left:.375rem;border-left:1px solid color-mix(in srgb,currentColor 35%,transparent);font-style:normal;font-weight:500;opacity:.8}.ca-app{--color-series: var(--color-brand);display:grid;gap:.625rem;padding:.75rem 1rem;border-radius:var(--radius-control);box-shadow:inset 0 0 0 1px var(--color-line)}.ca-app-t{display:grid;font-size:var(--text-small);font-weight:600;line-height:1.3}.ca-app-t span{color:var(--color-ink-2);font-size:.75rem;font-weight:500}@media(max-width:639px){.ca-win .hn-view{padding:1rem 1rem .5rem}.ca-win .hn .bar,.ca-win .bar{grid-template-columns:5rem minmax(0,1fr) auto}}}@layer components{:where(.motion) .ca-win .hn-chat{height:clamp(22rem,100svh - 34rem,30rem)}.ca-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.5rem;color:var(--color-ink-2);font-size:var(--text-caption);opacity:0;pointer-events:none;transition:opacity var(--duration-state) linear}.ca-empty .hn-logo{height:1rem}:where(.motion) .ca-win.loop:not(.is-q1) .ca-empty{opacity:1}:where(.motion) .ca-win .hn-view{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 1.5rem);mask-image:linear-gradient(to bottom,transparent,#000 1.5rem)}:where(.motion) .ca-win .hn-flow{transform:translateY(calc(-1 * var(--cw-l, 0px)));transition:transform var(--duration-move) var(--ease-out),opacity var(--duration-state) linear}:where(.motion) .ca-win.loop .hn-flow{transform:none}:where(.motion) .ca-win.loop.is-la .hn-flow{transform:translateY(calc(-1 * var(--cw-la, 0px)))}:where(.motion) .ca-win.loop.is-lq .hn-flow{transform:translateY(calc(-1 * var(--cw-lq, 0px)))}:where(.motion) .ca-win.loop.is-lb .hn-flow{transform:translateY(calc(-1 * var(--cw-lb, 0px)))}:where(.motion) .ca-win.loop.is-lift .hn-flow{transform:translateY(calc(-1 * var(--cw-l, 0px)))}:where(.motion) .ca-win.loop.is-out .hn-flow{opacity:0}:where(.motion) .ca-win.loop [data-b]{opacity:0;transform:translateY(6px);transition:opacity var(--duration-state) linear,transform var(--duration-state) var(--ease-out)}:where(.motion) .ca-win.loop .bar-track i{transform:scaleX(0);transition:transform .7s var(--ease-out) calc(.3s + var(--i, 0) * 60ms)}:where(.motion) .ca-win.loop :is(.is-q1 [data-b=q1],.is-r1 [data-b=r1],.is-k1 [data-b=k1],.is-s1 [data-b=s1],.is-s2 [data-b=s2],.is-s3 [data-b=s3],.is-a1 [data-b=a1],.is-q2 [data-b=q2],.is-r2 [data-b=r2],.is-k2 [data-b=k2],.is-b1 [data-b=b1],.is-b2 [data-b=b2],.is-app [data-b=app]){opacity:1;transform:none}:where(.motion) .ca-win.loop.is-app .bar-track i{transform:none}:where(.motion) .ca-win.loop.is-app :is(.bar-label,.bar-value){opacity:1}.ca-win .hn-typed{opacity:0}:where(.motion) .ca-win.loop .hn-typed{visibility:visible}:where(.motion) .ca-win.loop.is-t1 .hn-typed:nth-of-type(2),:where(.motion) .ca-win.loop.is-t2 .hn-typed:nth-of-type(3){opacity:1}:where(.motion) .ca-win.loop:is(.is-t1,.is-t2) .hn-ph{opacity:0}:where(.motion) .ca-win.loop [data-type] .ch{visibility:hidden}:where(.motion) .ca-win.loop [data-type] .ch.on{visibility:visible}:where(.motion) .ca-win.loop [data-type] .ch.on:not(:has(+.ch.on)){box-shadow:1.5px 0 0 var(--color-brand)}:where(.motion) .ca-win.loop.is-send .hn-send{transform:scale(.88)}.ca-win .hn-send{transition:transform var(--duration-ui) var(--ease-out)}}
