:root{color-scheme:dark;--bg:#06070d;--paper:#11111b;--white:#161520;--ink:#ece8e1;--muted:#aaa6b5;--line:#ffffff17;--plum:#b79bdd;--pale:#2d243b;--sage:#88bda8;--serif:'Songti SC','Noto Serif SC',SimSun,serif;--sans:'PingFang SC','Microsoft YaHei',system-ui,sans-serif}
body{font-size:14px;background:radial-gradient(ellipse at 22% 10%,#32213b40,transparent 60%),radial-gradient(ellipse at 85% 85%,#19304b3b,transparent 60%),var(--bg)}::selection{background:#615074;color:white}
.preview-bar{border-color:var(--line);color:#a69aad;font-size:11px;background:#0809106b}.preview-bar b{color:#cdb6e7;font-size:11px}.preview-bar a.active{color:#dfcbf7}.preview-bar nav a{font-size:11px}.preview-note{font-size:10px}.preview-bar a.active:after{background:linear-gradient(90deg,#6ecdff,#a78bfa,#ff85b3)}
.installer{border-color:#cab4e02e;background:var(--paper);box-shadow:0 30px 90px #0006,0 0 80px #ad85d308;position:relative}.installer:before{content:'';position:absolute;left:18%;right:18%;top:0;height:1px;background:linear-gradient(90deg,transparent,#bc9fe6,#95bddc,transparent);z-index:5;pointer-events:none}.window-header{background:#11101b;border-color:var(--line)}.wordmark{font-size:25px;color:#ece8e1}.wordmark .mark{width:31px;height:31px}.mark circle{fill:#95c9ef}.mark path{stroke:#c3a5e2}.window-title>span,.header-actions,.header-actions .text-link{color:#a69caf;font-size:11px}.windows-controls{color:#85788e}.layout{grid-template-columns:190px minmax(0,1fr)}.setup-sidebar{background:linear-gradient(180deg,#17121f,#11111b);border-color:var(--line)}.side-title{color:#a394b1;font-size:11px;letter-spacing:.5px}.step-list li{color:#a59cae;font-size:13px}.step-number{background:#17141e;border-color:#64516b;color:#a395ad}.step-list li:not(:last-child):after{background:#4a3c56}.step-list .current{color:#e2d4f3}.step-list .current .step-number{color:#21172d;background:#c4abe4;border-color:#c4abe4;box-shadow:0 0 0 4px #a78bfa18}.step-list .done{color:#a5c6b6}.step-list .done .step-number{background:#21302c;border-color:#34473f;color:#a5c6b6}.side-bottom{color:#a899b4;border-color:var(--line)}.side-bottom p{font-size:11px}.eyebrow{color:#ab98bd;letter-spacing:1.8px;font-size:10px}.step-heading h1{font-weight:500;font-size:28px}.step-heading>p{color:#b5aabe;font-size:14px}.optional{background:#2c223b;color:#c4aee0}.content,.window-content{background:transparent}.helper-label,.helper,.hint,.secret-note{color:#a398b0;font-size:11px}.text-link{color:#c9b1e5}.label,.field label{color:#d1c3dd;font-size:14px}.input,input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{background:#0e0e17;border-color:#50415d;color:#e1d7eb;font-size:14px}.input:focus,input:focus,select:focus,textarea:focus{border-color:#bea3e0;box-shadow:0 0 0 3px #a78bfa14}.input::placeholder,textarea::placeholder{color:#9b8daa}.btn{font-size:14px;min-height:40px}.btn.primary{background:linear-gradient(110deg,#a9c9ec,#bca7df,#d3a3bd);color:#211627;border-color:transparent;box-shadow:0 0 22px #a78bfa12}.btn.primary:hover{background:linear-gradient(110deg,#bad8f6,#cdb8ef,#e3b6d0)}.btn.secondary,.btn.ghost{background:#1a1623;border-color:#544460;color:#d6c4e8}.window-footer{background:#100f18;border-color:var(--line)}.footer-note{color:#b4a6c0;font-size:11px}.footer-note svg{color:#b4a6c0}.design-caption{color:#a99bb4;font-size:10px}.design-caption i{background:#614a6b}
.welcome-copy h1{font-size:39px;line-height:1.45;letter-spacing:1px}.welcome-copy h1 em{background:linear-gradient(105deg,#91c9ed,#c7ace9,#efa9cc);background-clip:text;-webkit-background-clip:text;color:transparent}.welcome-lead{font-size:14px;color:#b9afc4}.value-list{gap:15px}.value-item>svg{color:#c0a7d6}.value-item strong{font-size:14px;color:#e0d5e9}.value-item p{font-size:11px;color:#a89ab5}.welcome-settings summary{font-size:11px;color:#a79bb4}.welcome-settings .hint{font-size:11px}.welcome-art{background:radial-gradient(ellipse at 85% 0%,#54406940,transparent 65%),linear-gradient(130deg,#211729,#121622);border-color:#b39ac32a}.art-top{color:#bda7cb;font-size:10px}.welcome-art h2{color:#dbc6e8;font-size:26px}.example-window{background:#14121e;border-color:#9b7cad33;box-shadow:0 12px 35px #0004}.example-title{color:#a99bb7;font-size:10px;border-color:var(--line)}.example-avatar{background:#413046;color:#dfc6ed}.example-bubble{background:#202430;color:#cfc9dc;font-size:11px}.mine .example-bubble{background:#423047;color:#e4d2e8}.example-task{border-color:#735b804d;color:#c2add2;font-size:10px}.art-foot{color:#b39cc4;font-size:10px}.info-box{background:#232130;color:#b8a8c6;border-color:var(--line)}.info-box strong{color:#dbd0e6}.info-box.success{background:#1d2d28;color:#a7c6b7}.info-box.warning{background:#30271d;color:#e0c39b}.info-box.error{background:#352127;color:#f1b7bd}.info-box.error .text-link{color:#fac7ca}.inline-error{font-size:12px;color:#f4b9bf}
.choice-card{background:#15121f;border-color:#5c48684f}.choice-card.selected{background:#292034;border-color:#b69aca;box-shadow:0 0 0 1px #b69aca15}.choice-top h2,.channel-card .choice-top h2,.persona-grid .choice-top h2{font-size:14px;color:#e5d9ee}.choice-card p,.channel-card p{font-size:12px;color:#b5a5c1}.choice-card .choice-sub,.channel-card .choice-sub{font-size:11px;color:#aa9ab8}.radio-mark{background:#100f17;border-color:#786086}.selected .radio-mark{border-color:#cab0e5}.choice-icon{background:#3b294a;color:#d2b2ec}.badge{background:#45324e;color:#dfc2ee;font-size:10px}.choice-card .success-line{border-color:#70558343;color:#a7c6b7;font-size:11px}.platform-logo{background:#f3eff8;border-color:#c2b1cf}.connection-preview{background:#23212d}.connection-preview .number-stamp{color:#b399c8;border-color:#796085}.connection-preview h3{font-size:13px;color:#dfd0eb}.connection-preview p{font-size:11px;color:#b4a4c2}.advanced summary{color:#c3b2d2;font-size:12px}.skip-option{color:#b6a6c4;font-size:12px}.persona-example{color:#d2b5dd;border-color:#6d557b3b;font-size:12px}.mode-pill{background:#171320;border-color:#644a72;color:#c8b4d8;font-size:12px}.mode-pill.selected{background:#3c2c4b;border-color:#b69aca;color:#e1c9f6}.subsection-title{font-size:14px}.upload-box{background:#1b1525;border-color:#80638e;color:#c0abd0}.upload-box p{font-size:12px}.face-aside{background:linear-gradient(145deg,#30233c,#171724);color:#c7b2d6}.face-aside p{font-size:12px}.summary-table{background:#15131f}.summary-row{border-color:var(--line);font-size:13px}.summary-row>span{color:#b5a2c1}.summary-row .text-link{font-size:12px}.check-row{color:#bbabca;font-size:13px}.install-status,.install-card,.log-box,.log-preview,.complete-card{background:#181521;border-color:#69507645}.progress-track{background:#37293f}.progress-fill{background:linear-gradient(90deg,#85bee8,#bda3e1,#e2a4cb)}.install-step{color:#baacc8}.install-step.done{color:#a6c8b9}.qr-placeholder{background:#f5f1f7;color:#35263e}.success-symbol,.complete-check{background:#21312c;color:#a9d0bc}.console-sidebar{background:#15111e;border-color:var(--line)}.console-nav a,.console-nav button{color:#b5a4c5}.console-nav .active{background:#34273f;color:#e0c9f1}.console-heading h1{font-size:30px}.console-heading p{font-size:13px;color:#b5a5c1}.runtime-label{color:#a1cbb8;font-size:11px}.runtime-label.stopped{color:#d9b88c}.console-hero{background:linear-gradient(120deg,#2d2038,#18202d);border-color:#71597f45}.console-hero h2{font-size:20px;color:#e0d2ec}.console-hero p{font-size:13px;color:#bbaac7}.status-card{background:#171320;border-color:#5c466944}.status-card strong{font-size:15px;color:#e0d2ec}.status-card p,.status-label{color:#bba8c9;font-size:11px}.console-bottom{color:#b4a0c2;font-size:11px}.console-footer{color:#a38daf;border-color:var(--line)}dialog{background:#181320;color:#e1d3ec;border:1px solid #8c6fa04d;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#05050caa;backdrop-filter:blur(5px)}.dialog-close{color:#c7b1d6}.toast{background:#dac7e9;color:#251d2d;border-color:#e7d8f0}.scenario-control,.scenario-select{background:#15111e;color:#c5b2d3;border-color:#60496e}
.step-footer{background:#100f18;border-color:var(--line)}.footer-left{color:#b4a6c0;font-size:12px}.completion-options{color:#c2b4ce;font-size:12px}.install-log{background:#0f0e18;color:#b7a8c6;font-size:12px}.install-stage{color:#c4b6d0;font-size:14px}.install-stage p{color:#b1a1be;font-size:12px}.install-stage.done{color:#a6c8b9}.install-stage.done .stage-status{background:#21312c;border-color:#34473f}.pair-panel{background:#1d1827;border-color:#695076}.pair-panel h3{font-size:14px}.pair-panel p{color:#beaccd;font-size:12px}.completion-icon{background:#21312c;border-color:#34473f;color:#a9d0bc}.check-results span{color:#a9c9ba;font-size:12px}.first-message{background:#211a2c;border-color:#695076}.first-message-top p{color:#baa8c9;font-size:12px}.copy-message{background:#15111e;border-color:#60496e;color:#d4c4df;font-size:13px}.agent-badge{background:#1b1525;border-color:#60496e}.agent-badge strong{font-size:14px}.agent-badge small{color:#b3a1c1;font-size:11px}.settings-list{background:#15121f}.setting-row{font-size:14px}.setting-row p{color:#b5a4c4;font-size:12px}
.start-instructions{color:#c3b3d0;font-size:14px}.after-install{color:#b7a8c6;font-size:12px}.step-footer .btn,.pair-panel .btn{font-size:14px}.btn.quiet{color:#c0afce}
@media(max-width:1000px){.welcome-copy h1{font-size:33px}.welcome-lead{font-size:13px}.value-item strong{font-size:13px}.welcome-layout{gap:25px}.welcome-art{padding:20px 17px}.layout{grid-template-columns:175px minmax(0,1fr)}.welcome-art h2{font-size:23px}.choice-card p{font-size:11px}.step-heading>p{font-size:13px}}
@media(max-width:650px){.preview-bar{font-size:10px}.preview-bar>span:first-child{white-space:nowrap}.preview-bar nav a{font-size:10px}.layout{display:flex;flex-direction:column}.setup-sidebar{border-bottom:1px solid var(--line)}.step-list li{font-size:10px}.welcome-copy h1{font-size:35px}.welcome-lead{font-size:13px}.step-heading h1{font-size:25px}.btn{font-size:13px}.welcome-art{margin-top:6px}.window-title>span{font-size:10px}.value-item strong{font-size:13px}.value-item p{font-size:11px}.preview-note{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Shared reference palette: neutral surfaces, bone controls, iridescent light. */
:root { --bg: var(--void); --paper: var(--surface); --white: #101017; --ink: var(--bone); --muted: var(--mute); --line: rgba(236,232,225,.11); --plum: var(--bone); --pale: rgba(236,232,225,.06); --sage: var(--teal); }
body { background: var(--void); }
.preview-bar { background: transparent; color: var(--mute); border-color: var(--line); }
.preview-bar b, .preview-bar a.active { color: var(--bone); }
.preview-bar a.active:after { background: var(--rainbow); }
.installer { background: var(--surface); border-color: var(--line-strong); box-shadow: 0 24px 100px #0005; }
.installer:before { background: var(--rainbow); opacity: .35; }
.window-header, .step-footer { background: rgba(4,4,8,.72); border-color: var(--line); }
.setup-sidebar { background: rgba(236,232,225,.018); border-color: var(--line); }
.wordmark, .step-list .current, .label, .field label, .text-link { color: var(--bone); }
.mark circle { fill: var(--blue); }
.mark path { stroke: var(--bone); }
.side-title, .eyebrow, .window-title>span, .header-actions .text-link, .side-bottom p, .design-caption { color: var(--mute); }
.step-list li { color: var(--mute); }
.step-number { background: var(--surface); color: var(--mute); border-color: var(--line-strong); }
.step-list li:not(:last-child):after { background: var(--line-strong); }
.step-list .current .step-number { background: var(--bone); border-color: var(--bone); color: var(--void); box-shadow: 0 0 0 4px #ece8e110; }
.step-list .done { color: var(--teal); }
.step-list .done .step-number { color: var(--teal); background: #5fe6c00c; border-color: #5fe6c02d; }
.step-heading h1, .welcome-copy h1, .welcome-art h2, .console-heading h1 { font-family: var(--sans); font-weight: 200; }
.welcome-copy h1 { font-size: 39px; }
.welcome-copy h1 em { background: none; color: var(--bone); }
.welcome-lead, .step-heading>p, .value-item p, .value-item>svg { color: var(--mute); }
.value-item strong, .welcome-art h2, .console-heading h1 { color: var(--bone); }
.input, input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea { background: rgba(4,4,8,.8); color: var(--bone); border-color: var(--line-strong); }
.input::placeholder, textarea::placeholder { color: var(--dim); }
.input:focus, input:focus, select:focus, textarea:focus { border-color: var(--bone); box-shadow: 0 0 0 3px #ece8e10a; }
.btn { border-radius: 999px; transition: background .4s, box-shadow .5s, border-color .4s; }
.btn.primary { background: var(--bone); color: #07070b; box-shadow: none; }
.btn.primary:hover { background: var(--bone); box-shadow: 0 10px 38px -8px #a78bfa66, 0 0 48px -8px #ff6b9d40; }
.btn svg { transition: transform .5s var(--ease); }
.btn:hover svg { transform: translateX(3px); }
.btn.secondary, .btn.ghost { background: rgba(236,232,225,.025); color: var(--bone); border-color: var(--line-strong); }
.btn.secondary:hover, .btn.ghost:hover { background: rgba(236,232,225,.08); }
.btn.quiet, .footer-left, .completion-options, .console-footer { color: var(--mute); }
.welcome-art { background: radial-gradient(ellipse at 75% 95%, #ff6b9d0f, transparent 60%), radial-gradient(ellipse at 20% 15%, #a78bfa13, transparent 70%); border-color: var(--line); }
.art-top, .art-foot, .example-title { color: var(--mute); }
.example-window, .example-bubble, .example-task { background: rgba(4,4,8,.4); border-color: var(--line); color: var(--bone); }
.mine .example-bubble { background: rgba(236,232,225,.07); color: var(--bone); }
.example-avatar { background: rgba(236,232,225,.08); color: var(--bone); }
.choice-card, .summary-table, .settings-list, .status-card, .agent-badge { background: rgba(236,232,225,.025); border-color: var(--line); }
.settings-list { background: var(--white); }
.choice-card.selected { background: rgba(236,232,225,.06); border-color: rgba(236,232,225,.48); box-shadow: none; }
.choice-top h2, .channel-card .choice-top h2, .persona-grid .choice-top h2, .status-card strong, .agent-badge strong { color: var(--bone); }
.choice-card p, .channel-card p, .choice-card .choice-sub, .channel-card .choice-sub, .agent-badge small { color: var(--mute); }
.radio-mark { background: transparent; border-color: var(--line-strong); }
.selected .radio-mark { border-color: var(--bone); }
.choice-icon, .badge, .optional { background: rgba(236,232,225,.06); color: var(--bone); border-color: var(--line-strong); }
.choice-card .success-line { color: var(--teal); border-color: var(--line); }
.info-box, .connection-preview, .face-aside, .upload-box { background: rgba(236,232,225,.035); border-color: var(--line-strong); color: var(--mute); }
.info-box strong, .connection-preview h3, .face-aside, .upload-box { color: var(--bone); }
.connection-preview p, .helper-label, .hint, .secret-note { color: var(--mute); }
.info-box.success { color: var(--teal); background: #5fe6c00d; }
.info-box.warning { color: var(--gold); background: #ffcf8a0d; }
.info-box.error { color: #ffb9cc; background: #ff6b9d0d; }
.inline-error, .info-box.error .text-link { color: #ffb9cc; }
.persona-example, .summary-row>span, .setting-row p, .check-row { color: var(--mute); border-color: var(--line); }
.mode-pill { color: var(--mute); background: transparent; border-color: var(--line-strong); }
.mode-pill.selected { color: var(--bone); background: rgba(236,232,225,.06); border-color: var(--bone); }
.install-log, .first-message, .copy-message, .pair-panel { background: rgba(4,4,8,.36); color: var(--bone); border-color: var(--line-strong); }
.install-stage p, .pair-panel p, .first-message-top p, .after-install { color: var(--mute); }
.start-instructions { color: rgba(236,232,225,.78); }
.install-stage.done, .check-results span { color: var(--teal); }
.install-stage.done .stage-status, .completion-icon { background: #5fe6c00d; color: var(--teal); border-color: #5fe6c02d; }
.progress-track { background: rgba(236,232,225,.08); }
.progress-fill { background: var(--rainbow); }
.console-nav a, .status-card p, .status-label, .console-heading p { color: var(--mute); }
.console-nav .active { background: rgba(236,232,225,.06); color: var(--bone); }
.console-hero { background: radial-gradient(ellipse at 80% 100%, #ff6b9d0d, transparent 70%); border-color: var(--line); }
.console-hero h2, .console-hero p { color: var(--bone); }
.runtime-label { color: var(--teal); }
.runtime-label.stopped { color: var(--gold); }
dialog { background: var(--surface); color: var(--bone); border-color: var(--line-strong); }
.toast { color: var(--void); background: var(--bone); border-color: var(--line); }
@media (max-width:650px) { .welcome-copy h1 { font-size: 35px; } .layout { display: flex; flex-direction: column; } }

/* The installer keeps the same purple light as the story pages. */
:root { --plum: var(--violet); --white: #171020; --pale: #a78bfa14; }
body { background: radial-gradient(ellipse at 72% 46%,#291537,#140c22 48%,#06050c 100%); }
.installer-field { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.installer-field .atmosphere-plane { background: radial-gradient(ellipse 56% 65% at 72% 52%,#7346874d,#32204a2b 65%,transparent 100%); }
#app { position: relative; z-index: 1; }
.preview-bar { position: relative; z-index: 2; background: #09071080; }
.installer { background: #0e0915bf; border-color: #a78bfa45; box-shadow: 0 28px 100px #0008,0 0 110px -30px #a78bfa38; }
.window-header, .step-footer { background: #0f0919b3; border-color: #a78bfa24; }
.setup-content { background: linear-gradient(130deg,#1d112a66,#0d0a1680); }
.setup-sidebar { background: linear-gradient(180deg,#28173380,#120c2280); border-color: #a78bfa24; }
.step-list .current { color: #d7c7f4; }
.step-list .current .step-number { color: var(--void); background: #c4abea; border-color: var(--violet); box-shadow: 0 0 0 4px #a78bfa18,0 0 22px #a78bfa33; }
.step-number { background: #1b1027; border-color: #a78bfa38; }
.step-list li:not(:last-child):after { background: linear-gradient(#a78bfa55,#a78bfa15); }
.mark path { stroke: #c4abea; }
.side-bottom { border-color: #a78bfa24; }
.eyebrow, .side-title { color: #b8a1d6; }
.input, input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea { background: #0f0a18b3; border-color: #a78bfa40; }
.input:focus, input:focus, select:focus, textarea:focus { border-color: var(--violet); box-shadow: 0 0 0 3px #a78bfa14; }
.welcome-art { background: radial-gradient(ellipse at 70% 20%,#a78bfa2b,transparent 75%),linear-gradient(140deg,#38204490,#171125b3); border-color: #a78bfa3d; box-shadow: 0 0 65px -22px #a78bfa40; }
.welcome-copy h1 em { background: linear-gradient(100deg,#ece8e1,#ccb7f2 55%,#f1c3db); color: transparent; background-clip: text; -webkit-background-clip: text; }
.example-window { background: #100b1abf; border-color: #a78bfa35; box-shadow: 0 12px 40px #08040e55; }
.mine .example-bubble { background: #a78bfa21; }
.example-avatar, .choice-icon, .badge, .optional { color: #d2bcf5; background: #a78bfa1c; }
.choice-card, .summary-table, .settings-list, .status-card, .agent-badge { background: linear-gradient(135deg,#251730a6,#140e2199); border-color: #a78bfa29; }
.choice-card { transition: border-color .35s, box-shadow .4s, background .35s; }
.choice-card:hover { border-color: #a78bfa77; box-shadow: 0 0 30px #a78bfa0e; }
.choice-card.selected { background: linear-gradient(130deg,#a78bfa26,#45254766); border-color: var(--violet); box-shadow: 0 0 0 1px #a78bfa18,0 0 30px #a78bfa13; }
.selected .radio-mark { border-color: var(--violet); }
.mode-pill.selected { background: #a78bfa1f; color: #d8c5f7; border-color: #a78bfa99; }
.info-box:not(.success):not(.warning):not(.error), .connection-preview, .face-aside, .upload-box { background: #a78bfa0e; border-color: #a78bfa38; }
.console-nav .active { background: #a78bfa1c; color: #dccbf7; box-shadow: inset 2px 0 0 var(--violet); }
.console-hero { background: radial-gradient(ellipse at 80% 35%,#a78bfa26,transparent 80%),linear-gradient(130deg,#33203e80,#1b102a80); border-color: #a78bfa40; }
.choice-icon svg, .value-item>svg, .art-foot svg { color: #c4abea; }
.btn.primary { box-shadow: 0 0 35px -16px #a78bfa80; }
.btn.secondary, .btn.ghost { border-color: #a78bfa45; background: #a78bfa0a; }
.btn.secondary:hover, .btn.ghost:hover { border-color: var(--violet); background: #a78bfa1c; }
.text-link:hover { color: #ccb6f4; }
.step-enter { animation: step-arrive .6s var(--ease) both; }
@keyframes step-arrive { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion:reduce) { .step-enter { animation: none; } }