:root{color-scheme:light;--bg: #f4ede1;--bg-deep: #e9ddcb;--surface: #fffdf8;--surface-raised: #ffffff;--surface-soft: #faf4e9;--text: #263238;--text-strong: #182125;--muted: #655f58;--muted-light: #6f675e;--line: #ded3c3;--line-strong: #c9baa5;--accent: #9f3e22;--accent-contrast: #fffaf4;--accent-hover: #813019;--accent-soft: #f5dfd2;--ochre: #865713;--teal: #19666c;--teal-soft: #dceff0;--success: #2c6b4f;--success-soft: #e1f0e7;--danger: #a13232;--danger-soft: #f7e1de;--code-bg: #171c20;--code-text: #f8ead4;--wood-light: #f2dab0;--wood-mid: #d8ad74;--wood-dark: #8e6237;--slate: #111817;--slate-raised: #18211f;--chalk: #f1f1df;--chalk-muted: #aeb9ad;--shadow-sm: 0 1px 2px rgb(50 38 22 / 7%), 0 4px 14px rgb(50 38 22 / 5%);--shadow-lg: 0 20px 60px rgb(45 34 20 / 16%), 0 3px 12px rgb(45 34 20 / 8%);--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace}:root[data-theme=dark]{color-scheme:dark;--bg: #101518;--bg-deep: #0b0f11;--surface: #171c20;--surface-raised: #1d2428;--surface-soft: #20282d;--text: #f5ead9;--text-strong: #fff8ed;--muted: #b9b0a5;--muted-light: #938d85;--line: #323c41;--line-strong: #48555b;--accent: #ee8850;--accent-contrast: #12262a;--accent-hover: #f49c69;--accent-soft: #3a271e;--ochre: #e5aa50;--teal: #72c5c9;--teal-soft: #18383b;--success: #86c89f;--success-soft: #183529;--danger: #f08a80;--danger-soft: #3b2222;--shadow-sm: 0 1px 2px rgb(0 0 0 / 25%), 0 5px 16px rgb(0 0 0 / 20%);--shadow-lg: 0 22px 70px rgb(0 0 0 / 45%), 0 3px 14px rgb(0 0 0 / 30%);--wood-light: #e9ce9e;--wood-mid: #c99b61;--wood-dark: #77502d;--slate: #0d1413;--slate-raised: #151e1c;--chalk: #f1f1df;--chalk-muted: #b2bdb0}*,*:before,*:after{box-sizing:border-box}html{min-width:320px;min-height:100%;background:var(--bg)}body{min-width:320px;min-height:100vh;margin:0;color:var(--text);background:radial-gradient(circle at 8% 4%,color-mix(in srgb,var(--ochre) 9%,transparent) 0 12rem,transparent 26rem),radial-gradient(circle at 94% 95%,color-mix(in srgb,var(--teal) 8%,transparent) 0 10rem,transparent 28rem),var(--bg);font-family:var(--font-sans);font-size:15px;line-height:1.5;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid color-mix(in srgb,var(--teal) 58%,transparent);outline-offset:2px}.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}.app-shell{min-height:100vh;display:flex;flex-direction:column}.site-header{position:relative;z-index:30;min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px clamp(16px,3vw,44px);border-bottom:1px solid color-mix(in srgb,var(--line) 82%,transparent);background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(16px)}.brand{min-width:0;display:inline-flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand__mark{width:48px;height:48px;display:block;filter:drop-shadow(0 4px 5px rgb(89 51 24 / 14%))}.brand__copy{min-width:0;display:grid;line-height:1.05}.brand__copy strong{color:var(--text-strong);font-family:Georgia,Times New Roman,serif;font-size:1.75rem;font-weight:700;letter-spacing:-.035em}.brand__copy>span{margin-top:5px;color:var(--muted);font-size:.76rem;font-weight:650;letter-spacing:.045em}.header-actions,.toolbar,.toolbar__primary,.toolbar__secondary,.console-actions{display:flex;align-items:center}.header-actions{gap:9px}.language-switch{display:inline-flex;align-items:center;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--surface-soft)}.language-switch button{min-width:38px;height:31px;padding:0 10px;border:0;border-radius:999px;color:var(--muted);background:transparent;cursor:pointer;font-size:.72rem;font-weight:800;letter-spacing:.06em;transition:color .15s ease,background-color .15s ease,box-shadow .15s ease}.language-switch button[aria-pressed=true]{color:var(--text-strong);background:var(--surface-raised);box-shadow:var(--shadow-sm)}.icon-button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;cursor:pointer;font-weight:720;transition:transform .14s ease,color .14s ease,border-color .14s ease,background-color .14s ease,box-shadow .14s ease}.icon-button:hover,.button:hover{transform:translateY(-1px)}.icon-button:active,.button:active{transform:translateY(0)}.icon-button{min-height:39px;padding:0 13px;border-color:var(--line);border-radius:999px;background:var(--surface-soft)}.icon-button:hover,.icon-button.is-active{border-color:var(--line-strong);background:var(--surface-raised);box-shadow:var(--shadow-sm)}.icon-button--square{width:39px;padding:0}.icon-button--small{width:33px;min-height:33px}.workspace{position:relative;flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 0;gap:0;padding:clamp(14px,2.1vw,30px) clamp(14px,2.6vw,40px);overflow:hidden;transition:grid-template-columns .22s ease}.workspace.has-learn-panel{grid-template-columns:minmax(0,1fr) 338px;gap:clamp(14px,1.5vw,24px)}.playground{min-width:0;min-height:0;display:grid;grid-template-columns:minmax(480px,1.45fr) minmax(300px,.72fr);gap:clamp(12px,1.4vw,22px)}.editor-panel,.console-panel,.diagnostics,.learn-panel{min-width:0;overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow-sm)}.editor-panel,.console-panel,.diagnostics{border-radius:var(--radius-md)}.editor-panel{min-height:0;display:flex;flex-direction:column}.results-column{min-width:0;min-height:0;display:grid;grid-template-rows:minmax(280px,1.15fr) minmax(180px,.85fr);gap:clamp(12px,1.4vw,22px)}.panel-heading{flex:none;min-height:67px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;border-bottom:1px solid var(--line);background:var(--surface-raised)}.panel-heading h1,.panel-heading h2,.diagnostics__heading h2{margin:1px 0 0;color:var(--text-strong);font-size:1rem;line-height:1.25;letter-spacing:-.015em}.panel-kicker{display:block;color:var(--muted-light);font-family:var(--font-mono);font-size:.67rem;font-weight:650;letter-spacing:.035em}.autosave-note,.run-stats,.keyboard-hint{color:var(--muted-light);font-size:.72rem;font-weight:620}.autosave-note{display:inline-flex;align-items:center;gap:6px}.autosave-note>span{color:var(--success);font-size:.55rem}.toolbar{flex:none;min-height:58px;justify-content:space-between;gap:14px;padding:9px 12px;border-bottom:1px solid var(--line);background:var(--surface-soft)}.toolbar__primary,.toolbar__secondary,.console-actions{gap:8px}.toolbar__secondary{margin-left:auto}.button{min-height:38px;padding:0 14px;border-radius:var(--radius-sm);font-size:.82rem}.button--run{min-width:112px;color:var(--accent-contrast);background:var(--accent);box-shadow:0 7px 16px color-mix(in srgb,var(--accent) 25%,transparent)}.button--run:hover{background:var(--accent-hover);box-shadow:0 9px 20px color-mix(in srgb,var(--accent) 32%,transparent)}.button--stop{min-width:112px;color:var(--danger);border-color:color-mix(in srgb,var(--danger) 40%,var(--line));background:var(--danger-soft)}.button--quiet{border-color:var(--line);color:var(--muted);background:var(--surface-raised)}.button--quiet:hover{color:var(--text-strong);border-color:var(--line-strong);box-shadow:var(--shadow-sm)}.status-pill{display:inline-flex;align-items:center;gap:7px;min-height:30px;padding:0 10px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:var(--surface-raised);font-size:.7rem;font-weight:700;white-space:nowrap}.status-pill__dot{width:7px;height:7px;border-radius:50%;background:var(--muted-light)}.status-pill--good{color:var(--success);border-color:color-mix(in srgb,var(--success) 25%,var(--line));background:var(--success-soft)}.status-pill--good .status-pill__dot{background:var(--success)}.status-pill--bad{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 25%,var(--line));background:var(--danger-soft)}.status-pill--bad .status-pill__dot{background:var(--danger)}.status-pill--active{color:var(--teal);border-color:color-mix(in srgb,var(--teal) 25%,var(--line));background:var(--teal-soft)}.status-pill--active .status-pill__dot{background:var(--teal);box-shadow:0 0 color-mix(in srgb,var(--teal) 35%,transparent);animation:pulse 1.4s infinite}@keyframes pulse{50%{box-shadow:0 0 0 5px color-mix(in srgb,var(--teal) 0%,transparent)}}.code-editor{flex:1;min-height:360px;overflow:hidden;background:var(--surface)}.code-editor .cm-editor{height:100%;font-family:var(--font-mono);font-size:.875rem}.code-editor .cm-editor.cm-focused{outline:none}.code-editor .cm-scroller{padding:10px 0 28px;line-height:1.72;overscroll-behavior:contain}.code-editor .cm-content{padding:0 14px}.code-editor .cm-gutterElement{padding:0 10px 0 8px}.code-editor .cm-foldGutter .cm-gutterElement{padding:0 5px}.code-editor .cm-tooltip{border-radius:8px;box-shadow:var(--shadow-lg);overflow:hidden}.code-editor .cm-tooltip-autocomplete>ul{font-family:var(--font-sans)}.code-editor .cm-tooltip-autocomplete>ul>li{padding:5px 9px}.console-panel{position:relative;min-height:0;display:flex;flex-direction:column;padding:clamp(10px,1vw,14px);border-color:var(--wood-dark);background:linear-gradient(135deg,rgb(255 255 255 / 42%),transparent 31%),repeating-linear-gradient(4deg,transparent 0 7px,rgb(87 52 20 / 8%) 8px,transparent 10px 16px),linear-gradient(90deg,var(--wood-dark),var(--wood-light) 8%,var(--wood-mid) 48%,var(--wood-light) 92%,var(--wood-dark));box-shadow:inset 0 2px #ffffff73,inset 0 -3px #472a1338,0 12px 28px #3e271224}.console-slate{min-height:0;flex:1;display:flex;flex-direction:column;overflow:hidden;border:2px solid color-mix(in srgb,var(--slate) 82%,var(--wood-dark));border-radius:7px;background:var(--slate);box-shadow:inset 0 0 30px #00000057,0 1px 1px #ffffff61}.panel-heading--console{min-height:60px;color:var(--chalk);border-color:color-mix(in srgb,var(--chalk) 14%,transparent);background:color-mix(in srgb,var(--slate-raised) 92%,transparent)}.panel-heading--console h2{color:var(--chalk);letter-spacing:.005em;text-shadow:0 0 .6px currentColor}.panel-heading--console .panel-kicker,.panel-heading--console .run-stats{color:var(--chalk-muted)}.panel-heading--console .icon-button{color:var(--chalk);border-color:color-mix(in srgb,var(--chalk) 24%,transparent);background:color-mix(in srgb,var(--slate-raised) 88%,transparent)}.console-panel button:focus-visible,.console-panel input:focus-visible{outline-color:var(--chalk);box-shadow:0 0 0 2px var(--slate)}.console-body{min-height:0;flex:1;display:flex;flex-direction:column;background:radial-gradient(ellipse at 18% 22%,rgb(242 244 224 / 3%),transparent 34%),radial-gradient(ellipse at 78% 74%,rgb(242 244 224 / 2%),transparent 29%),repeating-linear-gradient(177deg,transparent 0 31px,rgb(242 244 224 / 1.2%) 32px,transparent 34px 67px),var(--slate)}.console-output{flex:1;min-height:0;margin:0;padding:18px;overflow:auto;color:var(--chalk);background:transparent;font-family:var(--font-mono);font-size:.82rem;line-height:1.7;letter-spacing:.012em;text-shadow:0 0 .55px currentColor;white-space:pre-wrap;overflow-wrap:anywhere;tab-size:4}.console-output.is-empty{color:var(--chalk-muted);font-family:var(--font-sans);font-style:italic}.input-request{flex:none;padding:14px;border-top:1px solid color-mix(in srgb,var(--chalk) 17%,transparent);background:color-mix(in srgb,var(--slate-raised) 94%,transparent)}.input-request label{display:grid;gap:2px;margin-bottom:9px;color:var(--chalk)}.input-request label span{color:var(--chalk-muted);font-size:.7rem}.input-request label strong{font-family:var(--font-mono);font-size:.8rem}.input-request__controls{display:flex;gap:8px}.input-request input{min-width:0;flex:1;height:39px;padding:0 11px;border:1px solid color-mix(in srgb,var(--chalk) 29%,transparent);border-radius:7px;color:var(--chalk);background:color-mix(in srgb,var(--slate) 91%,black);font-family:var(--font-mono)}.button--send{color:#12262a;background:#79c7c8}.diagnostics{min-height:0;display:flex;flex-direction:column}.diagnostics__heading{flex:none;min-height:50px;display:flex;align-items:center;justify-content:space-between;padding:10px 15px;border-bottom:1px solid var(--line);background:var(--surface-raised)}.diagnostics__heading>span{min-width:25px;height:25px;display:inline-grid;place-items:center;padding:0 7px;border-radius:999px;color:var(--muted);background:var(--surface-soft);font-size:.7rem;font-weight:750}.diagnostics__empty{display:flex;align-items:center;gap:9px;margin:auto;padding:22px;color:var(--muted);text-align:center;font-size:.82rem}.diagnostics__empty>span{width:24px;height:24px;display:inline-grid;place-items:center;border-radius:50%;color:var(--success);background:var(--success-soft);font-weight:800}.diagnostics__list{min-height:0;margin:0;padding:8px;overflow:auto;list-style:none}.diagnostic{display:grid;grid-template-columns:26px minmax(0,1fr);gap:9px;padding:10px;border-bottom:1px solid var(--line)}.diagnostic:last-child{border-bottom:0}.diagnostic__marker{width:23px;height:23px;display:grid;place-items:center;border-radius:50%;color:var(--danger);background:var(--danger-soft);font-size:.75rem;font-weight:850}.diagnostic--warning .diagnostic__marker,.diagnostic--info .diagnostic__marker{color:var(--ochre);background:color-mix(in srgb,var(--ochre) 14%,var(--surface))}.diagnostic p{margin:1px 0 2px;color:var(--text-strong);font-size:.78rem;font-weight:650;line-height:1.4}.diagnostic div>span,.diagnostic small{display:block;color:var(--muted-light);font-family:var(--font-mono);font-size:.66rem}.diagnostic small{margin-top:5px;color:var(--muted);font-family:var(--font-sans)}.learn-panel{position:relative;z-index:20;width:338px;min-height:0;display:flex;flex-direction:column;border-radius:var(--radius-lg);opacity:0;transform:translate(18px);visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .22s ease,visibility 0s linear .22s}.learn-panel.is-open{opacity:1;transform:translate(0);visibility:visible;pointer-events:auto;transition-delay:0s}.learn-panel__top{flex:none;display:flex;align-items:center;gap:8px;padding:8px;border-bottom:1px solid var(--line);background:var(--surface-raised)}.learn-tabs{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;border-radius:10px;background:var(--surface-soft)}.learn-tabs button{min-height:34px;padding:0 8px;border:0;border-radius:7px;color:var(--muted);background:transparent;cursor:pointer;font-size:.76rem;font-weight:720}.learn-tabs button[aria-selected=true]{color:var(--text-strong);background:var(--surface-raised);box-shadow:var(--shadow-sm)}.learn-panel__close{display:none}.learn-panel__content{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain}.learn-intro{margin:0;padding:16px 15px 10px;color:var(--muted);font-size:.77rem}.example-group{padding:5px 9px 10px}.example-group h3{margin:0;padding:7px;color:var(--muted-light);font-size:.65rem;font-weight:800;letter-spacing:.075em;text-transform:uppercase}.example-card{position:relative;width:100%;display:grid;grid-template-columns:15px minmax(0,1fr);gap:9px;padding:10px 9px;border:1px solid transparent;border-radius:10px;color:inherit;background:transparent;cursor:pointer;text-align:left}.example-card:hover,.example-card.is-active{border-color:var(--line);background:var(--surface-soft)}.example-card.is-active{border-color:color-mix(in srgb,var(--accent) 28%,var(--line));background:var(--accent-soft)}.example-card__beat{width:9px;height:9px;margin-top:5px;border:2px solid var(--ochre);border-radius:50%;box-shadow:0 7px 0 -3px var(--accent)}.example-card strong,.example-card small{display:block}.example-card strong{color:var(--text-strong);font-size:.79rem;line-height:1.35}.example-card small{margin-top:3px;color:var(--muted);font-size:.7rem;line-height:1.4}.reference-list{padding:14px}.language-note{padding:12px;border:1px solid color-mix(in srgb,var(--ochre) 35%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--ochre) 10%,var(--surface))}.language-note strong{color:var(--accent);font-family:var(--font-mono);font-size:.83rem}.language-note p{margin:4px 0 0;color:var(--muted);font-size:.72rem;line-height:1.5}.reference-list dl{margin:14px 0}.reference-list dl>div{padding:10px 3px;border-bottom:1px solid var(--line)}.reference-list dt,.reference-list dd{margin:0}.reference-list code{color:var(--accent);font-family:var(--font-mono);font-size:.73rem;font-weight:650}.reference-list dd{margin-top:3px;color:var(--muted);font-size:.7rem}.operator-strip{display:grid;gap:7px;padding:12px;border-radius:10px;color:var(--code-text);background:var(--code-bg)}.operator-strip code{color:inherit}.learn-scrim{display:none}.site-footer{position:relative;z-index:5;min-height:37px;display:grid;grid-template-columns:minmax(0,1fr) auto auto minmax(0,1fr);align-items:center;gap:16px;padding:7px clamp(16px,3vw,44px);color:var(--muted-light);border-top:1px solid color-mix(in srgb,var(--line) 75%,transparent);font-size:.67rem;font-weight:620}.footer-tagline{justify-self:start}.footer-rhythm{color:var(--ochre);letter-spacing:.18em}.footer-credit{white-space:nowrap}.footer-privacy{justify-self:end;text-align:right}.footer-link{color:var(--teal);font-weight:750;text-decoration:underline;text-underline-offset:2px}.footer-heart{display:inline-block;font-size:.9rem;line-height:1}@media(min-width:1181px)and (min-height:760px){.workspace{height:calc(100vh - 113px)}}@media(max-width:1380px){.workspace.has-learn-panel{grid-template-columns:minmax(0,1fr) 312px}.learn-panel{width:312px}.playground{grid-template-columns:minmax(430px,1.3fr) minmax(280px,.7fr)}.keyboard-hint{display:none}}@media(max-width:1180px){.workspace,.workspace.has-learn-panel{grid-template-columns:minmax(0,1fr)}.learn-panel{position:fixed;z-index:60;top:88px;right:18px;bottom:18px;width:min(360px,calc(100vw - 36px));box-shadow:var(--shadow-lg);transform:translate(calc(100% + 28px))}.learn-panel.is-open{transform:translate(0)}.learn-panel__close{display:inline-flex}.learn-scrim{position:fixed;z-index:50;inset:0;display:block;width:100%;border:0;background:#0d111361;backdrop-filter:blur(2px);cursor:default}}@media(max-width:860px){.workspace{display:block;overflow:visible}.playground{display:grid;grid-template-columns:minmax(0,1fr)}.editor-panel{min-height:min(660px,calc(100vh - 125px))}.results-column{grid-template-rows:minmax(320px,auto) minmax(180px,auto)}.console-panel{min-height:340px}.diagnostics{min-height:180px;max-height:360px}.site-footer{margin-top:8px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}.footer-rhythm{display:none}}@media(max-width:640px){.site-header{min-height:66px;padding:9px 12px}.brand__mark{width:42px;height:42px}.brand__copy strong{font-size:1.45rem}.brand__copy>span,.learn-toggle span{display:none}.learn-toggle{width:39px;padding:0}.header-actions{gap:6px}.language-switch button{min-width:34px;padding:0 7px}.workspace{padding:10px}.playground,.results-column{gap:10px}.editor-panel,.console-panel,.diagnostics{border-radius:11px}.panel-heading{min-height:57px;padding:9px 12px}.autosave-note,.button--quiet span{display:none}.toolbar{gap:6px}.toolbar__primary,.toolbar__secondary{min-width:0}.toolbar__secondary .button{flex:none}.button--run,.button--stop{min-width:102px}.code-editor{min-height:420px}.code-editor .cm-editor{font-size:.81rem}.learn-panel{top:76px;right:10px;bottom:10px;width:calc(100vw - 20px)}.site-footer{grid-template-columns:minmax(0,1fr);padding:10px 14px;text-align:center}.footer-tagline,.footer-rhythm,.footer-privacy{display:none}.footer-credit{justify-self:center}.console-panel{padding:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}