:root{color-scheme:dark;font-family:"PingFang SC","Helvetica Neue",sans-serif;color:#eee9da;background:#151512;--accent:#dbbc7c;--muted:#a49e8d}
*{box-sizing:border-box}body{margin:0}main{position:relative;height:100svh;min-height:560px;overflow:hidden}header{position:absolute;top:34px;left:40px;z-index:2;pointer-events:none}header a{pointer-events:auto;color:var(--accent);font-size:14px;letter-spacing:2px;text-decoration:none}header b{font-size:17px;letter-spacing:0}h1{font-family:"Songti SC",STSong,serif;font-size:38px;font-weight:500;letter-spacing:4px;margin:13px 0 0}#stage{position:absolute;inset:80px 0 95px}canvas{display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.controls{position:absolute;bottom:54px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);text-align:center}#status{font-size:13px;color:var(--muted);margin:0 0 15px;min-height:20px}.actions{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid #4a463580;background:#202019df;backdrop-filter:blur(12px);border-radius:10px;white-space:nowrap}button,select,.cutaway{font:14px inherit;font-family:inherit;font-size:14px;min-height:44px;border:0;border-radius:5px;padding:10px 14px;color:#eee9da;background:transparent;cursor:pointer}select{background:#29291f;padding-right:8px}.primary{background:var(--accent);color:#292417;font-weight:600;min-width:90px}button:hover:not(:disabled),.cutaway:hover{background:#39372a}.primary:hover:not(:disabled){background:#ebce94}button[aria-pressed=true]{color:var(--accent);background:#393327}button:disabled,select:disabled{opacity:.45;cursor:wait}.cutaway{display:flex;align-items:center;gap:7px}.cutaway input{accent-color:var(--accent);width:15px;height:15px;margin:0}button:focus-visible,select:focus-visible,a:focus-visible,canvas:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}footer{position:absolute;bottom:20px;left:40px;right:40px;display:flex;justify-content:space-between;color:#847e6c;font-size:12px;pointer-events:none}#error{position:absolute;top:45%;left:15%;right:15%;padding:20px;background:#37251b;color:#ffe0b4;z-index:5}@media(max-width:600px){header{top:24px;left:24px}h1{font-size:30px}#stage{inset:105px 0 150px}.controls{bottom:53px;width:330px}.actions{flex-wrap:wrap;justify-content:center;gap:4px;padding:6px}button,select,.cutaway{padding:8px 12px}.primary{min-width:120px}.actions select{min-width:140px}.actions #view{font-size:13px}footer{left:20px;right:20px;font-size:11px}#status{margin-bottom:10px}}