:root{color-scheme:dark;--board: #120f1e;--ink: #efeaff;--muted: #a79fc4;--dim: #6f6790;--line: rgba(255, 255, 255, .08);--violet: #6d4cff;--magenta: #ff4fd8;--cyan: #38e1ff;--amber: #ffb84d;--green: #4ade80;--sans: "Avenir Next", "Futura", "Helvetica Neue", "PingFang SC", "Noto Sans SC", sans-serif;--mono: "SF Mono", "JetBrains Mono", Menlo, Consolas, "PingFang SC", monospace;--scroll-y: 0px;--scroll-progress: 0;font-family:var(--sans);background:var(--board)}*{box-sizing:border-box}html,body{margin:0;min-width:320px}body{color:var(--ink);background:var(--board);overflow-x:hidden}a{color:inherit;text-decoration:none}h1,h2,h3,p,ol,ul,pre,figure{margin:0}ol,ul{padding:0;list-style:none}.board-shell{position:relative;min-height:100svh;background-color:var(--board);background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.4px);background-size:24px 24px;background-position:12px 12px;isolation:isolate}.nebula{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;pointer-events:none}.blob{position:absolute;display:block;border-radius:50%;filter:blur(70px);opacity:.55;translate:0 calc(var(--scroll-y) * -.12)}.blob-violet{width:60vw;height:60vw;left:-18vw;top:-12vh;background:var(--violet);opacity:.5}.blob-magenta{width:46vw;height:46vw;right:-16vw;top:40vh;background:var(--magenta);opacity:.3;translate:0 calc(var(--scroll-y) * -.22)}.blob-cyan{width:40vw;height:40vw;left:30vw;top:120vh;background:var(--cyan);opacity:.22;translate:0 calc(var(--scroll-y) * -.3)}.toolbar{position:fixed;top:14px;left:14px;z-index:20;display:flex;align-items:center;gap:14px;padding:8px 12px 8px 10px;background:#140f24c7;border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 40px #00000073;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-family:var(--mono);font-size:12px;color:var(--muted)}.doc-name{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-family:var(--sans);font-weight:600;letter-spacing:.01em}.doc-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}.doc-ext{color:var(--dim);font-family:var(--mono);font-weight:400;margin-left:-6px}.zoom{padding:2px 7px;border:1px solid var(--line);border-radius:5px;color:var(--dim)}.lang{display:flex;gap:2px;padding-left:12px;border-left:1px solid var(--line)}.lang a{padding:3px 7px;border-radius:5px;color:var(--muted)}.lang a[aria-current=page]{color:var(--ink);background:#6d4cff47}.hub-link{color:var(--muted);padding-left:12px;border-left:1px solid var(--line)}.hub-link:hover,.lang a:hover{color:var(--ink)}.board{position:relative;z-index:1;width:min(1240px,100%);margin:0 auto;padding:108px 40px 140px}.row{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;--in: 50%;--out: 50%}.row:before,.row:after{content:"";position:absolute;z-index:3;width:10px;height:10px;border-radius:50%;background:var(--board);border:2px solid var(--port, var(--violet));box-shadow:0 0 12px var(--port, var(--violet))}.row:before{top:-5px;left:calc(var(--in) - 5px)}.row:after{bottom:-5px;left:calc(var(--out) - 5px)}.row-role:before{display:none}.block{--type: var(--violet);position:relative;background:#161126d6;border:1px solid color-mix(in srgb,var(--type) 42%,transparent);border-radius:12px;box-shadow:inset 0 1px #ffffff0d,0 22px 48px #00000073,0 0 28px color-mix(in srgb,var(--type) 16%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation-name:snap,drift;animation-duration:.7s,6.4s;animation-timing-function:cubic-bezier(.2,.8,.2,1),ease-in-out;animation-delay:calc(var(--i, 0) * 70ms),calc(var(--i, 0) * -.9s);animation-iteration-count:1,infinite;animation-direction:normal,alternate;animation-fill-mode:both,none}.block-role{--type: var(--cyan)}.block-instruction{--type: var(--violet)}.block-context{--type: var(--amber)}.block-format{--type: var(--green)}.block-examples{--type: var(--magenta)}.block-ref{--type: #b79bff}.block-output{--type: var(--ink)}.block-preview{--type: var(--dim)}.block-head{display:flex;align-items:center;gap:10px;padding:9px 14px;border-bottom:1px solid color-mix(in srgb,var(--type) 26%,transparent);background:linear-gradient(90deg,color-mix(in srgb,var(--type) 16%,transparent),transparent 70%);border-radius:12px 12px 0 0;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--type)}.type-tag{display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--type)}.type-tag:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--type);box-shadow:0 0 10px var(--type);flex:none}.block-name{font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.head-ports{margin-left:auto;display:inline-flex;gap:4px}.head-ports i{width:6px;height:6px;border-radius:50%;border:1px solid color-mix(in srgb,var(--type) 60%,transparent)}.block-body{padding:18px 18px 20px;font-family:var(--mono);font-size:14px;line-height:1.6;color:var(--ink)}.block-body p{color:var(--muted)}.port{position:absolute;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--board);border:2px solid var(--type);box-shadow:0 0 10px color-mix(in srgb,var(--type) 60%,transparent)}.port-l{left:-6px}.port-r{right:-6px}.row-role{--out: 29.17%;--port: var(--cyan)}.block-role{grid-column:1 / span 7}.block-role .block-body{padding:26px 28px 28px}.block-role h1{font-family:var(--sans);font-weight:700;font-size:clamp(44px,6.6vw,88px);letter-spacing:-.045em;line-height:.98;color:var(--ink)}.one-liner{margin-top:18px;font-size:clamp(18px,1.7vw,22px);line-height:1.45;color:var(--ink)!important}.sub-block{margin-top:22px;padding:12px 14px 14px;border:1px dashed color-mix(in srgb,var(--cyan) 40%,transparent);border-radius:8px;background:#38e1ff0d}.sub-label{display:block;margin-bottom:6px;font-family:var(--sans);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan)}.sub-block p{font-size:13.5px;line-height:1.6}.row-instruction{--in: 70.83%;--out: 70.83%;--port: var(--violet)}.cluster{grid-column:6 / span 7}.cluster-title,.row-title{display:flex;align-items:center;gap:12px;margin:0 0 14px;font-family:var(--mono);font-size:13px;font-weight:400;color:var(--muted)}.cluster-title{--type: var(--violet)}.row-title{--type: var(--amber);grid-column:1 / -1}.fact-list{display:grid;gap:14px}.fact{display:flex;align-items:center;gap:14px;padding:13px 22px;border-radius:10px;font-family:var(--mono);font-size:14px;line-height:1.5}.fact:nth-child(2){margin-left:8%}.fact:nth-child(3){margin-left:16%}.fact:nth-child(4){margin-left:8%}.fact:nth-child(5){margin-left:24%}.fact-index{color:var(--type);font-size:11px;letter-spacing:.08em;flex:none}.fact-text{color:var(--ink)}.fact+.fact:before{content:"";position:absolute;left:50%;top:-16px;width:2px;height:16px;background:repeating-linear-gradient(180deg,var(--type) 0 3px,transparent 3px 6px);opacity:.6}.row-context{--in: 50%;--out: 83.33%;--port: var(--amber);row-gap:0}.context-grid{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.context-grid .block:nth-child(2){translate:0 22px}.context-grid .block:nth-child(3){translate:0 44px}.block-context .block-name{white-space:normal;font-family:var(--sans);font-weight:600;font-size:14px;color:var(--ink)}.block-context .block-body p{font-size:13.5px}.row-format{--in: 75%;--out: 75%;--port: var(--green);margin-top:44px}.block-format{grid-column:7 / span 6}.schema{padding:12px 18px 14px}.brace{display:block;color:var(--green);font-size:16px;line-height:1.4}.schema-row{margin-left:18px;border-left:1px solid color-mix(in srgb,var(--green) 25%,transparent)}.schema-row summary{list-style:none;cursor:pointer;display:flex;gap:10px;align-items:baseline;padding:8px 10px;font-size:13.5px;color:var(--ink)}.schema-row summary::-webkit-details-marker{display:none}.schema-row summary:before{content:"▸";color:var(--green);font-size:11px;flex:none;translate:0 -1px}.schema-row[open] summary:before{content:"▾"}.schema-row .key:before{content:'"';color:var(--dim)}.schema-row .key:after{content:'":';color:var(--dim)}.schema-row .value{padding:0 10px 10px 30px;font-size:13px;line-height:1.6;color:var(--muted)}.schema-row .value:before{content:'"';color:var(--dim)}.schema-row .value:after{content:'",';color:var(--dim)}.row-examples{--in: 20.83%;--out: 20.83%;--port: var(--magenta)}.block-examples{grid-column:1 / span 5}.block-ref{grid-column:6 / span 3;align-self:end;translate:0 26px}.example-line{color:var(--ink)!important;font-size:14px}.meta-list{margin-top:14px;display:grid;gap:6px;font-size:12px;color:var(--muted)}.meta-list li{display:flex;gap:8px}.meta-list li:before{content:"//";color:var(--magenta);opacity:.8}.block-ref .block-body{font-size:12.5px}.ref-link{display:inline-block;margin-bottom:4px;color:var(--ink);border-bottom:1px solid color-mix(in srgb,var(--type) 60%,transparent)}.ref-note{display:block;color:var(--muted);line-height:1.55}.row-output{--in: 45.83%;--port: var(--ink);margin-top:26px}.row-output:after{display:none}.block-output{grid-column:4 / span 5}.block-output .block-body{padding:16px 18px 20px}.compiled{display:grid;gap:6px;padding:14px 16px;margin-bottom:18px;background:#080610cc;border:1px solid var(--line);border-radius:8px;font-family:var(--mono);font-size:13px;line-height:1.5;white-space:pre-wrap}.compiled-line{display:block}.compiled-line.l0{color:var(--cyan)}.compiled-line.l1{color:#b79bff}.compiled-line.l2{color:var(--amber)}.compiled-line.l3{color:var(--green)}.compiled-line.l4{color:var(--magenta)}.store{display:inline-flex;align-items:center;justify-content:center;min-height:46px;width:100%;padding:12px 18px;border-radius:8px;background:linear-gradient(135deg,var(--cyan),var(--violet) 60%,var(--magenta));color:#0b0914;font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 0 34px #6d4cff73}.store:hover{filter:brightness(1.08)}.price{margin-top:10px;text-align:center;font-size:12px;color:var(--muted)}.hero-slot{grid-column:9 / span 4;align-self:start;translate:0 34px;border-style:dashed}.hero-slot .block-body{padding:14px 16px 16px}.preview-frame{display:block;aspect-ratio:16 / 9;margin-bottom:12px;border-radius:6px;border:1px dashed color-mix(in srgb,var(--muted) 50%,transparent);background:linear-gradient(135deg,transparent 49.5%,rgba(255,255,255,.08) 49.5%,rgba(255,255,255,.08) 50.5%,transparent 50.5%),linear-gradient(45deg,transparent 49.5%,rgba(255,255,255,.08) 49.5%,rgba(255,255,255,.08) 50.5%,transparent 50.5%)}.hero-slot p{font-size:12.5px;line-height:1.55;color:var(--muted)}.connector{position:relative;height:120px;margin:0;pointer-events:none}.connector svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}.connector path{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke}.connector .wire-glow{stroke:#6d4cff59;stroke-width:6;filter:blur(4px)}.connector .wire{stroke:#b79bff8c;stroke-width:1.5}.connector .wire-flow{stroke:var(--cyan);stroke-width:2;stroke-dasharray:6 18;animation:flow 1.6s linear infinite}.minimap{position:fixed;right:18px;bottom:54px;z-index:20;width:150px;height:104px;padding:6px;background:#140f24d1;border:1px solid var(--line);border-radius:8px;box-shadow:0 14px 40px #00000073;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.mini{position:absolute;border-radius:2px;background:color-mix(in srgb,var(--type) 55%,transparent)}.mini-role{--type: var(--cyan);left:6%;top:6%;width:50%;height:16%}.mini-instruction{--type: var(--violet);left:44%;top:27%;width:50%;height:18%}.mini-context{--type: var(--amber);left:6%;top:50%;width:88%;height:9%}.mini-format{--type: var(--green);left:52%;top:63%;width:42%;height:12%}.mini-examples{--type: var(--magenta);left:6%;top:78%;width:38%;height:7%}.mini-output{--type: var(--ink);left:28%;top:88%;width:60%;height:7%}.mini-viewport{position:absolute;left:3px;right:3px;height:26%;top:calc(3px + var(--scroll-progress) * (100% - 26% - 6px));border:1px solid var(--cyan);border-radius:3px;background:#38e1ff14;box-shadow:0 0 10px #38e1ff59}.status-bar{position:relative;z-index:1;display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;padding:12px 24px;background:#0e0b1ae6;border-top:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--muted)}.status-studio{color:var(--ink)}.status-bar a{color:var(--muted);border-bottom:1px dotted var(--dim)}@keyframes snap{0%{opacity:0;scale:.96}to{opacity:1;scale:1}}@keyframes drift{0%{translate:0 0}to{translate:0 -5px}}@keyframes flow{to{stroke-dashoffset:-48}}.context-grid .block:nth-child(2){animation-name:snap,drift-22}.context-grid .block:nth-child(3){animation-name:snap,drift-44}.block-ref{animation-name:snap,drift-26}.hero-slot{animation-name:snap,drift-34}@keyframes drift-22{0%{translate:0 22px}to{translate:0 17px}}@keyframes drift-44{0%{translate:0 44px}to{translate:0 39px}}@keyframes drift-26{0%{translate:0 26px}to{translate:0 21px}}@keyframes drift-34{0%{translate:0 34px}to{translate:0 29px}}@media(prefers-reduced-motion:reduce){.block,.connector path{animation:none!important}.blob{translate:0 0}}@media(max-width:1080px){.board{padding:100px 28px 120px}.block-role{grid-column:1 / span 9}.cluster{grid-column:3 / span 10}.block-format{grid-column:4 / span 9}.block-examples{grid-column:1 / span 7}.block-ref{grid-column:8 / span 5}.block-output{grid-column:1 / span 7}.hero-slot{grid-column:8 / span 5}.row-role{--out: 37.5%}.row-instruction{--in: 58.33%;--out: 58.33%}.row-format{--in: 70.83%;--out: 70.83%}.row-examples{--in: 29.17%;--out: 29.17%}.row-output{--in: 29.17%}.fact:nth-child(n){margin-left:0}.fact:nth-child(2n){margin-left:10%}}@media(max-width:720px){.minimap{display:none}.toolbar{top:0;left:0;right:0;border-radius:0;border-width:0 0 1px;gap:10px;padding:10px 14px;flex-wrap:wrap}.zoom{display:none}.hub-link{margin-left:auto}.board{padding:84px 16px 96px}.row{display:block;--in: 50% !important;--out: 50% !important}.block-role,.cluster,.context-grid,.block-format,.block-examples,.block-ref,.block-output,.hero-slot{grid-column:auto}.context-grid{display:grid;grid-template-columns:1fr;gap:24px}.context-grid .block,.block-ref,.hero-slot{translate:0 0;animation-name:snap,drift}.block-ref,.hero-slot{margin-top:24px}.block-role .block-body{padding:22px 18px 24px}.block-role h1{font-size:clamp(38px,12vw,56px)}.one-liner{font-size:17px}.fact:nth-child(n){margin-left:0}.fact{padding:12px 18px;font-size:13.5px}.row-format,.row-output{margin-top:0}.connector{height:40px}.connector svg{display:none}.connector:before{content:"";position:absolute;left:50%;top:4px;bottom:4px;width:2px;margin-left:-1px;background:repeating-linear-gradient(180deg,var(--cyan) 0 4px,transparent 4px 9px);opacity:.7}.status-bar{grid-template-columns:1fr;gap:8px;padding:14px 16px}}@media(max-width:360px){.board{padding-left:12px;padding-right:12px}.block-role h1{font-size:34px}.toolbar{font-size:11px;gap:8px}.lang,.hub-link{padding-left:8px}}