:root{color-scheme:dark;--bg:#08131e;--panel:#101e2b;--line:#293744;--text:#eef0ed;--muted:#aeb9c1;--gold:#d6c29a;--mono:ui-monospace,"SFMono-Regular",Consolas,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--text);background:radial-gradient(ellipse at 64% 9%,#12212e44,transparent 44%),var(--bg);font:15px/1.55 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}button,a{ -webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible,canvas:focus-visible{outline:2px solid #e0cba2;outline-offset:4px}.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;background:var(--bg);z-index:5}.shell,.bar{width:min(1280px,90%);margin:auto}.bar{display:flex;align-items:center;height:78px;gap:64px}header,footer{border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;font:600 32px/1 Georgia,serif;letter-spacing:-1.6px}.brand i{width:33px;height:33px;color:var(--gold);margin-right:10px}.brand span{color:var(--gold)}i[data-icon]{display:inline-flex;align-items:center;justify-content:center;font-style:normal}i svg{width:100%;height:100%;display:block}nav{display:flex;gap:30px;font-size:13px}nav a{color:var(--muted)}nav a:first-child,nav a:hover,footer a:hover{color:var(--gold)}.local{margin-left:auto;display:flex;align-items:center;gap:9px;color:#b5c0c7;font:11px var(--mono)}.local b,.live-dot{width:6px;height:6px;border-radius:100%;background:#93b99d;display:inline-block}.hero{position:relative;display:grid;grid-template-columns:minmax(280px,.78fr) minmax(0,1.35fr);gap:clamp(36px,5vw,84px);align-items:center;padding:clamp(48px,5.2vw,82px) 0}.intro h1{font:400 clamp(64px,6.8vw,100px)/.96 Georgia,"Times New Roman",serif;letter-spacing:-.057em;margin:0}.intro h1 em{font-weight:400;color:var(--gold)}.lead{font-size:clamp(15px,1.2vw,18px);line-height:1.65;color:var(--muted);max-width:380px;margin:23px 0 28px}.open{display:inline-flex;gap:11px;align-items:center;height:48px;padding:0 18px;border-radius:6px;background:#dcc69b;border:1px solid #e6d2ae;color:#19202a;font-weight:650}.open:hover{background:#ead4ad}.open i{width:19px;height:19px}.open i:last-child{width:17px;margin-left:13px}.drop-copy{font-size:12px;color:#9eacb8;margin-top:11px}code{font:12px var(--mono);color:var(--gold)}.private{display:flex;align-items:center;gap:8px;font-size:12px;color:#aeb9bd;margin-top:32px}.private i{width:15px;height:15px;color:var(--gold)}.studio{overflow:hidden;border:1px solid #384750;border-radius:13px;background:#0c1925;box-shadow:0 18px 54px #01060b40}.studio-head,.readout{display:flex;align-items:center;padding:0 17px;background:#12202c}.studio-head{height:42px;border-bottom:1px solid var(--line);justify-content:space-between}.studio-head>span{display:flex;align-items:center;gap:9px;font:10px var(--mono);letter-spacing:.16em;color:#c3cbd0}.live-dot{background:#cfb98e}.studio-head button,.tools button{display:grid;place-content:center;width:32px;height:32px;background:transparent;border:0;color:#aebcc6}.studio-head i,.tools i{width:16px;height:16px}.studio-head button:hover,.tools button:hover{color:white}.stage{position:relative;height:clamp(315px,28vw,405px);background:radial-gradient(ellipse at 50% 45%,#1b2b37,#0a1723 79%);isolation:isolate}.stage>canvas{position:absolute;width:100%;height:100%;inset:0}.stage #mesh{touch-action:none;cursor:grab}.stage #mesh:active{cursor:grabbing}.filelabel{position:absolute;left:17px;top:15px;display:flex;align-items:center;gap:7px;color:#bac4c8;font:11px var(--mono);pointer-events:none;max-width:85%}.filelabel span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filelabel i{width:14px;height:14px;color:var(--gold)}.axis{position:absolute;left:13px;bottom:11px;pointer-events:none}.axis canvas{display:block;width:55px;height:53px}.tools{position:absolute;right:15px;bottom:15px;display:flex;align-items:center;gap:2px;border:1px solid #35444f;border-radius:6px;background:#0b1924eb;padding:3px}.tools button{border-radius:3px}.tools [aria-pressed=true]{background:#344047;color:#e6cc99}.tools span{height:18px;width:1px;background:var(--line);margin:0 3px}.readout{min-height:60px;gap:20px;border-top:1px solid var(--line)}.readout>div+div{border-left:1px solid var(--line);padding-left:20px}.readout small,.readout strong{display:block;font-family:var(--mono)}.readout small{font-size:9px;color:#a5b2bd;letter-spacing:.1em}.readout strong{font-size:12px;font-weight:400;margin-top:2px}.example{margin-left:auto;display:flex;align-items:center;gap:5px;color:#c6c2b6;border:0;background:none;font-size:11px}.example i{width:13px;height:13px}.drop-overlay{display:none;position:absolute;inset:8px;align-items:center;justify-content:center;background:#12232df0;border:2px dashed var(--gold);border-radius:7px;pointer-events:none}.studio.over .drop-overlay{display:flex}.message{grid-column:1/-1;font-size:13px;color:#e5cdaa}.message:empty{display:none}.features,.split{border-top:1px solid var(--line);padding:38px 0 48px}h2,h3{margin:0;font-family:Georgia,serif;font-weight:400}h2{font-size:clamp(33px,3.15vw,46px);line-height:1.14;letter-spacing:-.04em}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:23px}.cards article{padding:23px 24px 24px;background:linear-gradient(120deg,#13222f,#0e1b27);border:1px solid var(--line);border-radius:9px}.icon{width:33px;height:33px;border:1px solid #53524a;border-radius:7px;display:grid;place-items:center;background:#cdb8850a;color:var(--gold)}.icon i{width:19px;height:19px}h3{font-size:24px;letter-spacing:-.025em}.cards h3{margin-top:15px}.cards p,.split p{font-size:14px;line-height:1.65;color:var(--muted);margin:6px 0 0}.split{display:grid;grid-template-columns:.85fr 1.35fr;gap:40px;padding:50px 0}.guide ol{margin:0;list-style:decimal-leading-zero;padding-left:32px}.guide li{padding:0 0 19px 10px}.guide li:last-child{padding-bottom:0}.guide li::marker{font:12px var(--mono);color:var(--gold)}.format-list{display:flex;gap:24px}.format-list>div{flex:1}.format-list strong{font:22px Georgia,serif}.format-list code{margin-left:8px}.faq details{border-bottom:1px solid var(--line);padding:15px 0}.faq details:first-child{padding-top:4px}summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}summary::-webkit-details-marker{display:none}summary:after{content:'+';color:var(--gold)}details[open] summary:after{content:'−'}footer{border-top:1px solid var(--line);border-bottom:0}footer .shell{display:flex;align-items:center;gap:18px;padding:26px 0;font-size:12px;color:var(--muted)}footer .brand{font-size:24px;color:var(--text)}footer .brand i{width:23px;height:23px}footer a:last-child{margin-left:auto}
@media(max-width:900px){.bar{gap:40px}.hero{grid-template-columns:.85fr 1.2fr;gap:25px}.intro h1{font-size:65px}.readout{gap:10px;padding:0 12px}.readout>div+div{padding-left:10px}.readout small span{display:none}}
@media(max-width:730px){.bar{height:64px;gap:20px}nav{margin-left:auto;gap:18px}.local{display:none}.hero{grid-template-columns:1fr;gap:26px;padding:37px 0}.intro h1 br{display:none}.intro h1 em:before{content:' '}.intro h1{font-size:clamp(47px,8.9vw,66px)}.lead{max-width:520px;margin:15px 0 20px}.private{margin-top:15px}.stage{height:clamp(260px,62vw,350px)}.cards{grid-template-columns:1fr}.cards article{display:grid;grid-template-columns:36px 1fr;column-gap:14px}.cards h3{margin:0}.cards p{grid-column:2}.split{grid-template-columns:1fr;gap:23px;padding:34px 0}.features{padding-top:30px}.brand{font-size:28px}.brand i{width:27px;height:27px}nav{font-size:12px}.format-list{flex-wrap:wrap}.readout{min-height:54px}.example{padding:8px 2px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
