@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&family=Manrope:wght@400;500;600;700&display=swap";:root{--bg:#f5efe2;--split-primary:58%;--splitter-size:.95rem;--panel-alt:#faf6eee6;--panel-border:#31292026;--text:#1f1d19;--text-soft:#645f55;--text-inverse:#f7f0e6;--accent:#f8c548;--accent-strong:#ea5a24;--editor-text:#f8f1df;--editor-surface:linear-gradient(180deg, #111418fc, #1c2024f7);--console-surface:#fffcf7bf;--shadow:0 24px 60px #37261324;--gutter:#f8f1df8f;--syntax-keyword:#ffb86c;--syntax-property:#9cdcfe;--syntax-variable:#f8f1df;--syntax-function:#ffd866;--syntax-constant:#7dd3fc;--syntax-punctuation:#d6cfbf;--syntax-number:#86efac;--syntax-string:#fca5a5;--syntax-comment:#a8b3bf;--syntax-operator:#c4b5fd;--radius-xl:28px;--radius-md:16px;--sans:"Manrope", sans-serif;--display:"Instrument Serif", serif;--mono:"IBM Plex Mono", monospace;color:var(--text);background:radial-gradient(circle at top left, #f8c5484d, transparent 28%), radial-gradient(circle at right 15%, #ea5a2424, transparent 24%), linear-gradient(180deg, #fbf7ef, var(--bg));font:16px/1.5 var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body:before{content:"";pointer-events:none;opacity:.35;background-image:linear-gradient(#382d220b 1px,#0000 1px),linear-gradient(90deg,#382d220b 1px,#0000 1px);background-size:32px 32px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000000bf,#0000 92%);mask-image:linear-gradient(#000000bf,#0000 92%)}button,kbd{font:inherit}button{cursor:pointer;border:0}kbd{font-family:var(--mono);background:#1f1d1914;border:1px solid #1f1d1914;border-radius:.45rem;padding:.16rem .42rem;font-size:.85rem}#app{min-height:100svh;padding:2rem}.shell{grid-template-rows:auto minmax(0,1fr);gap:1.5rem;width:min(1380px,100%);min-height:calc(100svh - 4rem);margin:0 auto;display:grid}.masthead{grid-template-columns:minmax(0,1fr) minmax(280px,.9fr);align-items:center;gap:1rem;display:grid}h1,h2,p{margin:0}h1{letter-spacing:-.05em;flex-wrap:wrap;align-items:baseline;gap:.9rem;font-size:clamp(2.5rem,5vw,3.6rem);line-height:1;display:flex}h1 span{font-family:var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--accent-strong);font-size:.32em;font-weight:700}.intro{max-width:34rem;color:var(--text-soft);justify-self:end;font-size:.98rem}.workspace{grid-template-columns:minmax(0, var(--split-primary)) var(--splitter-size) minmax(0, calc(100% - var(--split-primary) - var(--splitter-size)));min-height:0;align-items:stretch;gap:.75rem;block-size:100%;display:grid}.panel{min-height:0;border-radius:var(--radius-xl);border:1px solid var(--panel-border);block-size:100%;min-block-size:clamp(28rem,62svh,48rem);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow:hidden}.editor-panel{background:var(--editor-surface);color:var(--editor-text);grid-template-rows:auto minmax(0,1fr);display:grid}.console-panel{background:var(--panel-alt);grid-template-rows:auto minmax(0,1fr);display:grid}.splitter{block-size:100%;inline-size:var(--splitter-size);min-inline-size:var(--splitter-size);cursor:col-resize;touch-action:none;border-radius:999px;outline:none;align-self:stretch;position:relative}.splitter:before{content:"";background:#1f1d1914;border-radius:999px;transition:background-color .18s,box-shadow .18s,transform .18s;position:absolute;inset:.45rem .2rem}.splitter:hover:before{background:#ea5a2429}.splitter:focus-visible:before{background:#ea5a2433;box-shadow:0 0 0 3px #ea5a2438}.splitter-handle{pointer-events:none;background:linear-gradient(#ea5a24b3,#f8c548e6);border-radius:999px;block-size:4.75rem;inline-size:.3rem;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #fff6,0 10px 22px #5f370c2e}.workspace[data-collapsed=true] .editor-panel{min-inline-size:0}.panel-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;gap:1rem;padding:1.1rem 1.15rem;display:flex}.panel-kicker{text-transform:uppercase;letter-spacing:.2em;color:var(--accent-strong);margin:0 0 .35rem;font-size:.75rem;font-weight:700}.console-panel .panel-header{border-bottom-color:#3129201f}.panel-header h2{letter-spacing:-.03em;font-size:1.1rem;font-weight:700}.actions{flex-wrap:wrap;justify-content:flex-end;gap:.7rem;display:flex}.primary-button,.ghost-button{border-radius:999px;padding:.72rem 1rem;transition:transform .18s,background-color .18s,border-color .18s}.primary-button{background:var(--accent);color:#241b0d;font-weight:700}.ghost-button{color:inherit;background:0 0;border:1px solid #ffffff24}.console-panel .ghost-button{border-color:#1f1d191f}.primary-button:hover,.ghost-button:hover{transform:translateY(-1px)}.editor-host,.console-output{min-height:0}.console-output{background:linear-gradient(180deg, #fff6, transparent 20%), var(--console-surface);flex-direction:column;gap:.8rem;padding:1rem;display:flex;overflow:auto}.console-empty{text-align:center;min-height:100%;color:var(--text-soft);place-content:center;gap:.35rem;padding:2rem;display:grid}.console-empty-title{color:var(--text);font-weight:700}.console-line{border-radius:var(--radius-md);background:#ffffff8f;border:1px solid #1f1d1914;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.85rem;padding:.8rem .9rem;display:grid}.console-line-command{color:var(--text-inverse);background:#1f1d19f0;border-color:#f8c5482e}.console-line-warn{background:#f8c54824}.console-line-error{background:#ea5a241f}.console-line-result{background:#2c83681f}.console-badge{min-width:3.3rem;font-family:var(--mono);text-transform:uppercase;text-align:center;letter-spacing:.08em;background:#1f1d1914;border-radius:999px;padding:.25rem .55rem;font-size:.72rem}.console-content{white-space:pre-wrap;word-break:break-word;font-family:var(--mono);margin:0;font-size:.9rem;line-height:1.55}@media (width<=980px){#app{padding:1rem}.shell{min-height:calc(100svh - 2rem)}.masthead,.workspace{grid-template-columns:1fr}.intro{justify-self:start}h1{gap:.65rem}.workspace{gap:1rem;block-size:auto}.editor-panel,.console-panel{min-block-size:min(32rem,70svh)}.splitter{display:none}}@media (width<=640px){.panel-header{flex-direction:column;align-items:start}.actions{justify-content:stretch;width:100%}.primary-button,.ghost-button{width:100%}.console-line{grid-template-columns:1fr}}#spacer{border-top:1px solid var(--border);height:88px}@media (width<=1024px){#spacer{height:48px}}.ticks{width:100%;position:relative}.ticks:before,.ticks:after{content:"";border:5px solid #0000;position:absolute;top:-4.5px}.ticks:before{border-left-color:var(--border);left:0}.ticks:after{border-right-color:var(--border);right:0}