:root{color-scheme:dark;--cream:#efe0c3;--muted:#8d9d9c;--teal:#92c6bb;--red:#dd7353;--line:#91c8ba30;--panel:#111c24e8}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080f18;color:var(--cream);font-family:'Segoe UI',Arial,sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,a{color:inherit}#viewport{position:absolute;inset:0}#viewport canvas{display:block;width:100%;height:100%;outline:none}.vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 150px #0007}header{position:absolute;top:0;left:0;right:0;padding:30px 36px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);pointer-events:none}.brand{font-size:20px;letter-spacing:6px;font-weight:800;text-decoration:none;pointer-events:auto}.mark{color:var(--red);font-size:30px;margin-right:13px;font-style:italic;letter-spacing:-5px}.topright{font:10px Consolas,monospace;letter-spacing:2px;color:var(--muted);display:flex;align-items:center;gap:12px}.live,.dot{display:inline-block;width:5px;height:5px;background:var(--teal);box-shadow:0 0 8px #92c6bb80;border-radius:50%}.sep{color:#49686d;margin:0 10px}main{position:absolute;inset:0;pointer-events:none}.identity{position:absolute;left:38px;top:134px}.eyebrow{font:10px Consolas,monospace;letter-spacing:3px;color:var(--teal)}h1{font-size:76px;letter-spacing:-4px;font-style:italic;font-weight:850;line-height:1;margin:12px 0 11px}h1 span{display:inline-block;vertical-align:top;font:13px Consolas,monospace;letter-spacing:0;border-left:2px solid var(--red);padding-left:10px;margin:8px 0 0 17px;color:var(--red)}.identity p{font-size:13px;color:var(--muted);margin:0}.tags{display:flex;gap:8px;margin-top:23px}.tags span{font:8px Consolas,monospace;letter-spacing:1px;border:1px solid var(--line);padding:6px 8px;color:#bcc9bd}.controls{pointer-events:auto;position:absolute;right:30px;top:122px;width:245px;background:var(--panel);border:1px solid var(--line);padding:21px;backdrop-filter:blur(16px);border-radius:3px}.panelhead{display:flex;justify-content:space-between;font:9px Consolas,monospace;letter-spacing:1.4px;color:var(--teal);padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:20px}.smallmark{color:var(--red)}label{display:block;font-size:11px;color:#b9c6be;margin-bottom:17px}select{display:block;width:100%;background:#1b2b33;border:1px solid var(--line);border-radius:2px;color:var(--cream);padding:9px;margin-top:9px;font-size:11px;outline:none}.rangeLabel{font-size:11px;color:#b9c6be}.rangeLabel output{float:right;color:var(--teal);font:10px Consolas,monospace}input[type=range]{width:100%;height:3px;display:block;appearance:none;background:#3c5357;margin:13px 0 0;accent-color:var(--teal);cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:8px;height:12px;background:var(--teal);border:0;border-radius:1px}.toggle{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#b9c6be;margin:15px 0}.switch{width:26px;height:13px;border:1px solid #52656c;background:transparent;border-radius:8px;padding:0;position:relative;cursor:pointer}.switch:after{content:'';display:block;width:7px;height:7px;border-radius:50%;background:#63767d;position:absolute;left:2px;top:2px}.switch.on{border-color:#719f94;background:#719f9420}.switch.on:after{left:14px;background:var(--teal)}.separation{border-top:1px solid var(--line);padding-top:18px;margin-top:20px}.viewLabel{font:8px Consolas,monospace;letter-spacing:1px;color:var(--muted);margin:23px 0 9px}.views{display:flex;gap:5px}.views button{flex:1;background:#172730;border:1px solid var(--line);font-size:10px;color:var(--muted);padding:7px 0;cursor:pointer}.views button.active{border-color:var(--teal);color:var(--cream);background:#2d4a4c}.download{display:flex;justify-content:space-between;background:var(--cream);color:#14262d;text-decoration:none;padding:11px 10px;font-size:10px;font-weight:700;margin-top:23px}.download:hover{background:#fff0d2}.blendlink{display:block;text-align:center;margin-top:12px;text-decoration:none;font-size:9px;color:var(--muted)}footer{position:absolute;left:35px;right:35px;bottom:24px;border-top:1px solid var(--line);padding-top:16px;display:flex;align-items:center;justify-content:space-between;font:9px Consolas,monospace;letter-spacing:.5px;color:var(--muted)}.spec{display:flex;gap:10px;align-items:center}.hint{font-size:8px;letter-spacing:1px}.hint span{font-family:'Segoe UI',sans-serif;letter-spacing:0;color:#71868c;margin-left:5px}.hint b{font-weight:400;margin:0 14px;color:#3b555e}#capture{padding:0;background:transparent;border:0;color:var(--cream);font:9px Consolas,monospace;letter-spacing:1px;cursor:pointer}.axis{position:absolute;bottom:95px;left:40px;width:100px;height:40px;font:9px Consolas,monospace;pointer-events:none}.axis span{display:inline-block;margin:0 7px}.ax{color:#e78c6b}.ay{color:#a0cfad}.az{color:#8db8d3}.axis small{font-size:7px;letter-spacing:1px;color:#647e87;white-space:nowrap;display:block;margin-top:10px}#error{position:absolute;left:30px;bottom:90px;max-width:600px;padding:20px;background:#522e2c;border:1px solid #d78668;color:#ffe2cf;font-size:13px}
@media(max-height:780px){header{padding:20px 30px}.controls{top:90px;padding:16px;width:223px}.panelhead{margin-bottom:13px;padding-bottom:11px}label{margin-bottom:14px}.toggle{margin:11px 0}.separation{margin-top:13px;padding-top:13px}.viewLabel{margin-top:18px}.download{margin-top:16px}.identity{top:111px}h1{font-size:62px}}
@media(max-width:950px){.identity{top:100px;left:25px}h1{font-size:48px;letter-spacing:-2px}.identity p{font-size:11px}.tags{display:none}.controls{right:20px;width:205px}.topright{font-size:8px}.hint{display:none}.brand{font-size:15px;letter-spacing:4px}header{padding:20px 25px}}
@media(max-width:600px){header{padding:14px 18px}.topright{display:none}.identity{top:79px;left:20px}.eyebrow{font-size:8px}h1{font-size:43px}.controls{top:auto;bottom:72px;width:calc(100% - 30px);right:15px;padding:13px;display:grid;grid-template-columns:1fr 1fr;gap:10px 17px;background:#111c24e0}.panelhead{grid-column:1/-1;margin:0;padding-bottom:8px}.controls label{margin:0}select{padding:6px;margin-top:5px}.toggle{margin:3px 0}.separation{margin:0;padding:0;border:0}.viewLabel{display:none}.views{align-items:center}.download{margin:0;padding:8px}.blendlink{align-self:center;margin:0}.axis{display:none}footer{bottom:18px;left:20px;right:20px;font-size:8px}.controls .rangeLabel{font-size:10px}}