:root{color-scheme:dark;--bg:#0a0b10;--muted:#91959f;--ink:#edeef2;--lime:#d0e8b4;font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}button,a,input,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,summary:focus-visible,#stage:focus-visible{outline:2px solid var(--lime);outline-offset:5px}header{max-width:1280px;margin:auto;padding:32px 54px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0c}.brand{display:flex;align-items:center;font-size:15px;letter-spacing:3px;font-weight:600;gap:12px}.mark{color:var(--lime);font-size:30px;line-height:1}.brand-sub{font-size:11px;letter-spacing:1px;font-weight:400;color:var(--muted);border-left:1px solid #ffffff25;padding-left:18px;margin-left:7px}.about-link{font-size:12px;color:#a5a9b1}.about-link span{margin-left:12px}main{max-width:1160px;margin:auto;display:grid;grid-template-columns:1fr 1.14fr;align-items:center;gap:30px;padding:24px 54px 30px}.eyebrow{font-size:10px;letter-spacing:2.8px;font-weight:500;color:var(--lime)}h1{font-weight:400;line-height:1.45;letter-spacing:-2px;font-size:clamp(32px,4vw,52px);margin:24px 0}h1 em{font-style:normal;color:var(--lime)}.lead{font-size:14px;line-height:1.9;color:var(--muted)}.desktop-meta{display:flex;gap:22px;align-items:flex-start;margin-top:56px}.desktop-meta>span{font-size:11px;color:#626876}.desktop-meta b{font-size:14px;font-weight:500}.desktop-meta small{display:block;margin-top:10px;color:#787e89;font-size:9px;letter-spacing:1.8px}.display{position:relative;min-width:0;text-align:center}.display-top{display:flex;justify-content:space-between;font:9px Arial;letter-spacing:2px;color:#8f949e;padding:12px 30px 0}.display-top span+span{color:var(--lime)}.halo{position:absolute;inset:14% -8% 18%;background:radial-gradient(ellipse,#71896b12,transparent 67%);pointer-events:none}#stage{height:530px;width:100%;position:relative;touch-action:none;cursor:grab;border-radius:16px}#stage:active{cursor:grabbing}#stage canvas{display:block;position:relative}#loading{position:absolute;inset:0;display:grid;place-content:center;font-size:13px;color:var(--muted);line-height:1.8;white-space:pre-wrap;padding:25px}.hint{font-size:11px;letter-spacing:1.5px;margin:0 0 20px;color:#a9adb4}.hint span{padding:0 10px;color:#565a62}.actions{display:flex;justify-content:center;gap:9px}.actions button{min-height:40px;padding:0 16px;border:1px solid #ffffff19;border-radius:50px;font-size:11px;letter-spacing:.5px;transition:background .15s}.actions button:hover{background:#ffffff0e}.actions button[aria-pressed=true]{background:#d0e8b40f;border-color:#d0e8b448;color:var(--lime)}#view-label{font:8px Arial;letter-spacing:2px;color:#606775;margin:17px 0 0}.future{border-top:1px solid #ffffff12;max-width:1052px;margin:20px auto 0;padding:32px 0;display:flex;justify-content:space-between;gap:24px}h2{font-size:21px;font-weight:400;letter-spacing:.5px}.future h2{margin:14px 0 0}.future>p{font-size:12px;line-height:1.95;color:#a3a7b0;margin:9px 0 0}.future small{display:block;font-size:10px;color:#686f7b;margin-top:12px}.tuning{max-width:1052px;margin:auto;border-top:1px solid #ffffff12;border-bottom:1px solid #ffffff12}.tuning summary{list-style:none;cursor:pointer;font-size:11px;color:#7f8795;padding:20px 0;display:flex;justify-content:space-between}.tuning summary::-webkit-details-marker{display:none}.controls{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:25px;padding:8px 0 25px}.controls label{font-size:10px;color:var(--muted)}output{float:right;color:#bcc8b5}input[type=range]{display:block;width:100%;accent-color:var(--lime);margin:18px 0 0;cursor:pointer}.controls button{font-size:11px;border:1px solid #ffffff20;border-radius:8px;padding:10px}footer{max-width:1160px;padding:27px 54px;margin:auto;display:flex;justify-content:space-between;color:#626b78;font-size:9px;letter-spacing:1.4px}footer button{font-size:10px;letter-spacing:0}dialog{max-width:460px;width:calc(100% - 36px);border:1px solid #ffffff20;border-radius:18px;background:#151820;color:var(--ink);padding:35px}dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}dialog p{font-size:13px;line-height:1.9;color:#a2a9b6}dialog .eyebrow{color:var(--lime);font-size:9px}dialog .fine{font-size:11px}dialog .close{position:absolute;right:12px;top:9px;font-size:25px;min-width:35px;min-height:35px}@media(max-width:700px){header{padding:21px 23px}.brand{font-size:12px;gap:8px;letter-spacing:2px}.mark{font-size:25px}.brand-sub{display:none}.about-link{font-size:10px}main{display:flex;flex-direction:column;gap:8px;padding:23px 16px 24px}.intro{text-align:center}.intro .eyebrow{font-size:8px;letter-spacing:2px;margin:0 0 9px}h1{font-size:26px;letter-spacing:0;margin:0;line-height:1.45}h1 br{display:none}.lead,.desktop-meta{display:none}.display{width:100%;max-width:440px}.display-top{padding:10px 25px 0;font-size:8px}#stage{height:min(116vw,490px)}.hint{margin:0 0 15px;font-size:10px}.actions button{min-height:42px}.future{margin:0 24px;padding:26px 0;display:block}.future .eyebrow{font-size:8px;letter-spacing:1.8px}.future h2{font-size:19px}.future>p{font-size:11px;margin-top:17px}.future small{font-size:9px}.tuning{margin:0 24px}.controls{grid-template-columns:1fr 1fr;gap:22px}.controls button{grid-column:span 2;min-height:40px}footer{padding:24px;font-size:8px}#view-label{margin-top:13px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.halo{left:0;right:0}
