:root{--bg:#f8f9f5;--paper:#fff;--ink:#213b33;--muted:#718077;--line:#e0e7dd;--green:#315e48;--soft:#edf2e8;--gold:#bf8855}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,textarea,select{font:inherit}
button,a{touch-action:manipulation}
button{border:1px solid var(--line);background:white;color:var(--ink);padding:9px 16px;border-radius:8px;cursor:pointer}
button:hover{background:var(--soft)}
button:disabled{cursor:wait;opacity:.55}
button.primary{background:var(--green);color:white;border-color:var(--green)}
button.primary:hover{background:#244b38}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.3;letter-spacing:-.035em}
h1{font-size:36px}
h2{font-size:30px}
h3{font-size:18px}
.topbar{max-width:1440px;margin:auto;height:92px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:-.8px}
.brand-mark{display:grid;place-items:center;width:33px;height:36px;background:var(--green);border-radius:14px 14px 7px 7px;color:white;font-family:serif}
.brand-cn{font-size:13px;font-weight:400;color:var(--muted);margin-left:8px}
.topbar nav{display:flex;gap:28px;align-items:center;font-size:13px}
.hero{max-width:1240px;margin:auto;padding:88px 32px 100px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.eyebrow{font-size:11px;font-weight:650;letter-spacing:2px;color:var(--muted);margin-bottom:22px}
.hero h1{font-size:clamp(40px,4.2vw,62px);line-height:1.23;font-weight:600;margin-bottom:26px}
.hero em{font-style:normal;color:var(--green)}
.lead{font-size:17px;color:var(--muted);line-height:1.9}
.hero-actions{display:flex;gap:24px;align-items:center;margin:30px 0 18px}
.large{padding:14px 22px}
.fine{font-size:12px;color:var(--muted);line-height:1.7}
.tree-preview{background:#edf2e8;border:1px solid #dde5d6;border-radius:20px;padding:28px 24px 20px;min-height:410px}
.preview-top{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);gap:8px}
.small-pill{display:inline-block;padding:3px 9px;background:var(--soft);border:1px solid var(--line);border-radius:20px;font-size:11px;white-space:nowrap}
.sample-root{margin:38px auto 0;text-align:center;background:var(--green);color:white;border-radius:10px;padding:16px;font-size:18px;max-width:280px}
.sample-root span{display:block;font-size:11px;opacity:.75;margin-top:6px}
.sample-branches{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-top:32px;position:relative}
.sample-branches:before{content:"";position:absolute;top:0;left:25%;width:50%;height:30px;border-bottom:1px solid #b9c9af;background:linear-gradient(#b9c9af,#b9c9af) center/1px 100% no-repeat}
.sample-node{background:var(--paper);padding:14px;border:1px solid #dce6d5;border-radius:10px;font-size:14px}
.sample-node small{display:block;color:var(--gold);font-size:10px;letter-spacing:1px;margin-bottom:8px}
.sample-node div{font-size:11px;color:var(--muted);border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
.sample-node div.sample-done{color:var(--green)}
.preview-bottom{margin-top:28px;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:8px}
.dot{background:var(--green);width:6px;height:6px;border-radius:50%}
.section{max-width:1176px;margin:auto;border-top:1px solid var(--line);padding:58px 0}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:38px}
.features article span{font-size:12px;color:var(--gold)}
.features h3{margin:12px 0}
.features p,.platforms p{color:var(--muted);font-size:14px}
.platforms{max-width:1176px;margin:10px auto 60px;display:grid;grid-template-columns:1fr 1fr;gap:60px;background:var(--soft);border-radius:16px;padding:48px}
.platforms h3{margin-bottom:8px}
footer{max-width:1176px;margin:auto;padding:25px 0;border-top:1px solid var(--line);color:var(--muted);font-size:12px;display:flex;justify-content:space-between}
.auth-card{max-width:440px;margin:70px auto;padding:32px;background:white;border:1px solid var(--line);border-radius:16px}
.auth-card h1{font-size:28px}
.auth-card>p{color:var(--muted)}
label{display:block;margin:15px 0;font-size:12px;color:var(--muted)}
input,textarea,select{display:block;width:100%;background:white;border:1px solid #ced8cb;border-radius:7px;padding:10px 12px;margin-top:6px;color:var(--ink)}
textarea{resize:vertical}
input:focus,textarea:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid #76967d;outline-offset:3px}
.full{width:100%}
.text-button{border:none;background:transparent;padding:8px 0;font-size:12px;color:var(--green)}
#auth-toggle{margin:14px 0}
#notice{position:sticky;top:0;z-index:5;padding:12px 5%;background:#fff0da;color:#714623;border-bottom:1px solid #e7cfaa;white-space:pre-wrap}
.workspace-heading{max-width:1500px;margin:auto;padding:34px 32px 20px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.workspace-heading h1{font-size:27px;margin:0 0 8px}
.workspace-heading .eyebrow{margin-bottom:10px}
.workspace-heading p:last-child{font-size:12px;color:var(--muted);margin:0}
.workspace-heading>div:last-child{display:flex;align-items:center;gap:10px}
.workspace-grid{display:grid;grid-template-columns:220px minmax(320px,1fr) 340px;max-width:1500px;margin:auto;padding:0 32px 40px;gap:20px}
.goals-pane,.tasks-pane,.chat-pane{background:white;border:1px solid var(--line);border-radius:12px;min-width:0;padding:20px}
.pane-title{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:18px}
.pane-title h2,.pane-title h3{font-size:15px;margin:0}
.pane-title>span{font-size:11px;color:var(--muted)}
.goal{display:block;text-align:left;width:100%;margin:8px 0;padding:13px 12px;border-color:transparent;overflow-wrap:anywhere}
.goal small{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.goal.selected{background:var(--soft);border-color:var(--line)}
.sidebar-note{border-top:1px solid var(--line);margin-top:30px;padding-top:18px;font-size:11px;color:var(--muted)}
#tasks{max-height:360px;overflow:auto}
ul.tree{list-style:none;margin:0;padding-left:18px;border-left:1px solid var(--line)}
#tasks>ul.tree{padding-left:0;border:0}
.task-row{display:flex;align-items:center;gap:8px;margin:5px 0}
.task-row button{width:100%;text-align:left;border-color:transparent;padding:8px;overflow-wrap:anywhere}
.task-row button.selected{background:var(--soft);border-color:var(--line)}
.task-row small{color:var(--muted);font-size:10px;margin-right:8px}
.empty{padding:36px 12px;color:var(--muted);text-align:center;font-size:13px}
.editor-title{display:flex;justify-content:space-between;align-items:center;gap:10px}
.editor-title h3{font-size:14px;margin:0}
#editor{margin-top:25px;padding-top:20px;border-top:1px solid var(--line)}
.editor-grid{display:grid;grid-template-columns:110px 1fr;gap:15px}
.editor-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.danger{color:#a04735;border:0;font-size:12px}
.chat-pane{background:#f3f6ee}
#messages{max-height:300px;overflow:auto;margin:16px 0}
.message{padding:12px;background:white;border:1px solid var(--line);border-radius:8px;margin-bottom:10px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}
.message.user{background:#e6eedd}
.message small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
#chat-form textarea{font-size:13px}
#chat-form button{margin-top:9px}
#proposal{border-top:1px solid var(--line);padding-top:20px;margin-top:20px}
#proposal-tree{max-height:350px;overflow:auto;margin-bottom:15px;font-size:12px}
#proposal-tree li{margin:8px 0}
#proposal-tree p{font-size:11px;color:var(--muted);white-space:pre-wrap}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
dialog{border:1px solid var(--line);border-radius:14px;padding:30px;width:min(440px,90vw);color:var(--ink)}
dialog::backdrop{background:#20352b66}
[hidden]{display:none!important}
@media(min-width:1500px){.hero{padding-top:110px;padding-bottom:120px}
}
@media(max-width:1100px){.workspace-grid{grid-template-columns:180px minmax(280px,1fr)}
.chat-pane{grid-column:1/-1}
.section,footer{margin-left:32px;margin-right:32px}
.platforms{margin:20px 32px 50px}
.hero{gap:32px}
.sample-branches{gap:10px}
}
@media(max-width:700px){.topbar{height:74px;padding:0 20px}
.brand-cn,.topbar nav>a{display:none}
.topbar nav{gap:8px}
.hero{grid-template-columns:1fr;padding:48px 24px}
.hero h1{font-size:44px}
.hero-actions{gap:14px;font-size:13px}
.features{grid-template-columns:1fr;gap:20px}
.section{padding:38px 0}
.platforms{grid-template-columns:1fr;gap:18px;padding:28px;margin:10px 24px 40px}
.section,footer{margin-left:24px;margin-right:24px}
.workspace-heading{padding:24px 18px;align-items:flex-start;flex-direction:column}
.workspace-heading h1{font-size:24px}
.workspace-grid{display:flex;flex-direction:column;padding:0 18px 30px}
.goals-pane{padding:16px}
#goals{display:flex;gap:8px;overflow:auto}
.goal{min-width:160px;max-width:220px;margin:0}
.sidebar-note{margin-top:14px;padding-top:12px}
.auth-card{margin:40px 20px}
.editor-grid{grid-template-columns:1fr}
.hero-copy .fine{font-size:11px}
footer{gap:15px}
.tree-preview{padding:20px 15px}
}


#credits-dialog{width:min(640px,90vw);max-height:85vh;overflow:auto}
.credit-entry{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:14px 0;border-bottom:1px solid #e5e7eb}
.credit-entry small{width:100%;overflow-wrap:anywhere;color:#6b7280}


/* Optional vivid palette. Classic above matches 6531a87. */
html[data-palette="vivid"]{--bg:#f7f8ff;--paper:#fff;--ink:#17213a;--muted:#606b82;--line:#dce1f2;--green:#5546e8;--soft:#eeebff;--gold:#a34b00}
html[data-palette="vivid"] *{box-sizing:border-box}
html[data-palette="vivid"]{scroll-behavior:smooth}
html[data-palette="vivid"] body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
html[data-palette="vivid"] button,html[data-palette="vivid"] input,html[data-palette="vivid"] textarea,html[data-palette="vivid"] select{font:inherit}
html[data-palette="vivid"] button,html[data-palette="vivid"] a{touch-action:manipulation}
html[data-palette="vivid"] button{border:1px solid var(--line);background:white;color:var(--ink);padding:9px 16px;border-radius:8px;cursor:pointer}
html[data-palette="vivid"] button:hover{background:var(--soft)}
html[data-palette="vivid"] button:disabled{cursor:wait;opacity:.55}
html[data-palette="vivid"] button.primary{background:var(--green);color:white;border-color:var(--green)}
html[data-palette="vivid"] button.primary:hover{background:#4031cd}
html[data-palette="vivid"] a{color:inherit;text-decoration:none}
html[data-palette="vivid"] a:hover{text-decoration:underline}
html[data-palette="vivid"] h1,html[data-palette="vivid"] h2,html[data-palette="vivid"] h3,html[data-palette="vivid"] p{margin-top:0}
html[data-palette="vivid"] h1,html[data-palette="vivid"] h2,html[data-palette="vivid"] h3{line-height:1.3;letter-spacing:-.035em}
html[data-palette="vivid"] h1{font-size:36px}
html[data-palette="vivid"] h2{font-size:30px}
html[data-palette="vivid"] h3{font-size:18px}
html[data-palette="vivid"] .topbar{max-width:1440px;margin:auto;height:92px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
html[data-palette="vivid"] .brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:-.8px}
html[data-palette="vivid"] .brand-mark{display:grid;place-items:center;width:33px;height:36px;background:var(--green);border-radius:14px 14px 7px 7px;color:white;font-family:serif}
html[data-palette="vivid"] .brand-cn{font-size:13px;font-weight:400;color:var(--muted);margin-left:8px}
html[data-palette="vivid"] .topbar nav{display:flex;gap:28px;align-items:center;font-size:13px}
html[data-palette="vivid"] .hero{max-width:1240px;margin:auto;padding:88px 32px 100px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
html[data-palette="vivid"] .eyebrow{font-size:11px;font-weight:650;letter-spacing:2px;color:var(--muted);margin-bottom:22px}
html[data-palette="vivid"] .hero h1{font-size:clamp(40px,4.2vw,62px);line-height:1.23;font-weight:600;margin-bottom:26px}
html[data-palette="vivid"] .hero em{font-style:normal;color:var(--green)}
html[data-palette="vivid"] .lead{font-size:17px;color:var(--muted);line-height:1.9}
html[data-palette="vivid"] .hero-actions{display:flex;gap:24px;align-items:center;margin:30px 0 18px}
html[data-palette="vivid"] .large{padding:14px 22px}
html[data-palette="vivid"] .fine{font-size:12px;color:var(--muted);line-height:1.7}
html[data-palette="vivid"] .tree-preview{background:#eef3ff;border:1px solid #cedbff;border-radius:20px;padding:28px 24px 20px;min-height:410px}
html[data-palette="vivid"] .preview-top{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);gap:8px}
html[data-palette="vivid"] .small-pill{display:inline-block;padding:3px 9px;background:var(--soft);border:1px solid var(--line);border-radius:20px;font-size:11px;white-space:nowrap}
html[data-palette="vivid"] .sample-root{margin:38px auto 0;text-align:center;background:var(--green);color:white;border-radius:10px;padding:16px;font-size:18px;max-width:280px}
html[data-palette="vivid"] .sample-root span{display:block;font-size:11px;opacity:.75;margin-top:6px}
html[data-palette="vivid"] .sample-branches{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-top:32px;position:relative}
html[data-palette="vivid"] .sample-branches:before{content:"";position:absolute;top:0;left:25%;width:50%;height:30px;border-bottom:1px solid #8a78ee;background:linear-gradient(#8a78ee,#8a78ee) center/1px 100% no-repeat}
html[data-palette="vivid"] .sample-node{background:var(--paper);padding:14px;border:1px solid #d6dffa;border-radius:10px;font-size:14px}
html[data-palette="vivid"] .sample-node small{display:block;color:var(--gold);font-size:10px;letter-spacing:1px;margin-bottom:8px}
html[data-palette="vivid"] .sample-node div{font-size:11px;color:var(--muted);border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
html[data-palette="vivid"] .sample-node div.sample-done{color:var(--green)}
html[data-palette="vivid"] .preview-bottom{margin-top:28px;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:8px}
html[data-palette="vivid"] .dot{background:var(--green);width:6px;height:6px;border-radius:50%}
html[data-palette="vivid"] .section{max-width:1176px;margin:auto;border-top:1px solid var(--line);padding:58px 0}
html[data-palette="vivid"] .features{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:38px}
html[data-palette="vivid"] .features article span{font-size:12px;color:var(--gold)}
html[data-palette="vivid"] .features h3{margin:12px 0}
html[data-palette="vivid"] .features p,html[data-palette="vivid"] .platforms p{color:var(--muted);font-size:14px}
html[data-palette="vivid"] .platforms{max-width:1176px;margin:10px auto 60px;display:grid;grid-template-columns:1fr 1fr;gap:60px;background:var(--soft);border-radius:16px;padding:48px}
html[data-palette="vivid"] .platforms h3{margin-bottom:8px}
html[data-palette="vivid"] footer{max-width:1176px;margin:auto;padding:25px 0;border-top:1px solid var(--line);color:var(--muted);font-size:12px;display:flex;justify-content:space-between}
html[data-palette="vivid"] .auth-card{max-width:440px;margin:70px auto;padding:32px;background:white;border:1px solid var(--line);border-radius:16px}
html[data-palette="vivid"] .auth-card h1{font-size:28px}
html[data-palette="vivid"] .auth-card>p{color:var(--muted)}
html[data-palette="vivid"] label{display:block;margin:15px 0;font-size:12px;color:var(--muted)}
html[data-palette="vivid"] input,html[data-palette="vivid"] textarea,html[data-palette="vivid"] select{display:block;width:100%;background:white;border:1px solid #cbd3e8;border-radius:7px;padding:10px 12px;margin-top:6px;color:var(--ink)}
html[data-palette="vivid"] textarea{resize:vertical}
html[data-palette="vivid"] input:focus,html[data-palette="vivid"] textarea:focus,html[data-palette="vivid"] select:focus,html[data-palette="vivid"] button:focus-visible,html[data-palette="vivid"] a:focus-visible{outline:2px solid #5546e8;outline-offset:3px}
html[data-palette="vivid"] .full{width:100%}
html[data-palette="vivid"] .text-button{border:none;background:transparent;padding:8px 0;font-size:12px;color:var(--green)}
html[data-palette="vivid"] #auth-toggle{margin:14px 0}
html[data-palette="vivid"] #notice{position:sticky;top:0;z-index:5;padding:12px 5%;background:#fff0da;color:#714623;border-bottom:1px solid #e7cfaa;white-space:pre-wrap}
html[data-palette="vivid"] .workspace-heading{max-width:1500px;margin:auto;padding:34px 32px 20px;display:flex;align-items:center;justify-content:space-between;gap:20px}
html[data-palette="vivid"] .workspace-heading h1{font-size:27px;margin:0 0 8px}
html[data-palette="vivid"] .workspace-heading .eyebrow{margin-bottom:10px}
html[data-palette="vivid"] .workspace-heading p:last-child{font-size:12px;color:var(--muted);margin:0}
html[data-palette="vivid"] .workspace-heading>div:last-child{display:flex;align-items:center;gap:10px}
html[data-palette="vivid"] .workspace-grid{display:grid;grid-template-columns:220px minmax(320px,1fr) 340px;max-width:1500px;margin:auto;padding:0 32px 40px;gap:20px}
html[data-palette="vivid"] .goals-pane,html[data-palette="vivid"] .tasks-pane,html[data-palette="vivid"] .chat-pane{background:white;border:1px solid var(--line);border-radius:12px;min-width:0;padding:20px}
html[data-palette="vivid"] .pane-title{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:18px}
html[data-palette="vivid"] .pane-title h2,html[data-palette="vivid"] .pane-title h3{font-size:15px;margin:0}
html[data-palette="vivid"] .pane-title>span{font-size:11px;color:var(--muted)}
html[data-palette="vivid"] .goal{display:block;text-align:left;width:100%;margin:8px 0;padding:13px 12px;border-color:transparent;overflow-wrap:anywhere}
html[data-palette="vivid"] .goal small{display:block;color:var(--muted);font-size:11px;margin-top:3px}
html[data-palette="vivid"] .goal.selected{background:var(--soft);border-color:var(--line)}
html[data-palette="vivid"] .sidebar-note{border-top:1px solid var(--line);margin-top:30px;padding-top:18px;font-size:11px;color:var(--muted)}
html[data-palette="vivid"] #tasks{max-height:360px;overflow:auto}
html[data-palette="vivid"] ul.tree{list-style:none;margin:0;padding-left:18px;border-left:1px solid var(--line)}
html[data-palette="vivid"] #tasks>ul.tree{padding-left:0;border:0}
html[data-palette="vivid"] .task-row{display:flex;align-items:center;gap:8px;margin:5px 0}
html[data-palette="vivid"] .task-row button{width:100%;text-align:left;border-color:transparent;padding:8px;overflow-wrap:anywhere}
html[data-palette="vivid"] .task-row button.selected{background:var(--soft);border-color:var(--line)}
html[data-palette="vivid"] .task-row small{color:var(--muted);font-size:10px;margin-right:8px}
html[data-palette="vivid"] .empty{padding:36px 12px;color:var(--muted);text-align:center;font-size:13px}
html[data-palette="vivid"] .editor-title{display:flex;justify-content:space-between;align-items:center;gap:10px}
html[data-palette="vivid"] .editor-title h3{font-size:14px;margin:0}
html[data-palette="vivid"] #editor{margin-top:25px;padding-top:20px;border-top:1px solid var(--line)}
html[data-palette="vivid"] .editor-grid{display:grid;grid-template-columns:110px 1fr;gap:15px}
html[data-palette="vivid"] .editor-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
html[data-palette="vivid"] .danger{color:#ba304f;border:0;font-size:12px}
html[data-palette="vivid"] .chat-pane{background:#f0edff}
html[data-palette="vivid"] #messages{max-height:300px;overflow:auto;margin:16px 0}
html[data-palette="vivid"] .message{padding:12px;background:white;border:1px solid var(--line);border-radius:8px;margin-bottom:10px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}
html[data-palette="vivid"] .message.user{background:#e4ddff}
html[data-palette="vivid"] .message small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
html[data-palette="vivid"] #chat-form textarea{font-size:13px}
html[data-palette="vivid"] #chat-form button{margin-top:9px}
html[data-palette="vivid"] #proposal{border-top:1px solid var(--line);padding-top:20px;margin-top:20px}
html[data-palette="vivid"] #proposal-tree{max-height:350px;overflow:auto;margin-bottom:15px;font-size:12px}
html[data-palette="vivid"] #proposal-tree li{margin:8px 0}
html[data-palette="vivid"] #proposal-tree p{font-size:11px;color:var(--muted);white-space:pre-wrap}
html[data-palette="vivid"] .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
html[data-palette="vivid"] dialog{border:1px solid var(--line);border-radius:14px;padding:30px;width:min(440px,90vw);color:var(--ink)}
html[data-palette="vivid"] dialog::backdrop{background:#17213a88}
html[data-palette="vivid"] [hidden]{display:none!important}
@media(min-width:1500px){html[data-palette="vivid"] .hero{padding-top:110px;padding-bottom:120px}
}
@media(max-width:1100px){html[data-palette="vivid"] .workspace-grid{grid-template-columns:180px minmax(280px,1fr)}
html[data-palette="vivid"] .chat-pane{grid-column:1/-1}
html[data-palette="vivid"] .section,html[data-palette="vivid"] footer{margin-left:32px;margin-right:32px}
html[data-palette="vivid"] .platforms{margin:20px 32px 50px}
html[data-palette="vivid"] .hero{gap:32px}
html[data-palette="vivid"] .sample-branches{gap:10px}
}
@media(max-width:700px){html[data-palette="vivid"] .topbar{height:74px;padding:0 20px}
html[data-palette="vivid"] .brand-cn,html[data-palette="vivid"] .topbar nav>a{display:none}
html[data-palette="vivid"] .topbar nav{gap:8px}
html[data-palette="vivid"] .hero{grid-template-columns:1fr;padding:48px 24px}
html[data-palette="vivid"] .hero h1{font-size:44px}
html[data-palette="vivid"] .hero-actions{gap:14px;font-size:13px}
html[data-palette="vivid"] .features{grid-template-columns:1fr;gap:20px}
html[data-palette="vivid"] .section{padding:38px 0}
html[data-palette="vivid"] .platforms{grid-template-columns:1fr;gap:18px;padding:28px;margin:10px 24px 40px}
html[data-palette="vivid"] .section,html[data-palette="vivid"] footer{margin-left:24px;margin-right:24px}
html[data-palette="vivid"] .workspace-heading{padding:24px 18px;align-items:flex-start;flex-direction:column}
html[data-palette="vivid"] .workspace-heading h1{font-size:24px}
html[data-palette="vivid"] .workspace-grid{display:flex;flex-direction:column;padding:0 18px 30px}
html[data-palette="vivid"] .goals-pane{padding:16px}
html[data-palette="vivid"] #goals{display:flex;gap:8px;overflow:auto}
html[data-palette="vivid"] .goal{min-width:160px;max-width:220px;margin:0}
html[data-palette="vivid"] .sidebar-note{margin-top:14px;padding-top:12px}
html[data-palette="vivid"] .auth-card{margin:40px 20px}
html[data-palette="vivid"] .editor-grid{grid-template-columns:1fr}
html[data-palette="vivid"] .hero-copy .fine{font-size:11px}
html[data-palette="vivid"] footer{gap:15px}
html[data-palette="vivid"] .tree-preview{padding:20px 15px}
}
html[data-palette="vivid"] #credits-dialog{width:min(640px,90vw);max-height:85vh;overflow:auto}
html[data-palette="vivid"] .credit-entry{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:14px 0;border-bottom:1px solid #e5e7eb}
html[data-palette="vivid"] .credit-entry small{width:100%;overflow-wrap:anywhere;color:#6b7280}
html[data-palette="vivid"]{--blue:#3987ff;--violet:#a879ff;--teal:#16c9a4;--amber:#ffb326}
html[data-palette="vivid"] button{font-weight:600;transition:background .15s,border-color .15s,box-shadow .15s}
html[data-palette="vivid"] button.primary{box-shadow:0 4px 0 #3528b4}
html[data-palette="vivid"] button.primary:hover{box-shadow:0 2px 0 #3528b4}
html[data-palette="vivid"] button:disabled{box-shadow:none}
html[data-palette="vivid"] .brand-mark{background:linear-gradient(135deg,var(--blue),var(--green));border-radius:9px;box-shadow:3px 3px 0 #dfd8ff}
html[data-palette="vivid"] .hero h1{font-weight:800;letter-spacing:-.045em}
html[data-palette="vivid"] .hero em{color:var(--green)}
html[data-palette="vivid"] .eyebrow{color:var(--green);font-weight:750}
html[data-palette="vivid"] .tree-preview{background:radial-gradient(circle at 100% 0,#e5dcff,transparent 60%),#eef4ff;border:2px solid #c6d5ff;border-radius:14px;box-shadow:8px 8px 0 #dfe6ff}
html[data-palette="vivid"] .preview-top{color:var(--ink);font-weight:600}
html[data-palette="vivid"] .small-pill{color:var(--green);background:var(--soft);font-weight:600}
html[data-palette="vivid"] .sample-root{background:var(--blue);color:white;border:2px solid #2170e6;font-weight:750;box-shadow:4px 4px 0 #bfd5ff;border-radius:8px}
html[data-palette="vivid"] .sample-root span{opacity:1;font-weight:500}
html[data-palette="vivid"] .sample-branches:before{border-bottom-width:3px;background-size:3px 100%}
html[data-palette="vivid"] .sample-node{background:#f0fffa;border:2px solid var(--teal);border-top-width:6px;border-radius:8px;font-weight:650}
html[data-palette="vivid"] .sample-node:nth-child(2){background:#fff8e6;border-color:var(--amber)}
html[data-palette="vivid"] .sample-node small{color:#00785f;font-weight:750}
html[data-palette="vivid"] .sample-node:nth-child(2) small{color:#9a4a00}
html[data-palette="vivid"] .sample-node div{color:var(--ink);font-weight:400}
html[data-palette="vivid"] .sample-node div.sample-done{color:#00785f}
html[data-palette="vivid"] .dot{background:#009777;width:8px;height:8px}
html[data-palette="vivid"] .features{gap:24px}
html[data-palette="vivid"] .features article{padding:24px;background:#eef4ff;border:1px solid #ccdcff;border-top:4px solid var(--blue);border-radius:10px}
html[data-palette="vivid"] .features article:nth-child(2){background:#f2ecff;border-color:#ded0ff;border-top-color:var(--violet)}
html[data-palette="vivid"] .features article:nth-child(3){background:#edfff9;border-color:#b9efdf;border-top-color:var(--teal)}
html[data-palette="vivid"] .features article span{display:inline-grid;place-items:center;width:34px;height:34px;background:var(--blue);color:var(--ink);border-radius:8px;font-weight:800}
html[data-palette="vivid"] .features article:nth-child(2) span{background:var(--violet)}
html[data-palette="vivid"] .features article:nth-child(3) span{background:var(--teal)}
html[data-palette="vivid"] .platforms{background:#eeebff;border:1px solid #d6ccff;border-radius:12px}
html[data-palette="vivid"] .auth-card,html[data-palette="vivid"] dialog{border-top:4px solid var(--green);border-radius:12px;box-shadow:0 16px 48px #34318512}
html[data-palette="vivid"] .goals-pane{border-top:3px solid var(--blue)}
html[data-palette="vivid"] .tasks-pane{border-top:3px solid var(--teal)}
html[data-palette="vivid"] .chat-pane{border-top:3px solid var(--violet)}
html[data-palette="vivid"] .goal.selected,html[data-palette="vivid"] .task-row button.selected{background:var(--soft);color:#4031cd;border-color:#b5a7f8;box-shadow:inset 3px 0 0 var(--green)}
html[data-palette="vivid"] .message.user{border-color:#c2b3ff}
html[data-palette="vivid"] #ai-mode{background:var(--green);color:white;border-color:var(--green)}
@media(max-width:700px){html[data-palette="vivid"] .tree-preview{box-shadow:4px 4px 0 #dfe6ff}
html[data-palette="vivid"] .features article{padding:20px}
html[data-palette="vivid"] .workspace-heading>div:last-child{flex-wrap:wrap}
html[data-palette="vivid"] .hero-actions{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){html[data-palette="vivid"]{scroll-behavior:auto}
html[data-palette="vivid"] button{transition:none}
}

/* Settings are available before and after sign-in. */
#settings-dialog{max-height:85vh;overflow:auto}
#settings-dialog h2{font-size:24px}
.palette-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}
.palette-option{display:flex;align-items:center;gap:8px;padding:12px;border:1px solid var(--line);border-radius:8px;color:var(--ink);cursor:pointer}
.palette-option input{width:auto;margin:0;accent-color:var(--green)}
.palette-swatch{display:block;width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,#72a78d 50%,#c5a565 50%)}
.palette-swatch.vivid{background:linear-gradient(135deg,#3987ff 50%,#a879ff 50%)}
@media(max-width:700px){.topbar .brand{font-size:18px;gap:6px}.topbar nav button{padding:8px 10px}.workspace-heading>div:last-child{flex-wrap:wrap}}

/* Three peer themes: classic, vivid, and dark. */
.palette-choices{grid-template-columns:1fr;gap:4px}
.palette-option{margin:4px 0;font-size:14px}
.palette-option:has(input:checked){border-color:var(--green);background:var(--soft)}
.palette-swatch{flex:0 0 18px}
.palette-swatch.dark{background:linear-gradient(135deg,#222737 50%,#9abfae 50%)}
html[data-palette="dark"]{color-scheme:dark;--bg:#121214;--paper:#1c1c1e;--ink:#f2f2f7;--muted:#aaaab1;--line:#38383d;--green:#9abfae;--soft:#293c34;--gold:#e5b97c}
html[data-palette="dark"] button,html[data-palette="dark"] input,html[data-palette="dark"] textarea,html[data-palette="dark"] select{background:var(--paper);color:var(--ink);border-color:var(--line)}
html[data-palette="dark"] button:hover{background:var(--soft)}
html[data-palette="dark"] button.primary{background:var(--green);color:#172b22;border-color:var(--green)}
html[data-palette="dark"] button.primary:hover{background:#b0d1c2}
html[data-palette="dark"] .brand-mark,html[data-palette="dark"] .sample-root{background:#315e48;color:white}
html[data-palette="dark"] .tree-preview,html[data-palette="dark"] .chat-pane{background:#202923;border-color:var(--line)}
html[data-palette="dark"] .sample-node,html[data-palette="dark"] .auth-card,html[data-palette="dark"] .goals-pane,html[data-palette="dark"] .tasks-pane,html[data-palette="dark"] .message,html[data-palette="dark"] dialog{background:var(--paper);border-color:var(--line)}
html[data-palette="dark"] .message.user{background:var(--soft)}
html[data-palette="dark"] .text-button{color:var(--green);background:transparent}
html[data-palette="dark"] .danger{color:#ff9b90}
html[data-palette="dark"] #notice{background:#3d2f1d;color:#ffdda6;border-color:#705d3c}
html[data-palette="dark"] .credit-entry{border-color:var(--line)}
html[data-palette="dark"] .credit-entry small{color:var(--muted)}
/* Keep setting controls consistent across the fully scoped vivid theme. */
:root .palette-option{display:flex;align-items:center;gap:8px;margin:4px 0;padding:12px;border:1px solid var(--line);border-radius:8px;color:var(--ink);font-size:14px;cursor:pointer}
:root .palette-option:has(input:checked){border-color:var(--green);background:var(--soft)}
:root .palette-option input{display:block;flex:0 0 auto;width:auto;margin:0;accent-color:var(--green)}
@media(max-width:700px){:root .topbar .brand{font-size:18px;gap:6px}:root .topbar nav button{padding:8px 10px;white-space:nowrap}}

/* Pricing shares the site's palettes and typography. */
#pricing{max-width:1160px;margin:auto;padding:64px 28px 0}
.pricing-intro{text-align:center;max-width:720px;margin:0 auto 48px}
.pricing-intro h1{font-size:clamp(32px,4.5vw,54px);line-height:1.2;margin-bottom:22px}
.pricing-intro>p:last-child,.plan-description{color:var(--muted)}
.pricing-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:940px;margin:auto}
.price-card{padding:36px;border:1px solid var(--line);border-radius:22px;background:var(--paper)}
.pro-card{border:2px solid var(--green);background:linear-gradient(135deg,var(--soft),var(--paper))}
.plan-label{font-size:12px;letter-spacing:2px;font-weight:700;color:var(--green)}
.price-card h2{font-size:25px;margin:20px 0 12px}.plan-description{min-height:50px}
.price-value{font-size:52px;line-height:1.2;font-weight:650;min-height:104px;letter-spacing:-1px}
.price-value span{display:block;font-size:13px;font-weight:400;letter-spacing:0;color:var(--muted);margin-top:12px}
.price-pending{font-size:32px;padding-top:12px}.price-card ul{padding:0;list-style:none;margin:26px 0 22px}
.price-card li{padding:9px 0 9px 24px;position:relative}.price-card li:before{content:'✓';position:absolute;left:0;color:var(--green)}
.pricing-rules{margin:84px 0 60px;text-align:center}.pricing-rules>div{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:32px}.pricing-rules p,.pricing-faq p{color:var(--muted)}
.pricing-faq{max-width:780px;margin:0 auto 64px}.pricing-faq h2{text-align:center;margin-bottom:30px}.pricing-faq details{border-bottom:1px solid var(--line);padding:20px 0}.pricing-faq summary{cursor:pointer;font-weight:600}.pricing-faq p{margin:16px 0 0}
#pricing-info{max-width:440px}#pricing-info button{float:right}
@media(max-width:700px){#pricing{padding:40px 20px 0}.pricing-grid,.pricing-rules>div{grid-template-columns:1fr}.price-card{padding:26px}.pricing-rules{margin-top:52px}.pricing-rules>div{gap:16px}.pricing-intro{margin-bottom:30px}}
@media(max-width:700px){:root .topbar nav #pricing-link{display:inline-flex;align-items:center;white-space:nowrap}}

/* Keep the shared brand artwork intact across all palettes. */
html .brand .brand-mark{display:block;width:36px;height:36px;flex:0 0 36px;border-radius:8px;background:none;box-shadow:none;object-fit:contain}

.pricing-controls{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin:0 auto 16px;padding:0 24px}.pricing-controls label{display:flex;align-items:center;gap:10px}.pricing-controls select{padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:inherit}.pricing-reference{text-align:center;color:var(--muted);font-size:13px;padding:0 24px;margin-bottom:30px}#pro-price{font-weight:inherit}
.pricing-controls label{white-space:nowrap;width:auto}.pricing-controls select{width:auto;min-width:112px}