:root,[data-theme=dark]{--accent: #35d6bb;--c-bg: #0a0e27;--c-surface: #141a3a;--c-text: #e7ebff;--c-muted: #aab4dd;--c-accent: #5ad6ff;--c-accent-strong: #8ee4ff;--c-border: #2c376b;--canvas-bg: #0c1330;--c-alice: #3ee08a;--c-bob: #ff7ad6;--c-shared: #ffd24a;--c-leak: #ff6080;--c-edge: #3c4a93;--c-ell-a: #5ad6ff;--c-ell-b: #c08bff}[data-theme=light]{--accent: #0e7c6b;--c-bg: #ffffff;--c-surface: #f4f7ff;--c-text: #13183a;--c-muted: #45507a;--c-accent: #0b63b8;--c-accent-strong: #094a8c;--c-border: #c5cef0;--canvas-bg: #f8faff;--c-alice: #0a7a42;--c-bob: #b0179e;--c-shared: #9a6200;--c-leak: #c01f3f;--c-edge: #aab6e8;--c-ell-a: #0b63b8;--c-ell-b: #7a3cd0}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}html{background-color:var(--color-bg)}body{background-color:var(--c-bg);color:var(--c-text);font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:16px;line-height:1.65;transition:background-color .3s,color .3s}.cl-hero-wrap,.cl-hero{max-width:960px;margin-inline:auto;padding-inline:1.25rem}.cl-hero{--text: var(--c-text);--text-dim: var(--c-muted);--border: var(--c-border);position:relative}.cl-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:clamp(1rem,4vw,3rem);flex-wrap:wrap;margin:clamp(1rem,3vw,2rem) 0 1.5rem}.cl-hero-main{flex:1 1 22rem;min-width:min(100%,20rem)}.cl-hero-title{margin:0;font-size:clamp(1.6rem,3.8vw,2.7rem);font-weight:700;line-height:1.1;letter-spacing:.01em}.cl-hero-sub{margin:.4rem 0 0;font-size:clamp(.9rem,1.6vw,1.05rem);letter-spacing:.01em;opacity:.85}.cl-hero-desc{margin:.55rem 0 0;font-size:1rem;line-height:1.5;color:var(--text-dim);max-width:60ch}.cl-hero-why{flex:0 1 min(40%,26rem);min-width:min(100%,15rem);border:1px solid var(--border);border-radius:10px;padding:.85rem 1.05rem;background:color-mix(in oklab,var(--accent) 6%,transparent)}.cl-hero-why-label{display:block;font-size:.68rem;font-weight:700;letter-spacing:.14em}.cl-hero-why-text{margin:.35rem 0 0;font-size:.95rem;line-height:1.5}@media (max-width:640px){.cl-hero{flex-direction:column}.cl-hero-why{flex-basis:auto;width:100%}}.theme-toggle-btn{position:absolute;top:2.5rem;right:1.25rem;width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid var(--c-border);background-color:var(--c-surface);color:var(--c-accent);cursor:pointer;font-size:1.25rem;display:flex;align-items:center;justify-content:center;transition:background-color .2s,border-color .2s}.theme-toggle-btn:hover{border-color:var(--c-accent)}main{max-width:960px;margin:0 auto;padding:1rem 1.25rem 2rem;display:grid;gap:1.5rem}section{background-color:var(--c-surface);border:1px solid var(--c-border);border-radius:14px;padding:1.5rem}section h2{font-size:1.25rem;margin-bottom:.6rem;color:var(--c-accent-strong)}section p{margin-bottom:.75rem;max-width:68ch}.m,code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.m{color:var(--c-accent-strong);font-size:.95em}.primer{border-left:4px solid var(--c-accent)}.primer h2{color:var(--c-accent-strong)}.gloss{font:inherit;padding:0;margin:0;border:none;background:none;color:var(--c-accent-strong);border-bottom:1px dotted currentColor;cursor:help;border-radius:0}.gloss:hover{background:none;color:var(--c-accent)}.gloss:after{content:" ?";font-size:.7em;vertical-align:super;opacity:.9}.gloss-popover{position:absolute;z-index:900;max-width:min(32rem,90vw);padding:.7rem .9rem;border-radius:10px;border:1px solid var(--c-accent);background-color:var(--c-surface);color:var(--c-text);font-size:.9rem;line-height:1.5;box-shadow:0 8px 24px #00000059}.gloss-popover[hidden]{display:none}.controls{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.btn-secondary{border-color:var(--c-border);color:var(--c-muted)}.btn-secondary:hover{background-color:var(--c-border);color:var(--c-text)}.swatch-inline{display:inline-block;width:.7rem;height:.7rem;border-radius:3px;vertical-align:middle;border:1px solid var(--c-border)}.swatch-kernel{background-color:var(--c-shared)}.canvas-wrap{width:100%;margin:.5rem 0 1rem}canvas{width:100%;height:auto;display:block;background-color:var(--canvas-bg);border:1px solid var(--c-border);border-radius:10px}.legend{font-size:.85rem;color:var(--c-muted);margin-bottom:.75rem}.swatch{display:inline-block;width:.8rem;height:.8rem;border-radius:3px;vertical-align:middle;margin-right:.15rem}button{font:inherit;font-weight:600;cursor:pointer;padding:.6rem 1.1rem;border-radius:10px;border:1px solid var(--c-accent);background-color:transparent;color:var(--c-accent);transition:background-color .15s,color .15s,transform .05s}button:hover{background-color:var(--c-accent);color:var(--canvas-bg)}button:active{transform:translateY(1px)}:focus-visible{outline:3px solid var(--c-shared);outline-offset:2px}.output{margin-top:1rem;display:grid;gap:.35rem}.output:empty{display:none}.output--alert .result.bad code{color:var(--c-leak)}.kv{display:grid;grid-template-columns:minmax(8rem,12rem) 1fr;gap:.75rem;align-items:baseline;padding:.35rem .6rem;border-radius:8px;background-color:var(--c-bg);border:1px solid var(--c-border)}.kv>span{color:var(--c-muted);font-size:.85rem}.kv code{font-size:.9rem;word-break:break-word}.kv.result{font-weight:600}.kv.result.ok code{color:var(--c-alice)}.kv.result.bad code{color:var(--c-leak)}.lessons{list-style:none;display:grid;gap:.6rem}.lessons li{padding-left:1.25rem;position:relative}.lessons li:before{content:"◆";position:absolute;left:0;color:var(--c-accent)}.disclaimer{margin-top:1rem;padding:.75rem 1rem;border-left:3px solid var(--c-leak);background-color:var(--c-bg);border-radius:0 8px 8px 0;color:var(--c-muted);font-size:.9rem}.scripture-footer{text-align:center;padding:2.5rem 1.25rem;font-size:.85rem;color:var(--c-muted);border-top:1px solid var(--c-border);margin-top:1rem;max-width:960px;margin-inline:auto}a{color:var(--c-accent-strong);text-decoration:underline}a:hover{color:var(--c-accent)}a:focus-visible{outline:2px solid var(--c-accent-strong);outline-offset:2px}@media (max-width: 640px){.kv{grid-template-columns:1fr;gap:.15rem}section{padding:1.1rem}}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}