:root{--font:"JetBrains Mono Variable", ui-monospace, monospace;--display:"IBM Plex Mono", ui-monospace, monospace;--gut:2.6rem;color-scheme:dark}*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:var(--font)}body{background:var(--bg);min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}button,select{cursor:pointer}a{color:inherit}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}main{width:100%;max-width:1440px;padding:3.2rem var(--gut) 4rem;margin:0 auto}.intro{justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2rem;display:flex}.eyebrow,.panel-kicker{color:var(--accent);text-transform:uppercase;letter-spacing:.13em;font:600 .7rem var(--display);margin:0 0 .55rem}h1{font:600 clamp(2.1rem, 4vw, 4rem)/1.02 var(--display);letter-spacing:-.05em;margin:0}h1 span{color:var(--accent)}.lede{color:var(--sub);max-width:760px;margin:1rem 0 0;line-height:1.65}.intro-actions{flex-shrink:0;gap:.65rem;display:flex}.button,.small-button{border:1px solid var(--accent);background:var(--accent);color:var(--bg);padding:.7rem 1rem;font-weight:700}.button.secondary,.small-button{color:var(--text);border-color:var(--line);background:0 0}.button:hover,.small-button:hover{border-color:var(--accent)}.maker{border:1px solid var(--line);grid-template-columns:minmax(310px,370px) minmax(0,1fr);min-height:800px;display:grid}.editor{background:var(--bg2);border-right:1px solid var(--line);scrollbar-width:thin;scrollbar-color:var(--overlay0) transparent;align-self:start;max-height:100vh;padding:1rem;position:sticky;top:0;overflow:auto}.editor::-webkit-scrollbar{width:7px;height:7px}.editor::-webkit-scrollbar-track{background:0 0}.editor::-webkit-scrollbar-thumb{background:var(--overlay0);border:2px solid var(--bg2)}.editor::-webkit-scrollbar-thumb:hover{background:var(--accent)}.editor-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:end;gap:.75rem;padding-bottom:1rem;display:flex}select,.identity input{width:100%;color:var(--text);background:var(--surface);border:1px solid var(--line);padding:.55rem .65rem}#preset{min-width:220px}.identity{border-bottom:1px solid var(--line);padding:.75rem 0}.identity summary{color:var(--sub2);cursor:pointer;font-size:.78rem}.identity-grid{gap:.65rem;padding-top:.8rem;display:grid}.identity-grid label{color:var(--sub);gap:.3rem;font-size:.68rem;display:grid}.color-groups fieldset{border:0;margin:1.15rem 0;padding:0}.color-groups legend{color:var(--accent);font:600 .68rem var(--display);text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid var(--line);width:100%;margin-bottom:.25rem;padding-bottom:.45rem}.color-row{border-bottom:1px solid rgb(from var(--line) r g b / .5);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.65rem;padding:.48rem .2rem;display:grid}.color-row>label{min-width:0}.color-label{color:var(--text);font-size:.75rem}.color-inputs{align-items:center;gap:.35rem;display:flex}.picker{appearance:none;border:1px solid var(--line);background:0 0;width:28px;height:28px;padding:0}.picker::-webkit-color-swatch-wrapper{padding:2px}.picker::-webkit-color-swatch{border:0}.picker::-moz-color-swatch{border:0}.hex{width:82px;color:var(--text);background:var(--bg);border:1px solid var(--line);padding:.38rem .42rem;font-size:.68rem}.hex:focus{outline:1px solid var(--accent);border-color:var(--accent)}.hex[aria-invalid=true]{border-color:var(--coral)}.stage{background:var(--bg);min-width:0;padding:1.1rem}.stage-head{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.stage-head h2{color:var(--text);font:600 .82rem var(--display);margin:0}.viewport-switch{border:1px solid var(--line);display:flex}.viewport-switch button{color:var(--sub);background:var(--bg2);border:0;padding:.35rem .6rem;font-size:.65rem}.viewport-switch button.on{background:var(--accent);color:var(--bg)}.preview-wrap{background-image:linear-gradient(45deg, var(--surface) 25%, transparent 25%), linear-gradient(-45deg, var(--surface) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--surface) 75%), linear-gradient(-45deg, transparent 75%, var(--surface) 75%);border:1px solid var(--line);background-position:0 0,0 9px,9px -9px,-9px 0;background-size:18px 18px;padding:clamp(.5rem,2vw,1.5rem);overflow:auto}.preview{min-width:720px;max-width:1100px;color:var(--text);background:var(--bg);border:1px solid var(--overlay0);margin:auto;transition:max-width .2s;box-shadow:0 20px 55px #00000059}.preview[data-size=compact]{max-width:760px}.app-body{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:auto minmax(0,1fr);min-height:540px;display:grid}.sidebar{background:var(--base);border-right:1px solid var(--line);width:190px;min-height:0;padding:.55rem;font-size:.62rem}.side-brand{border-bottom:1px solid var(--surface);align-items:center;gap:.45rem;padding-bottom:.65rem;display:flex}.side-brand b{color:var(--accent)}.side-brand span{color:var(--sub)}.side-brand button{border:1px solid var(--line);color:var(--sub2);background:var(--surface);margin-left:auto;padding:.18rem .3rem;font-size:.55rem}.dock-title{color:var(--sub);text-transform:uppercase;letter-spacing:.1em;margin:.75rem .25rem .3rem}.agents-title{justify-content:space-between;display:flex}.agents-title small b{color:var(--accent)}.workspace,.agent{color:var(--sub2);align-items:center;gap:.4rem;padding:.37rem .42rem;display:flex}.workspace small,.agent small{color:var(--sub);margin-left:auto}.workspace.selected{color:var(--text);background:var(--sel)}.workspace.selected>span{color:var(--accent)}.agent.focused{border-left:2px solid var(--accent);color:var(--text)}.state{border-radius:50%;flex:none;width:7px;height:7px;display:inline-block}.state.working{background:var(--amber)}.state.blocked{background:var(--coral)}.state.done{background:var(--mint)}.state.idle{background:var(--green);border:1px solid var(--green)}.workspace-view{background:var(--bg2);flex-direction:column;min-width:0;min-height:0;display:flex}.tabs{border-bottom:1px solid var(--line);background:var(--bg);align-items:end;gap:2px;height:36px;padding:.35rem .45rem 0;display:flex}.tab{color:var(--sub);background:0 0;border:0;padding:.38rem .65rem;font-size:.6rem}.tab.active{color:var(--text);background:var(--surface);border-top:1px solid var(--accent)}.tabs>span{color:var(--overlay0);padding:.3rem}.panes{flex:1;grid-template-columns:1.18fr .82fr;gap:5px;min-height:290px;padding:5px;display:grid}.pane{border:1px solid var(--border);background:var(--bg2);flex-direction:column;min-width:0;display:flex}.pane-focused{border-color:var(--border-focus);box-shadow:0 0 0 1px var(--border-focus)}.pane header{border-bottom:1px solid var(--surface);height:25px;color:var(--text);background:var(--surface);align-items:center;gap:.35rem;padding:0 .5rem;font-size:.58rem;display:flex}.terminal{color:var(--text);flex:1;padding:.55rem .65rem;font-size:.58rem;line-height:1.65;overflow:hidden}.terminal p{margin:.12rem 0}.terminal b{color:var(--accent)}.selection{background:var(--sel);padding:0 .2rem;display:inline-block}.composer{background:var(--surface);border:1px solid var(--border);margin:.35rem;padding:.42rem .5rem;font-size:.55rem}.composer>span{color:var(--accent)}.composer i{color:var(--sub);float:right;font-style:normal}.permission{background:var(--surface);border:1px solid var(--border);gap:.3rem;margin:.5rem 0;padding:.55rem;display:grid}.permission button{text-align:left;color:var(--sub2);background:0 0;border:0;font-size:.55rem}.permission button:first-of-type{color:var(--accent);background:var(--sel)}.statusbar{background:var(--bg);border-top:1px solid var(--line);color:var(--sub);grid-column:1/-1;padding:.35rem .55rem;font-size:.55rem}.statusbar b{color:var(--accent)}.statusbar span:first-of-type{color:var(--overlay0)}.statusbar span:last-of-type{color:var(--coral)}.token-active{outline-offset:-2px;animation:.7s token-pulse;outline:2px solid var(--accent)!important}@keyframes token-pulse{50%{filter:brightness(1.35)}}.diagnostics{gap:.75rem;margin-top:1rem;display:grid}.quality{border:1px solid var(--green);background:rgb(from var(--green) r g b / .08);color:var(--sub2);padding:.8rem .9rem;font-size:.85rem;line-height:1.55}.quality strong{color:var(--green)}.quality.warn{border-color:var(--amber);background:rgb(from var(--amber) r g b / .08)}.quality.warn strong{color:var(--amber)}.quality ul{margin:.45rem 0 0;padding-left:1.25rem}.export-head{justify-content:space-between;align-items:end;gap:1rem;display:flex}.export-head p{margin:0}.export-head .panel-kicker{color:var(--accent);margin-bottom:.45rem;font-size:.7rem}.export-head p:not(.panel-kicker){color:var(--sub);font-size:.88rem;line-height:1.6}.export-head code,.export-head a{color:var(--accent)}.export-actions{flex-shrink:0;gap:.55rem;display:flex}.publish-button{color:var(--bg);background:var(--accent);border-color:var(--accent)}#toml-output{resize:vertical;white-space:pre;background:var(--bg2);width:100%;min-height:230px;color:var(--sub2);border:1px solid var(--line);scrollbar-width:thin;scrollbar-color:var(--overlay0) transparent;padding:.9rem;font-size:.78rem;line-height:1.6;overflow:auto}#toml-output::-webkit-scrollbar{width:7px;height:7px}#toml-output::-webkit-scrollbar-track{background:0 0}#toml-output::-webkit-scrollbar-thumb{background:var(--overlay0);border:2px solid var(--bg2)}#toml-output::-webkit-scrollbar-thumb:hover{background:var(--accent)}.starters{border-top:1px solid var(--line);margin-top:3.5rem;padding-top:2.5rem}.starters-head{margin-bottom:1.1rem}.starters-head h2{font:600 1.35rem var(--display);letter-spacing:-.035em;margin:0}.starters-head>p:last-child{max-width:46rem;color:var(--sub);margin:.45rem 0 0;font-size:.84rem}.starter-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem;display:grid}.starter-card{min-width:0;color:var(--text);background:var(--bg2);border:1px solid var(--line)}.starter-card:hover,.starter-card:focus-within{border-color:var(--accent);transform:translateY(-2px)}.starter-edit{text-align:left;width:100%;color:inherit;background:0 0;border:0;padding:0;display:block}.starter-edit:focus-visible,.starter-install:focus-visible{outline:1px solid var(--accent);outline-offset:-2px}.starter-preview{height:170px;color:var(--text);background:var(--bg);border-bottom:1px solid var(--line);display:block;overflow:hidden}.starter-bar{background:var(--bg);border-bottom:1px solid var(--line);align-items:center;gap:4px;height:18px;padding:0 7px;display:flex}.starter-bar i{background:var(--coral);border-radius:50%;width:5px;height:5px}.starter-bar i:nth-child(2){background:var(--amber)}.starter-bar i:nth-child(3){background:var(--green)}.starter-body{height:152px;display:flex}.starter-side{background:var(--base);border-right:1px solid var(--line);flex-direction:column;gap:7px;width:30%;padding:10px 8px;display:flex}.starter-side b{background:var(--sub);width:70%;height:4px;display:block}.starter-side b:nth-child(2){background:var(--accent);width:90%}.starter-side b:nth-child(3){background:var(--sub2);width:58%}.starter-side i{background:var(--sel);border-left:2px solid var(--accent);width:100%;height:21px;margin-top:4px;display:block}.starter-main{background:var(--bg2);flex-direction:column;flex:1;min-width:0;display:flex}.starter-tabs{background:var(--bg);border-bottom:1px solid var(--line);align-items:end;gap:3px;height:25px;padding:4px 5px 0;display:flex}.starter-tabs b{background:var(--surface);width:25%;height:14px}.starter-tabs b:first-child{border-top:2px solid var(--accent)}.starter-tabs b:nth-child(2){border:1px solid var(--surface);background:0 0}.starter-panes{flex:1;grid-template-columns:1.2fr .8fr;gap:4px;padding:5px;display:grid}.starter-panes i{background:var(--bg2);border:1px solid var(--border-focus);display:block}.starter-panes i+i{border-color:var(--border)}.starter-lines{gap:5px;padding:0 10px 10px;display:grid}.starter-lines b{background:var(--text);width:74%;height:3px;display:block}.starter-lines b:nth-child(2){background:var(--accent);width:48%}.starter-lines b:nth-child(3){background:var(--mint);width:62%}.starter-meta{background:var(--bg2);justify-content:space-between;align-items:center;gap:.5rem;padding:.75rem .85rem;display:flex}.starter-meta strong{color:var(--text);font:600 .78rem var(--display)}.starter-meta span{color:var(--accent);white-space:nowrap;font-size:.62rem}.starter-install{width:100%;min-width:0;color:var(--sub);background:var(--bg);border:0;border-top:1px solid var(--line);text-align:left;justify-content:space-between;align-items:center;gap:.5rem;padding:.55rem .85rem;display:flex}.starter-install:hover{color:var(--accent)}.starter-install code{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:.6rem;overflow:hidden}.starter-install span{color:var(--accent);font-size:.6rem}footer{border-top:1px solid var(--line);max-width:1440px;padding:2rem var(--gut);color:var(--sub);justify-content:space-between;margin:0 auto;font-size:.7rem;display:flex}footer a{color:var(--accent)}@media (width<=1050px){.maker{grid-template-columns:330px minmax(0,1fr)}.sidebar{width:165px}.panes{grid-template-columns:1fr}.pane:not(.pane-focused){display:none}.starter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=900px){:root{--gut:1.6rem}}@media (width<=780px){main{padding-top:2rem}.intro{flex-direction:column;align-items:start}.maker{flex-direction:column;display:flex}.editor{border-right:0;border-bottom:1px solid var(--line);max-height:none;position:static}.stage{padding:.65rem}.preview-wrap{padding:.5rem}.stage-head{align-items:end}.intro-actions{width:100%}.intro-actions .button{flex:1}.export-head{flex-direction:column;align-items:start}.export-actions{width:100%}.export-actions .small-button{flex:1}}@media (width<=560px){:root{--gut:1.15rem}.starter-grid{grid-template-columns:1fr}}@media (width<=480px){.intro-actions{flex-direction:column}footer{flex-direction:column;gap:.5rem}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}