.blocks{background:var(--ui);touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}.blocks-canvas{touch-action:none;opacity:0;width:100%;height:100%;transition:opacity .5s;display:block;position:absolute;inset:0}.blocks.is-ready .blocks-canvas{opacity:1}.blocks-back,.blocks-bar button{cursor:pointer;color:#fffaf3;background:0 0;border:0;border-radius:999px;place-items:center;width:44px;height:44px;display:grid}.blocks-back{top:max(14px, env(safe-area-inset-top));left:max(14px, env(safe-area-inset-left));background:color-mix(in srgb, var(--bar) 55%, transparent);-webkit-backdrop-filter:blur(10px);transition:opacity .6s;position:absolute}.blocks-dock{left:50%;bottom:max(18px, calc(env(safe-area-inset-bottom) + 6px));max-width:calc(100vw - 16px - env(safe-area-inset-left) - env(safe-area-inset-right));align-items:center;gap:10px;display:flex;position:absolute;transform:translate(-50%)}@media (max-width:860px){.blocks-dock{flex-direction:column;gap:8px}}.blocks-bar{background:color-mix(in srgb, var(--bar) 62%, transparent);-webkit-backdrop-filter:blur(12px);border-radius:999px;align-items:center;gap:4px;max-width:100%;padding:6px;transition:opacity .6s;display:flex;box-shadow:0 6px 24px #0000001f}.blocks-sep{background:#fffaf338;flex:none;width:1px;height:24px;margin:0 3px}.blocks-bar button{transition:background-color .18s,transform .12s}.blocks-bar button:hover{background:#fffaf321}.blocks-bar button[aria-pressed=true]{background:#fffaf347;box-shadow:inset 0 0 0 1.5px #fffaf38c}.blocks-bar button:active{transform:scale(.92)}.blocks.is-quiet .blocks-bar,.blocks.is-quiet .blocks-back{opacity:.3}.blocks.is-quiet .blocks-tools{opacity:.55}.blocks.is-quiet .blocks-bar:hover,.blocks.is-quiet .blocks-back:hover,.blocks.is-quiet .blocks-bar:focus-within,.blocks.is-quiet .blocks-back:focus-visible{opacity:1}@media (hover:none){.blocks-bar button:hover:not([aria-pressed=true]){background:0 0}}.blocks-hint{left:0;right:0;bottom:calc(max(18px, env(safe-area-inset-bottom)) + var(--dock,74px));text-align:center;pointer-events:none;color:color-mix(in srgb, var(--bar) 92%, white);text-shadow:0 1px 10px #fff6;margin:0;padding:0 16px;font-size:19px;animation:3.6s ease-in-out infinite breathe;position:absolute}@media (prefers-reduced-motion:reduce){.blocks-hint{animation:none}.blocks-canvas,.blocks-bar button{transition:none}.blocks-bar button:active{transform:none}}.blocks-fail{max-width:520px;margin:0 auto;padding:48px 24px}.blocks-fail a{color:#e9c99a}@media (max-width:400px){.blocks-bar{gap:2px;padding:5px}.blocks-bar button{width:42px;height:42px}.blocks-sep{margin:0 2px}}@media (max-width:350px){.blocks-bar button{width:38px;height:38px}}@media (max-height:500px) and (orientation:landscape){.blocks-dock{bottom:max(10px, env(safe-area-inset-bottom));flex-direction:row;gap:8px}.blocks-bar{gap:2px;padding:4px}.blocks-bar button{width:40px;height:40px}.blocks-sep{margin:0 2px}.blocks-hint{bottom:auto;top:max(24px, env(safe-area-inset-top));left:calc(max(14px, env(safe-area-inset-left), env(safe-area-inset-right)) + 160px);right:calc(max(14px, env(safe-area-inset-left), env(safe-area-inset-right)) + 160px);padding:0;font-size:16px}}.blocks-fps{top:calc(max(14px, env(safe-area-inset-top)) + 54px);left:max(14px, env(safe-area-inset-left));pointer-events:none;color:#fffaf3;background:#14100c9e;border-radius:10px;margin:0;padding:6px 9px;font:11px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;position:absolute}