:root{--bg-top: #e7dbc6;--bg-bottom: #d1b992;--panel: rgba(38, 30, 20, .72);--panel-border: rgba(255, 240, 212, .35);--text: #f6ecdd;--accent: #d9b268}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%}body{font-family:Manrope,sans-serif;color:var(--text);background:linear-gradient(180deg,var(--bg-top),var(--bg-bottom));overflow:hidden}.stage{position:relative;width:100%;height:100%}canvas{display:block;width:100%;height:100%}.toolbar{position:absolute;top:16px;left:50%;transform:translate(-50%);display:flex;gap:8px;padding:8px;background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px}button{appearance:none;border:1px solid transparent;border-radius:999px;padding:8px 14px;font:600 13px/1 Manrope,sans-serif;color:var(--text);background:#ffffff14;cursor:pointer}button.active{color:#21190e;background:var(--accent)}.hud{position:absolute;bottom:16px;left:16px;background:var(--panel);border:1px solid var(--panel-border);border-radius:12px;padding:10px 12px;font-size:12px;max-width:320px}.title{font-family:Marcellus,serif;font-size:18px;margin-bottom:6px}