:root{color-scheme:dark;--bg: #0a0a0f;--bg-soft: #0d0d14;--surface: #101017;--surface-raised: #141419;--surface-hover: #1a1a22;--panel-border: rgba(255, 255, 255, .08);--panel-border-strong: rgba(255, 255, 255, .14);--text: #fafafa;--muted: #b8b8b8;--faint: #888888;--accent: #8b5cf6;--accent-soft: rgba(139, 92, 246, .2);--accent-2: #c084fc;--green: #79c786;--blue: #89b8ff;--purple: #c7a2ff;--red: #ff7b72;--canvas-border: var(--surface-raised);--canvas-background: linear-gradient(180deg, rgba(255, 255, 255, .035), transparent 120px), var(--surface-raised);--mono: "IBM Plex Mono", "Geist Mono", "SFMono-Regular", "Cascadia Code", "Roboto Mono", Consolas, monospace;--sans: "Rubik Variable", "Geist 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-family:var(--sans);font-feature-settings:"kern"}button,input,select,textarea{font:inherit}.app{min-height:100vh;padding:0;display:grid;place-items:center}p{margin:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.status{color:var(--muted);font-size:13px}.status:empty{display:none}.button{min-height:34px;border:0;border-radius:7px;padding:0 13px;color:var(--text);cursor:pointer;font-size:13px;font-weight:500;transition:background .12s ease,color .12s ease}.button.primary{background:var(--accent-soft);color:#ddd0ff;font-weight:500}.button.secondary,.button.ghost{background:#ffffff0a;color:var(--muted)}.button.is-success{background:#79c78629;color:var(--green)}.button.is-active{background:var(--accent-soft);color:#ddd0ff}.button:disabled{color:var(--faint);cursor:not-allowed;opacity:.45}.icon-button{display:inline-grid;width:34px;min-width:34px;place-items:center;padding:0}.icon-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.button.ghost{min-height:30px;color:var(--muted);font-size:13px}.button.primary:hover{background:#8b5cf64d}.button.secondary:hover,.button.ghost:hover{background:#ffffff14;color:var(--text)}.button.is-success:hover{background:#79c78638}.button.is-active:hover{background:#8b5cf64d;color:#eee7ff}.button.secondary:disabled:hover,.button.ghost:disabled:hover{background:#ffffff0a}.button.primary:disabled:hover{background:var(--accent-soft)}.canvas-workspace{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto;align-content:center;gap:0;width:100%;max-width:1480px;min-height:100vh;margin:0 auto;padding:24px}.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;width:min(760px,100%);justify-self:center;margin-bottom:14px;border:0;border-radius:8px;padding:12px;background:var(--canvas-background);box-shadow:none;transition:background .12s ease}.toolbar-spacer{flex:1 1 auto;min-width:16px}.toolbar-item{display:flex;align-items:center;min-width:0}.action-group{display:flex;align-items:center;gap:4px}label,legend,.control-label{color:var(--muted);font-size:12px;font-weight:650}select,input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea{width:100%;border:1px solid var(--panel-border);border-radius:7px;background:var(--bg-soft);color:var(--text);outline:none}select,input:not([type=checkbox]):not([type=radio]):not([type=range]){height:34px;padding:0 10px}select{color-scheme:dark;min-width:128px;border:0;border-radius:7px;padding-right:30px;background:linear-gradient(45deg,transparent 50%,var(--muted) 50%) calc(100% - 15px) 14px / 5px 5px no-repeat,linear-gradient(135deg,var(--muted) 50%,transparent 50%) calc(100% - 10px) 14px / 5px 5px no-repeat,#ffffff0a;color:var(--text);cursor:pointer;appearance:none}select option{background:var(--surface);color:var(--text)}select option:disabled{color:var(--faint)}select:hover,select:focus{background:linear-gradient(45deg,transparent 50%,#ddd0ff 50%) calc(100% - 15px) 14px / 5px 5px no-repeat,linear-gradient(135deg,#ddd0ff 50%,transparent 50%) calc(100% - 10px) 14px / 5px 5px no-repeat,#ffffff12}select:disabled{color:var(--faint);cursor:not-allowed;opacity:.62}select:disabled:hover{background:linear-gradient(45deg,transparent 50%,var(--muted) 50%) calc(100% - 15px) 14px / 5px 5px no-repeat,linear-gradient(135deg,var(--muted) 50%,transparent 50%) calc(100% - 10px) 14px / 5px 5px no-repeat,#ffffff0a}input[type=color]{padding:3px}input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer}.segmented{display:grid;gap:0;overflow:hidden;border-radius:7px;background:#ffffff0a}.segmented-size{grid-template-columns:repeat(4,1fr);width:132px}.segmented-font{grid-template-columns:repeat(3,1fr);width:102px}.segmented label{display:grid;place-items:center;height:34px;border-left:1px solid rgba(255,255,255,.055);border-radius:0;background:transparent;color:var(--muted);cursor:pointer;transition:background .12s ease,color .12s ease}.segmented label:first-child{border-left:0}.segmented input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.segmented span{font-family:var(--mono);font-size:16px;line-height:1}.font-size-icon{display:block;font-family:var(--sans);font-weight:650;line-height:1}.segmented .font-size-icon-small{font-size:11px}.segmented .font-size-icon-medium{font-size:14px}.segmented .font-size-icon-large{font-size:17px}.segmented svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.segmented label:has(input:checked){background:var(--accent-soft);color:#ddd0ff}.segmented label:hover{background:#ffffff14;color:var(--text)}.segmented label:has(input:checked):hover{background:#8b5cf64d;color:#eee7ff}textarea{display:block;min-height:640px;height:calc(100vh - 156px);resize:none;border:0;border-radius:0 0 8px 8px;padding:18px;background:var(--bg-soft);color:#e9e4dc;font-family:var(--mono);font-size:14px;line-height:1.6}.canvas-stage{display:grid;position:relative;width:min(900px,100%);justify-self:center;min-height:0;height:auto;place-items:center;overflow:auto;padding:0;background:var(--bg)}.canvas{--canvas-font-size: 16px;--canvas-padding-y: 16px;--canvas-padding-x: 24px;--content-padding-y: var(--canvas-padding-y);--content-padding-x: var(--canvas-padding-x);--editor-line-height: calc(var(--canvas-font-size) * 1.6);display:flex;flex-direction:column;width:min(760px,100%);min-height:calc(var(--editor-line-height) + (var(--canvas-padding-y) * 2));padding:var(--canvas-padding-y) var(--canvas-padding-x);border:1px solid var(--canvas-border);border-radius:8px;background:var(--canvas-background);color:var(--text);box-shadow:none}.canvas[data-mode=code] .canvas-content,.canvas[data-mode=code] .source-editor,.canvas[data-mode=code] .code-block,.canvas[data-mode=code] pre{height:100%}.canvas[data-mode=code] .canvas-content{position:relative;flex:1 1 auto;min-height:0;margin:calc(var(--canvas-padding-y) * -1) calc(var(--canvas-padding-x) * -1);padding:0}.canvas[data-empty=true][data-mode=code] .canvas-content{height:auto;min-height:var(--editor-line-height)}.canvas[data-mode=markdown] .canvas-content{position:relative;min-height:var(--editor-line-height)}.source-editor{min-height:var(--editor-line-height);color:#e9e4dc;font-family:var(--mono);font-size:var(--canvas-font-size);line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}.source-editor .code-block{min-height:inherit}.markdown-source pre{overflow:visible;padding:0;background:transparent}.markdown-code-block{display:block}.markdown-source .markdown-fence-line .token.keyword{color:var(--faint)}.canvas[data-mode=code] .code-block{border:0}.canvas[data-mode=code] pre{padding:var(--canvas-padding-y) var(--canvas-padding-x)}.canvas:focus{outline:0}.canvas-content-editor{display:none;width:100%;min-height:var(--editor-line-height);height:auto;padding:0;border:0;border-radius:0;resize:none;background:transparent;color:#e9e4dc;box-shadow:none;font-family:var(--mono);font-size:var(--canvas-font-size, 16px);line-height:1.6;outline:0;tab-size:2}.canvas[data-mode=code] .canvas-content-editor,.canvas[data-mode=markdown] .canvas-content-editor{position:absolute;inset:0;z-index:1;display:block;min-height:var(--editor-line-height);height:100%!important;overflow:hidden;background:transparent;color:transparent;caret-color:#e9e4dc;white-space:pre-wrap;overflow-wrap:anywhere}.canvas[data-empty=true] .canvas-content-editor{min-height:0;height:100%!important;overflow:hidden}.canvas[data-mode=code] .canvas-content-editor{padding:var(--canvas-padding-y) var(--canvas-padding-x)}.canvas[data-mode=markdown] .canvas-content-editor{padding:var(--content-padding-y) var(--content-padding-x)}.canvas[data-mode=code] .canvas-content-editor::selection,.canvas[data-mode=markdown] .canvas-content-editor::selection{background:#8b5cf652;color:transparent}.canvas-content-editor::placeholder{color:transparent}.canvas[data-empty=true] .canvas-content-editor::placeholder{color:var(--faint);opacity:1}.canvas[data-preset=auto]{width:fit-content;min-width:min(320px,100%);max-width:min(760px,100%)}.canvas[data-preset=square]{width:720px}.canvas[data-preset=landscape]{width:900px}.canvas[data-preset=story]{width:520px}.canvas-content{display:grid;gap:14px;position:relative;margin:calc(var(--content-padding-y) * -1) calc(var(--content-padding-x) * -1);padding:var(--content-padding-y) var(--content-padding-x);border-radius:0;transition:background .12s ease}.canvas-content h2,.canvas-content h3{margin:0;color:var(--text);letter-spacing:0}.canvas-content h2{font-size:clamp(24px,4vw,42px);line-height:1.04}.canvas-content h3{font-size:22px}.canvas-content p,.canvas-content li,.quote,.callout{color:#e7e7e7;font-size:var(--canvas-font-size);line-height:1.55}.canvas-content p{margin:0}.canvas-content ul,.canvas-content ol{margin:0;padding-left:1.25em}.quote{margin:0;border:1px solid rgba(255,255,255,.1);border-radius:0;padding:10px 12px 10px 16px;background:#ffffff0b;box-shadow:inset 4px 0 0 var(--accent);color:#bfc7d5}.callout{border:1px solid rgba(255,255,255,.1);border-radius:0;padding:10px 12px 10px 16px;background:#ffffff0b;box-shadow:inset 4px 0 0 var(--accent)}.em-highlight{border-radius:0;padding:.08em .28em;background:var(--accent-soft);color:#ddd0ff}.text-red{color:var(--red)}.text-blue{color:var(--blue)}.text-green{color:var(--green)}.text-yellow{color:var(--accent-2)}.code-block{overflow:hidden;border:0;border-radius:0;background:transparent}pre{margin:0;overflow:hidden;padding:10px;color:#e9e4dc;font-family:var(--mono);font-size:var(--canvas-font-size);line-height:1.6;tab-size:2;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal}.code-line{display:block;min-height:1.6em;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.token.keyword{color:#ff9d7a}.token.string{color:#a6d189}.token.number{color:#f2b35d}.token.comment{color:#687385;font-style:italic}.token.fn{color:#89b8ff}.token.type{color:#c7a2ff}.agent-role,.agent-user{color:#89b8ff;font-weight:700}.agent-tool{color:#c7a2ff;font-weight:700}.agent-result{color:var(--faint)}.agent-line-number{color:var(--faint);user-select:none}.agent-command{color:#f2b35d;font-weight:700}.agent-path,.agent-inline-code{color:#f6c177}.agent-error{color:var(--red);font-weight:700}.agent-success,.agent-added{color:var(--green)}.agent-removed{color:var(--red)}.agent-diff-meta{color:var(--faint)}.agent-diff-file{color:#f2b35d}.agent-diff-hunk{color:#c7a2ff;font-weight:700}.markdown-marker{color:var(--faint)}.markdown-heading,.markdown-strong,.markdown-emphasis,.markdown-underline{color:#e9e4dc}.markdown-heading,.markdown-strong{font-weight:700}.markdown-emphasis{font-style:italic}.markdown-underline{text-decoration:underline}.markdown-quote{color:#bfc7d5;font-style:italic}.markdown-inline-code-content{color:#f6c177}code.inline-code{border:1px solid rgba(255,255,255,.08);border-radius:0;padding:.06em .28em;background:transparent;color:#f6c177;font-family:var(--mono);font-size:.92em}@media(max-width:1180px){.canvas-workspace{max-width:none}}@media(max-width:760px){.app{padding:0}.canvas-workspace{display:grid;grid-template-columns:1fr;align-content:start;padding:12px 14px 14px}.toolbar{flex-wrap:nowrap;gap:8px}.toolbar-language{order:1}.toolbar-size,.toolbar-font{display:none}.action-group{order:6;margin-left:auto}.toolbar-spacer{display:block;flex:1 1 auto;min-width:0;order:5}.status{order:7}select{min-width:112px}.canvas-stage{height:auto;min-height:0;padding:0}.canvas[data-preset=square],.canvas[data-preset=landscape],.canvas[data-preset=story]{width:min(100%,680px)}}@media(max-width:380px){.canvas-workspace{padding-inline:7px}.toolbar{width:100%}select{min-width:118px}}@font-face{font-family:Rubik Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/rubik-arabic-wght-normal-CGnJ-sf6.woff2) format("woff2-variations");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}@font-face{font-family:Rubik Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/rubik-cyrillic-ext-wght-normal-BjodpZir.woff2) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Rubik Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/rubik-cyrillic-wght-normal-DveCct9I.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Rubik Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/rubik-hebrew-wght-normal-BIkpbuMU.woff2) format("woff2-variations");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}@font-face{font-family:Rubik Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/rubik-latin-ext-wght-normal-OacczzuJ.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Rubik Variable;font-style:normal;font-display:swap;font-weight:300 900;src:url(/assets/rubik-latin-wght-normal-CnQIisVs.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2) format("woff2"),url(/assets/ibm-plex-mono-latin-400-normal-CvHOgSBP.woff) format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/ibm-plex-mono-latin-500-normal-DSY6xOcd.woff2) format("woff2"),url(/assets/ibm-plex-mono-latin-500-normal-CB9ihrfo.woff) format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-mono-latin-600-normal-BgSNZQsw.woff2) format("woff2"),url(/assets/ibm-plex-mono-latin-600-normal-DWFSQ4vo.woff) format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/ibm-plex-mono-latin-700-normal-7sUh57Bg.woff2) format("woff2"),url(/assets/ibm-plex-mono-latin-700-normal-CNHXzs6v.woff) format("woff")}
