:root{color-scheme:dark;--bg:#101312;--panel:#171c19;--panel-2:#1d241f;--line:#303a32;--text:#eef3ed;--muted:#9ba79c;--accent:#a4e479;--red:#ff9b91;--amber:#e8c274;--mono:ui-monospace,SFMono-Regular,Consolas,monospace;--sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 var(--sans)}button,input,textarea,select{font:inherit}a{color:inherit}button,a,input,textarea,select,summary{outline-offset:5px}button{cursor:pointer}button:disabled{opacity:.4;cursor:wait}.site-header{max-width:1240px;margin:auto;padding:24px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-weight:850;letter-spacing:-.8px;font-size:22px;text-decoration:none}.brand span{color:var(--accent)}nav{display:flex;gap:28px}nav a{text-decoration:none;color:var(--muted);font-size:14px}nav a:hover{color:var(--text)}main{max-width:1240px;margin:auto;padding:52px 32px 26px}.eyebrow{font:11px var(--mono);letter-spacing:2px;color:var(--accent);margin:0 0 16px}h1{font-size:clamp(28px,4vw,44px);line-height:1.15;letter-spacing:-1.6px;margin:0 0 15px;font-weight:750}.dot{color:var(--accent)}.subtitle{color:#c0cbc1;margin:0 0 12px;font-size:16px}.index-meta{color:var(--muted);font:12px var(--mono);margin:0 0 32px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}.editor-panel,.reference-panel,.results-panel{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:24px;min-width:0}.editor-panel{grid-column:1;grid-row:1}.reference-panel{grid-column:2;grid-row:1 / span 2;position:sticky;top:20px}.results-panel{grid-column:1;grid-row:2}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.panel-heading h2{margin:0;font-size:15px;letter-spacing:-.2px}.small-label{font:9px var(--mono);letter-spacing:.6px;color:var(--muted);text-align:right}.badge{font:9px var(--mono);letter-spacing:.4px;color:var(--accent);padding:4px 7px;border:1px solid var(--line);border-radius:4px;white-space:nowrap}textarea,input[type=search],select{background:#111612;border:1px solid var(--line);color:var(--text);border-radius:7px}textarea{width:100%;resize:vertical;padding:16px;line-height:1.7;font:14px/1.7 var(--mono);min-height:100px;tab-size:2}textarea::placeholder,input::placeholder{color:#6f7c70}textarea:focus,input:focus,select:focus{border-color:var(--accent);outline:1px solid var(--accent)}.editor-footer{display:flex;justify-content:space-between;color:var(--muted);font:10px var(--mono);gap:12px;margin:7px 0 19px}.settings{display:flex;align-items:center;flex-wrap:wrap;gap:20px;color:#c0cbc1;font-size:12px}.settings label:first-child{display:flex;align-items:center;gap:10px}select{padding:7px 9px;max-width:225px;font-size:12px}.checkbox{display:flex;align-items:center;gap:8px}.checkbox input{accent-color:var(--accent)}.error-input{margin:20px 0;border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:12px}.error-input summary{cursor:pointer;color:#c0cbc1}.error-input label{display:block;margin:12px 0 6px}.error-input textarea{font-size:12px;min-height:68px}.actions{display:flex;gap:10px;margin:20px 0}.primary,.secondary{border-radius:6px;padding:11px 16px;font-weight:650;font-size:13px}.primary{background:var(--accent);color:#13200e;border:1px solid var(--accent);display:flex;gap:28px;align-items:center}.primary:hover{background:#b7ee91}.secondary{background:transparent;border:1px solid var(--line);color:var(--muted)}.secondary:hover{color:var(--text);border-color:var(--muted)}.examples{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:10px;color:var(--muted)}.examples button{border:1px solid var(--line);background:transparent;color:#c2cec2;padding:4px 8px;border-radius:5px;font-size:10px}.examples button:hover{border-color:var(--accent);color:var(--accent)}input[type=search]{width:100%;padding:10px 12px;font-size:12px}.command-list{margin:14px 0;display:flex;flex-wrap:wrap;gap:5px;max-height:174px;overflow:auto;scrollbar-color:var(--line) transparent}.command-list button{border:1px solid transparent;color:var(--muted);background:#202822;font:11px var(--mono);padding:5px 7px;border-radius:4px}.command-list button:hover,.command-list button.selected{color:var(--accent);border-color:var(--accent)}.reference-detail{border-top:1px solid var(--line);padding-top:14px;font-size:12px;max-height:390px;overflow:auto;scrollbar-color:var(--line) transparent}.reference-detail p{color:var(--muted);margin:0}.reference-detail h3{font:14px var(--mono);margin:0 0 8px}.reference-detail a,.source-link{color:var(--accent);font-size:11px}.syntax-form{white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.7 var(--mono);background:#101612;border:1px solid var(--line);border-radius:6px;padding:10px;margin:10px 0;color:#becbbb}.empty-state{display:flex;align-items:center;gap:20px;color:var(--muted);padding:6px 0}.empty-state h2{font-size:15px;margin:0 0 5px;color:var(--text)}.empty-state p{font-size:12px;margin:0}.empty-icon{font:34px var(--mono);color:var(--accent);border:1px solid var(--line);width:60px;height:60px;display:grid;place-items:center;border-radius:10px;flex-shrink:0}.result-heading{display:flex;align-items:center;gap:10px;margin:0 0 5px;font-size:20px;letter-spacing:-.5px}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--accent)}.invalid .status-dot{background:var(--red)}.partial .status-dot,.unchecked .status-dot{background:var(--amber)}.result-caption{font-size:12px;color:var(--muted);margin:0 0 20px}.command-preview{margin:16px 0;background:#101612;border:1px solid var(--line);padding:15px;border-radius:7px;font:12px/1.8 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}.command-preview mark{background:#522b29;color:#ffd2ca;border-bottom:2px solid var(--red);border-radius:2px;padding:2px 0}.diagnostic{border-left:2px solid var(--red);padding:1px 0 1px 13px;margin:14px 0}.diagnostic.warning{border-color:var(--amber)}.diagnostic .code{color:var(--red);font:10px var(--mono);letter-spacing:.6px}.diagnostic.warning .code{color:var(--amber)}.diagnostic p{margin:5px 0;font-size:13px;overflow-wrap:anywhere}.jump{background:transparent;border:0;color:var(--muted);font:10px var(--mono);padding:4px 0;text-decoration:underline}.result-section{border-top:1px solid var(--line);margin-top:20px;padding-top:16px}.result-section h3,.result-section summary{font-size:12px;font-weight:650;margin:0 0 10px}.result-section summary{cursor:pointer}.result-section ul{padding-left:18px;color:var(--muted);font-size:12px}.result-section li{margin:6px 0}.suggestion{margin:12px 0}.suggestion p{font-size:12px;margin:0 0 8px;color:var(--muted)}.suggestion-row{display:flex;gap:8px;align-items:flex-start;background:#101612;border:1px solid var(--line);padding:10px;border-radius:6px;margin-bottom:6px}.suggestion-row code{font:11px/1.7 var(--mono);overflow-wrap:anywhere;flex:1;min-width:0}.copy{font:10px var(--mono);background:transparent;border:1px solid var(--line);border-radius:4px;color:var(--accent);padding:4px 7px;flex-shrink:0}.binding{display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px;border-bottom:1px solid var(--line);padding:8px 0;font-size:11px}.binding-name{color:var(--muted);overflow-wrap:anywhere}.binding code{font:11px/1.6 var(--mono);overflow-wrap:anywhere}.scope-note{font-size:11px;color:var(--muted);margin-top:22px;max-width:750px}footer{max-width:1240px;margin:auto;padding:20px 32px 28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;color:#718074;font-size:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1000px){.workspace{grid-template-columns:minmax(0,1fr) 280px}.editor-panel,.reference-panel,.results-panel{padding:20px}.small-label{display:none}}
@media(max-width:760px){.site-header{padding:20px}.brand{font-size:19px}nav{gap:20px}main{padding:32px 20px 20px}.workspace{grid-template-columns:1fr;gap:16px}.editor-panel{grid-row:1}.results-panel{grid-row:2}.reference-panel{grid-column:1;grid-row:3;position:static}.reference-detail{max-height:260px}.index-meta{font-size:10px;line-height:1.8}.settings{gap:14px}.editor-footer{font-size:9px}.editor-footer span:last-child{display:none}.command-list{max-height:120px}h1{letter-spacing:-1px}.binding{grid-template-columns:90px minmax(0,1fr)}footer{padding:18px 20px;flex-direction:column;gap:5px}.scope-note{font-size:10px}}
@media(prefers-reduced-motion:no-preference){button,a{transition:color .12s,border-color .12s,background .12s}}
/* Match the existing skygen.live shell and tool styling. */
:root{--bg:#111;--panel:#191919;--panel-2:#141414;--line:#383838;--text:#e8e8e8;--muted:#979797;--accent:#6fba5a;--red:#c96d6d;--amber:#d6a84b;--mono:Consolas,"Cascadia Mono","Courier New",monospace;--sans:var(--mono)}
body{font:14px/1.5 var(--mono)}a{color:#b7d7ff}.site-header{max-width:none;margin:0;padding:12px 18px;gap:18px;flex-wrap:wrap;background:#151515;position:sticky;top:0;z-index:10;justify-content:flex-start}.brand{font-size:18px;font-weight:700;letter-spacing:.4px;color:#fff}.brand span{color:inherit}.site-tag{color:var(--muted);font-size:11px;margin-right:auto}nav{gap:0}nav a{color:#bbb;border:1px solid var(--line);padding:7px 10px;margin-left:-1px;background:#171717;font-size:14px}nav a:hover,nav a.active{background:#242424;color:#fff;border-top-color:var(--accent)}main{max-width:1180px;padding:18px}.intro{border-bottom:1px solid var(--line);margin-bottom:14px;padding-bottom:12px}.eyebrow{font:10px var(--mono);letter-spacing:.4px;margin-bottom:7px}h1{font-size:19px;line-height:1.5;letter-spacing:0;margin-bottom:4px}.subtitle{font-size:12px;margin:0 0 7px;color:var(--muted)}.index-meta{font-size:10px;margin:0}.workspace{gap:14px}.editor-panel,.reference-panel,.results-panel{border-radius:0;padding:14px}.panel-heading h2{font-size:14px}.reference-panel{top:80px}.badge,textarea,input[type=search],select,.primary,.secondary,.examples button,.command-list button,.syntax-form,.empty-icon,.command-preview,.suggestion-row,.copy{border-radius:0}.primary{background:#254b25;border-color:#4d8146;color:#eee;font:13px var(--mono)}.primary:hover{background:#315b2e}.secondary{font:13px var(--mono)}.primary,.secondary{padding:8px 11px}.result-heading{font-size:16px;letter-spacing:0}.command-preview{background:#0b0b0b}.syntax-form{background:#0b0b0b}.site-header a.brand:hover{text-decoration:none}footer{max-width:1180px;margin:18px auto 0;padding:14px 18px;font-size:11px}
@media(max-width:760px){.site-header{padding:12px 18px}main{padding:18px}.workspace{gap:14px}.site-tag{margin-right:auto}.brand{font-size:18px}.reference-panel{position:static}h1{font-size:19px;letter-spacing:0}.index-meta{font-size:10px}footer{padding:14px 18px}}
@media(max-width:600px){.site-header{position:static}nav{width:100%;overflow:auto}.site-tag{font-size:10px}.settings label:first-child{flex-wrap:wrap}.small-label{display:none}}
