:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-primary:#000;--color-background:#fff;--color-shell:#ccc;--color-muted:#555;--color-accent:#0067b8;--color-border:#d9d9d9;--color-border-subtle:#e0e0e0;--color-hover-highlight:#d5f5c0;--color-dark-background:#111;--color-dark-surface:#1a1a1a;--color-dark-primary:#fff;--color-dark-muted:#999;--color-code-block:#1d1e22;--font-body:Inter, "DM Sans", "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;--font-brand:"Segoe UI", Inter, Arial, sans-serif;--font-mono:Consolas, "SFMono-Regular", "Cascadia Mono", Menlo, monospace;--space-mobile:16px;--space-tablet:24px;--space-desktop:30px;--space-section:48px;--space-compact:8px;--radius-inline-code:4px;--radius-block:8px}html[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-primary:#fff;--color-background:#111;--color-shell:#1a1a1a;--color-muted:#999;--color-accent:#4da6ff;--color-border:#444;--color-border-subtle:#333;--color-hover-highlight:#1a3a0a}*{box-sizing:border-box}html{background:var(--color-shell);min-height:100%}body{background:var(--color-shell);min-width:320px;min-height:100vh;color:var(--color-primary);font-family:var(--font-mono);margin:0}button,textarea,select{font:inherit}button,select{min-height:44px}button{cursor:pointer}.app-shell{max-width:1120px;padding:0 var(--space-desktop) 80px;background:var(--color-background);margin:0 auto}.app-shell:before{height:1px;margin:0 calc(var(--space-desktop) * -1) var(--space-section);background:var(--color-primary);content:"";display:block}.panel{box-shadow:none;background:0 0;border:0;border-radius:0}.hero{border-bottom:1px solid var(--color-border);margin:0;padding:48px 0 34px;display:block}.eyebrow{background:var(--color-primary);color:var(--color-background);font-family:var(--font-mono);text-transform:uppercase;margin:0 0 18px;padding:4px 8px;font-size:10px;font-weight:700;line-height:1.2;display:inline-block}h1,h2,h3,p{margin-top:0}h1{max-width:860px;color:var(--color-primary);font-family:var(--font-body);letter-spacing:-1px;margin-bottom:16px;font-size:42px;font-weight:500;line-height:1.2}h2{color:var(--color-primary);font-family:var(--font-body);margin-bottom:0;font-size:24px;font-weight:500;line-height:1.3}h3{color:var(--color-primary);font-family:var(--font-body);margin-bottom:8px;font-size:20px;font-weight:500;line-height:1.3}.hero-copy{max-width:760px;color:var(--color-muted);font-family:var(--font-mono);margin-bottom:24px;font-size:14px;font-weight:400;line-height:1.6}.inline-metrics,.help-text,.empty-view,.context-box p,.patch-layer-delta{color:var(--color-muted);font-family:var(--font-mono);font-size:12px;line-height:1.4}.workspace{grid-template-columns:minmax(0,1fr) 280px;align-items:start;gap:32px;padding-top:32px;display:grid}.editor-card,.stats-card{padding:0}.view-bar{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px 18px;margin-bottom:18px;display:grid}.model-pricing{color:var(--color-muted);font-family:var(--font-mono);text-transform:uppercase;flex-wrap:wrap;gap:6px 8px;margin:0;font-size:11px;line-height:1.3;display:flex}.model-pricing div{gap:4px;display:inline-flex}.model-pricing div:not(:last-child):after{content:"·";margin-left:8px}.model-pricing dt,.model-pricing dd{color:inherit;font:inherit;margin:0}.view-toggle{border:1px solid var(--color-primary);background:var(--color-background);border-radius:0;width:-moz-fit-content;width:fit-content;max-width:100%;margin-bottom:0;padding:0;display:inline-flex}.view-toggle button{border:0;border-right:1px solid var(--color-primary);min-width:104px;min-height:38px;color:var(--color-primary);font-family:var(--font-mono);text-transform:uppercase;background:0 0;border-radius:0;font-size:12px;font-weight:400}.view-toggle button:last-child{border-right:0}.view-toggle button:hover{background:var(--color-hover-highlight)}.view-toggle button.active,.view-toggle button[aria-selected=true]{background:var(--color-primary);color:var(--color-background)}.input-toolbar{border-bottom:1px solid var(--color-primary);background:var(--color-background);grid-template-columns:minmax(220px,1fr) auto;align-items:start;gap:10px 14px;padding:10px;display:grid}.model-compact{grid-template-columns:minmax(220px,1fr);max-width:100%;display:grid}.model-compact select{border-color:var(--color-border);min-height:36px;padding:0 10px;font-size:12px}.model-compact-label,.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}.patch-layer-grid{flex-wrap:wrap;grid-area:1/2/span 2;justify-content:flex-end;gap:4px;display:flex}.patch-layer-button{-webkit-appearance:none;appearance:none;border:1px solid var(--color-border);background-color:var(--color-background);min-width:38px;min-height:34px;color:var(--color-primary);font-family:var(--font-mono);text-align:center;border-radius:0;padding:4px 6px;display:inline-grid}.patch-layer-button:not([aria-pressed=true]):hover{border-color:var(--color-primary);background-color:var(--color-hover-highlight)}.patch-layer-button[aria-pressed=true],.patch-layer-button[aria-pressed=true]:hover,.patch-layer-button[aria-pressed=true]:active{border-color:var(--color-primary);background-color:var(--color-primary);color:var(--color-background)}.patch-layer-button[aria-pressed=true]:focus-visible{border-color:var(--color-primary);background-color:var(--color-primary);color:var(--color-background)}.patch-layer-button[aria-pressed=true] .patch-layer-delta{color:var(--color-background)}.patch-layer-icon{font-size:16px;line-height:1}.patch-layer-icon svg,.patch-layer-icon path{fill:currentColor;display:block}.patch-layer-icon svg{width:18px;height:18px}.patch-layer-delta{color:var(--color-muted);font-size:9px;line-height:1.1}.text-surface{border:1px solid var(--color-primary);border-radius:var(--radius-block);background:var(--color-background);position:relative}.plaintext-shell{height:clamp(420px,58vh,560px);position:relative;overflow:hidden}.text-viewport{border-radius:var(--radius-block);width:100%;height:clamp(420px,58vh,560px);color:var(--color-primary);font-family:var(--font-mono);white-space:pre-wrap;background:0 0;border:0;outline:none;padding:24px;font-size:17px;line-height:1.7;overflow:auto}.text-input{color:#0000;caret-color:#0000;cursor:default;resize:none;background:0 0;height:100%;display:block;position:relative}.text-input::placeholder{color:#0000}.chat-transcript{background:var(--color-background);flex-direction:column;gap:14px;display:flex}.chat-message p{margin:0}.chat-message{border:1px solid var(--color-border);background:var(--color-background);gap:8px;max-width:min(78%,620px);padding:14px;display:grid}.chat-message-user{border-color:var(--color-primary);align-self:flex-end}.chat-message-assistant{background:var(--color-shell);align-self:flex-start}.chat-message-label{color:var(--color-muted);text-transform:uppercase;font-size:11px;line-height:1.2}.chat-message p{color:var(--color-primary);font-family:var(--font-body);white-space:pre-wrap;font-size:15px;line-height:1.55}.chat-composer{border-top:1px solid var(--color-primary);background:var(--color-background);grid-template-columns:minmax(0,1fr) 88px;align-items:stretch;gap:0;padding:10px;display:grid}.chat-composer-label{color:var(--color-muted);grid-column:1/-1;margin:0;font-size:11px}.chat-input{border:1px solid var(--color-border);background:var(--color-background);min-height:92px;max-height:140px;color:var(--color-primary);font-family:var(--font-mono);resize:none;border-bottom:0;border-radius:0;grid-column:1/-1;padding:12px;font-size:14px;line-height:1.45;overflow:auto}.chat-input::placeholder{color:var(--color-muted)}.chat-submit{border:1px solid var(--color-border);background:var(--color-primary);width:100%;min-width:0;height:100%;min-height:64px;color:var(--color-background);border-left:0;border-radius:0;grid-area:3/2;place-items:center;padding:0;display:inline-grid}.chat-submit svg,.chat-submit path{fill:currentColor;display:block}.chat-submit svg{width:18px;height:18px}.chat-submit:hover{opacity:.72}.chat-submit:disabled{cursor:default;opacity:.45}.chat-submit:disabled:hover{opacity:.45}.chat-impact{border:1px solid var(--color-border);min-height:64px;color:var(--color-muted);font-family:var(--font-mono);text-align:left;text-transform:uppercase;border-right:0;flex-wrap:wrap;grid-area:3/1;justify-content:flex-start;gap:8px 12px;margin:0;padding:8px 10px;font-size:11px;line-height:1.25;display:flex}.chat-impact div{gap:2px;display:grid}.chat-impact dt,.chat-impact dd{color:inherit;font:inherit;margin:0}.chat-impact dd{color:var(--color-primary);font-size:12px}.plaintext-highlight{pointer-events:none;color:var(--color-primary);position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden}.plaintext-highlight-content{display:block}.placeholder-highlight{color:var(--color-muted)}.xml-tag{color:var(--color-accent)}.xml-attr{color:var(--color-primary)}.xml-string,.xml-comment,.xml-punctuation{color:var(--color-muted)}.readonly-view{-webkit-user-select:text;user-select:text}select:focus{border-color:var(--color-accent);outline:2px solid var(--color-accent);outline-offset:3px}button:focus-visible{border-color:var(--color-accent);outline:2px solid var(--color-accent);outline-offset:3px}.text-viewport:focus,.chat-input:focus{border-color:var(--color-border);outline:0}.editor-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-top:16px;display:flex}.controls-row{grid-template-columns:minmax(0,1fr);align-items:end;gap:12px;margin-top:14px;display:grid}label{color:var(--color-muted);font-family:var(--font-mono);text-transform:uppercase;gap:8px;font-size:12px;font-weight:400;display:grid}select{border:1px solid var(--color-primary);background:var(--color-background);width:100%;color:var(--color-primary);border-radius:0;padding:0 12px}.cost-note{color:var(--color-muted);font-family:var(--font-mono);margin:0;font-size:12px;line-height:1.4}.reset-button,.example-grid button{border:1px solid var(--color-primary);font-family:var(--font-mono);text-transform:uppercase;border-radius:0;font-size:12px;font-weight:400;transition:opacity .15s,background .2s}.reset-button{background:var(--color-primary);color:var(--color-background);align-items:center;gap:8px;padding:0 16px;display:inline-flex}.reset-button svg{fill:currentColor;width:16px;height:16px}.reset-button:hover{opacity:.65}.example-grid button{background:var(--color-background);color:var(--color-primary);padding:0 14px}.example-grid button:hover{background:var(--color-hover-highlight)}.example-grid{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.stats-card{border-top:0;padding-top:0;position:sticky;top:24px}.context-box{border:1px solid var(--color-primary);border-radius:var(--radius-block);background:var(--color-code-block);color:var(--color-dark-primary);padding:16px}.context-label{color:var(--color-dark-primary);font-family:var(--font-mono);text-transform:uppercase;justify-content:space-between;gap:12px;font-size:12px;font-weight:400;display:flex}.meter{background:var(--color-dark-muted);border:0;border-radius:0;height:2px;margin:16px 0;overflow:hidden}.meter span{background:var(--color-accent);height:100%;display:block}.context-box p{color:var(--color-dark-muted);margin-bottom:0}.context-metrics{border-bottom:1px solid var(--color-border);color:var(--color-muted);font-family:var(--font-mono);gap:8px;margin:18px 0 0;padding:0 0 18px;font-size:12px;line-height:1.3;display:grid}.context-metrics div{justify-content:space-between;gap:12px;display:flex}.context-metrics dt,.context-metrics dd{color:inherit;font:inherit;margin:0}.context-metrics dd{color:var(--color-primary);text-align:right}.invoice-panel{margin-top:18px;overflow:hidden}.invoice-nav{color:var(--color-muted);font-family:var(--font-mono);text-align:center;text-transform:uppercase;grid-template-columns:32px minmax(0,1fr) 32px;align-items:center;gap:8px;margin-bottom:8px;font-size:11px;line-height:1.3;display:grid}.invoice-nav button{border:1px solid var(--color-border);background:var(--color-background);min-width:32px;min-height:32px;color:var(--color-primary);border-radius:0;place-items:center;padding:0;display:inline-grid}.invoice-nav button:disabled{cursor:default;color:var(--color-muted);opacity:.55}.invoice-nav svg,.invoice-nav path{fill:currentColor;display:block}.invoice-nav svg{width:16px;height:16px}.invoice-slide{will-change:transform, opacity}.invoice-slide-next{animation:.24s ease-out invoice-slide-next}.invoice-slide-previous{animation:.24s ease-out invoice-slide-previous}.invoice-table{border-collapse:collapse;width:100%;color:var(--color-muted);font-family:var(--font-mono);font-size:11px;line-height:1.3}.invoice-table caption{color:var(--color-primary);text-align:left;text-transform:uppercase;margin-bottom:8px}.invoice-table th,.invoice-table td{border-bottom:1px solid var(--color-border-subtle);font:inherit;text-align:right;vertical-align:top;padding:6px 0}.invoice-table th:first-child,.invoice-table td:first-child{text-align:left}.invoice-table tbody th{color:var(--color-primary);font-weight:400}.invoice-table .inactive th,.invoice-table .inactive td{color:var(--color-muted)}.invoice-table tfoot th,.invoice-table tfoot td{color:var(--color-primary);padding-top:9px;font-weight:700}.invoice-table tfoot tr:last-child th,.invoice-table tfoot tr:last-child td{border-bottom:0}.invoice-table .conversation-total th,.invoice-table .conversation-total td{color:var(--color-primary);padding-top:10px}@keyframes invoice-slide-next{0%{opacity:0;transform:translate(18px)}to{opacity:1;transform:translate(0)}}@keyframes invoice-slide-previous{0%{opacity:0;transform:translate(-18px)}to{opacity:1;transform:translate(0)}}@media (prefers-reduced-motion:reduce){.invoice-slide-next,.invoice-slide-previous{animation:none}}.help-text{margin:18px 0 0}.token-stream{color:var(--color-primary);overflow-wrap:anywhere}.token-segment{-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:.02em .08em;display:inline}.token-segment:hover{outline:2px solid var(--color-accent);outline-offset:2px}.token-segment:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.token-0{background:var(--color-border-subtle)}.token-1{background:var(--color-hover-highlight)}.token-2{background:var(--color-shell)}.token-3{background:var(--color-primary);color:var(--color-background)}.token-4{background:var(--color-accent);color:var(--color-dark-primary)}.token-5{background:var(--color-background);box-shadow:inset 0 0 0 1px var(--color-border)}.token-kind-whitespace,.token-kind-newline{color:var(--color-muted)}.token-more{background:var(--color-accent);color:var(--color-dark-primary)}.references{margin-top:var(--space-section);padding:var(--space-section) 0 0;border-top:1px solid var(--color-primary)}.references h2{margin-bottom:18px}.references ol{color:var(--color-muted);font-family:var(--font-mono);gap:14px;margin:0;padding-left:22px;font-size:12px;line-height:1.5;display:grid}.references li{padding-left:4px}.references cite{color:var(--color-primary);font-style:normal}.references cite span{font-style:italic}.references p:not(.eyebrow){max-width:760px;color:var(--color-muted);margin:4px 0 0}.references a{color:var(--color-accent);text-underline-offset:3px;text-decoration-thickness:1px}.references a:hover{background:var(--color-hover-highlight);color:var(--color-primary)}@media (max-width:900px){.app-shell{padding-right:var(--space-tablet);padding-left:var(--space-tablet)}.app-shell:before{margin-right:calc(var(--space-tablet) * -1);margin-left:calc(var(--space-tablet) * -1)}h1{font-size:36px}.workspace{grid-template-columns:minmax(0,1fr)}.stats-card{border-top:1px solid var(--color-primary);padding-top:var(--space-section);position:static}.view-bar{grid-template-columns:minmax(0,1fr)}.inline-metrics{text-align:left;justify-content:flex-start}}@media (max-width:620px){.app-shell{padding-right:var(--space-mobile);padding-bottom:60px;padding-left:var(--space-mobile)}.app-shell:before{margin-right:calc(var(--space-mobile) * -1);margin-left:calc(var(--space-mobile) * -1)}.hero{padding-top:40px}h1{font-size:28px}.view-bar{gap:12px;display:grid}.view-toggle{width:100%}.view-toggle button{flex:1;min-width:0}.text-viewport{height:360px;padding:18px}.plaintext-shell{height:360px}.input-toolbar{grid-template-columns:minmax(0,1fr);gap:8px}.patch-layer-grid{grid-area:auto/1;justify-content:flex-start;width:100%}.chat-composer{grid-template-columns:minmax(0,1fr) auto}.chat-submit{min-height:44px}.chat-impact{border-right:1px solid var(--color-border);text-align:left;border-bottom:0;grid-column:1;grid-template-columns:repeat(3,minmax(0,1fr));justify-content:stretch;display:grid}}
