@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600&display=swap');
:root{color-scheme:dark;font-family:'DM Sans',sans-serif;color:#ece9e5;background:#030407;--muted:#83858e;--accent:#e8aa71}*{box-sizing:border-box}body{margin:0;overflow:hidden}canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}header{position:absolute;top:0;left:0;right:0;padding:30px 42px;display:flex;justify-content:flex-end;align-items:center}.brand{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:21px;letter-spacing:5px;color:inherit;text-decoration:none}.brand-icon{color:var(--accent);margin-right:12px}.brand-sub{font-size:10px;letter-spacing:2px;color:var(--muted);margin-left:10px}button,select{font:inherit;color:inherit;background:#11131bb3;border:1px solid #ffffff23;border-radius:6px;padding:11px 14px;cursor:pointer}button:hover{background:#ffffff16;border-color:#e8aa7177}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}#panel-toggle{font-size:12px}#panel-toggle span{margin-left:22px;font-size:17px}main{position:absolute;left:42px;top:19%;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2.5px;color:#adaba9}.live-dot{display:inline-block;width:5px;height:5px;background:var(--accent);border-radius:50%;margin-right:8px;box-shadow:0 0 12px #f1ad74}h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(35px,4.2vw,66px);font-weight:400;letter-spacing:-3px;line-height:1.08;margin:22px 0}h1 em{font-style:normal;color:#b1aca8}.intro{font-size:12px;color:var(--muted);line-height:1.9}aside{position:absolute;right:30px;top:118px;width:270px;padding:23px;background:#090c12b8;border:1px solid #ffffff16;border-radius:10px;backdrop-filter:blur(18px);max-height:calc(100dvh - 220px);overflow:auto}aside[hidden]{display:none}.panel-heading{font-size:9px;letter-spacing:1.7px;display:flex;justify-content:space-between;margin-bottom:25px}.muted{color:var(--muted)}label{display:block;font-size:11px;color:#b7b7bd;margin-top:20px;margin-bottom:10px}output{float:right;color:var(--accent);font-size:10px}select{width:100%;font-size:11px;padding:10px}.field-title{margin-top:0}input[type=range]{width:100%;accent-color:var(--accent);height:3px;cursor:pointer}.switch-row{display:flex;justify-content:space-between;align-items:center;margin:13px 0}.switch-row label{margin:8px 0}input[type=checkbox]{accent-color:var(--accent)}.buttons{display:flex;gap:8px}.buttons button{font-size:10px;flex:1;padding:10px 6px}details{border-top:1px solid #ffffff12;margin-top:20px;padding-top:16px;font-size:11px;color:var(--muted);line-height:1.7}summary{cursor:pointer;color:#b7b7bd}details a{color:var(--accent)}footer{position:absolute;bottom:0;left:0;right:0;display:flex;gap:38px;align-items:center;padding:25px 42px;border-top:1px solid #ffffff12;background:linear-gradient(transparent,#03040799)}footer div{display:flex;flex-direction:column;gap:8px}.footer-label{font-size:8px;letter-spacing:1.8px;color:var(--muted)}footer strong{font-size:11px;font-weight:400}.gesture{margin-left:auto;color:var(--muted);font-size:10px}.gesture i{margin:0 9px}#fps{font-size:9px;color:#9b9da6;font-variant-numeric:tabular-nums}#status{position:absolute;left:50%;top:60%;transform:translateX(-50%);font-size:12px;color:var(--accent);text-align:center;max-width:80%}#status:empty{display:none}@media(max-width:800px){header{padding:22px}.brand-sub{display:none}main{left:22px;top:110px}h1{font-size:38px;letter-spacing:-2px}.intro{display:none}aside{right:16px;top:90px;width:240px;max-height:calc(100dvh - 180px)}footer{padding:20px;gap:24px}.gesture{display:none}footer div:nth-child(3){display:none}#fps{margin-left:auto}}@media(max-height:600px){main{top:90px}aside{top:82px;max-height:calc(100dvh - 160px)}h1{font-size:36px}}

header,footer{pointer-events:none}header button{pointer-events:auto}footer{border-top:0;background:none}