@import"https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500&family=Nunito:ital,wght@0,400;0,500;0,600;0,700;0,800;1,500&family=Geist+Mono:wght@400;500&display=swap";:root{color-scheme:light;--sage-50: #f1f4e8;--sage-100: #e4ead2;--sage-200: #c9d5b0;--sage-300: #aec088;--sage-400: #8ea466;--sage-500: #6f8a4e;--sage-600: #5a7240;--sage-700: #4f6340;--sage-800: #3d4e32;--sage-900: #2c3a24;--honey-50: #fdf6e3;--honey-100: #fbecc4;--honey-200: #f7dd9d;--honey-300: #f4d98a;--honey-400: #efc46f;--honey-500: #e8b658;--honey-600: #d09a3f;--honey-700: #a9792d;--denim-50: #eef2f6;--denim-100: #d8e1ea;--denim-200: #b5c6d6;--denim-300: #8ba8c2;--denim-400: #6a8bab;--denim-500: #527393;--denim-600: #3f5c78;--denim-700: #33475c;--peach-50: #fdf1ea;--peach-100: #fadfcf;--peach-200: #f5cbb3;--peach-300: #eeae8f;--peach-400: #e8a88b;--peach-500: #d98a67;--peach-600: #b16a4a;--peach-700: #8c4e34;--cream-50: #fdfaf2;--cream-100: #faf4e8;--cream-200: #f2e8d3;--cream-300: #e8dbbf;--cream-400: #d9c9a6;--ink-900: #2a2620;--ink-800: #3a342c;--ink-700: #4a4238;--ink-600: #6b6052;--ink-500: #807564;--ink-400: #9c927f;--ink-300: #b8af9b;--ink-200: #d2c8b2;--ink-100: #e5dcc6;--success: var(--sage-600);--success-bg: var(--sage-100);--info: var(--denim-500);--info-bg: var(--denim-100);--warn: var(--honey-600);--warn-bg: var(--honey-100);--danger: #b1412b;--danger-bg: #f5d5c9;--bg-0: var(--cream-50);--bg-1: var(--cream-100);--bg-2: var(--cream-200);--bg-3: var(--cream-300);--bg-inverse: var(--ink-900);--fg-0: var(--ink-900);--fg-1: var(--ink-700);--fg-2: var(--ink-500);--fg-3: var(--ink-400);--fg-inverse: var(--cream-50);--accent-primary: var(--sage-500);--accent-primary-hover: var(--sage-600);--accent-secondary: var(--honey-500);--accent-tertiary: var(--denim-400);--accent-warm: var(--peach-400);--border-grout: rgba(60, 48, 30, .08);--border-grout-strong: rgba(60, 48, 30, .16);--topbar-bg: rgba(253, 250, 242, .86);--syntax-keyword: var(--danger);--syntax-function: var(--denim-600);--syntax-string: var(--sage-700);--syntax-comment: var(--ink-400);--syntax-number: var(--honey-700);--syntax-class: var(--peach-600);--syntax-operator: var(--ink-600);--syntax-variable: var(--ink-800);--gradient-sunrise: linear-gradient(135deg, var(--honey-500) 0%, var(--peach-400) 60%, var(--peach-200) 100%);--gradient-mosaic: linear-gradient(135deg, var(--sage-300) 0%, var(--honey-300) 50%, var(--peach-300) 100%);--font-display: "Fraunces", "Source Serif Pro", Georgia, serif;--font-ui: "Nunito", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;--text-xs: 11px;--lh-xs: 16px;--text-sm: 13px;--lh-sm: 18px;--text-base: 15px;--lh-base: 22px;--text-md: 17px;--lh-md: 24px;--text-lg: 20px;--lh-lg: 28px;--text-xl: 24px;--lh-xl: 32px;--text-2xl: 30px;--lh-2xl: 38px;--text-3xl: 38px;--lh-3xl: 46px;--text-4xl: 48px;--lh-4xl: 56px;--text-5xl: 64px;--lh-5xl: 72px;--weight-regular: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--tracking-tight: -.02em;--tracking-snug: -.01em;--tracking-normal: 0em;--tracking-wide: .04em;--space-0: 0px;--space-05: 2px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--space-9: 96px;--radius-square: 2px;--radius-tile: 6px;--radius-pebble: 14px;--radius-nest: 28px;--radius-pill: 999px;--shadow-tile: 0 1px 2px rgba(60, 48, 30, .06);--shadow-lift: 0 4px 14px -4px rgba(60, 48, 30, .12);--shadow-nest: 0 12px 32px -8px rgba(60, 48, 30, .18);--shadow-scrim: 0 0 0 100vmax rgba(42, 38, 32, .36);--shadow-inset-grout: inset 0 0 0 1px rgba(60, 48, 30, .06);--shadow-inset-pressed: inset 0 1px 2px rgba(60, 48, 30, .12);--ease-settle: cubic-bezier(.34, 1.2, .5, 1);--ease-out: cubic-bezier(.2, .8, .2, 1);--ease-in: cubic-bezier(.6, 0, .8, .4);--dur-hover: .12s;--dur-ui: .22s;--dur-sheet: .42s;--dur-delight: .6s;--focus-ring: 0 0 0 2px var(--bg-1), 0 0 0 4px var(--sage-500)}html{font-family:var(--font-ui);color:var(--fg-1);background:var(--bg-1);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body{margin:0}h1,.h1{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-4xl);line-height:var(--lh-4xl);letter-spacing:var(--tracking-tight);color:var(--fg-0);margin:0;font-optical-sizing:auto}h2,.h2{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-3xl);line-height:var(--lh-3xl);letter-spacing:var(--tracking-tight);color:var(--fg-0);margin:0}h3,.h3{font-family:var(--font-display);font-weight:var(--weight-medium);font-size:var(--text-2xl);line-height:var(--lh-2xl);letter-spacing:var(--tracking-snug);color:var(--fg-0);margin:0}h4,.h4{font-family:var(--font-ui);font-weight:var(--weight-semibold);font-size:var(--text-lg);line-height:var(--lh-lg);letter-spacing:var(--tracking-snug);color:var(--fg-0);margin:0}.eyebrow{font-family:var(--font-ui);font-weight:var(--weight-semibold);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--fg-2)}p,.body{font-family:var(--font-ui);font-weight:var(--weight-regular);font-size:var(--text-base);line-height:var(--lh-base);color:var(--fg-1);margin:0;text-wrap:pretty}.body-lg{font-size:var(--text-md);line-height:var(--lh-md)}.body-sm,small{font-family:var(--font-ui);font-size:var(--text-sm);line-height:var(--lh-sm);color:var(--fg-2)}.meta{font-family:var(--font-ui);font-size:var(--text-xs);line-height:var(--lh-xs);color:var(--fg-2)}.display-serif-italic{font-family:var(--font-display);font-style:italic;font-weight:var(--weight-medium)}code,.mono{font-family:var(--font-mono);font-size:.9em;background:var(--bg-2);padding:1px 6px;border-radius:var(--radius-tile);color:var(--fg-0)}a{color:var(--sage-700);text-decoration:none;transition:color var(--dur-hover) var(--ease-out)}a:hover{color:var(--sage-800);text-decoration:underline}a.ai-suggestion{color:var(--peach-600);text-decoration:underline wavy var(--honey-500);text-underline-offset:3px}:root[data-theme=dark]{color-scheme:dark;--topbar-bg: rgba(26, 23, 18, .82);--cream-50: #1a1712;--cream-100: #221e17;--cream-200: #2b261d;--cream-300: #372f23;--cream-400: #463d2d;--ink-900: #f4eddd;--ink-800: #e8dfca;--ink-700: #d6ccb4;--ink-600: #bdb299;--ink-500: #a0957d;--ink-400: #877c64;--ink-300: #6b6149;--ink-200: #564d39;--ink-100: #423a2a;--border-grout: rgba(244, 237, 221, .09);--border-grout-strong: rgba(244, 237, 221, .18);--shadow-tile: 0 1px 2px rgba(0, 0, 0, .35);--shadow-lift: 0 6px 18px -4px rgba(0, 0, 0, .5);--shadow-nest: 0 14px 36px -8px rgba(0, 0, 0, .62);--shadow-scrim: 0 0 0 100vmax rgba(8, 6, 4, .58);--shadow-inset-grout: inset 0 0 0 1px rgba(244, 237, 221, .05);--shadow-inset-pressed: inset 0 1px 3px rgba(0, 0, 0, .4);--sage-50: #232a18;--sage-100: #2c3620;--sage-200: #3a4a2a;--sage-300: #5f7a3f;--sage-400: #88ad57;--sage-500: #9ec46a;--sage-600: #b0d27e;--sage-700: #bcd78b;--sage-800: #cce29e;--sage-900: #dcecb4;--honey-50: #2e2614;--honey-100: #3a2f15;--honey-200: #4a3c1c;--honey-300: #c79b48;--honey-400: #d6ab50;--honey-500: #e8b658;--honey-600: #f0c873;--honey-700: #f3d68f;--denim-50: #1f2730;--denim-100: #28323d;--denim-200: #3a4d60;--denim-300: #4d6b88;--denim-400: #6a8bab;--denim-500: #7aa0c0;--denim-600: #8fb0cd;--denim-700: #9db9d4;--peach-50: #2e1f16;--peach-100: #3a261b;--peach-200: #4a2f22;--peach-300: #8c5a40;--peach-400: #e0996f;--peach-500: #d98a67;--peach-600: #e0996f;--peach-700: #e8a784;--danger: #e0795f;--danger-bg: #3a201a}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--cream-50);color:var(--fg-1);font-family:var(--font-ui);overflow:hidden}#app{height:100vh}.src,pre.code,.ed code{font-family:var(--font-mono);font-size:13px;line-height:21px;color:var(--ink-800);white-space:pre;-moz-tab-size:4;tab-size:4}.src{background:none;padding:0;border-radius:0}.kw{color:var(--syntax-keyword)}.fn{color:var(--syntax-function)}.st{color:var(--syntax-string)}.cm{color:var(--syntax-comment);font-style:italic}.nb{color:var(--syntax-number)}.cl{color:var(--syntax-class)}.ar{color:var(--syntax-comment);font-style:italic}.op{color:var(--syntax-operator)}.dc{color:var(--syntax-number)}.va{color:var(--syntax-variable)}*::-webkit-scrollbar{width:9px;height:9px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--ink-200);border-radius:9px;border:2px solid var(--cream-50)}*::-webkit-scrollbar-thumb:hover{background:var(--ink-300)}.shell{display:flex;flex-direction:column;height:100vh}.topbar{height:62px;flex-shrink:0;display:flex;align-items:center;gap:18px;padding:0 22px;background:var(--topbar-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border-grout);position:relative;z-index:30}.brand{display:flex;align-items:center;gap:11px}.brand img{width:30px;height:30px;display:block}.brand .logo{display:block;flex-shrink:0;color:var(--fg-0)}.brand .wm{font-family:var(--font-display);font-weight:600;font-size:22px;color:var(--fg-0);letter-spacing:-.02em;line-height:1}.brand .wm .ac{color:var(--peach-600)}.brand .tg{font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--fg-2);margin-top:3px}.brand .bsep{width:1px;height:26px;background:var(--border-grout-strong);margin:0 2px}.topbar .spacer{flex:1}.crumbs{display:flex;align-items:center;gap:8px;font-family:var(--font-ui);font-size:13px;color:var(--fg-2)}.crumbs b{color:var(--fg-1);font-weight:600}.crumbs i{color:var(--ink-300);font-style:normal}.scratch-btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-ui);font-weight:600;font-size:14px;color:var(--cream-50);background:var(--sage-500);border:1px solid transparent;border-radius:var(--radius-pill);padding:9px 16px 9px 14px;cursor:pointer;box-shadow:var(--shadow-tile);transition:transform .12s var(--ease-settle),box-shadow .12s var(--ease-out),background .12s}.scratch-btn:hover{background:var(--sage-600);transform:translateY(-1px);box-shadow:var(--shadow-lift)}.scratch-btn:active{transform:scale(.98);box-shadow:var(--shadow-inset-pressed)}.scratch-btn .kbd{font-family:var(--font-mono);font-size:11px;font-weight:500;background:#fdfaf238;border-radius:5px;padding:1px 6px;margin-left:2px}.scratch-btn.is-open{background:var(--ink-900)}.theme-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0;color:var(--fg-2);background:transparent;border:1px solid var(--border-grout-strong);border-radius:var(--radius-tile);cursor:pointer;font-size:18px;transition:color .12s var(--ease-out),background .12s var(--ease-out),border-color .12s var(--ease-out),transform .12s var(--ease-settle)}.theme-btn:hover{color:var(--fg-0);background:var(--bg-2);border-color:transparent;transform:translateY(-1px)}.theme-btn:active{transform:scale(.96)}.theme-btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}.body{flex:1;display:flex;overflow:hidden}.rail{width:264px;flex-shrink:0;border-right:1px solid var(--border-grout);overflow-y:auto;padding:26px 0 40px;background:var(--cream-100)}.rail .intro{padding:0 24px 22px;margin-bottom:6px;border-bottom:1px solid var(--border-grout)}.rail .intro .eyebrow{display:block;margin-bottom:9px}.rail .intro p{font-size:13.5px;line-height:1.5;color:var(--fg-2)}.rail .intro p .hl{color:var(--sage-700);font-weight:600}.rail .grp{padding:22px 24px 6px}.rail .grp:first-of-type{padding-top:18px}.rail .grp .lbl{font-family:var(--font-ui);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}.chap{display:flex;align-items:baseline;gap:11px;width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:8px 24px;position:relative;transition:background .12s var(--ease-out)}.chap:hover{background:var(--cream-200)}.chap .num{font-family:var(--font-mono);font-size:11px;color:var(--ink-300);width:18px;flex-shrink:0}.chap .nm{font-family:var(--font-ui);font-size:14.5px;font-weight:500;color:var(--fg-1);line-height:1.3}.chap .ct{margin-left:auto;font-family:var(--font-mono);font-size:10.5px;color:var(--ink-300);align-self:center}.chap.active{background:var(--cream-200)}.chap.active:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:0 3px 3px 0;background:var(--sage-500)}.chap.active .num{color:var(--sage-600)}.chap.active .nm{color:var(--fg-0);font-weight:600}.rail .future{margin:26px 24px 0;padding:13px 14px;background:var(--cream-200);border:1px dashed var(--border-grout-strong);border-radius:var(--radius-tile)}.rail .future .t{font-size:12px;font-weight:600;color:var(--fg-1);margin-bottom:3px}.rail .future .s{font-size:11.5px;color:var(--fg-2);line-height:1.45}.rail .section+.section{border-top:1px solid var(--border-grout)}.section-head{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;cursor:pointer;text-align:left;padding:16px 24px 14px;transition:background .12s var(--ease-out)}.section-head:hover{background:var(--cream-200)}.section-head:focus-visible{outline:none;box-shadow:var(--focus-ring)}.section-head .chev{font-size:13px;color:var(--fg-3);transition:transform .16s var(--ease-out)}.section-head.open .chev{transform:rotate(90deg)}.section-head .st{font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--fg-0);letter-spacing:-.01em}.section-head .sc{margin-left:auto;font-family:var(--font-mono);font-size:10.5px;color:var(--ink-300);background:var(--cream-200);border-radius:var(--radius-pill);padding:1px 8px}.section-head:hover .sc{background:var(--cream-300)}.section-body{padding-bottom:12px}.section-body .grp:first-of-type{padding-top:10px}.reading{flex:1;overflow-y:auto}.page{max-width:760px;margin:0 auto;padding:52px 40px 120px}.chap-head{margin-bottom:36px}.chap-head .eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:14px;flex-wrap:nowrap}.chap-head .eyebrow span{white-space:nowrap}.chap-head .eyebrow .dot{width:5px;height:5px;border-radius:50%;background:var(--honey-500)}.chap-head h1{font-family:var(--font-display);font-weight:600;font-size:46px;line-height:1.04;letter-spacing:-.025em;color:var(--fg-0)}.snip{margin-bottom:18px}.snip .sh{display:flex;align-items:center;gap:12px;margin-bottom:9px}.snip .sh .lbl{font-family:var(--font-ui);font-size:14px;font-weight:600;color:var(--fg-0);flex-shrink:0;white-space:nowrap}.snip .sh .rule{flex:1;height:1px;background:var(--border-grout)}.snip .acts{display:flex;gap:5px;opacity:0;transition:opacity .14s var(--ease-out)}.snip:hover .acts{opacity:1}.snip .act{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-ui);font-size:12px;font-weight:600;color:var(--fg-2);background:var(--cream-100);border:1px solid var(--border-grout);border-radius:var(--radius-pill);padding:4px 11px;cursor:pointer;transition:all .12s var(--ease-out);white-space:nowrap}.snip .act:hover{color:var(--sage-700);border-color:var(--sage-300);background:var(--sage-50);transform:translateY(-1px)}.snip .act.run:hover{color:var(--peach-700);border-color:var(--peach-300);background:var(--peach-50)}.snip .act.copied{color:var(--sage-700);border-color:var(--sage-400)}pre.code{margin:0;padding:16px 18px;overflow-x:auto;background:var(--cream-100);border:1px solid var(--border-grout);border-radius:var(--radius-pebble);box-shadow:var(--shadow-inset-grout)}.page p code,.chap-head code{font-family:var(--font-mono);font-size:.86em;color:var(--sage-700);background:var(--cream-200);border:1px solid var(--border-grout);border-radius:5px;padding:.5px 5px}@keyframes riseIn{0%{transform:translateY(7px)}to{transform:none}}@keyframes fadeRise{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}.rise{animation:riseIn .34s var(--ease-settle)}.sp{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:none;flex-direction:column;background:var(--cream-50)}.sp.show{display:flex;animation:spIn .3s var(--ease-settle)}@keyframes spIn{0%{transform:translateY(10px)}to{transform:none}}.sp-head{flex-shrink:0;height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 18px 0 24px;border-bottom:1px solid var(--border-grout);background:var(--cream-100)}.sp-head-l{display:flex;align-items:center;gap:13px}.sp-title{font-family:var(--font-display);font-weight:600;font-size:16px;color:var(--fg-0);line-height:1.1;white-space:nowrap}.sp-sub{font-family:var(--font-ui);font-size:11.5px;color:var(--fg-2);margin-top:1px;white-space:nowrap}.sp-sub b{color:var(--sage-700);font-weight:700}.sp-head-r{display:flex;align-items:center;gap:16px}.head-actions{display:inline-flex;align-items:center;gap:8px}.sp-esc{font-family:var(--font-ui);font-size:12px;color:var(--fg-3);display:inline-flex;align-items:center;gap:7px}.sp-esc .kbd{font-family:var(--font-mono);font-size:11px;background:var(--cream-300);color:var(--fg-2);border-radius:5px;padding:2px 7px}.sp-close{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px 0 13px;border-radius:var(--radius-pill);border:1px solid var(--border-grout-strong);background:var(--cream-50);cursor:pointer;color:var(--fg-1);font-family:var(--font-ui);font-size:13px;font-weight:600;transition:all .12s var(--ease-out)}.sp-close:hover{background:var(--ink-900);color:var(--cream-50);border-color:transparent}.sp-close i{font-size:16px}.sp-close .kbd{font-family:var(--font-mono);font-size:11px;font-weight:500;background:var(--cream-300);color:var(--fg-2);border-radius:5px;padding:1px 6px;transition:all .12s var(--ease-out)}.sp-close:hover .kbd{background:#fdfaf22e;color:var(--cream-100)}.sp-body{flex:1;min-height:0;display:flex;overflow:hidden}.stage{flex:1 1 auto;min-width:0;min-height:0;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:18px;padding:44px 32px 72px}.sp-body.debugging .stage{align-items:stretch;gap:0;padding:0}.code-card{width:100%;max-width:720px;min-height:min(620px,70vh);display:flex;flex-direction:column;background:var(--cream-50);border:1px solid var(--border-grout);border-radius:var(--radius-pebble);box-shadow:var(--shadow-tile);overflow:hidden}.sp-body.debugging .code-card{max-width:none;min-height:0;border:none;border-radius:0;box-shadow:none;height:100%}.code-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 11px 9px 16px;border-bottom:1px solid var(--border-grout);background:var(--cream-100)}.code-name{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;color:var(--fg-2);white-space:nowrap}.code-name i{font-size:15px;color:var(--fg-3)}.code-actions{display:flex;align-items:center;gap:8px}.btn-play{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-ui);font-size:13px;font-weight:600;color:var(--cream-50);background:var(--sage-500);border:none;border-radius:var(--radius-pill);padding:7px 15px 7px 13px;cursor:pointer;transition:all .12s var(--ease-out)}.btn-play:hover{background:var(--sage-600);transform:translateY(-1px);box-shadow:var(--shadow-lift)}.btn-play:active{transform:scale(.98)}.btn-play i{font-size:12px}.btn-debug{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-ui);font-size:13px;font-weight:600;color:var(--fg-1);background:var(--cream-50);border:1px solid var(--border-grout-strong);border-radius:var(--radius-pill);padding:6px 14px;cursor:pointer;transition:all .12s var(--ease-out)}.btn-debug:hover{border-color:var(--denim-300);color:var(--denim-700);background:var(--denim-50)}.btn-debug i{font-size:16px}.btn-debug.on{background:var(--denim-100);color:var(--denim-700);border-color:var(--denim-300)}.btn-debug.on .close-x{font-size:13px;opacity:.6}.ed{flex:1 1 auto;min-height:0;padding:16px 0;overflow:auto}.ed-inner{min-width:max-content}.ln{display:flex;align-items:center;min-height:23px;padding:0 18px}.ln .gut{flex-shrink:0;width:26px;text-align:right;padding-right:16px;font-family:var(--font-mono);font-size:12px;color:var(--ink-300);-webkit-user-select:none;user-select:none}.ln .src{font-size:14px;line-height:23px}.ln.cur{background:var(--sage-50);box-shadow:inset 3px 0 0 var(--sage-500)}.ln.cur .gut{color:var(--sage-600)}.ed-ta{display:block;flex:1 1 auto;width:100%;min-height:340px;resize:none;border:none;outline:none;background:var(--cream-50);color:var(--ink-800);font-family:var(--font-mono);font-size:14px;line-height:23px;padding:16px 18px;-moz-tab-size:4;tab-size:4}.out-card{width:100%;max-width:720px;background:var(--cream-200);border:1px solid var(--border-grout);border-radius:var(--radius-pebble);overflow:hidden;animation:riseIn .26s var(--ease-settle)}.out-lbl{display:flex;align-items:center;gap:7px;padding:9px 16px;font-family:var(--font-ui);font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2);border-bottom:1px solid var(--border-grout)}.out-lbl i{font-size:14px;color:var(--sage-600)}.inspect{flex:0 0 clamp(340px,33%,460px);display:flex;flex-direction:column;min-height:0;border-left:1px solid var(--border-grout);background:var(--cream-100);animation:riseIn .24s var(--ease-settle)}.inspect-player{flex-shrink:0;padding:14px 16px 16px;border-bottom:1px solid var(--border-grout);background:var(--cream-50)}.ip-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.ip-note{margin-top:12px;display:flex;gap:8px;align-items:flex-start;font-family:var(--font-ui);font-size:13px;line-height:1.5;color:var(--ink-700)}.ip-note i{color:var(--honey-600);font-size:15px;flex-shrink:0;margin-top:1px}.ip-note span{animation:riseIn .24s var(--ease-out)}.tp-btns{display:flex;align-items:center;gap:4px}.tp-btns button{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:7px;border:none;background:none;cursor:pointer;color:var(--fg-1);transition:all .1s}.tp-btns button:hover{background:var(--cream-300);color:var(--fg-0)}.tp-btns button i{font-size:16px}.tp-count{font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--fg-0)}.tp-count span{color:var(--ink-300)}.scrub{display:block;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;border-radius:4px;background:var(--cream-400);cursor:pointer}.scrub::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:var(--sage-500);border:2px solid var(--cream-50);box-shadow:var(--shadow-tile);cursor:pointer}.scrub::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--sage-500);border:2px solid var(--cream-50);cursor:pointer}.inspect-vars{flex:1 1 auto;min-height:0;overflow:auto}.inspect-out{flex:0 0 auto;max-height:38%;overflow:auto;background:var(--cream-200);border-top:1px solid var(--border-grout)}.panel-lbl{display:flex;align-items:center;gap:7px;font-family:var(--font-ui);font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2);padding:12px 16px 9px}.panel-lbl i{font-size:13px;color:var(--fg-3)}.vars-list{padding:0 10px 12px;display:flex;flex-direction:column;gap:4px}.vrow{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:var(--radius-tile);border:1px solid transparent}.vrow .vname{font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--ink-900);min-width:52px}.vrow .vtype{font-family:var(--font-mono);font-size:9.5px;font-weight:500;color:var(--denim-600);background:var(--denim-50);padding:1px 6px;border-radius:var(--radius-pill)}.vrow .veq{color:var(--ink-300);font-family:var(--font-mono);font-size:12px}.vrow .vval{font-family:var(--font-mono);font-size:13px;color:var(--ink-800);flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes flashHoney{0%{background:var(--honey-200);border-color:var(--honey-400)}to{background:transparent;border-color:transparent}}.vrow.changed{animation:flashHoney .9s var(--ease-out) both}.out-body{padding:11px 16px;overflow-x:auto}.con-body{padding:2px 16px 14px;overflow:visible;overflow-x:auto}.con-line{display:flex;gap:9px;align-items:baseline;font-family:var(--font-mono);font-size:13px;line-height:1.7}.con-ret{color:var(--sage-600);font-weight:600}.con-line code{color:var(--ink-800);font-family:var(--font-mono);background:none;padding:0;white-space:nowrap}.con-line code .cstr{color:var(--peach-600)}.con-wait{padding:2px 0;font-family:var(--font-mono);font-size:12.5px;color:var(--fg-3);font-style:italic}.scratch-foot{width:100%;max-width:720px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 4px}.preview-tag{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-family:var(--font-ui);font-size:11px;color:var(--fg-2)}.preview-tag .ph-sparkle{color:var(--honey-600)}.preview-tag .mono{font-family:var(--font-mono);color:var(--peach-600)}.link-step{background:none;border:none;padding:0;margin:0;font-family:var(--font-ui);font-size:12.5px;font-weight:700;color:var(--sage-700);cursor:pointer;white-space:nowrap}.link-step:hover{text-decoration:underline}@media (max-width: 1024px){.inspect{flex-basis:320px}}.rail-about{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:14px 24px;position:relative;border-bottom:1px solid var(--border-grout);transition:background .12s var(--ease-out)}.rail-about:hover{background:var(--cream-200)}.rail-about i{font-size:16px;color:var(--fg-3);width:18px;flex-shrink:0;text-align:center}.rail-about .nm{font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--fg-0);letter-spacing:-.01em}.rail-about.active{background:var(--cream-200)}.rail-about.active:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--sage-500)}.rail-about.active i{color:var(--sage-600)}.about-lede{font-family:var(--font-ui);font-size:19px;line-height:1.55;font-weight:500;color:var(--fg-1);margin:0;text-wrap:pretty}.about-block{margin-top:38px}.about-block>p{font-size:16px;line-height:1.68;color:var(--fg-1);margin:0 0 14px;text-wrap:pretty}.about-block>p:last-child{margin-bottom:0}.about-block p strong{color:var(--fg-0);font-weight:700}.about-block p em{font-style:italic;color:var(--fg-0);font-family:var(--font-display)}.about-h{font-family:var(--font-ui);font-weight:700;font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--sage-700);margin:0 0 12px}.about-flow{margin-top:20px;padding:24px;border:1px solid var(--border-grout);border-radius:var(--radius-pebble);background:var(--cream-100);display:flex;flex-direction:column;align-items:center}.about-flow .af-row{width:100%;display:flex;justify-content:center;gap:14px}.about-flow .af-node{flex:1;max-width:320px;text-align:center;padding:14px 16px;border-radius:var(--radius-tile);border:1px solid var(--border-grout-strong);background:var(--cream-50);font-family:var(--font-ui);font-size:14.5px;font-weight:600;color:var(--fg-0);display:flex;flex-direction:column;gap:2px;justify-content:center}.about-flow .af-node b{font-weight:700}.about-flow .af-node span{font-size:12px;font-weight:500;color:var(--fg-2)}.about-flow .af-pair-top{align-items:flex-start}.about-flow .af-col{flex:1;max-width:320px;display:flex;flex-direction:column;align-items:center}.about-flow .af-col .af-node{width:100%;max-width:none}.about-flow .af-src{order:1;align-self:center;margin-top:9px;display:inline-flex;align-items:center;gap:5px;line-height:1;font-family:var(--font-ui);font-weight:600;font-size:11.5px;color:#4a57e0;background:#eef0fe;border:1px solid #dadffc;border-radius:var(--radius-pill);padding:5px 11px 5px 9px;text-decoration:none;transition:background .12s,border-color .12s,transform .12s var(--ease-settle)}.about-flow .af-src i{font-size:14px}.about-flow .af-src:hover{background:#e3e7fd;border-color:#c6cef9;transform:translateY(-1px)}:root[data-theme=dark] .about-flow .af-src{color:#c2c8fb;background:#5865f229;border-color:#5865f252}:root[data-theme=dark] .about-flow .af-src:hover{background:#5865f23d;border-color:#5865f273}.about-flow+.af-note{margin:13px 4px 0;text-align:center;font-family:var(--font-ui);font-size:13px;line-height:1.55;color:var(--fg-2)}.about-flow+.af-note i{font-size:13px;vertical-align:-1px;color:#4a57e0}.about-flow+.af-note strong{font-weight:600;color:var(--fg-1)}:root[data-theme=dark] .about-flow+.af-note i{color:#c2c8fb}.about-flow .af-arrow{color:var(--fg-3);font-size:18px;padding:7px 0;line-height:1}.about-flow .af-filter{background:var(--honey-50);border-color:var(--honey-300)}.about-flow .af-out{background:var(--sage-50);border-color:var(--sage-300)}.about-flow .af-end{background:var(--denim-50);border-color:var(--denim-300);max-width:320px}.about-closing{margin-top:40px;padding-top:24px;border-top:1px solid var(--border-grout);font-family:var(--font-display);font-style:italic;font-weight:500;font-size:21px;line-height:1.5;color:var(--fg-0);text-wrap:pretty}.chap-head .discord-link{margin-top:18px}.discord-link{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-ui);font-weight:600;font-size:14px;color:#4a57e0;background:#eef0fe;border:1px solid #dadffc;border-radius:var(--radius-pill);padding:9px 16px;text-decoration:none;box-shadow:var(--shadow-tile);transition:transform .12s var(--ease-settle),box-shadow .12s,background .12s,border-color .12s}.discord-link:hover{background:#e3e7fd;border-color:#c6cef9;transform:translateY(-1px);box-shadow:var(--shadow-lift)}.discord-link i{font-size:17px;color:#5865f2}:root[data-theme=dark] .discord-link{color:#c2c8fb;background:#5865f229;border-color:#5865f252}:root[data-theme=dark] .discord-link:hover{background:#5865f23d;border-color:#5865f273}:root[data-theme=dark] .discord-link i{color:#aab2f7}@media (max-width: 620px){.about-flow .af-pair{flex-direction:column;align-items:center}.about-flow .af-pair .af-node,.about-flow .af-pair .af-col{width:100%;max-width:none}}.pat .chap-head{margin-bottom:14px}.pat .chap-head .eyebrow{display:block;margin-bottom:12px}.pat .chap-head h1{font-size:36px;line-height:1.08}.pat .artframe{margin:6px 0 10px;border:1px solid var(--border-grout-strong);border-radius:var(--radius-nest);background:var(--bg-1);box-shadow:var(--shadow-nest);overflow:hidden}.pat .artframe>.c{display:block;width:100%;line-height:0}.pat .artbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px;border-top:1px solid var(--border-grout);background:var(--bg-1)}.pat .artbar .cap{flex:1;min-width:180px;font-size:12.5px;line-height:1.45;color:var(--fg-2)}.pat .abtn{font-family:var(--font-ui);font-weight:600;font-size:12.5px;color:var(--fg-1);background:var(--bg-2);border:1px solid var(--border-grout-strong);border-radius:var(--radius-pill);padding:5px 12px;cursor:pointer;transition:all .12s var(--ease-out)}.pat .abtn:hover{color:var(--fg-0);background:var(--bg-3);transform:translateY(-1px)}.pat .abtn.primary{color:var(--cream-50);background:var(--sage-500);border-color:transparent}.pat .abtn.primary:hover{background:var(--sage-600)}.pat .artbar .art-hint{font-size:12px;color:var(--fg-3)}.pat .seedwrap{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--fg-2)}.pat .seedwrap input{width:70px;font-family:var(--font-mono);font-size:12px;color:var(--fg-0);background:var(--bg-3);border:1px solid var(--border-grout-strong);border-radius:var(--radius-tile);padding:4px 7px}.pat .pat-sec{margin:26px 0}.pat h2.sec{font-family:var(--font-display);font-weight:600;font-size:23px;letter-spacing:-.01em;color:var(--fg-0);margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--border-grout)}.pat h2.sec .seccount{color:var(--fg-3);font-weight:500}.pat .note{font-style:italic;color:var(--fg-2);font-size:14px;line-height:1.55;margin:0 0 12px}.pat .drill{border:1px solid var(--border-grout-strong);border-radius:var(--radius-pebble);background:var(--bg-1);padding:18px 20px;box-shadow:var(--shadow-lift)}.pat .drill .stmt{font-family:var(--font-display);font-weight:600;font-size:19px;line-height:1.28;color:var(--fg-0);margin:0 0 7px}.pat .steps{font-size:14px;line-height:1.55;color:var(--fg-1);margin:0 0 10px}.pat .steps strong{color:var(--fg-0);font-weight:700}.pat .ex{font-size:13px;line-height:1.5;color:var(--fg-2);margin:0 0 8px}.pat .drill details.reveal{margin:10px 0 0;border-top:1px solid var(--border-grout);padding-top:4px}.pat .drill details.reveal>summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;font-family:var(--font-ui);font-size:13px;font-weight:600;color:var(--fg-2);padding:6px 0}.pat .drill details.reveal>summary:hover{color:var(--fg-0)}.pat .drill details.reveal>summary::-webkit-details-marker{display:none}.pat .drill details.reveal>summary .chev{display:inline-flex;color:var(--fg-3);transition:transform .2s var(--ease-out)}.pat .drill details.reveal[open]>summary .chev{transform:rotate(90deg)}.pat .codeblock{margin:12px 0 0}.pat .codeblock .cb-acts{display:flex;justify-content:flex-end;gap:5px;margin-bottom:7px;opacity:0;transition:opacity .14s var(--ease-out)}.pat .codeblock:hover .cb-acts,.pat .codeblock:focus-within .cb-acts{opacity:1}.pat .act{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-ui);font-size:12px;font-weight:600;color:var(--fg-2);background:var(--cream-100);border:1px solid var(--border-grout);border-radius:var(--radius-pill);padding:4px 11px;cursor:pointer;transition:all .12s var(--ease-out);white-space:nowrap}.pat .act:hover{color:var(--sage-700);border-color:var(--sage-300);background:var(--sage-50);transform:translateY(-1px)}.pat .act.run:hover{color:var(--peach-700);border-color:var(--peach-300);background:var(--peach-50)}.pat .act.copied{color:var(--sage-700);border-color:var(--sage-400)}.pat pre.code{margin:0}.pat pre.code.skel{background:var(--sage-50);border-color:var(--sage-300)}.pat details.more{border:1px solid var(--border-grout-strong);border-radius:var(--radius-pebble);background:var(--bg-1);margin:12px 0;overflow:hidden;box-shadow:var(--shadow-tile)}.pat details.more>summary{cursor:pointer;list-style:none;padding:15px 18px;display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:600;font-size:16px;line-height:1.3;color:var(--fg-0)}.pat details.more>summary::-webkit-details-marker{display:none}.pat details.more>summary .st-text{flex:1 1 auto;min-width:0;overflow-wrap:break-word}.pat details.more>summary .chev{color:var(--fg-3);display:inline-flex;transition:transform .2s var(--ease-out);flex:none}.pat details.more>summary .chev i{font-size:16px}.pat details.more[open]>summary .chev{transform:rotate(90deg)}.pat .more-body{padding:2px 18px 18px}.pat .mini-art{border:1px solid var(--border-grout);border-radius:var(--radius-tile);overflow:hidden;background:var(--bg-0);margin:0 0 12px}.pat .mini-art>.c{display:block;width:100%;line-height:0}.pat .mini-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 12px;border-top:1px solid var(--border-grout);background:var(--bg-1);font-size:12px;color:var(--fg-2)}.pat .mini-bar .cap{flex:1;min-width:150px;line-height:1.45}.pat .steps code,.pat .note code,.pat .cap code,.pat .ex code{font-family:var(--font-mono);font-size:.86em;color:var(--sage-700);background:var(--cream-200);border:1px solid var(--border-grout);border-radius:5px;padding:.5px 5px}.pat .stmt code,.pat details.more>summary code{font-family:inherit;font-size:inherit;font-weight:inherit;color:var(--sage-600);background:none;border:0;padding:0;border-radius:0}.nav-toggle{display:none;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0;margin-left:-2px;color:var(--fg-1);background:transparent;border:1px solid var(--border-grout-strong);border-radius:var(--radius-tile);cursor:pointer;font-size:20px;transition:color .12s var(--ease-out),background .12s var(--ease-out),border-color .12s var(--ease-out),transform .12s var(--ease-settle)}.nav-toggle:hover{color:var(--fg-0);background:var(--bg-2)}.nav-toggle:active{transform:scale(.95)}.nav-toggle:focus-visible{outline:none;box-shadow:var(--focus-ring)}.rail-scrim{display:none}@media (hover: none){.snip .acts,.pat .codeblock .cb-acts{opacity:1}}@media (max-width: 768px){#app,.shell{height:100dvh}.topbar{padding:0 12px;gap:10px}.nav-toggle{display:inline-flex}.brand .wm{font-size:18px;white-space:nowrap}.bsep,.crumbs{display:none}.scratch-btn{padding:8px 13px;font-size:13px;gap:7px}.scratch-btn .kbd{display:none}.rail{position:fixed;top:62px;left:0;bottom:0;width:min(84vw,300px);z-index:45;transform:translate(-100%);transition:transform .28s var(--ease-out);box-shadow:var(--shadow-nest);padding-top:14px}.rail.is-open{transform:translate(0)}.rail-scrim{display:block;position:fixed;top:62px;right:0;bottom:0;left:0;z-index:44;background:#14100a57;opacity:0;pointer-events:none;transition:opacity .28s var(--ease-out)}.rail-scrim.show{opacity:1;pointer-events:auto}.page{padding:30px 20px 96px}.chap-head{margin-bottom:26px}.chap-head h1{font-size:32px}.pat .chap-head h1{font-size:27px}.about-lede{font-size:17px}.about-closing{font-size:19px}.sp-head{height:56px;padding:0 12px;gap:8px;justify-content:center}.sp-head-l{display:none}.sp-head-r{gap:8px}.head-actions{gap:6px}.btn-play,.btn-debug{padding:7px 12px;font-size:13px}.btn-play .kbd,.btn-debug .kbd,.btn-debug.on .close-x{display:none}.sp-close{padding:0 10px}.sp-close .lbl,.sp-close .kbd{display:none}.stage{padding:16px 14px 48px;gap:14px}.code-card{min-height:min(58vh,440px)}.scratch-foot{padding:0 2px}.out-card,.code-card,.scratch-foot{max-width:100%}.sp-body.debugging{flex-direction:column;padding:12px;gap:12px;overflow:auto}.sp-body.debugging .stage{flex:0 0 auto;height:52vh;min-height:300px;overflow:hidden}.sp-body.debugging .inspect{flex:0 0 auto;width:100%;border-left:none}.sp-body.debugging .inspect-vars,.sp-body.debugging .inspect-out{flex:0 0 auto;max-height:none}.sp-body.debugging .inspect-vars .vars-list,.sp-body.debugging .inspect-out .con-body{overflow:visible}}@media (max-width: 380px){.scratch-btn .lbl{display:none}.scratch-btn{padding:9px 11px}}.cm-host{display:flex;min-height:0}.cm-host .cm-editor{flex:1 1 auto;background:var(--cream-50)}.cm-host .cm-scroller{font-family:var(--font-mono);font-size:14px;line-height:23px;overflow:auto}.cm-host .cm-content{min-height:320px;padding:12px 0;caret-color:var(--ink-900)}.cm-host .cm-gutters{background:var(--cream-50);border-right:none;color:var(--ink-300)}.cm-host .cm-lineNumbers .cm-gutterElement{padding:0 10px 0 18px;font-size:12px;color:var(--ink-300)}.cm-host .cm-line{padding:0 18px}.cm-host .cm-cursor{border-left-color:var(--ink-900)}.cm-host .cm-selectionBackground,.cm-host .cm-content ::selection{background:var(--honey-200)!important}.cm-host .cm-activeLine,.cm-host .cm-activeLineGutter{background:transparent}.cm-host .cm-debug-line{background:var(--sage-50);box-shadow:inset 3px 0 0 var(--sage-500)}.cm-host .cm-debug-gutter{color:var(--sage-600)}.cm-host.is-readonly .cm-cursor{display:none}.cm-host .cm-scroller::-webkit-scrollbar{width:9px;height:9px}.cm-host .cm-scroller::-webkit-scrollbar-thumb{background:var(--ink-200);border-radius:9px;border:2px solid var(--cream-50)}@keyframes cm-spin{to{transform:rotate(360deg)}}.spin{display:inline-block;animation:cm-spin .8s linear infinite}.btn-play:disabled,.btn-debug:disabled{opacity:.55;cursor:default;transform:none;box-shadow:none}.run-error,.trace-err{margin:0;font-family:var(--font-mono);font-size:12.5px;line-height:1.6;color:var(--danger);white-space:pre-wrap;word-break:break-word}.ip-note .note-src{background:none;padding:0;color:var(--ink-700);font-family:var(--font-mono);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-width:100%}.btn-play .kbd,.btn-debug .kbd{font-family:var(--font-mono);font-size:10.5px;font-weight:500;border-radius:5px;padding:1px 5px;line-height:1.4}.btn-play .kbd{background:#fdfaf238;color:var(--cream-50)}.btn-debug .kbd{background:var(--cream-300);color:var(--fg-2)}.btn-debug.on .kbd{background:var(--denim-200);color:var(--denim-700)}.sp-body.debugging{padding:22px;gap:18px}.sp-body.debugging .stage{flex:1 1 auto;min-width:0;padding:0;gap:0;align-items:stretch;overflow:hidden}.sp-body.debugging .code-card{max-width:none;width:100%;height:100%;min-height:0;border:1px solid var(--border-grout);border-radius:var(--radius-pebble);box-shadow:var(--shadow-tile)}.sp-body.debugging .cm-host{flex:1 1 auto;min-height:0}.sp-body.debugging .inspect{flex:0 0 clamp(340px,34%,460px);display:flex;flex-direction:column;gap:18px;min-height:0;background:transparent;border-left:none}.sp-body.debugging .inspect-player,.sp-body.debugging .inspect-vars,.sp-body.debugging .inspect-out{border:1px solid var(--border-grout);border-radius:var(--radius-pebble);box-shadow:var(--shadow-tile);overflow:hidden}.sp-body.debugging .inspect-player{flex:0 0 auto;background:var(--cream-50)}.sp-body.debugging .inspect-player .panel-lbl{padding:2px 0 10px}.sp-body.debugging .inspect-vars{flex:0 1 auto;min-height:0;display:flex;flex-direction:column;background:var(--cream-50)}.sp-body.debugging .inspect-vars .vars-list{flex:0 1 auto;min-height:0;overflow:auto}.sp-body.debugging .inspect-out{flex:0 1 auto;min-height:0;display:flex;flex-direction:column;background:var(--cream-200)}.sp-body.debugging .inspect-out .con-body{flex:0 1 auto;min-height:0;overflow:auto}.sp-body:not(.debugging) .stage{overflow:auto;justify-content:flex-start}.sp-body:not(.debugging) .code-card{flex:0 0 auto;min-height:0;max-height:none}.sp-body:not(.debugging) .out-card{flex:0 1 auto;min-height:290px;display:flex;flex-direction:column}.sp-body:not(.debugging) .out-card .out-body{flex:1 1 auto;min-height:0;overflow:auto}