.user-avatar{--avatar-a:var(--ui-accent-fill);--avatar-b:var(--ui-accent-fill-2);inline-size:var(--avatar-size,36px);block-size:var(--avatar-size,36px);border-radius:50%;flex-shrink:0;place-items:center;display:inline-grid;overflow:hidden}.user-avatar.is-initials{background:radial-gradient(120% 90% at 28% 18%, #ffffff24, transparent 55%), linear-gradient(150deg, var(--avatar-a), var(--avatar-b));color:#fff;font-weight:700;font-size:calc(var(--avatar-size,36px) * .38);letter-spacing:.02em;box-shadow:inset 0 0 0 1px #ffffff38, 0 2px 6px -2px color-mix(in srgb, var(--avatar-b) 60%, transparent);text-shadow:0 1px 1px #0000002e}.user-avatar.is-mascot .agent-mascot{block-size:100%;inline-size:100%}.account-menu{flex-shrink:0;position:relative}.account-menu>summary{list-style:none}.account-menu>summary::-webkit-details-marker{display:none}.account-trigger{cursor:pointer;box-shadow:0 0 0 1px color-mix(in srgb, var(--border) 80%, transparent);transition:box-shadow var(--dur-2,.16s) ease, transform var(--dur-2,.16s) ease;border-radius:50%;place-items:center;padding:2px;display:grid}.account-trigger:hover,.account-menu[open]>.account-trigger{box-shadow:0 0 0 2px var(--ui-accent)}.account-trigger:focus-visible{outline:2px solid var(--ui-accent);outline-offset:2px}.account-panel{z-index:40;background:var(--surface);border:1px solid color-mix(in srgb, var(--border) 85%, transparent);border-radius:var(--r-xl,16px);inline-size:18.5rem;animation:account-pop var(--dur-2) var(--ease-out);transform-origin:100% 0;padding:.5rem;position:absolute;top:calc(100% + .55rem);right:0;box-shadow:0 18px 44px -14px #0f172a59,0 2px 6px #0f172a0f}@keyframes account-pop{0%{opacity:0;transform:translateY(-4px)scale(.98)}}.account-head{border-radius:calc(var(--r-xl,16px) - 4px);background:radial-gradient(140% 120% at 0% 0%, color-mix(in srgb, var(--ui-accent) 16%, transparent), transparent 60%), color-mix(in srgb, var(--ui-accent) 5%, var(--surface));align-items:center;gap:.75rem;margin-bottom:.35rem;padding:.75rem .7rem .85rem;display:flex}.account-who{min-inline-size:0}.account-who p{text-overflow:ellipsis;white-space:nowrap;margin:0;overflow:hidden}.account-name{color:var(--text);font-weight:700}.account-sub{color:var(--text-muted);font-size:.8rem}.account-mail{color:var(--text-muted);font-size:.76rem}.account-mode{background:color-mix(in srgb, var(--text) 5%, transparent);border-radius:999px;grid-template-columns:repeat(3,1fr);gap:.25rem;margin:0 .2rem .45rem;padding:.25rem;display:grid}.account-mode-btn{color:var(--text-muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;gap:.3rem;padding:.32rem .4rem;font-size:.78rem;font-weight:600;display:inline-flex}.account-mode-btn:hover{color:var(--text)}.account-mode-btn.is-current{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #0f172a24, inset 0 0 0 1px color-mix(in srgb, var(--ui-accent) 35%, transparent)}.account-mode-btn.is-current svg{color:var(--ui-accent)}.account-locale{grid-template-columns:repeat(3,1fr);gap:.25rem;margin:0 .2rem .45rem;display:grid}.account-locale-btn{border:1px solid color-mix(in srgb, var(--border) 85%, transparent);border-radius:var(--r-md,8px);min-block-size:2rem;color:var(--text-2);font:inherit;cursor:pointer;background:0 0;padding:.25rem .4rem;font-size:.8rem;font-weight:600}.account-locale-btn:hover{color:var(--text);background:color-mix(in srgb, var(--ui-accent) 6%, transparent)}.account-locale-btn.is-current{color:var(--primary-text);background:var(--primary-soft);border-color:color-mix(in srgb, var(--ui-accent) 40%, var(--border))}.account-mode-btn:focus-visible,.account-locale-btn:focus-visible,.account-link:focus-visible{box-shadow:var(--ring);outline:none}.account-links{gap:1px;display:grid}.account-link{inline-size:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:background var(--dur-1,.12s) ease;background:0 0;border:0;border-radius:10px;align-items:center;gap:.65rem;padding:.48rem .6rem;font-size:.9rem;text-decoration:none;display:flex}.account-link:hover,.account-link:focus-visible{background:color-mix(in srgb, var(--ui-accent) 9%, transparent);outline:none}.account-link-icon{background:color-mix(in srgb, var(--ui-accent) 11%, transparent);block-size:28px;inline-size:28px;color:var(--ui-accent);border-radius:8px;place-items:center;display:grid}.account-logout{border-top:1px solid color-mix(in srgb, var(--border) 80%, transparent);margin-top:.35rem;padding-top:.35rem}.account-link.is-logout{color:var(--text-muted)}.account-link.is-logout .account-link-icon{background:color-mix(in srgb, var(--text) 6%, transparent);color:var(--text-muted)}.ap-studio{grid-template-columns:minmax(16rem,22rem) 1fr;align-items:start;gap:1.5rem;margin-top:.75rem;display:grid}@media (max-width:900px){.ap-studio{grid-template-columns:1fr}}.ap-motion{border-top:1px solid var(--border);max-width:40rem;margin-top:1.25rem;padding-top:1rem}.ap-preview-wrap{top:calc(var(--header-height,56px) + 1rem);gap:.5rem;display:grid;position:sticky}.ap-controls{gap:1.35rem;display:grid}.ap-section{gap:.6rem;display:grid}.ap-section-head h3{margin:0;font-size:.95rem}.ap-section-head p{margin:.1rem 0 0;font-size:.82rem}.ap-tick{background:var(--ui-accent);color:#fff;block-size:20px;inline-size:20px;box-shadow:0 0 0 2px var(--surface);border-radius:50%;place-items:center;display:grid;position:absolute;top:6px;right:6px}.ap-preset,.ap-mode,.ap-amb,.ap-pattern,.ap-avatar-style,.ap-vseg-btn{border:1px solid color-mix(in srgb, var(--border) 85%, transparent);background:var(--surface);color:var(--text);font:inherit;text-align:left;cursor:pointer;border-radius:14px;gap:.4rem;padding:.45rem;font-size:.82rem;font-weight:600;transition:border-color .14s,box-shadow .14s,transform .14s;display:grid;position:relative}.ap-preset:hover,.ap-mode:hover,.ap-amb:hover,.ap-pattern:hover,.ap-avatar-style:hover,.ap-vseg-btn:hover:not(:disabled){border-color:color-mix(in srgb, var(--ui-accent) 45%, var(--border));transform:translateY(-1px);box-shadow:0 6px 16px -10px #0f172a66}.ap-preset.is-current,.ap-mode.is-current,.ap-amb.is-current,.ap-pattern.is-current,.ap-avatar-style.is-current,.ap-vseg-btn.is-current{border-color:var(--ui-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--ui-accent) 22%, transparent)}.ap-preset:focus-visible,.ap-mode:focus-visible,.ap-amb:focus-visible,.ap-pattern:focus-visible,.ap-avatar-style:focus-visible,.ap-vseg-btn:focus-visible,.ap-swatch:focus-visible{outline:2px solid var(--ui-accent);outline-offset:2px}.ap-presets{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.6rem;display:grid}.ap-preset-swatch{border-radius:10px;grid-template-columns:3fr 2fr;block-size:44px;display:grid;overflow:hidden}.ap-preset-swatch span:first-child{background:linear-gradient(160deg, var(--ui-accent), color-mix(in oklab, var(--ui-accent) 70%, #000))}.ap-preset-swatch span:last-child{background:linear-gradient(160deg, var(--ui-accent-2), color-mix(in oklab, var(--ui-accent-2) 70%, #000))}.ap-preset-name{padding:0 .15rem .1rem}.ap-colors{grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.7rem 1.2rem;display:grid}.ap-color-group{gap:.35rem;display:grid}.ap-color-group-name{letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);font-size:.72rem;font-weight:650}.ap-color-row{gap:.55rem;display:flex}.ap-color-row.is-wrap{flex-wrap:wrap;gap:.45rem}.ap-swatch{--sw-a:var(--ui-accent);--sw-b:var(--ui-accent-2);background:radial-gradient(110% 90% at 30% 20%, #ffffff59, transparent 50%), linear-gradient(150deg, var(--sw-a) 35%, var(--sw-b));color:#fff;cursor:pointer;block-size:42px;inline-size:42px;box-shadow:inset 0 0 0 1px #fff3, 0 3px 8px -4px color-mix(in srgb, var(--sw-b) 80%, transparent);border:0;border-radius:50%;place-items:center;padding:0;transition:transform .14s,box-shadow .14s;display:grid}.ap-swatch.is-small{block-size:30px;inline-size:30px}.ap-swatch:hover{transform:scale(1.08)}.ap-swatch.is-current{box-shadow:0 0 0 3px var(--surface), 0 0 0 5px var(--sw-a), 0 6px 14px -6px var(--sw-b)}.ap-swatch.is-theme{background:conic-gradient(from 200deg, var(--ui-accent), var(--ui-accent-2), var(--ui-accent))}.ap-modes{grid-template-columns:repeat(3,minmax(0,11rem));gap:.6rem;display:grid}.ap-mode-art{background:linear-gradient(140deg, color-mix(in srgb, var(--ui-accent) 22%, #eef2f8), #f7f8fb);border-radius:10px;padding:8px;display:block}.ap-mode[data-mode-tile=dark] .ap-mode-art{background:linear-gradient(140deg, color-mix(in srgb, var(--ui-accent) 30%, #10131a), #171a21)}.ap-mode[data-mode-tile=system] .ap-mode-art{background:linear-gradient(115deg,#f2f4f8 0 50%,#151821 50% 100%)}.ap-mode-win{background:#fff;border-radius:7px;grid-template-columns:22% 1fr;gap:4px;block-size:46px;padding:4px;display:grid;box-shadow:0 2px 6px -2px #0f172a4d}.ap-mode[data-mode-tile=dark] .ap-mode-win{background:#1f232c}.ap-mode[data-mode-tile=system] .ap-mode-win{background:linear-gradient(115deg,#fff 0 50%,#1f232c 50% 100%)}.ap-mode-side{background:linear-gradient(180deg, var(--ui-accent), var(--ui-accent-2));border-radius:4px}.ap-mode-body{align-content:start;gap:4px;display:grid}.ap-mode-body span{background:#8a93a673;border-radius:3px;block-size:6px}.ap-mode-body span:last-child{background:var(--ui-accent);inline-size:60%}.ap-mode-name{align-items:center;gap:.35rem;padding:0 .15rem .1rem;display:inline-flex}.ap-ambient{grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));gap:.6rem;display:grid}.ap-amb-art{background:radial-gradient(80% 120% at 10% 0%, var(--amb-glow), transparent 70%), var(--amb-bg);border-radius:10px;block-size:46px;display:block;position:relative;box-shadow:inset 0 0 0 1px #0f172a0f}.ap-amb-art span{background:var(--amb-surface);block-size:18px;inline-size:40%;box-shadow:0 2px 6px -2px #0f172a40, inset 3px 0 0 var(--amb-primary);border-radius:6px;position:absolute;inset:10px 12px auto auto}.ap-patterns{grid-template-columns:repeat(auto-fill,minmax(6.5rem,1fr));gap:.6rem;display:grid}.ap-pattern-art{background-color:color-mix(in srgb, var(--ui-accent) 4%, var(--surface));block-size:46px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--border) 80%, transparent);border-radius:10px;display:block}.ap-triple{grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1rem;display:grid}.ap-vseg{gap:.45rem;display:grid}.ap-vseg.is-disabled .ap-vseg-row{opacity:.5}.ap-vseg-row{grid-auto-columns:1fr;grid-auto-flow:column;gap:.4rem;display:grid}.ap-vseg-btn{text-align:center;justify-items:center;padding:.4rem .3rem;font-size:.78rem}.ap-vseg-btn:disabled{cursor:not-allowed}.ap-vseg-hint{margin:0;font-size:.76rem}.ap-seg-art{background-color:color-mix(in srgb, var(--ui-accent) 14%, var(--surface));border-radius:8px;block-size:30px;inline-size:100%;display:block}.ap-seg-art[data-finish-art=gloss]{background:linear-gradient(160deg, #ffffffbf, transparent 45%), radial-gradient(120% 120% at 100% 100%, color-mix(in srgb, var(--ui-accent) 45%, transparent), transparent 60%), color-mix(in srgb, var(--ui-accent) 18%, var(--surface));box-shadow:inset 0 0 0 1px #ffffff80}.ap-seg-art[data-finish-art=sober]{background:color-mix(in srgb, var(--ui-accent) 16%, var(--surface))}.ap-seg-art[data-grain-art]{background-image:var(--grain-image);background-blend-mode:multiply;background-size:120px}.ap-seg-art[data-grain-art=none]{background-image:none}.ap-seg-art[data-grain-art=soft]{background-color:color-mix(in srgb, var(--ui-accent) 10%, var(--surface))}.ap-seg-art[data-grain-art=medium]{background-color:color-mix(in srgb, var(--ui-accent) 22%, var(--surface))}.ap-seg-art[data-density-art]{background-color:color-mix(in srgb, var(--ui-accent) 7%, var(--surface));align-content:center;padding:0 7px;display:grid}.ap-seg-art[data-density-art] span{background:var(--ui-accent);opacity:.7;border-radius:2px;block-size:3px}.ap-seg-art[data-density-art=compact]{gap:2px}.ap-seg-art[data-density-art=normal]{gap:5px}.ap-seg-art[data-density-art=comfortable]{gap:8px}.ap-preview{--pv-text:#1c2230;--pv-muted:#8a93a6;aspect-ratio:4/3;background:radial-gradient(90% 70% at 100% 0%, var(--pv-glow), transparent 70%), var(--pv-bg);border-radius:16px;grid-template-columns:30% 1fr;transition:background .22s;display:grid;overflow:hidden;box-shadow:0 18px 40px -22px #0f172a8c,inset 0 0 0 1px #0f172a14}.ap-preview[data-pv-mode=dark]{--pv-text:#e8ebf2;--pv-muted:#6b7385;--pv-bg:#12151c!important;--pv-surface:#1c2029!important;--pv-glow:color-mix(in srgb, var(--ui-accent) 22%, transparent)!important}.ap-pv-side{background:linear-gradient(180deg, var(--sbt-top), var(--sbt-mid) 55%, var(--sbt-bottom));box-shadow:inset -1px 0 0 color-mix(in srgb, var(--sbt-glow) 50%, transparent);align-content:start;gap:7px;padding:12px 9px;display:grid}.ap-pv-mark{background:#ffffffe6;border-radius:7px;block-size:22px;inline-size:22px;margin-bottom:6px}.ap-pv-item{border-radius:7px;align-items:center;gap:6px;padding:4px 5px;display:flex}.ap-pv-item.is-current{background:#ffffff2e;box-shadow:inset 0 0 0 1px #ffffff47}.ap-pv-dot{background:#ffffffd9;border-radius:4px;flex-shrink:0;block-size:11px;inline-size:11px}.ap-pv-side .ap-pv-line{background:#ffffffa6}.ap-pv-line{background:color-mix(in srgb, var(--pv-muted) 55%, transparent);border-radius:3px;block-size:6px;display:block}.ap-pv-line.is-strong{background:color-mix(in srgb, var(--pv-text) 70%, transparent);block-size:8px}.ap-pv-main{grid-template-rows:auto 1fr;gap:10px;min-inline-size:0;padding:12px;display:grid;position:relative}.ap-pv-top{justify-content:space-between;align-items:center;display:flex}.ap-pv-avatar{background:linear-gradient(150deg, var(--ui-accent), var(--ui-accent-2));border-radius:50%;block-size:18px;inline-size:18px}.ap-pv-card{align-content:start;gap:var(--pv-gap,8px);background:var(--pv-surface);color:var(--pv-text);border-radius:10px;padding:10px;font-size:.66rem;display:grid;box-shadow:0 6px 16px -10px #0f172a66}.ap-preview[data-pv-density=compact]{--pv-gap:4px}.ap-preview[data-pv-density=comfortable]{--pv-gap:12px}.ap-preview[data-pv-finish=gloss] .ap-pv-card{background:linear-gradient(170deg, #ffffff1a, transparent 40%), var(--pv-surface);box-shadow:0 10px 22px -12px color-mix(in srgb, var(--ui-accent) 55%, transparent), inset 0 1px 0 #ffffff80}.ap-pv-title{font-size:.74rem;font-weight:700}.ap-pv-row{align-items:center;gap:6px;display:flex}.ap-pv-row .ap-pv-line{flex:1}.ap-pv-pill{background:color-mix(in srgb, var(--ui-accent) 14%, transparent);color:color-mix(in oklab, var(--ui-accent) 75%, var(--pv-text));border-radius:999px;padding:1px 6px;font-size:.6rem;font-weight:650}.ap-pv-btn{background:var(--ui-accent);color:#fff;border-radius:7px;justify-self:start;margin-top:2px;padding:4px 9px;font-weight:650}.ap-pv-bar{background:linear-gradient(90deg, var(--ui-accent), var(--ui-accent-2));block-size:3px;position:absolute;inset:0 0 auto}.ap-pv-main:before{content:"";pointer-events:none;background-image:var(--pattern-image,none);background-size:var(--pattern-size,auto);opacity:1;position:absolute;inset:0}.ap-preview[data-pv-grain=soft] .ap-pv-main:after,.ap-preview[data-pv-grain=medium] .ap-pv-main:after{content:"";pointer-events:none;background-image:var(--grain-image);mix-blend-mode:overlay;opacity:.12;position:absolute;inset:0}.ap-preview[data-pv-grain=medium] .ap-pv-main:after{opacity:.22}.ap-pv-main>*{position:relative}.ap-avatar{grid-template-columns:minmax(14rem,18rem) 1fr;align-items:start;gap:1.5rem;margin-top:.75rem;display:grid}@media (max-width:900px){.ap-avatar{grid-template-columns:1fr}}.ap-avatar-card{background:radial-gradient(140% 120% at 0% 0%, color-mix(in srgb, var(--ui-accent) 16%, transparent), transparent 60%), color-mix(in srgb, var(--ui-accent) 5%, var(--surface));border:1px solid color-mix(in srgb, var(--border) 80%, transparent);border-radius:16px;align-items:center;gap:.9rem;padding:1rem;display:flex}.ap-avatar-card p{margin:0}.ap-avatar-name{font-size:1.02rem;font-weight:700}.ap-avatar-controls{gap:.5rem;display:grid}.ap-avatar-styles{gap:.6rem;margin-bottom:.4rem;display:flex}.ap-avatar-style{grid-auto-flow:column;align-items:center;padding:.45rem .85rem .45rem .45rem}
.agent-mark{--m-size:52px;width:var(--m-size);height:var(--m-size);border-radius:50%;flex-shrink:0;place-items:center;display:inline-grid;position:relative}.mk-disc{background:linear-gradient(160deg, color-mix(in srgb, var(--primary) 84%, var(--on-primary)), var(--primary) 62%);width:100%;height:100%;color:var(--on-primary);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--on-primary) 18%, transparent);border-radius:50%;place-items:center;display:grid}.mk-disc svg{fill:currentColor;transform-origin:44% 56%;width:50%;height:50%}.mk-spark{opacity:.78}.mk-ring{background:conic-gradient(from 0deg, var(--primary) 0 28%, transparent 28% 100%);opacity:0;pointer-events:none;border-radius:50%;position:absolute;inset:-4px;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,#0000 calc(100% - 2.5px),#000 calc(100% - 2px))}.agent-mark[data-state=thinking] .mk-ring{opacity:1}.agent-mark[data-state=thinking][data-motion=none] .mk-ring{background:var(--primary);opacity:.45}@media (prefers-reduced-motion:no-preference){.agent-mark[data-state=thinking]:not([data-motion=none]) .mk-ring{animation:1.1s linear infinite mk-turn}.agent-mark[data-state=thinking][data-motion=soft] .mk-ring{animation-duration:1.8s}.agent-mark[data-state=answering]:not([data-motion=none]) .mk-disc svg{animation:mk-breathe .9s var(--ease) infinite alternate}.agent-mark[data-state=answering][data-motion=soft] .mk-disc svg{animation-duration:1.4s}.agent-mark[data-state=idle]:not([data-motion=none]) .mk-disc svg{transition:transform var(--dur-3) var(--ease-out)}:hover>.agent-mark[data-state=idle]:not([data-motion=none]) .mk-disc svg{transform:rotate(14deg)scale(1.04)}}@keyframes mk-turn{to{transform:rotate(1turn)}}@keyframes mk-breathe{0%{transform:scale(.92)}to{transform:scale(1.06)}}
