
:root{color-scheme:dark;--cv-bg:#091222;--cv-card:#14263b;--cv-border:#314965;--cv-ink:#edf6ff;--cv-muted:#a9bbd0;--cv-accent:#ffd088;--cv-blue:#76cfff;--cv-glow:#66bdff44}
:root[data-cv-theme="blue"]{--cv-accent:#79ceff;--cv-blue:#a9e2ff;--cv-glow:#52c5ff44}
:root[data-cv-theme="purple"]{--cv-accent:#c9b2ff;--cv-blue:#c9b2ff;--cv-glow:#ba86ff44}
:root[data-cv-theme="green"]{--cv-accent:#82e0c7;--cv-blue:#a8fce3;--cv-glow:#68dcb544}
*{box-sizing:border-box}html{scroll-behavior:smooth}body.cv22{margin:0;background:radial-gradient(ellipse at 65% -20%,#2668a53b,transparent 55%),var(--cv-bg);color:var(--cv-ink);font:15px/1.55 system-ui,-apple-system,Segoe UI,sans-serif;min-height:100vh}
a{color:var(--cv-blue)}.cv22 a{text-decoration:none}.cv22 a:hover{text-decoration:underline}.cv22 button,.cv22 select,.cv22 input,.cv22 textarea{font:inherit}.cv22 button{cursor:pointer;color:var(--cv-ink);border:1px solid var(--cv-border);background:#223953;border-radius:12px;padding:10px 15px}.cv22 button:hover,.cv22 button:focus-visible{border-color:var(--cv-accent)}.cv22 button:disabled{opacity:.55;cursor:not-allowed}.cv22 .primary{background:var(--cv-accent);color:#162236;font-weight:750;border-color:transparent}.cv22 input,.cv22 select,.cv22 textarea{color:var(--cv-ink);background:#0b1b2e;border:1px solid #42607b;border-radius:11px;padding:10px;max-width:100%}.cv22 label{color:var(--cv-muted);font-size:13px;font-weight:650}.cv22 .muted{color:var(--cv-muted)}.cv22 .eyebrow{letter-spacing:.16em;color:var(--cv-accent);text-transform:uppercase;font-size:11px;font-weight:800}.cv22 .glass{background:linear-gradient(135deg,#16283ede,#111f34ed);border:1px solid var(--cv-border);border-radius:20px;box-shadow:0 14px 45px #0002}.cv22 .layout{max-width:1490px;margin:auto;padding:22px clamp(16px,4vw,56px)}.cv22 .toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.cv22 .tabs{display:flex;flex-wrap:wrap;gap:8px}.cv22 .tabs a,.cv22 .tabs button{padding:9px 12px;background:#1b3047;border-radius:11px;border:1px solid #314865;color:var(--cv-ink)}.cv22 .tabs .active{background:#2e5270;border-color:var(--cv-accent)}.cv22 .hero{margin:20px 0;display:flex;gap:18px;align-items:center;justify-content:space-between;padding:25px}.cv22 h1{font-size:clamp(26px,3.5vw,45px);letter-spacing:-.035em;line-height:1.14;margin:8px 0 10px}.cv22 h2{font-size:19px;margin:0 0 12px}.cv22 h3{font-size:16px;margin:0 0 7px}.cv22 p{margin:6px 0;color:var(--cv-muted)}.cv22 .chips{display:flex;flex-wrap:wrap;gap:7px}.cv22 .chip{border-radius:30px;padding:5px 10px;background:#1a3753;color:#c4e4fa;font-size:12px}.cv22 .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:12px}.cv22 .stat{padding:18px}.cv22 .stat strong{font-size:25px;display:block}.cv22 .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:14px}.cv22 .panel{padding:20px;margin-top:18px;min-width:0}.cv22 .tile{display:block;padding:18px;min-width:0;transition:transform .2s,border-color .2s,box-shadow .2s}.cv22 .tile:hover{transform:translateY(-3px);border-color:var(--cv-accent);box-shadow:0 10px 25px var(--cv-glow)}.cv22 .status-dot{display:inline-block;height:9px;width:9px;border-radius:50%;background:#708398;margin-right:7px}.cv22 .status-dot.online{background:#81e5c6;box-shadow:0 0 11px #81e5c677}.cv22 .status-dot.busy{background:var(--cv-accent);animation:cvBlink 1.25s ease-in-out infinite}.cv22 .live-row{padding:8px 0;border-bottom:1px solid #2c4057;display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap}.cv22 .settings{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.cv22 .settings select{width:auto;min-width:115px}.cv22 .constellation{height:300px;position:relative;overflow:hidden;background:radial-gradient(ellipse,#213e57c2,#0e1c2d);border-radius:16px;border:1px solid #34506b;margin:8px 0}.cv22 .constellation svg{position:absolute;inset:0;width:100%;height:100%}.cv22 .constellation line{stroke:#6cb2e75c;stroke-width:2;stroke-dasharray:4 9}.cv22 .constellation.busy line{animation:cvFlow 1.6s linear infinite}.cv22 .ai-node{position:absolute;display:grid;place-items:center;transform:translate(-50%,-50%);padding:10px;text-align:center;border-radius:14px;border:1px solid #7294ad;background:#1b3450;box-shadow:0 0 16px #5db1e633;min-width:96px;color:#f2f9ff;font-size:13px}.cv22 .ai-node small{font-size:11px;color:#b2c9dc}.cv22 .ai-node.busy{border-color:var(--cv-accent);box-shadow:0 0 26px var(--cv-glow);animation:cvNodePulse 1.7s ease-in-out infinite}.cv22 .command{position:fixed;inset:0;background:#000a;z-index:50;display:grid;place-items:start center;padding:12vh 15px}.cv22 .command[hidden]{display:none}.cv22 .command-box{width:min(640px,100%);padding:20px}.cv22 .command-list{max-height:45vh;overflow:auto;margin-top:8px}.cv22 .command-list a{display:block;padding:12px;border-radius:10px;color:var(--cv-ink)}.cv22 .command-list a:hover,.cv22 .command-list a:focus-visible{background:#25435f}.cv22 .notice{min-height:22px;color:#ffd08a}.cv22 .toast{position:fixed;bottom:22px;right:22px;border:1px solid var(--cv-border);background:#193248;padding:14px 20px;border-radius:12px;z-index:100;box-shadow:0 10px 35px #0008}.cv22 .toast[hidden]{display:none}
/* Guest animations and flexible layout */
.cv22 .guest-shell{width:min(1180px,100%);margin:auto;padding:clamp(10px,3vw,24px);height:100dvh;min-height:560px;display:flex;flex-direction:column;gap:13px}.cv22 .guest-main{display:grid;grid-template-columns:260px minmax(0,1fr);gap:13px;flex:1;min-height:0}.cv22 .guest-side{padding:16px;overflow:auto}.cv22 .guest-side button{width:100%;text-align:left;margin:4px 0;display:flex;align-items:center;gap:9px}.cv22 .guest-side button[aria-pressed=true]{background:#365b78;border-color:var(--cv-accent)}.cv22 .guest-side .prompts button{font-size:12px;background:#162d44}.cv22 .chat-panel{display:flex;flex-direction:column;min-height:0;overflow:hidden}.cv22 .chat-header{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--cv-border);padding:14px 17px}.cv22 .feed{min-height:130px;flex:1;overflow-y:auto;padding:15px;scroll-behavior:smooth}.cv22 .bubble{margin:12px 0;max-width:min(90%,700px);padding:15px 17px;background:#1f3854;border:1px solid #35516d;border-radius:17px;overflow-wrap:anywhere;animation:cvRise .25s both}.cv22 .bubble.user{margin-left:auto;background:#30495e}.cv22 .bubble .who{font-size:12px;letter-spacing:.02em;font-weight:700;color:var(--cv-accent);margin-bottom:5px}.cv22 .bubble .content{white-space:pre-wrap;line-height:1.65}.cv22 .bubble .bubble-actions{display:flex;gap:6px;margin-top:7px}.cv22 .bubble .bubble-actions button{font-size:12px;padding:5px 9px}.cv22 .wait{display:flex;align-items:center;gap:4px;color:var(--cv-muted)}.cv22 .wait i{display:inline-block;width:6px;height:6px;background:var(--cv-accent);border-radius:50%;animation:cvBlink .9s infinite alternate}.cv22 .wait i:nth-child(2){animation-delay:.18s}.cv22 .wait i:nth-child(3){animation-delay:.36s}.cv22 .chat-compose{padding:14px;display:flex;gap:9px;border-top:1px solid var(--cv-border)}.cv22 .chat-compose textarea{flex:1;min-height:76px;resize:vertical}.cv22 .chat-compose button{align-self:stretch}.cv22 .guest-hint{font-size:12px;color:var(--cv-muted)}.cv22 .compare{border-left:3px solid var(--cv-accent);padding:8px 12px;color:var(--cv-muted);margin:8px 0}.cv22 .scanline{position:relative;overflow:hidden}.cv22 .scanline:before{content:'';position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--cv-accent),transparent);opacity:.28;animation:cvScan 8s linear infinite;pointer-events:none}.cv22 .login-choice{display:grid;grid-template-columns:1fr 1fr;gap:14px}.cv22 .login-choice section{padding:20px}.cv22 .login-choice section:hover{border-color:var(--cv-accent)}
@keyframes cvBlink{from{opacity:.35}to{opacity:1}}@keyframes cvNodePulse{50%{box-shadow:0 0 34px var(--cv-glow);transform:translate(-50%,-50%) scale(1.04)}}@keyframes cvFlow{to{stroke-dashoffset:-25}}@keyframes cvRise{from{opacity:.15;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes cvScan{to{transform:translateY(360px)}}
@media(max-width:750px){.cv22 .guest-main{grid-template-columns:1fr}.cv22 .guest-side{max-height:170px}.cv22 .guest-side .agent-picks{display:flex;overflow-x:auto;gap:6px}.cv22 .guest-side .agent-picks button{width:auto;flex-shrink:0}.cv22 .guest-shell{min-height:100dvh}.cv22 .constellation{height:265px}.cv22 .ai-node{min-width:75px;font-size:11px;padding:8px}.cv22 .login-choice{grid-template-columns:1fr}.cv22 .hero{display:block}.cv22 .stats{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
:root[data-cv-motion="off"] *, :root[data-cv-motion="off"] *:before,:root[data-cv-motion="off"] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}

.cv22 .panel textarea,.cv22 .panel input:not([type=checkbox]){width:100%;display:block;margin:8px 0}.cv22 .cv-output{white-space:pre-wrap;overflow-wrap:anywhere;max-height:420px;overflow-y:auto;background:#0a172a;border:1px solid #416582;border-radius:12px;padding:15px}.cv22 .panel .live-row button{padding:4px 9px}.cv22 .panel .primary{display:inline-block;background:var(--cv-accent);color:#121e30;font-weight:700;padding:12px;border-radius:12px}

:root[data-cv-motion="minimal"] .cv22 .scanline:before,:root[data-cv-motion="minimal"] .cv22 .constellation line{animation:none!important} :root[data-cv-motion="minimal"] .cv22 .tile{transition:none!important} :root[data-cv-motion="cinematic"] .cv22 .hero{box-shadow:0 0 40px var(--cv-glow)} :root[data-cv-motion="cinematic"] .cv22 .ai-node.busy{filter:drop-shadow(0 0 8px var(--cv-accent))}

.cv22 .flow-nodes{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch;margin-top:12px}.cv22 .flow-node{flex:1 1 170px;display:flex;flex-direction:column;gap:4px;min-width:0;padding:12px;border:1px solid var(--cv-border);border-radius:12px;background:#203b55}.cv22 .flow-node strong{color:var(--cv-accent)}.cv22 .flow-node small{color:var(--cv-muted)}.cv22 .flow-arrow{align-self:center;color:var(--cv-accent);font-size:18px}.cv22 .flow-node span{overflow-wrap:anywhere}

/* Gen 2.2 workflow and diagnostics visualizations */
.cv-flow-canvas{min-height:150px;overflow-x:auto;background:#0b1b2e;border:1px solid var(--cv-border);border-radius:14px;margin:13px 0;padding:12px}
.cv-flow-canvas svg{width:100%;min-width:320px;height:auto;display:block}
.cv-flow-editor{display:grid;gap:9px;margin:12px 0}
.cv-flow-step{border:1px solid var(--cv-border);border-radius:12px;padding:10px;display:grid;grid-template-columns: minmax(70px,.5fr) minmax(95px,.6fr) minmax(150px,1.5fr) minmax(90px,1fr) auto;gap:7px;align-items:center}
.cv-flow-step input,.cv-flow-step select{width:100%;min-width:0}
.cv-guest-preview,.panel-inside{margin-top:14px;padding:14px;background:#0b1b2e;border:1px solid var(--cv-border);border-radius:12px}
.cv-flow-canvas .flowbox{fill:#1b3955;stroke:var(--cv-accent);stroke-width:1.5}
.cv-flow-canvas .flowlabel{fill:#f3f9ff;font:700 14px system-ui}
.cv-flow-canvas .flowsub{fill:#b8d4e8;font:12px system-ui}
.cv-flow-canvas .flowedge{stroke:#87c7f7;stroke-width:2;fill:none}
.cv-statsbar{height:9px;border-radius:9px;background:#1a3046;overflow:hidden}
.cv-statsbar span{height:100%;display:block;background:#82e0c7}
@media(max-width:960px){.cv-flow-step{grid-template-columns:repeat(2,minmax(0,1fr))}.cv-flow-step .cv-step-task{grid-column:1/-1}}
