/* PlushCrew: plain local CSS. No framework, CDN or build step. */
:root { --page-bg: #050505; --text: #f1f5f9; --muted: #94a3b8; --border: #303030; }
*, ::before, ::after { box-sizing: border-box; border-width: 0; border-style: solid; border-color: #e5e7eb; --offset-x: 0px; --offset-y: 0px; --rotation: 0deg; --scale: 1; --focus-glow: 0 0 #0000; --surface-shadow: 0 0 #0000; }
html { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-feature-settings: normal; }
body { margin: 0; color: var(--text); background: var(--page-bg); }
body.workspace-page { height: 100vh; overflow: hidden; background: #000; }
.ui-icon { display: inline-block; width: 1em; height: 1em; flex-shrink: 0; vertical-align: -.15em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.plushie-thought-text { display: inline-flex; align-items: center; gap: .35rem; }

/* Separate public landing and focused workspace; share the existing theme. */
.landing-page .chat-messages { padding-bottom: 2rem; }
.landing-page .workspace-footer { text-align: center; padding: 1rem; }
.landing-header { min-height: 3.5rem; }
.landing-nav-link { color: #cbd5e1; font-size: .875rem; }
.landing-nav-link:hover { color: #a7f3d0; }
.landing-cta { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; padding: .85rem 1.2rem; border: 1px solid #34d399; border-radius: .75rem; color: #042f20; background: #6ee7b7; font-size: .9375rem; font-weight: 600; }
.landing-cta:hover { background: #a7f3d0; }
.landing-cta:focus-visible, .landing-nav-link:focus-visible { outline: 2px solid #a7f3d0; outline-offset: 4px; }
.landing-nav-cta { padding: .5rem .8rem; font-size: .8125rem; }
.landing-primary-action { display: flex; flex-direction: column; align-items: center; gap: .65rem; }
.landing-primary-action p { color: #a1a1aa; font-size: .75rem; line-height: 1.5; }
.hero-outcome { max-width: 42rem; color: #cbd5e1; font-size: 1rem; line-height: 1.7; }
.landing-final-action { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 3rem 1rem; text-align: center; }
.landing-final-action h2 { color: #f1f5f9; font-size: 1.75rem; font-weight: 600; }
.landing-final-action p { color: #a1a1aa; line-height: 1.6; }
.app-empty-state .welcome-content { gap: 1.5rem; }
.app-welcome h1 { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 600; line-height: 1.25; }
.app-welcome p { color: #94a3b8; font-size: .875rem; line-height: 1.7; margin-top: .75rem; }
@media (max-width: 480px) { .landing-header .landing-nav-link:first-child { display: none; } .landing-page .hero-category { font-size: 1.5rem; } .landing-header .header-inline-group { gap: .75rem; } }
h1,h2,h3,h4,h5,h6,p,pre,blockquote,figure,dl,dd { margin: 0; } h1,h2,h3,h4,h5,h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; } b,strong { font-weight: bolder; }
button,input,optgroup,select,textarea { font: inherit; font-feature-settings: inherit; color: inherit; margin: 0; padding: 0; letter-spacing: inherit; }
button,select { text-transform: none; } button,[type=button],[type=reset],[type=submit] { appearance: button; background-color: transparent; background-image: none; }
button,[role=button] { cursor: pointer; } :disabled { cursor: default; } textarea { resize: vertical; }
input::placeholder,textarea::placeholder { opacity: 1; color: #9ca3af; }
ul,ol,menu { list-style: none; margin: 0; padding: 0; } table { border-collapse: collapse; text-indent: 0; }
img,svg,video,canvas,audio,iframe,embed,object { display: block; vertical-align: middle; } img,video { max-width: 100%; height: auto; }
code,kbd,samp,pre { font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1em; }
summary { display: list-item; } [hidden] { display: none !important; }
:focus-visible { outline: 2px solid rgb(52 211 153 / .7); outline-offset: 2px; border-radius: 4px; }
::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: #27272a; border-radius: 999px; } ::-webkit-scrollbar-thumb:hover { background: #3f3f46; }
.ambient-glow { pointer-events: none; z-index: 0; background: none; width: 80rem; height: 30rem; position: fixed; top: -25%; left: 50%; transform: translateX(-50%); }
@keyframes status-pulse { 50% { opacity: .5; } } @keyframes loading-spin { to { transform: rotate(360deg); } }
@keyframes direction-bounce { 0%,100% { transform: translateY(-25%); } 50% { transform: none; } }
@keyframes pulse-dot { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .45; transform: scale(.8); } }
.pulse-dot { animation: pulse-dot 1.8s ease-in-out infinite; }
@keyframes think-bounce { 0%,80%,100% { opacity: .4; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-4px); } }
.think-dot { animation: think-bounce 1.2s ease-in-out infinite; } .think-dot:nth-child(2) { animation-delay: .15s; } .think-dot:nth-child(3) { animation-delay: .3s; }
#sidebar { transition: transform .2s; }
.chat-answer { font-family: inherit !important; font-size: .875rem !important; line-height: 1.625; }
.plushie-avatar.is-speaking { transform: scale(1.08); }
@media (prefers-reduced-motion: reduce) { .pulse-dot,.think-dot,.is-pulsing { animation: none !important; } #sidebar { transition: none !important; } }

/* Local typefaces. */
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/inter-latin-400-normal.woff2)format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/inter-latin-500-normal.woff2)format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(/static/fonts/inter-latin-600-normal.woff2)format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(/static/fonts/inter-latin-700-normal.woff2)format("woff2")}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/jetbrains-mono-latin-400-normal.woff2)format("woff2")}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/jetbrains-mono-latin-500-normal.woff2)format("woff2")}

/* Named components and responsive behavior. */
.document-page { background-color: #050505; color: #f1f5f9; min-height: 100vh; }
.document-container { max-width: 48rem; margin-left: auto; margin-right: auto; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: 3rem; padding-bottom: 3rem; }
.back-link { font-size: .875rem; line-height: 1.25rem; }
.back-link:hover { color: #a7f3d0; }
.document-title { font-size: 1.875rem; line-height: 2.25rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.5rem; }
.document-updated { font-size: .875rem; line-height: 1.25rem; margin-bottom: 2rem; }
.document-copy { font-size: .875rem; line-height: 1.625; }
.document-copy > :not([hidden]) ~ :not([hidden]) { margin-top: 1.5rem; }
.section-heading { font-size: 1.125rem; line-height: 1.75rem; font-weight: 600; margin-bottom: 0.5rem; }
.paragraph-spacing { margin-top: 0.5rem; }
.inline-link:hover { color: #a7f3d0; }
.document-list { list-style-type: disc; padding-left: 1.5rem; margin-top: 0.5rem; }
.document-list > :not([hidden]) ~ :not([hidden]) { margin-top: 0.25rem; }
.page-root { height: 100%; }
.workspace-surface { background-color: #000000; color: #f1f5f9; height: 100vh; }
.sidebar-overlay { position: fixed; inset: 0rem; z-index: 20; background-color: rgb(0 0 0 / 0.5); }
@media (min-width: 768px) { .sidebar-overlay { display: none; } }
.workspace-shell { position: relative; z-index: 10; height: 100%; width: 100%; }
.sidebar { position: fixed; top: 0rem; bottom: 0rem; left: 0rem; z-index: 30; width: 18rem; flex-shrink: 0; border-right-width: 1px; border-color: rgb(255 255 255 / 0.05); background-color: rgb(8 8 8 / 0.95); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); flex-direction: column; transition-property: transform; transition-duration: 200ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
@media (min-width: 768px) { .sidebar { position: static; --offset-x: 0rem; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); background-color: rgb(8 8 8 / 0.6); backdrop-filter: none; -webkit-backdrop-filter: none; } }
.sidebar-new-chat { padding: 0.75rem; }
.new-chat-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: .75rem; border-width: 1px; padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.new-chat-btn:hover { border-color: rgb(255 255 255 / 0.25); background-color: rgb(255 255 255 / 0.05); }
.icon-small { height: 1rem; width: 1rem; }
.sidebar-section-label { padding-left: 1rem; padding-right: 1rem; padding-top: 0.5rem; padding-bottom: 0.25rem; }
.eyebrow { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.thread-list { flex: 1 1 0%; overflow-y: auto; padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.25rem; padding-bottom: 0.25rem; }
.thread-list > :not([hidden]) ~ :not([hidden]) { margin-top: 0.125rem; }
.thread-empty { padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; font-size: .75rem; line-height: 1rem; font-style: italic; }
.sidebar-account { padding: 0.75rem; border-top-width: 1px; border-color: rgb(255 255 255 / 0.05); }
.sidebar-profile { width: 100%; align-items: center; gap: 0.75rem; border-radius: .75rem; border-width: 1px; padding: 0.625rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); text-align: left; }
.sidebar-profile:hover { background-color: rgb(255 255 255 / 0.05); }
.sidebar-avatar { height: 2rem; width: 2rem; flex-shrink: 0; align-items: center; justify-content: center; border-radius: 9999px; background-color: #059669; background-image: none; --gradient-start: #10b981; --gradient-end: #22d3ee; font-size: .75rem; line-height: 1rem; font-weight: 700; color: #080808; }
.flex-content { min-width: 0rem; flex: 1 1 0%; }
.sidebar-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .875rem; line-height: 1.25rem; font-weight: 500; }
.sidebar-meta { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 11px; }
.workspace-main { flex: 1 1 0%; min-width: 0rem; flex-direction: column; position: relative; height: 100%; }
.workspace-header { flex-shrink: 0; height: 3.5rem; border-bottom-width: 1px; border-color: rgb(255 255 255 / 0.05); background-color: rgb(8 8 8 / 0.8); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); align-items: center; justify-content: space-between; padding-left: 0.75rem; padding-right: 0.75rem; z-index: 30; }
@media (min-width: 640px) { .workspace-header { padding-left: 1.25rem; padding-right: 1.25rem; } }
.spaced-inline-row { align-items: center; gap: 0.75rem; }
@media (min-width: 768px) { .sidebar-toggle { display: none; } }
.sidebar-toggle { padding: 0.5rem; margin-left: -0.25rem; border-radius: .5rem; }
.sidebar-toggle:hover { background-color: rgb(255 255 255 / 0.05); }
.icon-medium { height: 1.25rem; width: 1.25rem; }
.header-inline-group { align-items: center; gap: 0.5rem; }
.brand-presence { position: relative; height: 0.625rem; width: 0.625rem; }
.motion-timing-1-layout { position: absolute; display: inline-flex; height: 100%; width: 100%; border-radius: 9999px; opacity: 0.5; }
.brand-dot { position: relative; display: inline-flex; height: 0.625rem; width: 0.625rem; border-radius: 9999px; --surface-shadow: 0 10px 15px -3px var(--shadow-tint,rgb(0 0 0 / .1)),0 4px 6px -4px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); --shadow-tint: rgb(52 211 153 / 0.3); }
.brand-name { font-weight: 600; font-size: 1rem; line-height: 1.5rem; letter-spacing: -.025em; }
.usage-widget { display: none; align-items: center; gap: 0.5rem; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.375rem; padding-bottom: 0.375rem; border-radius: .5rem; background-color: rgb(5 5 5 / 0.6); border-width: 1px; }
@media (min-width: 640px) { .usage-widget { display: flex; } }
.usage-content { flex-direction: column; gap: 0.25rem; min-width: 100px; }
.usage-label-row { align-items: center; justify-content: space-between; gap: 0.5rem; }
.usage-label { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; }
.usage-percent { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 10px; }
.usage-track { width: 100%; background-color: #222222; border-radius: 9999px; height: 0.375rem; }
.usage-fill { height: 100%; background-color: #10b981; transition-property: all; transition-duration: 500ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.signin-btn { display: inline-flex; align-items: center; gap: 0.5rem; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.375rem; padding-bottom: 0.375rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; background-color: #059669; border-width: 1px; border-color: #059669; border-radius: .5rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); cursor: pointer; --surface-shadow: 0 4px 6px -1px var(--shadow-tint,rgb(0 0 0 / .1)),0 2px 4px -2px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); }
.signin-btn:hover { background-color: #047857; }
.signin-icon { width: 1rem; height: 1rem; }
.profile-menu-wrapper { position: relative; }
.profile-btn { align-items: center; gap: 0.5rem; border-radius: .5rem; border-width: 1px; padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.375rem; padding-bottom: 0.375rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.profile-btn:hover { background-color: rgb(255 255 255 / 0.05); }
.profile-avatar { height: 1.75rem; width: 1.75rem; align-items: center; justify-content: center; border-radius: 9999px; background-color: #059669; background-image: none; --gradient-start: #10b981; --gradient-end: #22d3ee; font-size: .75rem; line-height: 1rem; font-weight: 700; color: #080808; }
.profile-name { display: none; max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (min-width: 640px) { .profile-name { display: inline; } }
.profile-dropdown { position: absolute; right: 0rem; margin-top: 0.5rem; width: 14rem; border-radius: .75rem; border-width: 1px; background-color: rgb(8 8 8 / 0.95); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); --surface-shadow: 0 20px 25px -5px var(--shadow-tint,rgb(0 0 0 / .1)),0 8px 10px -6px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); z-index: 50; }
.profile-contact { padding: 0.75rem; border-bottom-width: 1px; border-color: rgb(255 255 255 / 0.05); }
.profile-email { font-size: .875rem; line-height: 1.25rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.signout-btn { width: 100%; text-align: left; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; font-size: .875rem; line-height: 1.25rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.signout-btn:hover { background-color: rgb(255 255 255 / 0.05); }
.delete-account-btn { width: 100%; text-align: left; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; font-size: .875rem; line-height: 1.25rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); border-top-width: 1px; border-color: rgb(255 255 255 / 0.05); }
.delete-account-btn:hover { background-color: rgb(255 255 255 / 0.05); color: #f87171; }
.chat-scroll { flex: 1 1 0%; overflow-y: auto; }
.chat-messages { width: 100%; padding-left: 1rem; padding-right: 1rem; padding-top: 1.5rem; padding-bottom: 1.5rem; flex-direction: column; gap: 1.5rem; min-height: 100%; }
@media (min-width: 640px) { .chat-messages { padding-left: 1.5rem; padding-right: 1.5rem; } }
.empty-state { margin: auto; width: 100%; padding-top: 2.5rem; padding-bottom: 2.5rem; padding-left: 1rem; padding-right: 1rem; position: relative; }
.welcome-content { position: relative; z-index: 10; max-width: 48rem; margin-left: auto; margin-right: auto; flex-direction: column; align-items: center; text-align: center; gap: 3.5rem; }
.marketing-sections-layout { flex-direction: column; align-items: center; gap: 3.5rem; width: 100%; }
.hero-section { width: 100%; min-width: 0; flex-direction: column; align-items: center; gap: 1.25rem; }
.hero-badge-frame { border-radius: 9999px; padding: 1px; background-image: none; --gradient-start: rgb(16 185 129 / 0.6); --gradient-mid: rgb(34 211 238 / 0.6); --gradient-end: rgb(16 185 129 / 0.6); }
.hero-badge { display: block; border-radius: 9999px; background-color: #080808; padding-left: 1rem; padding-right: 1rem; padding-top: 0.375rem; padding-bottom: 0.375rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1rem; }
.hero-heading { width: 100%; font-size: clamp(3.25rem, 8vw, 6rem); line-height: 1.08; font-weight: 700; letter-spacing: -.035em; }
.motion-timing-36-layout { max-width: 42rem; font-size: .875rem; line-height: 1.625; }
@media (min-width: 640px) { .motion-timing-36-layout { font-size: 1rem; line-height: 1.5rem; } }
.quick-starters { width: 100%; max-width: 42rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
.hero-starter { text-align: left; border-radius: .75rem; border-width: 1px; border-color: #222222; background-color: rgb(5 5 5 / 0.6); padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 200ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
@media (min-width: 640px) { .hero-starter { padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; } }
.hero-starter:hover { --offset-y: -0.125rem; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); border-color: rgb(16 185 129 / 0.6); --surface-shadow: 0 10px 15px -3px var(--shadow-tint,rgb(0 0 0 / .1)),0 4px 6px -4px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); --shadow-tint: rgb(16 185 129 / 0.1); }
.hero-starter:focus-visible { outline-style: solid; outline-width: 2px; outline-color: #22d3ee; }
.starter-title { display: block; font-size: .875rem; line-height: 1.25rem; font-weight: 500; }
.hero-starter-description { display: none; margin-top: 0.125rem; font-size: .75rem; line-height: 1rem; }
@media (min-width: 640px) { .hero-starter-description { display: block; } }
.hero-down-arrow { animation: direction-bounce 1s infinite; margin-top: 0.25rem; height: 1.5rem; width: 1.5rem; }
.motion-timing-37-layout { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1rem; letter-spacing: .1em; }
.agent-section { width: 100%; }
.agent-flow { flex-direction: column; align-items: center; justify-content: space-between; gap: 0.5rem; }
@media (min-width: 640px) { .agent-flow { flex-direction: row; gap: 0rem; } }
.agent-card { flex-direction: column; align-items: center; gap: 0.75rem; width: 10rem; }
.agent-icon-frame { height: 4rem; width: 4rem; align-items: center; justify-content: center; border-radius: 1rem; background-image: none; --gradient-start: rgb(16 185 129 / 0.2); --gradient-end: #050505; padding: 0.25rem; }
.agent-icon-outline { height: 100%; width: 100%; align-items: center; justify-content: center; border-radius: .75rem; border-width: 1px; border-style: dashed; }
.icon-large { height: 2rem; width: 2rem; }
.agent-name { font-size: .875rem; line-height: 1.25rem; font-weight: 600; }
.agent-description { font-size: .75rem; line-height: 1rem; margin-top: 0.25rem; }
.agent-forward-arrow { height: 2rem; width: 2rem; flex-shrink: 0; --rotation: 90deg; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
@media (min-width: 640px) { .agent-forward-arrow { --rotation: 0deg; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); width: 5rem; } }
.motion-timing-38-layout { height: 4rem; width: 4rem; align-items: center; justify-content: center; border-radius: 1rem; background-image: none; --gradient-start: rgb(34 211 238 / 0.2); --gradient-end: #050505; padding: 0.25rem; }
.developer-icon-outline { height: 100%; width: 100%; align-items: center; justify-content: center; border-radius: .75rem; border-width: 1px; border-style: dashed; border-color: rgb(103 232 249 / 0.4); }
.developer-icon { height: 2rem; width: 2rem; color: #67e8f9; }
.agent-return-arrow { display: none; margin-left: auto; margin-right: auto; margin-top: 0.75rem; width: 100%; max-width: 32rem; height: 2rem; color: rgb(52 211 153 / 0.7); }
@media (min-width: 640px) { .agent-return-arrow { display: block; } }
.mission-example { width: 100%; flex-direction: column; align-items: center; gap: 1.5rem; }
.example-heading { width: 100%; text-align: left; }
.example-eyebrow { font-size: .75rem; line-height: 1rem; margin-bottom: 0.5rem; }
.example-prompt { font-size: 1rem; line-height: 1.5rem; font-weight: 600; }
.example-disclaimer { font-size: .75rem; line-height: 1rem; }
.benefit-list { text-align: left; font-size: .875rem; line-height: 1.25rem; }
.benefit-list > :not([hidden]) ~ :not([hidden]) { margin-top: 0.625rem; }
.supporting-copy { font-size: .875rem; line-height: 1.25rem; }
.secondary-starters { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 0.75rem; width: 100%; max-width: 32rem; }
@media (min-width: 640px) { .secondary-starters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.secondary-starter { text-align: left; border-radius: .75rem; border-width: 1px; border-color: #222222; background-color: rgb(5 5 5 / 0.6); padding-left: 1rem; padding-right: 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 200ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.secondary-starter:hover { --offset-y: -0.25rem; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); border-color: rgb(16 185 129 / 0.6); --surface-shadow: 0 10px 15px -3px var(--shadow-tint,rgb(0 0 0 / .1)),0 4px 6px -4px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); --shadow-tint: rgb(16 185 129 / 0.1); }
.secondary-starter:focus-visible { outline-style: solid; outline-width: 2px; outline-color: #22d3ee; }
.secondary-starter-title { display: block; font-size: .875rem; line-height: 1.25rem; font-weight: 500; margin-bottom: 0.25rem; }
.starter-description { display: block; font-size: .75rem; line-height: 1rem; }
.advanced-controls { margin-bottom: 0.5rem; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .advanced-controls { padding-left: 1.5rem; padding-right: 1.5rem; } }
.advanced-toggle { margin-top: 0.5rem; display: inline-flex; align-items: center; gap: 0.375rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.advanced-toggle:hover { color: #cbd5e1; }
.advanced-chevron { height: 0.75rem; width: 0.75rem; transition-property: transform; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.advanced-settings { align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.5rem; }
.provider-select { border-radius: .5rem; border-width: 1px; background-color: rgb(24 24 27 / 0.6); padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: .75rem; line-height: 1rem; outline: 2px solid transparent; outline-offset: 2px; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.provider-select:focus { border-color: rgb(52 211 153 / 0.5); }
.composer-panel { padding-left: 1rem; padding-right: 1rem; padding-bottom: 1rem; }
@media (min-width: 640px) { .composer-panel { padding-left: 1.5rem; padding-right: 1.5rem; } }
.composer-toolbar { margin-bottom: 0.5rem; align-items: center; gap: 0.5rem; }
.task-picker { position: relative; flex-shrink: 0; }
.task-toggle { display: inline-flex; align-items: center; gap: 0.5rem; border-radius: .75rem; border-width: 1px; background-color: rgb(24 24 27 / 0.6); padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; font-size: .75rem; line-height: 1rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.task-toggle:hover { background-color: rgb(255 255 255 / 0.05); }
.task-toggle:disabled { opacity: 0.5; }
.composer-toolbar { flex-wrap: wrap; }
.reasoning-control { display: inline-flex; align-items: center; gap: .5rem; padding: .45rem .65rem; border: 1px solid #303030; border-radius: .75rem; font-size: .75rem; background: #0c0c0e; }
.reasoning-control label { color: #94a3b8; }
.reasoning-control select { background: #0c0c0e; color: #a7f3d0; max-width: 11rem; }
.reasoning-control select:disabled { opacity: .5; }
.reasoning-help { margin: .5rem 0; max-width: 55rem; color: #94a3b8; font-size: .65rem; line-height: 1.5; }
.task-chevron { height: 0.875rem; width: 0.875rem; transition-property: transform; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.task-options { position: absolute; bottom: 100%; left: 0rem; z-index: 50; margin-bottom: 0.5rem; width: 16rem; border-radius: 1rem; border-width: 1px; background-color: #080808; padding: 0.375rem; --surface-shadow: 0 25px 50px -12px var(--shadow-tint,rgb(0 0 0 / .25)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); }
.task-option { width: 100%; align-items: center; justify-content: space-between; gap: 0.75rem; border-radius: .75rem; border-width: 1px; border-color: transparent; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.625rem; padding-bottom: 0.625rem; text-align: left; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.task-option:hover { background-color: rgb(255 255 255 / 0.05); }
.chat-mode-description { display: block; margin-top: 0.125rem; font-size: 11px; }
.audit-attachment { min-width: 0rem; align-items: center; gap: 0.5rem; }
.attachment-label { flex-shrink: 0; cursor: pointer; border-radius: .5rem; border-width: 1px; background-color: rgb(24 24 27 / 0.6); padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: .75rem; line-height: 1rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.attachment-label:hover { background-color: rgb(255 255 255 / 0.05); }
.audit-file { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }
.attachment-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .75rem; line-height: 1rem; }
.remove-attachment { font-size: .75rem; line-height: 1rem; }
.remove-attachment:hover { color: #e2e8f0; }
.chat-form { align-items: flex-end; gap: 0.75rem; }
.chat-input { flex: 1 1 0%; resize: none; border-radius: .75rem; border-width: 1px; background-color: rgb(24 24 27 / 0.6); padding-left: 1rem; padding-right: 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; font-size: .875rem; line-height: 1.25rem; outline: 2px solid transparent; outline-offset: 2px; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); max-height: 12rem; }
.chat-input::placeholder { color: #64748b; }
.chat-input:focus { border-color: rgb(52 211 153 / 0.5); }
.send-btn { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: .75rem; background-color: #059669; padding-left: 1rem; padding-right: 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; font-size: .875rem; line-height: 1.25rem; font-weight: 600; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); --surface-shadow: 0 4px 6px -1px var(--shadow-tint,rgb(0 0 0 / .1)),0 2px 4px -2px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); }
@media (min-width: 640px) { .send-btn { padding-left: 1.25rem; padding-right: 1.25rem; } }
.send-btn:hover { background-color: #047857; }
.send-btn:active { --scale: 0.99; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.send-btn:disabled { opacity: 0.5; pointer-events: none; }
.loading-icon { height: 1rem; width: 1rem; animation: loading-spin 1s linear infinite; }
.circle { opacity: 0.25; }
.path { opacity: 0.75; }
.composer-button-label { display: none; }
@media (min-width: 640px) { .composer-button-label { display: inline; } }
.stop-btn { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: .75rem; background-color: #dc2626; padding-left: 1rem; padding-right: 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; font-size: .875rem; line-height: 1.25rem; font-weight: 600; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); --surface-shadow: 0 4px 6px -1px var(--shadow-tint,rgb(0 0 0 / .1)),0 2px 4px -2px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); }
@media (min-width: 640px) { .stop-btn { padding-left: 1.25rem; padding-right: 1.25rem; } }
.stop-btn:hover { background-color: #b91c1c; }
.stop-btn:active { --scale: 0.99; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.composer-hint { margin-top: 0.5rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 11px; color: #475569; }
.workspace-footer { margin-top: 0.25rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 11px; color: #475569; }
.footer-link:hover { color: #94a3b8; }
.footer-link { transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.launch-badge-link { display: inline-block; opacity: 0.8; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); vertical-align: middle; margin-left: 0.25rem; }
.launch-badge-link:hover { opacity: 1.0; }
.launch-badge-image { height: 0.875rem; display: inline-block; border-radius: 2px; }
.auth-backdrop { position: fixed; inset: 0rem; z-index: 50; align-items: center; justify-content: center; background-color: rgb(0 0 0 / 0.6); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); padding-left: 1rem; padding-right: 1rem; }
.auth-card { width: 100%; max-width: 28rem; border-radius: 1rem; border-width: 1px; background-color: rgb(8 8 8 / 0.95); padding: 1.5rem; position: relative; }
.close-auth-btn { position: absolute; right: 1rem; top: 1rem; border-radius: .5rem; padding: 0.375rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.close-auth-btn:hover { background-color: rgb(255 255 255 / 0.05); color: #cbd5e1; }
.auth-brand { align-items: center; gap: 0.5rem; margin-bottom: 1.5rem; }
.auth-brand-dot { position: relative; display: inline-flex; height: 0.625rem; width: 0.625rem; border-radius: 9999px; }
.auth-modal-title { font-weight: 600; font-size: 1rem; line-height: 1.5rem; }
.auth-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.25rem; border-radius: .75rem; border-width: 1px; background-color: rgb(255 255 255 / 0.03); padding: 0.25rem; margin-bottom: 1.5rem; }
.tab-signin { border-radius: .5rem; padding-top: 0.5rem; padding-bottom: 0.5rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.google-auth-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: .75rem; border-width: 1px; padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); margin-bottom: 0.75rem; }
.google-auth-btn:hover { border-color: rgb(255 255 255 / 0.25); background-color: rgb(255 255 255 / 0.05); }
.github-auth-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: .75rem; border-width: 1px; padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); margin-bottom: 1rem; }
.github-auth-btn:hover { border-color: rgb(255 255 255 / 0.25); background-color: rgb(255 255 255 / 0.05); }
.auth-divider { align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.auth-divider-line { height: 1px; flex: 1 1 0%; }

.form-fields > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }
.auth-error { font-size: .875rem; line-height: 1.25rem; background-color: rgb(239 68 68 / 0.1); border-width: 1px; border-color: rgb(239 68 68 / 0.2); border-radius: .5rem; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; }
.auth-notice { font-size: .875rem; line-height: 1.25rem; color: #6ee7b7; background-color: rgb(16 185 129 / 0.1); border-width: 1px; border-color: rgb(16 185 129 / 0.2); border-radius: .5rem; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; }
.auth-resend-btn { margin-left: 0.25rem; text-decoration-line: underline; text-underline-offset: 2px; }
.auth-resend-btn:hover { color: #a7f3d0; }
.field-label { display: block; font-size: .75rem; line-height: 1rem; font-weight: 500; margin-bottom: 0.375rem; }
.full-name-input { width: 100%; border-radius: .5rem; border-width: 1px; background-color: rgb(24 24 27 / 0.6); padding-left: 0.875rem; padding-right: 0.875rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; outline: 2px solid transparent; outline-offset: 2px; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.full-name-input::placeholder { color: #475569; }
.full-name-input:focus { border-color: rgb(52 211 153 / 0.5); }
.remember-row { align-items: center; justify-content: space-between; }
.remember-label { align-items: center; gap: 0.5rem; font-size: .875rem; line-height: 1.25rem; cursor: pointer; }
.remember-checkbox { height: 1rem; width: 1rem; border-radius: .25rem; border-color: rgb(255 255 255 / 0.2); background-color: #18181b; color: #10b981; }
.remember-checkbox:focus { --focus-color: rgb(52 211 153 / 0.5); }
.password-help { font-size: .875rem; line-height: 1.25rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.password-help:hover { color: #ddd6fe; }
.age-confirm-label { align-items: flex-start; gap: 0.5rem; font-size: .75rem; line-height: 1rem; cursor: pointer; }
.age-confirm { margin-top: 0.125rem; height: 1rem; width: 1rem; border-radius: .25rem; border-color: rgb(255 255 255 / 0.2); background-color: #18181b; color: #10b981; }
.age-confirm:focus { --focus-color: rgb(52 211 153 / 0.5); }
.auth-submit-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: .75rem; background-color: #059669; padding-left: 1rem; padding-right: 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; font-size: .875rem; line-height: 1.25rem; font-weight: 600; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); --surface-shadow: 0 4px 6px -1px var(--shadow-tint,rgb(0 0 0 / .1)),0 2px 4px -2px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); }
.auth-submit-btn:hover { background-color: #047857; }
.auth-submit-btn:active { --scale: 0.99; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.confirmation-card { width: 100%; max-width: 28rem; border-radius: 1rem; border-width: 1px; background-color: rgb(8 8 8 / 0.95); padding: 1.5rem; }
.supporting-text { font-size: .875rem; line-height: 1.25rem; margin-bottom: 1rem; }
.delete-error { font-size: .875rem; line-height: 1.25rem; background-color: rgb(239 68 68 / 0.1); border-width: 1px; border-color: rgb(239 68 68 / 0.2); border-radius: .5rem; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; margin-bottom: 1rem; }
.confirmation-actions { gap: 0.5rem; justify-content: flex-end; }
.delete-cancel-btn { padding-left: 1rem; padding-right: 1rem; padding-top: 0.5rem; padding-bottom: 0.5rem; border-radius: .5rem; border-width: 1px; font-size: .875rem; line-height: 1.25rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.delete-cancel-btn:hover { background-color: rgb(255 255 255 / 0.05); }
.delete-confirm-btn { padding-left: 1rem; padding-right: 1rem; padding-top: 0.5rem; padding-bottom: 0.5rem; border-radius: .5rem; background-color: #dc2626; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.delete-confirm-btn:hover { background-color: #b91c1c; }
.toast-container { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 9999; flex-direction: column; gap: 0.5rem; pointer-events: none; }
.pricing-container { max-width: 64rem; margin-left: auto; margin-right: auto; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: 3rem; padding-bottom: 3rem; }
.pricing-intro { text-align: center; margin-top: 2rem; margin-bottom: 3rem; }
.pricing-heading { font-size: 2.25rem; line-height: 2.5rem; font-weight: 600; margin-bottom: 0.75rem; }
.pricing-plans { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 1rem; }
@media (min-width: 768px) { .pricing-plans { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.plan-card { border-radius: 1rem; border-width: 1px; background-color: rgb(255 255 255 / 0.03); padding: 1.5rem; }
.plan-heading { font-size: 1.25rem; line-height: 1.75rem; font-weight: 600; margin-bottom: 0.25rem; }
.plan-price-row { margin-bottom: 1.5rem; }
.plan-price { font-size: 2.25rem; line-height: 2.5rem; font-weight: 600; }
.plan-features { font-size: .875rem; line-height: 1.25rem; margin-bottom: 1.5rem; }
.plan-features > :not([hidden]) ~ :not([hidden]) { margin-top: 0.5rem; }
.plan-link { display: block; text-align: center; border-radius: .75rem; border-width: 1px; padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.plan-link:hover { background-color: rgb(255 255 255 / 0.05); }
.plan-card-featured { border-radius: 1rem; border-width: 2px; border-color: rgb(16 185 129 / 0.6); background-color: rgb(16 185 129 / 0.05); padding: 1.5rem; position: relative; }
.plan-popular-label { position: absolute; top: -0.75rem; left: 50%; --offset-x: -50%; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); border-radius: 9999px; background-color: #10b981; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.125rem; padding-bottom: 0.125rem; font-size: .75rem; line-height: 1rem; font-weight: 500; }
.plan-link-featured { display: block; text-align: center; border-radius: .75rem; background-image: none; --gradient-start: #10b981; --gradient-end: #22d3ee; padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; font-weight: 600; color: #080808; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.plan-link-featured:hover { opacity: 0.9; }
.waitlist { max-width: 36rem; margin-left: auto; margin-right: auto; margin-top: 4rem; scroll-margin-top: 2rem; }
.waitlist-heading { font-size: 1.5rem; line-height: 2rem; font-weight: 600; text-align: center; margin-bottom: 0.5rem; }
.waitlist-description { font-size: .875rem; line-height: 1.25rem; text-align: center; margin-bottom: 1.5rem; }
.waitlist-form { border-radius: 1rem; border-width: 1px; background-color: rgb(255 255 255 / 0.03); padding: 1.5rem; }
.waitlist-form > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }
.wl-email { width: 100%; border-radius: .75rem; border-width: 1px; background-color: rgb(8 8 8 / 0.6); padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; }
.wl-email::placeholder { color: #64748b; }
.wl-email:focus { border-color: #6ee7b7; outline: 2px solid transparent; outline-offset: 2px; }
.wl-plan { width: 100%; border-radius: .75rem; border-width: 1px; background-color: rgb(8 8 8 / 0.6); padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; }
.wl-plan:focus { border-color: #6ee7b7; outline: 2px solid transparent; outline-offset: 2px; }
.honeypot-field { position: absolute; left: -9999px; }
.wl-submit { display: block; width: 100%; text-align: center; border-radius: .75rem; background-image: none; --gradient-start: #10b981; --gradient-end: #22d3ee; padding-left: 1rem; padding-right: 1rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: .875rem; line-height: 1.25rem; font-weight: 600; color: #080808; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.wl-submit:hover { opacity: 0.9; }
.wl-submit:disabled { opacity: 0.6; cursor: not-allowed; }
.waitlist-privacy { font-size: .75rem; line-height: 1rem; text-align: center; }
.wl-success { border-radius: 1rem; border-width: 1px; border-color: rgb(16 185 129 / 0.3); background-color: rgb(16 185 129 / 0.1); padding: 1.5rem; text-align: center; }
.waitlist-success-title { font-size: 1.125rem; line-height: 1.75rem; font-weight: 600; color: #6ee7b7; margin-bottom: 0.25rem; }
.pricing-contact { text-align: center; font-size: .75rem; line-height: 1rem; margin-top: 3rem; }
.document-note { font-size: .75rem; line-height: 1rem; padding-top: 1.5rem; border-top-width: 1px; border-color: rgb(255 255 255 / 0.05); }
.profile-photo { height: 100%; width: 100%; border-radius: 9999px; object-fit: cover; }
.tier-badge-free { background-color: #4b5563; font-size: .75rem; line-height: 1rem; padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.25rem; padding-bottom: 0.25rem; border-radius: 9999px; }
.tier-badge-pro { background-color: #16a34a; font-size: .75rem; line-height: 1rem; padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.25rem; padding-bottom: 0.25rem; border-radius: 9999px; }
.plushie-art { flex-shrink: 0; filter: drop-shadow(0 4px 3px rgb(0 0 0 / .07)) drop-shadow(0 2px 2px rgb(0 0 0 / .06)); user-select: none; }
.logic-badge-clean { display: inline-flex; align-items: center; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: 9999px; font-size: .75rem; line-height: 1rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; background-color: rgb(16 185 129 / 0.1); border-width: 1px; border-color: rgb(16 185 129 / 0.2); }
.logic-badge-icon { width: 0.875rem; height: 0.875rem; margin-right: 0.25rem; }
.logic-badge-patched { display: inline-flex; align-items: center; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: 9999px; font-size: .75rem; line-height: 1rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; background-color: rgb(99 102 241 / 0.1); color: #818cf8; border-width: 1px; border-color: rgb(99 102 241 / 0.2); }
.logic-shield-icon { width: 0.875rem; height: 0.875rem; margin-right: 0.25rem; color: #818cf8; }
.logic-badge-unresolved { display: inline-flex; align-items: center; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: 9999px; font-size: .75rem; line-height: 1rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; background-color: rgb(245 158 11 / 0.1); border-width: 1px; border-color: rgb(245 158 11 / 0.2); }
.user-message-bubble { max-width: 80%; border-radius: 1rem; border-bottom-right-radius: .125rem; background-color: rgb(5 150 105 / 0.9); padding-left: 1rem; padding-right: 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; font-size: .875rem; line-height: 1.25rem; white-space: pre-wrap; overflow-wrap: break-word; }
.plushie-avatar-container-layout { flex-shrink: 0; padding-top: 0.25rem; position: relative; }
.plushie-avatar-layout { transition-property: transform; transition-duration: 300ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.assistant-message-body { position: relative; flex: 1 1 0%; min-width: 0rem; }
.thought-connector-small { position: absolute; left: -0.625rem; top: 1.25rem; width: 0.5rem; height: 0.5rem; border-radius: 9999px; background-color: #222222; border-width: 1px; border-color: rgb(71 85 105 / 0.8); --surface-shadow: 0 1px 2px 0 var(--shadow-tint,rgb(0 0 0 / .05)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); pointer-events: none; }
.thought-connector-large { position: absolute; left: -1rem; top: 1.75rem; width: 0.875rem; height: 0.875rem; border-radius: 9999px; background-color: #222222; border-width: 1px; border-color: rgb(71 85 105 / 0.8); --surface-shadow: 0 1px 2px 0 var(--shadow-tint,rgb(0 0 0 / .05)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); pointer-events: none; }
.thought-bubble-card-layout { border-radius: 1.5rem; border-width: 1px; border-color: rgb(51 65 85 / 0.8); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); padding: 1rem; --surface-shadow: 0 25px 50px -12px var(--shadow-tint,rgb(0 0 0 / .25)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); --focus-glow: 0 0 0 1px var(--focus-color,rgb(59 130 246 / .5)); --focus-color: rgb(16 185 129 / 0.1); }
@media (min-width: 640px) { .thought-bubble-card-layout { padding: 1.25rem; } }
.assistant-message-header { align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.75rem; }
.assistant-message-title { align-items: center; gap: 0.5rem; min-width: 0rem; }
.status-dot-layout { height: 0.5rem; width: 0.5rem; border-radius: 9999px; }
.assistant-brand { font-size: .75rem; line-height: 1rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.status-text-layout { font-size: .75rem; line-height: 1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.duration-text-layout { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1rem; margin-left: 0.25rem; }
.thought-badge-layout { flex-shrink: 0; align-items: center; gap: 0.375rem; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: 9999px; background-color: rgb(2 44 34 / 0.4); border-width: 1px; border-color: rgb(16 185 129 / 0.3); font-size: .75rem; line-height: 1rem; color: #6ee7b7; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.plushie-thought-text-layout { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; }
.live-status-container-layout { margin-bottom: 0.5rem; }
.live-status-pill-layout { display: inline-flex; align-items: center; gap: 0.5rem; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.25rem; padding-bottom: 0.25rem; border-radius: 9999px; font-size: .75rem; line-height: 1rem; font-weight: 500; background-color: rgb(16 185 129 / 0.1); border-width: 1px; border-color: rgb(16 185 129 / 0.2); }
.details { border-width: 1px; border-color: #262626; border-radius: .75rem; background-color: rgb(23 23 23 / 0.6); font-size: .75rem; line-height: 1rem; margin-top: 0.5rem; margin-bottom: 0.5rem; }
.activity-summary { align-items: center; justify-content: space-between; padding: 0.75rem; cursor: pointer; user-select: none; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); color: #d4d4d4; font-weight: 500; }
.activity-summary:hover { background-color: rgb(38 38 38 / 0.5); }
.activity-summary-label { align-items: center; gap: 0.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity-chevron { height: 1rem; width: 1rem; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); transition-property: transform; transition-duration: 200ms; transition-timing-function: cubic-bezier(.4,0,.2,1); color: #a3a3a3; flex-shrink: 0; margin-left: 0.5rem; }
.disclosure-group[open] .activity-chevron { --rotation: 180deg; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.log-cards-container-layout { padding: 0.75rem; border-top-width: 1px; border-color: rgb(38 38 38 / 0.6); background-color: rgb(0 0 0 / 0.4); }
.log-cards-container-layout > :not([hidden]) ~ :not([hidden]) { margin-top: 0.75rem; }
.content-area-layout { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1.625; background-color: rgb(8 8 8 / 0.8); border-radius: 1rem; padding: 0.75rem; border-width: 1px; border-color: rgb(255 255 255 / 0.05); overflow-y: auto; max-height: 380px; white-space: pre-wrap; overflow-wrap: break-word; --surface-shadow: inset 0 2px 4px 0 rgb(0 0 0 / .05); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); user-select: text; }
@media (min-width: 640px) { .content-area-layout { padding: 1rem; } }
.bubble-footer-layout { margin-top: 0.75rem; padding-top: 0.625rem; border-top-width: 1px; border-color: rgb(255 255 255 / 0.05); flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem; }
.thinking-status-layout { align-items: center; gap: 0.5rem; font-size: .75rem; line-height: 1rem; font-style: italic; }
.icon-compact { height: 0.875rem; width: 0.875rem; }
.guest-signup-wall { margin-bottom: 0.75rem; border-radius: .75rem; border-width: 1px; border-color: rgb(16 185 129 / 0.3); background-color: rgb(5 5 5 / 0.9); padding: 0.75rem; font-size: .875rem; line-height: 1.25rem; }
.guest-signup-button { margin-top: 0.5rem; border-radius: .5rem; background-color: #059669; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.375rem; padding-bottom: 0.375rem; font-size: .75rem; line-height: 1rem; font-weight: 600; }
.guest-signup-button:hover { background-color: #10b981; }
.toast { pointer-events: auto; padding-left: 1rem; padding-right: 1rem; padding-top: 0.75rem; padding-bottom: 0.75rem; border-radius: .75rem; --surface-shadow: 0 25px 50px -12px var(--shadow-tint,rgb(0 0 0 / .25)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); border-width: 1px; font-size: .875rem; line-height: 1.25rem; font-weight: 500; transition-property: all; transition-duration: 300ms; transition-timing-function: cubic-bezier(.4,0,.2,1); transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.usage-fill-warning { height: 100%; background-color: #eab308; transition-property: all; transition-duration: 500ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.usage-fill-low { height: 100%; background-color: #ef4444; transition-property: all; transition-duration: 500ms; transition-timing-function: cubic-bezier(.4,0,.2,1); }
.history-button { width: 100%; text-align: left; border-radius: .5rem; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; font-size: .875rem; line-height: 1.25rem; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); align-items: center; gap: 0.5rem; }
.history-button:hover { background-color: rgb(255 255 255 / 0.05); }
.history-status-dot { flex-shrink: 0; height: 0.5rem; width: 0.5rem; border-radius: 9999px; }
.history-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1 1 0%; }
.mission-report-content { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1.625; background-color: rgb(8 8 8 / 0.8); border-radius: 1rem; padding: 1rem; border-width: 1px; overflow-y: auto; max-height: 420px; white-space: pre-wrap; overflow-wrap: break-word; --surface-shadow: inset 0 2px 4px 0 rgb(0 0 0 / .05); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); user-select: text; }
.thought-status-done { flex-shrink: 0; align-items: center; gap: 0.375rem; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: 9999px; background-color: rgb(2 44 34 / 0.6); border-width: 1px; font-size: .75rem; line-height: 1rem; color: #6ee7b7; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.download-zip-button { background-color: #2563eb; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.375rem; padding-bottom: 0.375rem; border-radius: .75rem; font-size: .75rem; line-height: 1rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); --surface-shadow: 0 4px 6px -1px var(--shadow-tint,rgb(0 0 0 / .1)),0 2px 4px -2px var(--shadow-tint,rgb(0 0 0 / .1)); box-shadow: var(--focus-glow,0 0 #0000), var(--surface-shadow,0 0 #0000); align-items: center; gap: 0.375rem; cursor: pointer; }
.download-zip-button:hover { background-color: #3b82f6; }
.secondary-action { border-width: 1px; border-color: #303030; padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.375rem; padding-bottom: 0.375rem; border-radius: .75rem; font-size: .75rem; line-height: 1rem; font-weight: 500; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); align-items: center; gap: 0.375rem; cursor: pointer; }
.secondary-action:hover { background-color: rgb(255 255 255 / 0.05); }
.logic-badge-row { width: 100%; margin-top: 0.5rem; align-items: center; }
.logic-warning { width: 100%; margin-top: 0.5rem; border-radius: .5rem; border-width: 1px; border-color: rgb(245 158 11 / 0.3); background-color: rgb(69 26 3 / 0.3); padding-left: 0.75rem; padding-right: 0.75rem; padding-top: 0.5rem; padding-bottom: 0.5rem; font-size: .75rem; line-height: 1rem; color: #fcd34d; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.thought-status-paused { flex-shrink: 0; align-items: center; gap: 0.375rem; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: 9999px; background-color: rgb(69 26 3 / 0.5); border-width: 1px; border-color: rgb(245 158 11 / 0.4); font-size: .75rem; line-height: 1rem; color: #fcd34d; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.thought-status-error { flex-shrink: 0; align-items: center; gap: 0.375rem; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: 9999px; background-color: rgb(69 10 10 / 0.5); border-width: 1px; font-size: .75rem; line-height: 1rem; color: #fca5a5; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.response-error { font-size: .75rem; line-height: 1rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; white-space: pre-wrap; overflow-wrap: break-word; margin-top: 0.5rem; }
.response-retry { border-radius: .75rem; border-width: 1px; background-color: rgb(69 10 10 / 0.4); padding-left: 0.875rem; padding-right: 0.875rem; padding-top: 0.375rem; padding-bottom: 0.375rem; font-size: .75rem; line-height: 1rem; font-weight: 500; color: #fecaca; transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-duration: 150ms; transition-timing-function: cubic-bezier(.4,0,.2,1); cursor: pointer; align-items: center; gap: 0.375rem; }
.response-retry:hover { background-color: rgb(127 29 29 / 0.6); }
.message-user-avatar { margin-top: 0.25rem; height: 2rem; width: 2rem; flex-shrink: 0; align-items: center; justify-content: center; border-radius: 9999px; background-image: none; --gradient-start: #10b981; --gradient-end: #22d3ee; font-size: 11px; font-weight: 700; color: #080808; }
.message-user-photo { height: 100%; width: 100%; object-fit: cover; }
.user-message-row { justify-content: flex-end; align-items: flex-start; gap: 0.75rem; }
.assistant-message-row { align-items: flex-start; gap: 0.75rem; max-width: 56rem; width: 100%; }
@media (min-width: 640px) { .assistant-message-row { gap: 1rem; } }
.activity-card { border-radius: .5rem; border-width: 1px; border-color: #262626; background-color: rgb(23 23 23 / 0.4); padding: 0.75rem; }
.activity-card > :not([hidden]) ~ :not([hidden]) { margin-top: 0.5rem; }
.activity-header-wrap { align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; }
.activity-action { font-size: .75rem; line-height: 1rem; font-weight: 600; color: #d4d4d4; align-items: center; gap: 0.375rem; }
.activity-file-path { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; background-color: rgb(2 44 34 / 0.4); padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.125rem; padding-bottom: 0.125rem; border-radius: .25rem; border-width: 1px; border-color: rgb(6 95 70 / 0.5); }
.activity-role { font-size: 11px; color: #737373; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.activity-source { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1rem; color: #d4d4d4; background-color: #0a0a0a; padding: 0.75rem; border-radius: .5rem; border-width: 1px; border-color: #262626; overflow-x: auto; }
.activity-terminal { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1rem; color: #e5e5e5; background-color: #000000; padding: 0.75rem; border-radius: .5rem; border-width: 1px; border-color: rgb(38 38 38 / 0.8); overflow-x: auto; max-height: 16rem; scrollbar-width: thin; }
.activity-note { border-radius: .5rem; border-width: 1px; border-color: #262626; background-color: rgb(23 23 23 / 0.4); padding: 0.75rem; }
.activity-note > :not([hidden]) ~ :not([hidden]) { margin-top: 0.25rem; }
.activity-heading { align-items: center; gap: 0.375rem; font-size: .75rem; line-height: 1rem; font-weight: 600; color: #d4d4d4; }
.activity-body { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: .75rem; line-height: 1rem; color: #d4d4d4; white-space: pre-wrap; overflow-wrap: break-word; }

/* Explicit interaction and visibility states. */
.is-hidden { display: none !important; }
.is-flex { display: flex; }
.is-clipped { overflow: hidden; }
.is-rotated { --rotation: 180deg; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.is-sidebar-closed { --offset-x: -100%; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.is-offscreen-right { --offset-x: 100%; transform: translate(var(--offset-x,0),var(--offset-y,0)) rotate(var(--rotation,0deg)) scale(var(--scale,1)); }
.is-transparent { opacity: 0.0; }
.is-highlighted { background-color: rgb(255 255 255 / 0.05); }
.is-active-surface { background-color: rgb(255 255 255 / 0.1); }
.is-text-strong { color: #ffffff; }
.is-muted { color: #94a3b8; }
.is-selected-surface { background-color: rgb(16 185 129 / 0.2); }
.is-selected-border { border-color: rgb(52 211 153 / 0.4); }
.is-pulsing { animation: status-pulse 2s cubic-bezier(.4,0,.6,1) infinite; }
.is-status-info { background-color: #22d3ee; }
.is-status-success { background-color: #34d399; }
.is-status-warning { background-color: #fbbf24; }
.is-status-error { background-color: #f87171; }
.surface-success { background-color: rgb(2 44 34 / 0.95); }
.surface-danger { background-color: rgb(69 10 10 / 0.95); }
.is-status-neutral { background-color: #64748b; }
.surface-elevated { background-color: rgb(5 5 5 / 0.95); }
.border-success { border-color: rgb(16 185 129 / 0.4); }
.border-danger { border-color: rgb(239 68 68 / 0.4); }
.border-subtle { border-color: rgb(255 255 255 / 0.1); }
.text-warning { color: #fbbf24; }
.text-accent { color: #22d3ee; }
.text-on-success { color: #d1fae5; }
.text-success { color: #34d399; }
.text-on-danger { color: #fee2e2; }
.text-danger { color: #f87171; }
.text-primary { color: #e2e8f0; }
.text-secondary { color: #cbd5e1; }
.text-subtle { color: #64748b; }
.text-brand-light { color: #a7f3d0; }
.text-brand { color: #6ee7b7; }
@media (min-width: 768px) { .sidebar.is-sidebar-closed { --offset-x: 0px; } }

/* Page theme, mission character, previews and polish. */
/* ---- Plushie Thinking Animation ---- */
@keyframes plushieThink {
    0%, 100% { transform: scale(1) rotate(0deg); }
    25% { transform: scale(0.98) rotate(-2deg); }
    75% { transform: scale(0.98) rotate(2deg); }
}
.plushie-thinking {
    animation: plushieThink 1.2s ease-in-out infinite;
}
/* ============================================
   PLUSHIE THEME OVERRIDES + ANIMATIONS
   ============================================ */

/* Emerald ambient glow instead of violet/cyan */
.shadow-glow {
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 12px 30px -10px rgba(16, 185, 129, 0.45) !important;
  }

  /* Emerald shadow glow for user message bubbles */
  .shadow-glow {
    box-shadow: 0 0 0 1px rgba(16, 185, 129, 0.08), 0 12px 30px -10px rgba(16, 185, 129, 0.45) !important;
  }

  /* Emerald focus ring globally */
  :focus-visible {
    outline: 2px solid rgba(52, 211, 153, 0.7) !important;
  }

  /* Gentle breathing for the plushie when idle */
  @keyframes plushieBreathe {
    0%, 100% { transform: scale(1) translateY(0); }
    50% { transform: scale(1.04) translateY(-2px); }
  }
  .plushie-avatar:not(.plushie-thinking) {
    animation: plushieBreathe 3.2s ease-in-out infinite;
  }

  /* Thought bubble fade + slide-in */
  @keyframes thoughtSlideIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  .thought-bubble-card {
    animation: thoughtSlideIn 0.35s ease-out;
  }

  /* Button ripple on click */
  @keyframes buttonRipple {
    0%   { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.55); }
    100% { box-shadow: 0 0 0 14px rgba(52, 211, 153, 0); }
  }
  #send-btn:not(:disabled):active,
  #auth-submit-btn:active,
  #signin-btn:active {
    animation: buttonRipple 0.5s ease-out;
  }

  /* Logo dot breathing glow */
  @keyframes logoGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.7); }
    50%      { box-shadow: 0 0 0 8px rgba(52, 211, 153, 0); }
  }
  #logo-dot {
    animation: logoGlow 2.4s ease-in-out infinite;
  }

  /* Mission cards lift on hover */
  .starter-card {
    transition: transform 0.2s ease, box-shadow 0.25s ease, border-color 0.2s ease;
  }
  .starter-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 28px rgba(16, 185, 129, 0.18);
  }

  /* New chat icon rotate on hover */
  #new-chat-btn svg {
    transition: transform 0.3s ease;
  }
  #new-chat-btn:hover svg {
    transform: rotate(90deg);
  }

  /* Content area smooth text updates */
  .content-area {
    transition: background-color 0.3s ease;
  }
/* Read-only generated file preview; ZIP actions stay below. */
.file-preview { margin-top: 1rem; border: 1px solid #303030; border-radius: .75rem; overflow: hidden; }
.file-preview > h3, .file-preview > p { padding: .6rem .8rem; font-size: .75rem; }
.file-preview > h3 { font-weight: 600; color: #e2e8f0; }
.file-preview > p { color: #94a3b8; }
.file-preview-layout { display: grid; grid-template-columns: minmax(120px, 30%) minmax(0, 1fr); border-top: 1px solid #303030; }
.file-tree { padding: .5rem; overflow: auto; max-height: 360px; font: .75rem monospace; }
.file-tree button { display: block; width: 100%; text-align: left; padding: .35rem; border-radius: .3rem; overflow-wrap: anywhere; color: #cbd5e1; }
.file-tree button[aria-pressed=true] { background: #05966933; color: #a7f3d0; }
.file-tree summary { cursor: pointer; color: #94a3b8; padding: .35rem 0; }
.file-folder { padding-left: .7rem; }
.file-source { min-width: 0; background: #080808; border-left: 1px solid #303030; }
.file-source-name, .file-source-notice { font-size: .7rem; padding: .5rem .7rem; overflow-wrap: anywhere; color: #94a3b8; }
.file-source-notice:empty { display: none; }
.file-source pre { max-height: 360px; overflow: auto; padding: .8rem; font: .75rem/1.7 'JetBrains Mono', monospace; white-space: pre; color: #e2e8f0; tab-size: 4; }
.source-keyword { color: #a7f3d0; } .source-string { color: #6ee7b7; } .source-number { color: #fbbf24; } .source-comment { color: #94a3b8; font-style: italic; }
@media (max-width: 600px) { .file-preview-layout { grid-template-columns: minmax(0, 1fr); } .file-tree { max-height: 150px; } .file-source { border-left: 0; border-top: 1px solid #303030; } }
[data-task-mode]:disabled { opacity: .45; cursor: not-allowed; }

/* The plushie is the mission's status character, in the existing theme. */
.plushie-avatar[data-status] { position: relative; border-radius: 50%; animation: none; }
.plushie-avatar[data-status=thinking] { animation: plushieThink 2s ease-in-out infinite; box-shadow: 0 0 0 1px #22d3ee55; }
.plushie-avatar[data-status=building] { animation: plushieThink 1.6s ease-in-out infinite; box-shadow: 0 0 0 2px #6ee7b766; }
.plushie-avatar[data-status=testing] { animation: plushieThink 2.5s ease-in-out infinite; box-shadow: 0 0 0 2px #22d3ee88; }
.plushie-avatar[data-status=done] { box-shadow: 0 0 0 2px #34d39966; }
.plushie-avatar[data-status=error] { box-shadow: 0 0 0 2px #fbbf2488; }
.plushie-caption { display: block; width: 56px; margin-top: .4rem; text-align: center; font-size: .6rem; color: #94a3b8; overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) { .plushie-avatar, .plushie-thinking, .thought-bubble-card { animation: none !important; } }

.example-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; width: 100%; text-align: left; }
.example-card { padding: 1.25rem; border: 1px solid #222222; border-radius: .75rem; background: #05050599; min-width: 0; }
.example-card h3 { font-size: .85rem; font-weight: 600; color: #e2e8f0; margin-bottom: .8rem; }
.example-card p, .example-files { font-size: .75rem; line-height: 1.7; color: #94a3b8; }
.example-card pre { overflow-x: auto; padding: .8rem; margin: .8rem 0; border-radius: .5rem; background: #080808; font-size: .7rem; color: #cbd5e1; }
.example-mission { border-color: #22d3ee66; }
.example-files li { margin-bottom: .8rem; overflow-wrap: anywhere; }
.example-files code { color: #a7f3d0; }
.example-card .example-test-result { color: #6ee7b7; margin: .8rem 0; }
@media (max-width: 600px) { .example-comparison { grid-template-columns: minmax(0, 1fr); } }

/* Quieter product surface: the plushie owns motion and status. */
.marketing-sections .animate-float, .marketing-sections .animate-gradient,
.marketing-sections .animate-bounce, .marketing-sections .flow-line { animation: none; }
.marketing-sections .animate-fade-up { animation-delay: 0s !important; }
#more-examples { max-width: 32rem; margin-inline: auto; }
#more-examples > summary { width: fit-content; margin: 0 auto 1rem; padding: .5rem .8rem; cursor: pointer; border: 1px solid #303030; border-radius: .6rem; }
#more-examples[open] > summary { color: #e2e8f0; }
.msg-row .thought-bubble-card { box-shadow: none; backdrop-filter: none; }
.thought-badge, .thinking-status { display: none !important; }
.live-status-container .live-status-pill { padding: 0; background: transparent; border: 0; color: #94a3b8; }
.live-status-pill > .is-pulsing { display: none; }
.thought-bubble-card .bubble-footer { justify-content: flex-end; }
.thought-bubble-card .action-buttons { flex-wrap: wrap; justify-content: flex-end; }
.mission-report { margin-top: .75rem; color: #94a3b8; font-size: .75rem; }
.mission-report > summary { cursor: pointer; padding: .5rem 0; }
.mission-report[open] > summary { color: #cbd5e1; }
.mission-report .content-area { margin-top: .4rem; box-shadow: none; }


  @keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
  }
  @keyframes fade-up {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes gradient-shift {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
  }
  @keyframes dash-flow {
    to { stroke-dashoffset: -24; }
  }
  .animate-float { animation: float 3s ease-in-out infinite; }
  .animate-fade-up { animation: fade-up 0.7s ease-out both; }
  .animate-gradient { background-size: 200% 200%; animation: gradient-shift 6s ease infinite; }
  .fade-once { animation-fill-mode: backwards; }
  .flow-line { stroke-dasharray: 6 6; animation: dash-flow 1s linear infinite; }
  @media (prefers-reduced-motion: reduce) {
    #empty-state, #empty-state * { animation: none !important; transition: none !important; }
  }

  #empty-state {
    position: relative;
    overflow: hidden;
  }
  #empty-state > *:not(.landing-effects) {
    position: relative;
    z-index: 1;
  }
    @keyframes plushieBounce {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-5px); }
    }
    .plushie-thinking {
      animation: plushieBounce 0.6s ease-in-out infinite;
    }

/* Static presentation formerly embedded in markup. */
.motion-timing-1 { animation-duration: 2s; }
.initial-width-2 { width: 100%; }
.motion-timing-36 { animation-delay: 0.15s; }
.motion-timing-37 { animation-delay: 0.8s; }
.motion-timing-38 { animation-delay: 0.4s; }
.motion-timing-39 { animation-delay: 0.3s; }
.motion-timing-40 { animation-delay: 0.5s; }
.motion-timing-41 { animation-delay: 0.6s; }
.plushie-gradient-42 { stop-color:#6EE7B7; }
.plushie-gradient-43 { stop-color:#34D399; }

/* Static, crawlable use-case and pricing content. */
.hero-category { width: 100%; max-width: 44rem; color: #d1fae5; font-size: clamp(1.35rem, 2.8vw, 2.125rem); font-weight: 600; line-height: 1.3; letter-spacing: -.02em; text-wrap: balance; }
.particle-text { position: relative; isolation: isolate; padding-block: .2em; }
.particle-text-label { display: block; }
.particle-text-canvas { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 20; }
/* Use one visual glyph layer, only after JS verifies the particle paint. */
.particle-text.is-particle-ready > .particle-text-label { opacity: 0; }
.particle-font-probe { position: absolute; left: 0; top: 0; visibility: hidden; white-space: pre; font: inherit; letter-spacing: inherit; pointer-events: none; }
.particle-baseline-marker { display: inline-block; width: 0; height: 0; margin: 0; padding: 0; vertical-align: baseline; }
.hero-category { overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) {
  .particle-text-canvas { display: none; }
  .particle-text.is-particle-ready > .particle-text-label { opacity: 1; }
}
.use-case-links { width: 100%; text-align: left; }
.use-case-links h2 { font-size: 1.125rem; font-weight: 600; color: #f1f5f9; }
.use-case-links p { margin: .75rem 0; color: #94a3b8; font-size: .875rem; line-height: 1.65; }
.use-case-links .guest-policy { font-size: .75rem; }
.use-case-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.use-case-grid a { display: block; padding: 1rem; border: 1px solid #303030; border-radius: .75rem; background: #05050599; }
.use-case-grid a:hover { border-color: #6ee7b7; }
.use-case-grid strong, .use-case-grid span { display: block; }
.use-case-grid strong { font-size: .875rem; color: #e2e8f0; }
.use-case-grid span { margin-top: .35rem; font-size: .75rem; color: #94a3b8; line-height: 1.6; }
.use-case-page { max-width: 56rem; margin: 0 auto; padding: 3rem 1.5rem; }
.use-case-nav { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; margin-bottom: 2rem; color: #94a3b8; font-size: .875rem; }
.use-case-nav a:hover { color: #a7f3d0; }
.use-case-intro h1 { margin: .75rem 0 1rem; font-size: 2.25rem; line-height: 1.2; font-weight: 600; color: #fff; }
.use-case-intro p { color: #cbd5e1; line-height: 1.8; }
.use-case-cta { display: inline-flex; margin: 1rem 0; padding: .75rem 1rem; border-radius: .75rem; background: #059669; color: #fff; font-size: .875rem; font-weight: 600; }
.use-case-cta:hover { background: #047857; }
.use-case-page .use-case-note { color: #94a3b8; font-size: .75rem; line-height: 1.7; }
.use-case-section { margin-top: 2.5rem; }
.use-case-section h2 { margin-bottom: 1rem; font-size: 1.25rem; font-weight: 600; color: #f1f5f9; }
.use-case-section h3 { margin-top: 1rem; font-size: 1rem; font-weight: 600; }
.use-case-section p { margin: .75rem 0; color: #cbd5e1; line-height: 1.8; }
.use-case-section blockquote { margin: 1rem 0; padding: 1rem; border-left: 2px solid #6ee7b7; border-radius: .5rem; background: #080808; color: #cbd5e1; font-size: .875rem; line-height: 1.8; }
.use-case-section pre { overflow-x: auto; padding: 1rem; border: 1px solid #303030; border-radius: .75rem; background: #080808; font-size: .75rem; line-height: 1.8; }
.use-case-file-list li { margin: 1rem 0; }
.use-case-file-list code { display: block; color: #a7f3d0; overflow-wrap: anywhere; }
.use-case-file-list span { display: block; margin-top: .25rem; color: #94a3b8; font-size: .875rem; }
.use-case-checks { padding-left: 1.25rem; list-style: disc; color: #cbd5e1; line-height: 1.8; }
.use-case-checks li { margin-bottom: .75rem; }
.use-case-related { display: flex; flex-wrap: wrap; gap: 1rem; }
.use-case-page footer { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid #303030; }
.pricing-guest-access { padding: 1.5rem; margin-bottom: 2rem; border: 1px solid #303030; border-radius: .75rem; background: #08080866; }
.pricing-guest-access h2, .pricing-faq h2 { font-size: 1.25rem; font-weight: 600; color: #f1f5f9; }
.pricing-guest-access p, .pricing-faq p { margin-top: .75rem; color: #cbd5e1; font-size: .875rem; line-height: 1.8; }
.pricing-faq { margin-top: 3rem; }
.pricing-faq h2 { margin-bottom: 1rem; }
.pricing-faq details { padding: 1rem 0; border-bottom: 1px solid #303030; }
.pricing-faq summary { cursor: pointer; color: #e2e8f0; font-size: .875rem; font-weight: 500; }
@media (max-width: 600px) { .use-case-grid { grid-template-columns: minmax(0, 1fr); } .use-case-intro h1 { font-size: 1.875rem; } }

/* Selected, attributed maker feedback; no stars or rating widgets. */
.maker-feedback { width: 100%; text-align: left; }
.maker-feedback h2 { color: #f1f5f9; font-size: 1.125rem; font-weight: 600; }
.feedback-disclosure { margin: .75rem 0 1rem; color: #94a3b8; font-size: .875rem; line-height: 1.7; }
.feedback-disclosure a { color: #a7f3d0; text-decoration: underline; text-underline-offset: 3px; }
.feedback-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.feedback-grid figure { display: flex; flex-direction: column; justify-content: space-between; gap: 1.25rem; padding: 1.25rem; border: 1px solid #303030; border-radius: .75rem; background: #05050599; }
.feedback-grid blockquote { color: #e2e8f0; font-size: .875rem; line-height: 1.8; }
.feedback-grid figcaption { color: #94a3b8; font-size: .75rem; line-height: 1.7; }
.feedback-grid figcaption strong { display: block; color: #cbd5e1; font-weight: 600; }
.feedback-grid figcaption span, .feedback-grid time { display: block; }
@media (max-width: 600px) { .feedback-grid { grid-template-columns: minmax(0, 1fr); } }

/* Black workspace, emerald light. All effects remain behind the actual controls. */
.workspace-main { background: #000; }
.chat-scroll { position: relative; z-index: 1; background: transparent; }
.workspace-header, .sidebar, .composer { background-color: #080808; }
.hero-badge-frame { background: #252525; }
.hero-badge { background: #080808; }
.sidebar-avatar, .profile-avatar, .message-user-avatar { background: #a7f3d0; color: #052e16; }
.agent-icon-frame, .motion-timing-38-layout { background: #101512; }
.agent-icon-outline { border-style: solid; }
.thought-bubble-card-layout { border-color: #292929; }
.assistant-message-title .duration-text { display: none; }
.hero-starter, .example-card, .feedback-grid figure, .use-case-grid a { background-color: rgb(8 8 8 / .88); }
.send-btn, .signin-btn, .auth-submit-btn, .guest-signup-button { color: #ecfdf5; }
.landing-effects { position: absolute; inset: -2rem -1rem auto; height: min(860px, 110vh); pointer-events: none; z-index: 0; overflow: hidden; contain: strict; }
.landing-effects > div { position: absolute; inset: 0; }
.landing-effects canvas { display: block; width: 100%; height: 100%; }
.continuation-effects { position: absolute; left: 0; right: 0; pointer-events: none; z-index: 0; overflow: hidden; contain: strict; mix-blend-mode: screen; opacity: .8; }
.continuation-effects canvas { display: block; width: 100%; height: 100%; }
.ghost-fibers-layer { opacity: .85; mask-image: linear-gradient(#000 65%, transparent); }
.lightfall-layer { opacity: .65; mix-blend-mode: screen; mask-image: linear-gradient(#000 40%, transparent 95%); }
.hero-heading, .hero-category, .hero-section > p { text-shadow: 0 2px 18px #000, 0 0 40px #000; }
.landing-motion-toggle { align-self: flex-end; color: #a1a1aa; background: #080808b3; border: 1px solid #27272a; border-radius: 999px; font-size: .65rem; padding: .3rem .65rem; margin-bottom: -2.5rem; z-index: 2; }
.landing-motion-toggle:hover { color: #d1fae5; border-color: #10b98166; }
@media (max-width: 640px) { .landing-effects { height: 680px; } .ghost-fibers-layer { opacity: .65; } .lightfall-layer { opacity: .45; } }

/* Thought Line, adapted from the supplied React Bits design. */
.thought-line { position: relative; width: 100%; margin: .75rem 0; color: #c9d4ce; font-size: .875rem; }
.thought-line-head { display: flex; align-items: center; gap: .4rem; width: fit-content; max-width: 100%; padding: .4rem 0; list-style: none; cursor: pointer; border-radius: .35rem; }
.thought-line-head::-webkit-details-marker { display: none; }
.thought-line-glyph { color: #6ee7b7; font-size: 1.4em; line-height: 1; }
.thought-line-label { font-weight: 500; transition: color .35s ease; }
.thought-line-timer { color: #8b9690; font-size: .75rem; font-variant-numeric: tabular-nums; }
.thought-line-count { color: #717b75; font-size: .65rem; margin-left: .3rem; }
.thought-line-chevron { flex: none; width: .9rem; height: .9rem; color: #87928b; transition: transform .25s ease; }
.thought-line[open] .thought-line-chevron { transform: rotate(180deg); }
.thought-line[data-working=true] .thought-line-glyph { animation: thought-breath 1.6s ease-in-out infinite; }
.thought-line[data-working=true] .thought-line-label { background: linear-gradient(100deg, #788b7e 30%, #e1f7e9 50%, #788b7e 70%); background-size: 250% 100%; background-clip: text; -webkit-background-clip: text; color: transparent; animation: thought-shimmer 1.8s linear infinite; }
.thought-line[data-working=false] .thought-line-glyph { opacity: .55; }
.thought-line[data-failed=true] .thought-line-glyph { color: #fbbf24; }
.thought-line-popover { position: absolute; top: 100%; left: 0; width: 100%; max-height: 340px; overflow: auto; overscroll-behavior: contain; padding: 1rem; background: #0a0d0b; border: 1px solid #304338; border-radius: .85rem; z-index: 25; box-shadow: 0 12px 32px #0009; animation: thought-popover-in .2s ease-out; }
.thought-line-note { color: #8b9690; font-size: .65rem; line-height: 1.5; padding-bottom: .8rem; border-bottom: 1px solid #ffffff0d; margin-bottom: .7rem; }
.thought-line-steps { display: flex; flex-direction: column; }
.thought-line-steps > div { position: relative; flex: none; padding: .55rem 0 .7rem 1.35rem; border: 0; border-left: 1px solid #2a3b30; border-radius: 0; background: transparent; margin-left: .3rem; opacity: .72; }
.thought-line-steps > div::before { content: ''; position: absolute; left: -3px; top: .95rem; width: 5px; height: 5px; border-radius: 50%; background: #6b8c76; }
.thought-line[data-working=true] .thought-line-steps > .is-current-step { opacity: 1; }
.thought-line[data-working=true] .is-current-step::before { background: #6ee7b7; box-shadow: 0 0 8px #34d39988; animation: thought-breath 1.6s ease-in-out infinite; }
.thought-line-steps .activity-header-wrap, .thought-line-steps .usage-label-row { gap: .5rem; flex-wrap: wrap; }
.thought-line-steps .activity-source, .thought-line-steps .activity-terminal { margin-top: .5rem; max-height: 160px; font-size: .7rem; }
.thought-line-steps .activity-body { font-family: inherit; font-size: .75rem; line-height: 1.6; }
.thought-line-steps .activity-file-path { max-width: 100%; overflow-wrap: anywhere; font-size: .7rem; }
.thought-line-steps .activity-role { overflow-wrap: anywhere; }
.thought-line-steps .activity-heading > .text-brand { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
@keyframes thought-shimmer { from { background-position: 125% 0; } to { background-position: -125% 0; } }
@keyframes thought-breath { 0%,100% { opacity: .5; } 50% { opacity: 1; } }
@keyframes thought-popover-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

/* Native ScrollStack: the existing chat viewport is the only page scroller. */
#empty-state { overflow: clip; }
.scroll-stack { width: 100%; text-align: left; }
.scroll-stack-inner { position: relative; width: 100%; }
.scroll-stack-anchor { height: 0; pointer-events: none; }
.scroll-stack-slot { position: relative; margin-bottom: 1.5rem; }
.scroll-stack-card { position: relative; width: 100%; padding: clamp(1.2rem, 3vw, 1.5rem); border-radius: 1.5rem; border: 1px solid #2b4736; background: #000; color: #e5f2e9; transform-origin: 50% 0; box-shadow: 0 -8px 32px #0008; isolation: isolate; }
.scroll-stack-card::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: #000; opacity: var(--scroll-stack-dim, 0); pointer-events: none; }
.scroll-stack[data-stack-enabled=true] .scroll-stack-slot { position: sticky; top: var(--stack-top); z-index: var(--stack-order); margin-bottom: 100px; }
.scroll-stack[data-stack-enabled=true] .scroll-stack-card { min-height: var(--stack-height); will-change: transform; }
.scroll-stack[data-stack-enabled=true] .scroll-stack-end { height: 180px; }
.stack-kicker { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; color: #6ee7b7; font: .65rem/1.5 'JetBrains Mono',monospace; letter-spacing: .07em; text-transform: uppercase; margin-bottom: 1.2rem; }
.stack-kicker > span { color: #86a18f; }
.stack-heading h2, .scroll-stack-card > h2 { color: #ecfdf5; font-size: clamp(1.2rem, 2.2vw, 1.65rem); font-weight: 600; line-height: 1.25; letter-spacing: -.025em; }
.stack-heading > p { color: #9caf9f; font-size: .85rem; line-height: 1.7; margin-top: .6rem; }
.scroll-stack-card .example-card, .scroll-stack-card .feedback-grid figure, .scroll-stack-card .use-case-grid a { background: #080d09; border-color: #233329; }
.scroll-stack-card .example-card h3, .scroll-stack-card .example-files code, .scroll-stack-card .example-test-result { color: #86efac; }
.scroll-stack-card.mission-example { gap: 1rem; }
.scroll-stack-card .example-heading { width: 100%; }
.scroll-stack-card .example-prompt { font-size: 1.1rem; }
.scroll-stack-card .example-card { padding: 1rem; }
.scroll-stack-card .benefit-list { margin-top: 0; }
.stack-footnote { color: #92a499; font-size: .7rem; line-height: 1.7; margin-top: 1rem; }
.landing-editor { margin-top: 1.25rem; border: 1px solid #2c4032; border-radius: .85rem; overflow: hidden; background: #050805; }
.landing-editor-bar { display: flex; align-items: center; gap: .5rem; padding: .65rem .8rem; color: #97b19f; font: .65rem/1.5 'JetBrains Mono',monospace; border-bottom: 1px solid #ffffff0d; }
.editor-status-dot { width: 6px; height: 6px; flex: none; background: #34d399; border-radius: 50%; }
.editor-readonly { margin-left: auto; color: #718278; }
.landing-editor-tabs { display: flex; overflow-x: auto; border-bottom: 1px solid #ffffff0d; }
.landing-editor-tabs button { flex: none; padding: .65rem .85rem; color: #83958a; border-bottom: 1px solid transparent; font: .65rem/1.5 'JetBrains Mono',monospace; }
.landing-editor-tabs button[aria-selected=true] { color: #86efac; border-bottom-color: #34d399; background: #102117; }
.landing-editor pre { height: 170px; padding: 1rem; overflow: auto; color: #c2e8cd; font: .7rem/1.7 'JetBrains Mono',monospace; tab-size: 4; }
.landing-editor-footer { display: flex; justify-content: space-between; gap: .75rem; flex-wrap: wrap; padding: .6rem .8rem; border-top: 1px solid #ffffff0d; font-size: .65rem; color: #83958a; }
.landing-editor-footer > :first-child { color: #6ee7b7; }
.stack-example-button { display: inline-flex; align-items: center; gap: 1rem; margin-top: 1rem; padding: .55rem .85rem; border: 1px solid #2f6942; border-radius: .6rem; font-size: .75rem; color: #a7f3d0; background: #0a1b10; }
.stack-example-button:hover { background: #102a19; border-color: #6ee7b7; }
.task-guide-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; margin: 1.5rem 0; }
.task-guide-grid article { padding: 1rem; border: 1px solid #233329; border-radius: .85rem; background: #080d09; }
.task-guide-grid .task-guide-mission { border-color: #376c47; }
.task-guide-icon { display: grid; place-items: center; width: 2rem; height: 2rem; border: 1px solid #2c5036; border-radius: .6rem; color: #6ee7b7; margin-bottom: .8rem; }
.task-guide-grid h3 { font-weight: 600; font-size: .9rem; color: #d1fae5; }
.task-guide-grid p { margin: .6rem 0 .8rem; color: #9caf9f; font-size: .75rem; line-height: 1.7; }
.task-guide-detail { font-size: .65rem; color: #77a486; line-height: 1.6; }
@media (max-width: 760px) {
  .scroll-stack-card { border-radius: 1.1rem; padding: 1.15rem; }
  .task-guide-grid { grid-template-columns: minmax(0,1fr); }
  .task-guide-grid article { display: grid; grid-template-columns: 2rem minmax(0,1fr); column-gap: .8rem; }
  .task-guide-icon { grid-row: span 3; margin: 0; }
  .task-guide-grid p { margin: .3rem 0 .4rem; }
  .scroll-stack-card .feedback-grid, .scroll-stack-card .use-case-grid { grid-template-columns: minmax(0,1fr); }
  .editor-readonly { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .landing-effects, .continuation-effects { display: none; }
  .thought-line *, .thought-line-steps > div::before { animation: none !important; transition: none !important; }
  .thought-line[data-working=true] .thought-line-label { background: none; color: #c9d4ce; }
}
.privacy-notice { margin: .5rem 0; color: #9caf9f; font-size: .7rem; line-height: 1.6; }
.composer-panel .privacy-notice { margin: .25rem 0; line-height: 1.5; }
.composer-toolbar .privacy-notice { flex: 1 1 22rem; max-width: 40rem; }
.privacy-notice a, .privacy-menu-link { color: #a7f3d0; text-decoration: underline; text-underline-offset: .2em; }
.privacy-menu-link { display: block; padding: .65rem 1rem; font-size: .8rem; }
.privacy-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin: .75rem 0; }
.privacy-action { border: 1px solid #376c47; border-radius: .6rem; padding: .6rem .85rem; color: #d1fae5; background: #080d09; font-size: .85rem; }
.privacy-action:hover, .privacy-action:focus-visible { border-color: #6ee7b7; }
.privacy-action:disabled { opacity: .6; cursor: wait; }
.privacy-draft { border-left: 3px solid #d5b66e; padding-left: 1rem; margin: 1rem 0; color: #e7d6ac; }
.sidebar { width: 17.5rem; background: #050505; backdrop-filter: none; -webkit-backdrop-filter: none; overflow: hidden; }
.sidebar-rail-head { display: flex; padding: .5rem; min-height: 3rem; align-items: center; }
.sidebar-rail-toggle { display: grid; place-items: center; flex: none; width: 2.25rem; height: 2.25rem; border-radius: .5rem; color: #a3aaa5; }
.sidebar-rail-toggle:hover, .sidebar-rail-toggle:focus-visible { background: #171a18; color: #f1f5f9; }
.sidebar-new-chat, .sidebar-history-action { padding: .125rem .5rem; }
.sidebar .new-chat-btn, .sidebar-history-button { display: flex; align-items: center; justify-content: flex-start; gap: .65rem; width: 100%; min-height: 2.25rem; border: 0; padding: .5rem; border-radius: .5rem; font-size: .875rem; color: #d4d9d6; text-align: left; }
.sidebar .new-chat-btn { background: #181c19; }
.sidebar .new-chat-btn:hover, .sidebar-history-button:hover, .sidebar-history-button:focus-visible { background: #222824; }
.sidebar .icon-medium { flex: none; }
.sidebar-history-panel { display: flex; flex: 1; min-height: 0; padding-top: .5rem; }
.sidebar-history-panel[hidden], .sidebar-account[hidden] { display: none; }
.sidebar .thread-list { width: 100%; }
.sidebar .history-button { min-height: 2.5rem; padding: .65rem .6rem; font-size: .8rem; border-radius: .5rem; }
@media (min-width: 768px) {
  .sidebar, .sidebar.is-sidebar-closed { position: static; transform: none; --offset-x: 0; }
  .sidebar.is-sidebar-closed { width: 3.25rem; }
  .sidebar.is-sidebar-closed .sidebar-label { display: none; }
}
.thought-line-head { width: 100%; padding: .65rem .75rem; border: 1px solid #263b2e; border-radius: .65rem; background: #0a100c; flex-wrap: wrap; }
.mission-steps-heading { color: #d1fae5; font-size: .75rem; font-weight: 600; }
.thought-line-head .thought-line-count { margin-left: auto; color: #b3c7ba; }
.thought-line-popover { position: static; max-height: min(320px, 50vh); margin-top: .5rem; box-shadow: none; animation: none; }
.thought-line-steps > div { opacity: 1; }
.thought-line-note { font-size: .7rem; }
.analytics-notice { position: fixed; top: 4rem; right: 1rem; z-index: 25; display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; width: max-content; max-width: calc(100vw - 2rem); padding: .65rem .8rem; border: 1px solid #2c4233; border-radius: .8rem; background: #0a100d; color: #cad8cf; font-size: .75rem; line-height: 1.6; }
.analytics-notice strong { color: #d1fae5; }
.analytics-notice p { margin: 0; }
.analytics-notice a { color: #a7f3d0; text-decoration: underline; }
.analytics-notice-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.analytics-notice-actions button { padding: .35rem .65rem; border: 1px solid #35453b; border-radius: .45rem; color: #e1e9e4; }
.analytics-notice-actions button:hover, .analytics-notice-actions button:focus-visible { background: #1a2920; border-color: #6ee7b7; }
