html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none;background:#071314;touch-action:none;font-family:Inter,Microsoft YaHei,system-ui,sans-serif}body{color:#f7f2df}canvas{display:block;width:100%;height:100%}.hud{position:fixed;right:max(18px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));z-index:10;display:flex;gap:10px}.icon-button{width:44px;height:44px;border:1px solid rgb(232 225 190 / .28);border-radius:8px;background:#0819198f;color:#f4e9bf;box-shadow:0 10px 28px #00000038;cursor:pointer;display:grid;place-items:center;font-size:21px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform .16s ease,border-color .16s ease,background .16s ease}.icon-button:hover{transform:translateY(-1px);border-color:#ffe89a9e;background:#12302db8}.icon-button.is-active{border-color:#ffbc4de6;color:#ffcb62}.score-panel{position:fixed;right:max(18px,env(safe-area-inset-right));top:calc(max(18px,env(safe-area-inset-top)) + 58px);z-index:10;display:grid;gap:10px;justify-items:end;color:#ffe8a7;text-shadow:0 2px 10px rgb(0 0 0 / .45)}.score-count{min-width:58px;height:34px;border:1px solid rgb(232 225 190 / .24);border-radius:8px;background:#0819198a;display:grid;place-items:center;font-size:16px;font-weight:700;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.score-markers{width:82px;display:grid;grid-template-columns:repeat(3,22px);gap:7px;justify-content:end}.score-marker{width:22px;height:12px;border-radius:999px;border:1px solid rgb(255 232 154 / .28);background:radial-gradient(circle at 72% 42%,#fff3b1 0 12%,transparent 13%),linear-gradient(90deg,#e65d24,#ffba3b 56%,#ffd36b);box-shadow:0 3px 12px #ffa02352;animation:marker-pop .28s ease both}.success-banner{position:fixed;left:50%;top:20%;z-index:20;transform:translate(-50%);padding:14px 22px;border-radius:8px;border:1px solid rgb(255 225 142 / .42);background:#0d2522c2;color:#ffe7a2;font-size:clamp(24px,4vw,44px);font-weight:800;letter-spacing:0;text-shadow:0 4px 18px rgb(0 0 0 / .5);box-shadow:0 22px 60px #00000052;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.creator-badge{position:fixed;left:max(18px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));z-index:10;height:38px;padding:0 12px 0 10px;border:1px solid rgb(232 225 190 / .24);border-radius:8px;background:#0819198a;color:#e7f7d5;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;text-shadow:0 2px 10px rgb(0 0 0 / .4);box-shadow:0 10px 28px #00000038;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-user-select:none;user-select:none;text-decoration:none;transition:transform .16s ease,border-color .16s ease,background .16s ease}.creator-badge:hover,.creator-badge:focus-visible{transform:translateY(-1px);border-color:#ffe89a8f;background:#12302db8;outline:none}.github-icon{width:23px;height:23px;fill:#f7f2df;filter:drop-shadow(0 2px 6px rgb(0 0 0 / .24))}@keyframes marker-pop{0%{opacity:0;transform:translateY(-5px) scale(.76)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width: 640px){.hud{right:14px;top:14px;gap:8px}.icon-button{width:40px;height:40px;font-size:19px}.score-panel{left:14px;right:auto;top:14px;justify-items:start}.score-markers{width:68px;grid-template-columns:repeat(3,18px);gap:5px;justify-content:start}.score-marker{width:18px;height:10px}.creator-badge{left:14px;bottom:12px;height:34px;padding:0 9px;font-size:12px}.github-icon{width:20px;height:20px}}