:root{--bg0: #1a1f1c;--bg1: #232a26;--bg2: #2c352f;--ink: #e8efe9;--muted: #9aab9e;--line: #3d4a41;--accent: #c4f082;--accent-ink: #1a2418;--warn: #f0c27a;--danger: #f0958a;--ok: #8fd4a8;--step: #2a332d;--step-border: #4a5c4f;--context-bg: #1e2420;--context-line: #354038;--activity-bg: #24352a;--activity-bg-2: #1c2a22;--activity-line: #4d6a52;--aux-bg: #1c2120;--mono: "IBM Plex Mono", ui-monospace, monospace;--sans: "DM Sans", system-ui, sans-serif;--brand: "Syne", "Avenir Next", "Segoe UI", sans-serif;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(1200px 600px at 10% -10%,#2d3a30 0%,transparent 55%),radial-gradient(900px 500px at 100% 0%,#3a3228 0%,transparent 50%),var(--bg0);color:var(--ink);font-family:var(--sans)}body{line-height:1.5}a{color:var(--accent)}.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{max-width:1280px;margin:0 auto;padding:1.75rem 1.25rem 5rem}.hero{margin-bottom:2.75rem;animation:rise .55s ease-out both}.eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 .75rem}.eyebrow-link{color:inherit;text-decoration:none;transition:color .15s ease,text-decoration-color .15s ease}.eyebrow-link:visited{color:inherit}.eyebrow-link:hover,.eyebrow-link:focus-visible{color:var(--ink);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--muted) 65%,var(--ink));text-underline-offset:.15em}.eyebrow-sep{opacity:.55}.eyebrow-label{color:var(--muted)}h1{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:700;letter-spacing:-.03em;margin:0 0 .5rem;max-width:18ch}.hero-tagline{color:var(--ink);max-width:48ch;margin:0 0 .85rem;font-size:1.05rem;line-height:1.45}.lede{color:var(--muted);max-width:62ch;margin:0 0 1.25rem;font-size:1.05rem}.hero-links{display:flex;flex-wrap:wrap;gap:.75rem}.hero-links a{text-decoration:none;border:1px solid var(--line);padding:.4rem .75rem;border-radius:.35rem;color:var(--ink);background:color-mix(in oklab,var(--bg1) 80%,transparent);transition:border-color .15s ease,background .15s ease}.hero-links a:hover{border-color:var(--accent);background:var(--bg2)}.context-bar{margin:0 0 2.5rem;border:1px solid var(--context-line);border-radius:.5rem;background:var(--context-bg);animation:rise .55s ease-out .06s both}.context-bar-inner{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem 1.25rem;padding:.65rem 1rem}.context-label{margin:0;font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.context-field{margin:0}.context-field select{font:inherit;font-family:var(--mono);font-size:.82rem;background:color-mix(in oklab,var(--bg0) 70%,transparent);color:var(--ink);border:1px solid var(--context-line);border-radius:.3rem;padding:.35rem .55rem;min-width:min(100%,16rem)}.context-hint{margin:0;flex:1 1 12rem;font-size:.8rem;color:color-mix(in oklab,var(--muted) 85%,transparent)}.activity{position:relative;margin:0 0 2.75rem;padding:1.75rem 1.5rem 1.5rem;border:1px solid var(--activity-line);border-radius:1rem;background:radial-gradient(900px 420px at 8% 0%,color-mix(in oklab,var(--accent) 10%,transparent),transparent 55%),linear-gradient(165deg,var(--activity-bg) 0%,var(--activity-bg-2) 100%);box-shadow:0 24px 60px color-mix(in oklab,#000 35%,transparent);animation:rise .55s ease-out .12s both}.activity-head{margin-bottom:1.5rem;max-width:56rem}.activity-eyebrow{margin:0 0 .4rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:color-mix(in oklab,var(--accent) 70%,var(--muted))}.activity-head h2{margin:0 0 .5rem;font-size:clamp(1.35rem,2.6vw,1.75rem);letter-spacing:-.02em}.activity-desc{margin:0;color:color-mix(in oklab,var(--ink) 72%,var(--muted));font-size:.98rem;max-width:62ch}.map-shell{margin:0 -.35rem;padding:1.5rem .85rem 1.75rem;border-radius:.75rem;background:color-mix(in oklab,var(--bg0) 45%,transparent);border:1px solid color-mix(in oklab,var(--activity-line) 70%,transparent);overflow-x:auto;min-height:14rem}.pipeline{display:flex;align-items:stretch;gap:0;min-height:11rem;padding:.35rem .25rem .65rem}.activity-probe-wrap{position:relative;margin-bottom:1.25rem;padding-bottom:1.15rem;border-bottom:1px dashed color-mix(in oklab,var(--activity-line) 75%,transparent)}.activity-probe{margin-bottom:0;padding-bottom:0;border-bottom:none}.compose-tip{position:absolute;top:0;left:37.25rem;width:min(14.5rem,calc(100% - 37.25rem));padding:.85rem 2rem .75rem .9rem;border-radius:.55rem;border:1px solid color-mix(in oklab,var(--activity-line) 85%,var(--accent));background:color-mix(in oklab,var(--activity-bg) 88%,var(--bg0));box-shadow:0 10px 28px color-mix(in oklab,#000 28%,transparent);z-index:2;animation:compose-tip-in .45s ease-out .35s both}.compose-tip[hidden]{display:none}.compose-tip-close{position:absolute;top:.35rem;right:.35rem;width:1.5rem;height:1.5rem;padding:0;line-height:1;font-size:1.1rem;border:none;background:transparent;color:var(--muted)}.compose-tip-close:hover{color:var(--ink);border:none}.compose-tip-copy{margin:0 0 .65rem;font-size:.82rem;line-height:1.45;color:color-mix(in oklab,var(--ink) 88%,var(--muted))}.compose-tip-copy strong{font-family:var(--mono);font-weight:600;color:var(--accent)}.compose-tip-got-it{font-size:.78rem;padding:.35rem .65rem}.compose-tip-arrows{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:1}.compose-tip-arrows[hidden]{display:none}.compose-tip-arrow{fill:none;stroke:color-mix(in oklab,var(--accent) 65%,var(--muted));stroke-width:1.5;stroke-linecap:round;stroke-dasharray:5 4;animation:compose-tip-arrow-pulse 2.4s ease-in-out infinite}.compose-tip-arrows marker path{fill:color-mix(in oklab,var(--accent) 65%,var(--muted))}.compose-tip-arrow:nth-child(2){animation-delay:.6s}@keyframes compose-tip-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes compose-tip-arrow-pulse{0%,to{stroke-opacity:.45}50%{stroke-opacity:.95}}.activity-probe label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;color:var(--muted);max-width:36rem}.activity-probe .field-hint{font-size:.78rem;color:color-mix(in oklab,var(--muted) 80%,transparent)}.activity-probe input[type=url]{font:inherit;font-family:var(--mono);font-size:.9rem;background:color-mix(in oklab,var(--bg0) 55%,transparent);color:var(--ink);border:1px solid var(--activity-line);border-radius:.4rem;padding:.55rem .7rem;width:100%}.socket{display:flex;flex-direction:column;align-items:center;justify-content:center;width:2.25rem;flex:0 0 auto;position:relative}.socket:before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:var(--line);transform:translateY(-50%)}.socket button{position:relative;z-index:1;width:1.75rem;height:1.75rem;padding:0;border-radius:999px;font-size:1.1rem;line-height:1;background:var(--bg0);color:var(--accent);border-color:color-mix(in oklab,var(--accent) 45%,var(--line))}.step{flex:0 0 auto;width:12.5rem;min-width:0;overflow:hidden;background:var(--step);border:1px solid var(--step-border);border-radius:.65rem;padding:.75rem;display:flex;flex-direction:column;gap:.4rem;box-shadow:0 10px 30px color-mix(in oklab,#000 35%,transparent);transition:border-color .15s ease,box-shadow .2s ease}.step>*{min-width:0;max-width:100%;overflow-wrap:anywhere;word-break:break-word}.step[data-active=true]{border-color:var(--accent);box-shadow:0 0 0 1px color-mix(in oklab,var(--accent) 50%,transparent),0 12px 28px color-mix(in oklab,#000 40%,transparent)}.step[data-status=loop]{border-color:var(--danger)}.step[data-status=matched]{border-color:var(--warn)}.step-kind{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.step h3{margin:0;font-size:.95rem;letter-spacing:-.02em;line-height:1.25}.step .summary{margin:0;font-size:.8rem;color:var(--muted);flex:1;line-height:1.35}.step .meta{font-family:var(--mono);font-size:.68rem;line-height:1.35;color:var(--ink);opacity:.85;border-top:1px dashed var(--line);padding-top:.4rem}.children{margin-top:.35rem;display:flex;flex-direction:column;gap:.35rem;padding:.4rem;border-radius:.4rem;background:color-mix(in oklab,var(--bg0) 65%,transparent);border:1px dashed var(--line)}.child-step{font-size:.75rem;padding:.3rem .4rem;border-radius:.3rem;background:var(--bg2);overflow-wrap:anywhere;word-break:break-word}.aux{margin:0 0 1.5rem;padding:1.35rem 1.25rem 1.25rem;border:1px solid var(--line);border-radius:.85rem;background:var(--aux-bg);animation:rise .55s ease-out .18s both}.aux-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.15rem}.aux-eyebrow{margin:0 0 .35rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.aux-head h2{margin:0 0 .35rem;font-size:1.15rem}.aux-desc{margin:0;max-width:48ch;font-size:.88rem;color:var(--muted)}.aux-body{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem}@media(max-width:840px){.aux-body{grid-template-columns:1fr}.activity{padding:1.25rem 1rem 1.15rem}.compose-tip,.compose-tip-arrows{display:none!important}}.panel{border:1px solid var(--line);border-radius:.65rem;background:color-mix(in oklab,var(--bg1) 80%,transparent);padding:1rem 1.1rem}.idea-panel h3{margin:0 0 .75rem;font-size:.95rem}.idea-panel ul{margin:0;padding-left:1.1rem;color:var(--muted);font-size:.88rem}.idea-panel li+li{margin-top:.35rem}button{font:inherit;cursor:pointer;border-radius:.35rem;border:1px solid var(--line);background:var(--bg2);color:var(--ink);padding:.5rem .85rem;transition:transform .12s ease,border-color .15s ease,background .15s ease}button:hover{border-color:var(--accent)}button:active{transform:translateY(1px)}button.primary{background:var(--accent);color:var(--accent-ink);border-color:color-mix(in oklab,var(--accent) 70%,#000);font-weight:600}button.ghost{background:transparent}.trace{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem;font-family:var(--mono);font-size:.78rem}.trace li{display:grid;grid-template-columns:5.5rem 1fr;gap:.5rem;padding:.45rem .5rem;border-radius:.4rem;background:var(--bg2)}.trace .status{text-transform:uppercase;letter-spacing:.04em}.trace .status[data-s=loop],.banner.danger{color:var(--danger)}.trace .status[data-s=matched]{color:var(--warn)}.trace .status[data-s=done],.trace .status[data-s=applied]{color:var(--ok)}.trace .status[data-s=skipped]{color:var(--muted)}.trace .status[data-s=error]{color:var(--danger)}.banner{margin:0 0 .75rem;padding:.65rem .75rem;border-radius:.45rem;border:1px solid var(--line);background:var(--bg2);font-size:.9rem}.banner.danger{border-color:color-mix(in oklab,var(--danger) 55%,var(--line));background:color-mix(in oklab,var(--danger) 12%,var(--bg2))}.banner.ok{color:var(--ok);border-color:color-mix(in oklab,var(--ok) 45%,var(--line));background:color-mix(in oklab,var(--ok) 10%,var(--bg2))}.palette-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:color-mix(in oklab,#000 55%,transparent);display:grid;place-items:center;padding:1rem;z-index:20;animation:fade .15s ease-out}.palette{width:min(28rem,100%);background:var(--bg1);border:1px solid var(--line);border-radius:.75rem;padding:1rem;box-shadow:0 24px 60px color-mix(in oklab,#000 50%,transparent)}.palette h2{margin:0 0 .35rem;font-size:1.05rem}.palette p{margin:0 0 .85rem;color:var(--muted);font-size:.9rem}.palette-list{display:flex;flex-direction:column;gap:.45rem;max-height:min(50vh,22rem);overflow:auto}.palette-list button{text-align:left;display:flex;flex-direction:column;gap:.15rem;padding:.65rem .75rem}.palette-list strong{font-size:.92rem}.palette-list span{font-size:.8rem;color:var(--muted)}.palette-actions{display:flex;justify-content:flex-end;margin-top:.85rem}.footnote{margin-top:1.75rem;color:var(--muted);font-size:.85rem;max-width:70ch;animation:rise .55s ease-out .26s both}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes fade{0%{opacity:0}to{opacity:1}}
