*{box-sizing:border-box}body{margin:0;background:#f8f8f7;color:#232323;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}header{height:95px;margin:0 5%;border-bottom:1px solid #dededb;display:flex;align-items:center;justify-content:space-between;gap:20px;overflow:hidden}header img{width:150px;height:80px;object-fit:cover;object-position:50% 44%}header span{font-size:10px;letter-spacing:1.5px;color:#72726d}main{display:grid;grid-template-columns:340px 1fr;gap:45px;max-width:1450px;margin:auto;padding:45px 5% 30px}aside{padding-top:65px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:650;color:#b83824;margin-bottom:24px}h1{font-size:55px;line-height:1.04;letter-spacing:-2.7px;margin:0 0 25px}h1 span{color:#888780}.intro{color:#70706a;font-size:16px;line-height:1.8;max-width:300px}.tag{display:inline-block;border:1px solid #d9d8d2;border-radius:25px;font-size:9px;letter-spacing:1.5px;padding:10px 14px;margin:15px 0 30px}.presets{display:flex;flex-direction:column;gap:9px;align-items:stretch;max-width:290px}button{font:inherit;cursor:pointer;border:1px solid #d5d5d0;background:#ffffffa8;color:#343430;border-radius:12px;padding:12px 16px;transition:background .2s,border-color .2s}.presets button{text-align:left;font-size:13px}.presets button:after{content:'↗';float:right;color:#898982}.presets .selected{background:#252725;color:white;border-color:#252725}.note{font-size:11px;line-height:1.7;color:#888780;max-width:300px;margin-top:30px}.stage{position:relative;height:730px;min-width:0;border-radius:28px;background:radial-gradient(ellipse at 50% 40%,#fff 0%,#efefeb 70%,#e2e3dd 100%);overflow:hidden;box-shadow:inset 0 0 0 1px #deded780}.stage.dark{background:radial-gradient(ellipse at 50% 40%,#45494d 0%,#22262b 70%,#171a20 100%);color:#f0f0ef}#canvas-wrap{width:100%;height:100%}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}canvas:focus-visible,button:focus-visible{outline:3px solid #b83824;outline-offset:-4px}.stage-top{position:absolute;top:26px;left:25px;right:25px;display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:1.6px;pointer-events:none}.live-dot{width:6px;height:6px;background:#b83824;border-radius:50%}#angle{margin-left:auto;color:#8b8d86}.controls{position:absolute;bottom:58px;left:15px;right:15px;display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.controls button{font-size:11px;padding:10px 13px;border-radius:30px;backdrop-filter:blur(12px)}.hint{position:absolute;bottom:15px;text-align:center;width:100%;font-size:10px;color:#898b84;pointer-events:none}#loading{position:absolute;top:45%;width:100%;text-align:center;font-size:13px}footer{display:flex;justify-content:space-between;gap:20px;max-width:1450px;margin:auto;padding:15px 5% 30px;font-size:9px;letter-spacing:1px;color:#87877f}details{max-width:1320px;margin:0 auto 40px;padding:0 5%;font-size:13px;color:#777}summary{cursor:pointer}details p{font-size:12px}video{display:block;width:300px;max-width:100%;max-height:550px;margin-top:20px;border-radius:15px}@media(max-width:1000px){main{grid-template-columns:270px 1fr;gap:25px}h1{font-size:44px}.stage{height:680px}.controls{bottom:60px}.controls button{padding:9px 10px}}@media(max-width:700px){header{height:80px}header img{width:120px}header span{font-size:8px;text-align:right;max-width:130px}main{display:flex;flex-direction:column;padding-top:25px;gap:24px}aside{padding-top:0}h1{font-size:44px;margin-bottom:15px}h1 br{display:none}h1 span{margin-left:8px}.intro{max-width:100%;font-size:14px}.tag{margin:5px 0 17px}.presets{display:grid;grid-template-columns:1fr 1fr;max-width:100%}.note{max-width:100%;margin:15px 0 0;font-size:10px}.stage{height:650px}.controls button{font-size:10px}.hint{font-size:9px}footer{flex-direction:column;font-size:8px}}@media(prefers-reduced-motion:reduce){button{transition:none}}