:root{--ink:#4a3f35;--card:#fffaf2d1;--card-strong:#fffaf2f2;--accent:#6fae55;--safe-t:env(safe-area-inset-top,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-text-size-adjust:100%;background:linear-gradient(#d8cfc2 0%,#efe3d2 78%);margin:0;font-family:ui-rounded,SF Pro Rounded,Nunito,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;overflow:hidden}#app{position:fixed;top:0;bottom:0;left:0;right:0}canvas#scene{touch-action:none;outline:none;width:100%;height:100%;display:block;position:absolute;top:0;bottom:0;left:0;right:0}#hud{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}#hud button{pointer-events:auto;touch-action:manipulation;font:inherit;color:inherit;cursor:pointer;border:none;outline:none}#hud button:focus-visible{box-shadow:0 0 0 3px #6fae5599}.hud-top{top:calc(12px + var(--safe-t));left:calc(14px + var(--safe-l));right:calc(14px + var(--safe-r));justify-content:space-between;align-items:flex-start;display:flex;position:absolute}.brand{background:var(--card);-webkit-backdrop-filter:blur(8px);border-radius:16px;min-width:170px;padding:10px 14px 11px;box-shadow:0 4px 18px #5a46321f}.wordmark{letter-spacing:.06em;opacity:.85;font-size:15px;font-weight:700}.meter{margin-top:7px}.meter-bar{background:#7864502e;border-radius:99px;height:8px;overflow:hidden}.meter-fill{background:linear-gradient(90deg, #b5c46f, var(--accent));border-radius:99px;width:0;height:100%;transition:width .5s}.meter-label{opacity:.75;font-variant-numeric:tabular-nums;margin-top:5px;font-size:12px}.round{background:var(--card);-webkit-backdrop-filter:blur(8px);border-radius:50%;width:56px;height:56px;transition:transform .12s;box-shadow:0 4px 16px #5a463224}.round:active{transform:scale(.92)}.menu{pointer-events:auto;position:relative}.menu-btn{width:48px;height:48px}.menu-panel{background:var(--card-strong);border-radius:14px;padding:6px;display:none;position:absolute;top:56px;right:0;box-shadow:0 6px 22px #5a46322e}.menu.open .menu-panel{display:block}.menu-item{white-space:nowrap;background:0 0;border-radius:10px;min-height:48px;padding:0 18px;display:block;font-size:15px!important}.menu-item:active{background:#7864501f}.hud-bottom{left:0;right:0;bottom:calc(14px + var(--safe-b));flex-direction:column;align-items:center;gap:10px;display:flex;position:absolute}.toolbar{background:var(--card);-webkit-backdrop-filter:blur(10px);border-radius:22px;gap:8px;padding:8px;display:flex;box-shadow:0 6px 24px #5a463229}.tool{background:0 0;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:92px;min-height:64px;padding:6px 12px;transition:background .15s,transform .12s;display:flex}.tool:active{transform:scale(.95)}.tool.active{background:#6fae5538;box-shadow:inset 0 0 0 2px #6fae558c}.tool-icon,.round{justify-content:center;align-items:center;display:flex}.tool-icon svg,.round svg{display:block}.tool-label{opacity:.8;font-size:12px;font-weight:600}.rotate{right:calc(14px + var(--safe-r));bottom:calc(18px + var(--safe-b));gap:8px;display:flex;position:absolute}.hint{background:var(--card-strong);opacity:0;border-radius:99px;padding:6px 12px;font-size:13px;transition:opacity .2s,transform .2s;transform:translateY(6px);box-shadow:0 3px 12px #5a46321f}.hint.show{opacity:1;transform:none}.toast{top:calc(26px + var(--safe-t));background:var(--card-strong);opacity:0;white-space:nowrap;border-radius:99px;padding:12px 20px;font-size:16px;transition:opacity .6s,transform .6s;position:absolute;left:50%;transform:translate(-50%,-12px);box-shadow:0 6px 24px #5a46322e}.toast.show{opacity:1;transform:translate(-50%)}.fps{left:calc(14px + var(--safe-l));bottom:calc(14px + var(--safe-b));color:#fff;background:#00000073;border-radius:6px;padding:3px 7px;font:12px ui-monospace,monospace;position:absolute}@media (max-width:560px){.rotate{bottom:calc(104px + var(--safe-b))}.tool{min-width:76px}}
