@font-face{font-family:Geist;src:url(/lab/kinetik/fonts/Geist-Variable.woff2)format("woff2");font-weight:100 900;font-display:swap}@font-face{font-family:Geist Mono;src:url(/lab/kinetik/fonts/GeistMono-Variable.woff2)format("woff2");font-weight:100 900;font-display:swap}@font-face{font-family:Instrument Serif;src:url(/lab/kinetik/fonts/instrument-serif-regular-latin.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Instrument Serif;src:url(/lab/kinetik/fonts/instrument-serif-italic-latin.woff2)format("woff2");font-weight:400;font-style:italic;font-display:swap}:root{--paper:#fffcf6;--ink:#151515;--ink-60:#1515159e;--ink-40:#1515156b;--hairline:#78716238;--hairline-soft:#7871621f;--tool-accent:#7a4a2b;--ease:cubic-bezier(.32, .72, 0, 1)}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:Geist,system-ui,sans-serif;font-size:15px;line-height:1.6}::selection{background:var(--tool-accent);color:#fff}button{font:inherit;color:inherit}.mono{font-variant-numeric:tabular-nums;font-family:Geist Mono,monospace}.label{text-transform:uppercase;letter-spacing:.2em;color:var(--ink-60);font-family:Geist Mono,monospace;font-size:.62rem}.wrap{max-width:1560px;margin:0 auto;padding:0 28px}.skip{z-index:99;background:var(--ink);color:var(--paper);border-radius:0 0 12px;padding:10px 18px;font-family:Geist Mono,monospace;font-size:.7rem;position:absolute;top:0;left:-9999px}.skip:focus{left:0}header.site{border-bottom:1px solid var(--hairline);z-index:20;background:color-mix(in srgb, var(--paper) 92%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:18px 0;position:sticky;top:0}header.site .wrap{justify-content:space-between;align-items:center;gap:20px;display:flex}.back{text-transform:uppercase;letter-spacing:.2em;color:var(--ink-60);transition:color .3s var(--ease);font-family:Geist Mono,monospace;font-size:10px;text-decoration:none}.back:hover{color:var(--tool-accent)}.head-actions{align-items:center;gap:12px;display:flex}.langbtn{border:1px solid var(--hairline);letter-spacing:.14em;width:44px;height:34px;color:var(--ink-60);transition:color .3s var(--ease), border-color .3s var(--ease), transform .15s var(--ease);background:#fff;border-radius:999px;place-items:center;font-family:Geist Mono,monospace;font-size:.58rem;text-decoration:none;display:grid}.langbtn:hover{color:var(--tool-accent);border-color:color-mix(in srgb, var(--tool-accent) 40%, transparent)}.langbtn:active{transform:scale(.96)}.brand{align-items:baseline;gap:12px;display:flex}.brand h1{font-family:Instrument Serif,serif;font-size:1.35rem;font-weight:400;line-height:1}.brand span{text-transform:uppercase;letter-spacing:.18em;color:var(--ink-40);font-family:Geist Mono,monospace;font-size:10px}.sysstatus{color:var(--tool-accent)}.hero{text-align:center;padding:64px 0 34px}.hero h2{text-wrap:balance;max-width:24ch;margin:14px auto 18px;font-family:Instrument Serif,serif;font-size:clamp(2.2rem,4.6vw,3.5rem);font-weight:400;line-height:1.08}.hero h2 em{font-style:italic}.hero p{color:var(--ink-60);text-wrap:pretty;max-width:56ch;margin:0 auto;font-weight:300}.hero .label{color:var(--tool-accent)}.presetbar{scroll-snap-type:x proximity;scrollbar-width:none;flex-wrap:nowrap;align-items:center;gap:8px;padding-top:8px;padding-bottom:18px;display:flex;overflow-x:auto}.presetbar::-webkit-scrollbar{display:none}.presetbtn{scroll-snap-align:start;border:1px solid var(--hairline);cursor:pointer;text-transform:uppercase;letter-spacing:.16em;height:44px;color:var(--ink-60);white-space:nowrap;transition:color .3s var(--ease), background-color .3s var(--ease), border-color .3s var(--ease), transform .15s var(--ease);background:#fff;border-radius:999px;flex:none;padding:0 20px;font-family:Geist Mono,monospace;font-size:.62rem}.presetbtn:hover{border-color:var(--tool-accent);color:var(--ink)}.presetbtn:active{transform:scale(.96)}.presetbtn[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.presetbtn .p-no{opacity:.55;margin-right:4px}.preset-status{color:var(--tool-accent);flex:none;margin-left:auto;padding-left:14px}.workbench{grid-template-columns:minmax(250px,.8fr) minmax(440px,1.8fr) minmax(290px,1fr);align-items:start;gap:22px;padding-bottom:56px;display:grid}.col{border:1px solid var(--hairline);background:#fff;border-radius:24px;min-width:0;padding:22px 24px 24px}.colhead{margin-bottom:16px;display:block}.axis{border-top:1px solid var(--hairline-soft);padding:12px 0 14px}.axis:first-child{border-top:none;padding-top:2px}.axis-head{justify-content:space-between;align-items:baseline;display:flex}.axis-val{color:var(--tool-accent);font-size:.85rem}.axis-ends{text-transform:uppercase;letter-spacing:.14em;color:var(--ink-40);justify-content:space-between;margin:8px 0 0;font-family:Geist Mono,monospace;font-size:.55rem;display:flex}.axis input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:44px;display:block}.axis input[type=range]::-webkit-slider-runnable-track{background:var(--hairline);border-radius:999px;height:2px}.axis input[type=range]::-moz-range-track{background:var(--hairline);border-radius:999px;height:2px}.axis input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--ink);border:3px solid var(--paper);width:18px;height:18px;box-shadow:0 0 0 1px var(--hairline);transition:background-color .3s var(--ease);border-radius:999px;margin-top:-8px}.axis input[type=range]::-moz-range-thumb{background:var(--ink);border:3px solid var(--paper);width:12px;height:12px;box-shadow:0 0 0 1px var(--hairline);border-radius:999px}.axis input[type=range]:hover::-webkit-slider-thumb{background:var(--tool-accent)}.axis input[type=range]:hover::-moz-range-thumb{background:var(--tool-accent)}.axis input[type=range]:focus-visible{outline:none}.axis input[type=range]:focus-visible::-webkit-slider-thumb{background:var(--tool-accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--tool-accent) 45%, transparent)}.axis input[type=range]:focus-visible::-moz-range-thumb{background:var(--tool-accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--tool-accent) 45%, transparent)}.axis input[type=range]:active::-webkit-slider-thumb{background:var(--tool-accent)}.axis-hint{color:var(--ink-40);text-wrap:pretty;margin-top:2px;font-size:.72rem;font-weight:300}.char-actions{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.ghostbtn{border:1px solid var(--hairline);background:var(--paper);cursor:pointer;text-transform:uppercase;letter-spacing:.14em;height:34px;color:var(--ink-60);transition:color .3s var(--ease), background-color .3s var(--ease), border-color .3s var(--ease), transform .15s var(--ease);border-radius:999px;padding:0 14px;font-family:Geist Mono,monospace;font-size:.58rem}.ghostbtn:hover{border-color:var(--tool-accent);color:var(--ink)}.ghostbtn:active{transform:scale(.96)}.ghostbtn[aria-pressed=true]{color:var(--tool-accent);border-color:color-mix(in srgb, var(--tool-accent) 40%, transparent)}.ghostbtn.copied{background:var(--ink);color:var(--paper);border-color:var(--ink)}.rm-panel{border-top:1px solid var(--hairline-soft);margin-top:22px;padding-top:18px}.rm-hint{color:var(--ink-40);text-wrap:pretty;margin:6px 0 10px;font-size:.72rem;font-weight:300}.rm-choice{gap:6px;display:grid}.rm-choice label{color:var(--ink-60);cursor:pointer;align-items:center;gap:8px;font-size:.8rem;display:flex}.rm-choice input{accent-color:var(--tool-accent)}.rm-os{color:var(--ink-40);font-family:Geist Mono,monospace;font-size:.6rem}.col-stage{padding:8px}.col-stage .colhead{margin:14px 0 12px 18px}.col-stage .scenebar{padding:0 12px 10px}.stage{background:var(--paper);border:1px solid var(--hairline);aspect-ratio:16/10.5;border-radius:16px;position:relative;overflow:hidden;container-type:inline-size}.stage-grid{background-image:linear-gradient(to right, var(--hairline-soft) 1px, transparent 1px);pointer-events:none;background-size:8.33333% 100%;position:absolute;inset:0}.sp{opacity:0;position:absolute}.sp-title{font-family:Instrument Serif,serif;font-size:clamp(1.6rem,7cqw,3.4rem);line-height:1;top:7%;left:5%}.sp-words{letter-spacing:.02em;font-family:Geist,sans-serif;font-size:clamp(1rem,4.4cqw,2.1rem);font-weight:500;line-height:1.18;top:34%;left:5%}.sp-words div{opacity:0}.sp-rect{aspect-ratio:1;background:var(--ink);border-radius:2px;width:22%;top:30%;right:8%}.sp-rule{background:var(--ink);transform-origin:0;opacity:1;height:1px;bottom:18%;left:5%;right:5%;transform:scaleX(0)}.sp-meta{letter-spacing:.2em;color:var(--ink-60);font-family:Geist Mono,monospace;font-size:.62rem;bottom:8%;left:5%}.sp-arrow{font-size:1.1rem;bottom:7%;right:5%}.sp-card{opacity:1;border:1px solid var(--hairline);background:#fff;border-radius:12px;gap:10px;width:46%;padding:16px;display:grid;top:16%;left:50%;transform:translate(-50%)}.sp-card-dot{background:var(--tool-accent);border-radius:999px;width:10px;height:10px}.sp-card-lines i{background:var(--hairline);border-radius:3px;height:6px;margin-bottom:6px;display:block}.sp-card-lines i:last-child{width:62%}.sp-btn{background:var(--ink);height:30px;color:var(--paper);text-transform:uppercase;letter-spacing:.14em;pointer-events:none;border:none;border-radius:999px;justify-self:start;padding:0 14px;font-family:Geist Mono,monospace;font-size:.55rem}.sp-toggle{border:1px solid var(--hairline);background:var(--paper);border-radius:999px;width:40px;height:22px;position:relative}.sp-knob{background:var(--ink);border-radius:999px;width:16px;height:16px;position:absolute;top:2px;left:2px}.sp-accordion{height:0;overflow:hidden}.sp-accordion i{background:var(--hairline-soft);border-radius:3px;height:5px;margin-bottom:5px;display:block}.sp-modal{background:var(--ink);width:34%;color:var(--paper);border-radius:12px;gap:8px;padding:14px 16px;display:grid;bottom:10%;left:50%;transform:translate(-50%)}.sp-modal i{background:#fffcf640;border-radius:3px;height:5px;display:block}.sp-modal i:last-of-type{width:55%}.sp-modal span{text-transform:uppercase;letter-spacing:.14em;color:#fffcf6b3;font-family:Geist Mono,monospace;font-size:.55rem}.sp-navpanel{background:var(--ink);transform-origin:top;border-radius:0;inset:0 45% 0 0}.sp-navlinks{color:var(--paper);list-style:none;top:14%;left:7%}.sp-navlinks li{opacity:0;font-family:Instrument Serif,serif;font-size:clamp(1.1rem,4.4cqw,2rem);line-height:1.45}.sp-navbar{background:var(--tool-accent);transform-origin:0;opacity:1;width:26%;height:1px;bottom:14%;left:7%}.sp-navlinks,.sp-navpanel{opacity:1}.sp-navpanel{transform:scaleY(0)}.sp-seq{list-style:none;top:12%;left:6%}.sp-seq li{opacity:0;border-bottom:1px solid var(--hairline-soft);padding-right:24cqw;font-family:Geist,sans-serif;font-size:clamp(.85rem,3cqw,1.3rem);font-weight:300;line-height:1.8}.sp-seqblocks{opacity:1;gap:10px;width:24%;display:grid;top:18%;right:7%}.sp-seqblocks div{aspect-ratio:2.6;background:var(--ink);opacity:0;border-radius:2px}.sp-seqblocks div:nth-child(2){background:var(--tool-accent)}.sp-seqblocks div:nth-child(3){background:var(--hairline)}.sp-seq{opacity:1}.sp-springtrack{background:var(--hairline);opacity:1;height:1px;top:50%;left:12%;right:12%;transform:translateY(-50%)}.sp-springbox{aspect-ratio:1;background:var(--ink);border-radius:4px;width:clamp(34px,9cqw,56px);position:absolute;top:50%;left:0;translate:0 -50%}.stage [data-el]{will-change:transform, opacity}.stage .sp-card,.stage .sp-modal,.stage .sp-navpanel,.stage .sp-navlinks,.stage .sp-navbar,.stage .sp-seq,.stage .sp-seqblocks,.stage .sp-springtrack{display:none}.stage[data-scene=entrance] .sp-title,.stage[data-scene=entrance] .sp-words,.stage[data-scene=entrance] .sp-rect,.stage[data-scene=entrance] .sp-rule,.stage[data-scene=entrance] .sp-meta,.stage[data-scene=entrance] .sp-arrow{display:block}.stage:not([data-scene=entrance]) .sp-title,.stage:not([data-scene=entrance]) .sp-words,.stage:not([data-scene=entrance]) .sp-rect,.stage:not([data-scene=entrance]) .sp-rule,.stage:not([data-scene=entrance]) .sp-meta,.stage:not([data-scene=entrance]) .sp-arrow{display:none}.stage[data-scene=interface] .sp-card,.stage[data-scene=interface] .sp-modal{display:grid}.stage[data-scene=navigation] .sp-navpanel,.stage[data-scene=navigation] .sp-navbar,.stage[data-scene=navigation] .sp-navlinks,.stage[data-scene=sequence] .sp-seq{display:block}.stage[data-scene=sequence] .sp-seqblocks{display:grid}.stage[data-scene=spring] .sp-springtrack{display:block}.scenebar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;display:flex}.scenetabs{scrollbar-width:none;gap:6px;display:flex;overflow-x:auto}.scenetabs::-webkit-scrollbar{display:none}.scenetab{cursor:pointer;text-transform:uppercase;letter-spacing:.14em;height:34px;color:var(--ink-40);white-space:nowrap;transition:color .3s var(--ease), background-color .3s var(--ease), border-color .3s var(--ease), transform .15s var(--ease);background:0 0;border:1px solid #0000;border-radius:999px;flex:none;padding:0 14px;font-family:Geist Mono,monospace;font-size:.58rem}.scenetab:hover{color:var(--ink);border-color:var(--tool-accent)}.scenetab:active{transform:scale(.96)}.scenetab[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.scenetab .p-no{opacity:.5;margin-right:3px}.scenectrl{align-items:center;gap:8px;display:flex}.seg{border:1px solid var(--hairline);background:#fff;border-radius:999px;display:inline-flex;overflow:hidden}.seg button{cursor:pointer;letter-spacing:.08em;height:34px;color:var(--ink-60);transition:color .3s var(--ease), background-color .3s var(--ease), transform .15s var(--ease);background:0 0;border:none;padding:0 13px;font-family:Geist Mono,monospace;font-size:.58rem}.seg button:active{transform:scale(.96)}.seg button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.instabs{flex-wrap:wrap;gap:4px;margin-bottom:14px;display:flex}.instab{cursor:pointer;text-transform:uppercase;letter-spacing:.14em;height:34px;color:var(--ink-40);transition:color .3s var(--ease), border-color .3s var(--ease), background-color .3s var(--ease), transform .15s var(--ease);background:0 0;border:1px solid #0000;border-radius:999px;padding:0 14px;font-family:Geist Mono,monospace;font-size:.58rem}.instab:hover{color:var(--ink);border-color:var(--tool-accent)}.instab:active{transform:scale(.96)}.instab[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.tokrow{border-bottom:1px solid var(--hairline-soft);color:var(--ink-60);justify-content:space-between;align-items:baseline;gap:12px;padding:9px 2px;font-size:.82rem;font-weight:300;display:flex}.tokrow .mono{color:var(--ink);overflow-wrap:anywhere;text-align:right;font-size:.76rem}.tokdivider{height:14px}.tok-time{grid-template-rows:auto auto;grid-template-columns:1fr auto;row-gap:5px;display:grid}.timebar{background:var(--hairline-soft);grid-column:1/-1;height:1px;display:block;position:relative;overflow:visible}.timebar i{background:var(--tool-accent);border-radius:2px;width:4px;height:4px;animation-name:timerun;animation-iteration-count:infinite;animation-delay:.4s;position:absolute;top:-1.5px;left:0}@keyframes timerun{0%{opacity:1;left:0}85%{opacity:1;left:calc(100% - 4px)}to{opacity:0;left:calc(100% - 4px)}}.curvewrap{padding:14px 0 4px}.curve{width:100%;height:auto;display:block}.c-axis{stroke:var(--hairline);stroke-width:1px}.c-dash{stroke-dasharray:3 4}.c-handle{stroke:var(--ink-40);stroke-width:1px;stroke-dasharray:2 3}.c-path{fill:none;stroke:var(--ink);stroke-width:1.6px}.c-accent{stroke:var(--tool-accent)}.c-pt{fill:var(--ink)}.curve-note{letter-spacing:.08em;color:var(--ink-40);font-size:.62rem}.red-note{color:var(--tool-accent);margin-top:12px;display:block}.exportsec{border-top:1px solid var(--hairline);background:#fff;padding:56px 0 64px}.exph{text-wrap:balance;margin:12px 0;font-family:Instrument Serif,serif;font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:400;line-height:1.1}.expp{color:var(--ink-60);text-wrap:pretty;max-width:56ch;margin-bottom:24px;font-weight:300}.exphead{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px;display:flex}.exphead .instabs{margin-bottom:0}.expactions{flex-wrap:wrap;gap:10px;display:flex}.expactions .ghostbtn{background:var(--paper);letter-spacing:.16em;height:44px;color:var(--ink);padding:0 20px;font-size:.62rem}.codeblock{background:var(--paper);border:1px solid var(--hairline);max-height:460px;color:var(--ink);tab-size:2;border-radius:16px;padding:22px 24px;font-family:Geist Mono,monospace;font-size:.76rem;line-height:1.7;overflow:auto}.site-foot{border-top:1px solid var(--hairline);padding:36px 0 44px}.site-foot p{color:var(--ink-60);text-wrap:pretty;max-width:64ch;margin-bottom:10px;font-weight:300}.site-foot a{color:var(--ink);-webkit-text-decoration-color:var(--hairline);text-decoration-color:var(--hairline);text-underline-offset:3px}.site-foot a:hover{-webkit-text-decoration-color:var(--tool-accent);text-decoration-color:var(--tool-accent)}@media (width<=1080px){.workbench{grid-template-columns:1fr}.col-stage{order:2}.col-character{order:1}.col-system{order:3}.stage{aspect-ratio:4/5}.sp-card{width:72%}.sp-modal{width:60%}.sp-navpanel{inset:0 25% 0 0}.hero{padding:44px 0 26px}}@media (width<=560px){.wrap{padding:0 18px}header.site .wrap{flex-wrap:wrap;gap:8px}.sysstatus{display:none}.langbtn{height:44px}.scenebar{justify-content:flex-start}.exphead{flex-direction:column;align-items:flex-start}.presetbtn,.ghostbtn,.scenetab,.seg button,.instab{height:44px}}.presetbtn:focus-visible,.ghostbtn:focus-visible,.instab:focus-visible,.scenetab:focus-visible,.seg button:focus-visible,.back:focus-visible,.codeblock:focus-visible,.rm-choice input:focus-visible{outline:2px solid var(--tool-accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.timebar i{opacity:0;animation:none}.presetbtn:active,.ghostbtn:active,.scenetab:active,.instab:active,.seg button:active{transform:none}}
