.pushpop{background:var(--ui);touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}.pushpop-canvas,.pushpop-fade{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.pushpop-canvas{cursor:default}.pushpop-canvas[data-cursor=pick]{cursor:pointer}.pushpop-fade{pointer-events:none;opacity:0}.pushpop-back,.pushpop-bar button{cursor:pointer;color:#fbf4ea;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:999px;place-items:center;width:44px;height:44px;display:grid}.pushpop-back{top:max(14px, env(safe-area-inset-top));left:max(14px, env(safe-area-inset-left));-webkit-backdrop-filter:blur(10px);background:#0e0c0a52;transition:opacity .6s;position:absolute}.pushpop-dock{left:50%;bottom:max(14px, 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;display:flex;position:absolute;transform:translate(-50%)}.pushpop-bar{-webkit-backdrop-filter:blur(12px);background:#0e0c0a6b;border:1px solid #fff5e614;border-radius:999px;align-items:center;gap:4px;max-width:100%;padding:6px;transition:opacity .6s;display:flex}.pushpop-bar button{transition:background-color .2s,transform .12s}.pushpop-bar button:active{transform:scale(.92)}@media (hover:hover){.pushpop-bar button:not([aria-pressed=true]):hover{background:#fff5e61f}}.pushpop-bar .looks{gap:2px;display:flex}.pushpop-bar .look[aria-pressed=true]{background:#fff5e633;box-shadow:inset 0 0 0 2px #fffaf2d9}.pushpop-bar .flip{letter-spacing:.01em;background:#fff5e629;align-items:center;gap:7px;width:auto;padding:0 16px 0 13px;font:600 15px/1 system-ui,sans-serif;display:flex}.pushpop-bar .flip.is-ready{background:#fff5e64d;box-shadow:inset 0 0 0 1.5px #fffaf2b3}.pushpop-sep{background:#fff5e633;flex:none;width:1px;height:24px;margin:0 3px}.pushpop-bar button:focus-visible,.pushpop-back:focus-visible{outline-offset:1px;outline:2px solid #ffffffd9}.pushpop.is-quiet .pushpop-bar,.pushpop.is-quiet .pushpop-back{opacity:.35}.pushpop.is-quiet .pushpop-bar:hover,.pushpop.is-quiet .pushpop-back:hover,.pushpop.is-quiet .pushpop-bar:focus-within,.pushpop.is-quiet .pushpop-back:focus-visible{opacity:1}.pushpop-hint{left:50%;top:calc(max(14px, env(safe-area-inset-top)) + 58px);pointer-events:none;-webkit-backdrop-filter:blur(6px);text-align:center;color:#fffaf2f0;text-shadow:0 1px 10px #00000073;background:#0e0c0a6b;border-radius:999px;width:max-content;max-width:calc(100vw - 48px);margin:0;padding:8px 18px;font-size:clamp(14px,3.9vw,18px);line-height:1.3;animation:3.6s ease-in-out infinite breathe;position:absolute;transform:translate(-50%)}@media (prefers-reduced-motion:reduce){.pushpop-hint{animation:none}.pushpop-bar button{transition:none}.pushpop-bar button:active{transform:none}}.pushpop-fail{max-width:520px;margin:0 auto;padding:48px 24px}.pushpop-fail a{color:#e9c99a}@media (max-width:380px){.pushpop-bar{gap:1px;padding:4px}.pushpop-bar button{width:40px;height:40px}.pushpop-bar .flip{gap:5px;width:auto;padding:0 12px 0 10px;font-size:14px}}@media (max-height:500px) and (orientation:landscape){.pushpop-dock{left:auto;right:max(10px, env(safe-area-inset-right));bottom:auto;top:calc(max(14px, env(safe-area-inset-top)) + 54px);transform:none}.pushpop-bar{border-radius:26px;flex-direction:column;gap:1px;padding:4px}.pushpop-bar button{width:38px;height:38px}.pushpop-bar .looks{flex-direction:column}.pushpop-bar .flip{flex-direction:column;gap:2px;width:38px;height:auto;padding:6px 0 5px;font-size:11px}.pushpop-sep{width:24px;height:1px;margin:3px 0}.pushpop-hint{left:max(14px, env(safe-area-inset-left));top:calc(max(14px, env(safe-area-inset-top)) + 52px);text-align:left;white-space:normal;border-radius:16px;width:auto;max-width:128px;padding:6px 12px;font-size:14px;transform:none}}@media (max-height:360px) and (orientation:landscape){.pushpop-hint{padding:5px 10px;font-size:13px}.pushpop-bar button{width:34px;height:34px}.pushpop-bar .looks svg{width:22px;height:22px}.pushpop-bar .flip{width:34px}}
