:root{color:#ffd21a;background:#020615;font-family:Arial,Helvetica,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color-scheme:dark}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}body{background:#020615}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}::selection{color:#020615;background:#ffd21a}.beer-finder{position:fixed;top:0;right:0;bottom:0;left:0;isolation:isolate;min-height:100dvh;overflow:hidden;background:#020615}.scene-layer,.bottlecap-canvas,.visual-fallback{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.scene-layer{z-index:0;overflow:hidden}.scene-layer:after{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,transparent 70%,rgba(2,6,21,.18) 78%,rgba(2,6,21,.86) 100%);content:"";pointer-events:none}.bottlecap-canvas{display:block;touch-action:none}.visual-fallback{background-color:#020615;background-image:linear-gradient(rgba(61,78,136,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(61,78,136,.12) 1px,transparent 1px);background-size:32px 32px}.wordmark{position:absolute;z-index:3;top:calc(env(safe-area-inset-top) + clamp(20px,2.8vh,30px));left:calc(env(safe-area-inset-left) + clamp(20px,5.6vw,42px));max-width:calc(100% - 40px);margin:0;color:#ffd21a;font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:clamp(16px,4.2vw,28px);font-weight:900;line-height:1;letter-spacing:.015em;text-transform:uppercase;text-shadow:0 5px 0 rgba(5,8,18,.6)}.control-stage{position:absolute;z-index:4;top:47.5%;left:50%;display:grid;width:min(73vw,54svh,440px);aspect-ratio:1;place-items:stretch;transform:translate(-50%,-50%)}.center-control{display:flex;width:100%;min-width:44px;min-height:44px;aspect-ratio:1;align-items:center;justify-content:center;flex-direction:column;margin:0;padding:12%;border:clamp(14px,4.1vw,24px) solid #07090c;border-radius:50%;outline:2px solid rgba(199,255,49,.45);outline-offset:-2px;color:#050608;background:#ffb800;box-shadow:0 16px 24px #0000009e,inset 0 0 0 4px #ffe04d59,inset 0 -18px 24px #cf6e0033,0 0 0 3px #00000080;font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:clamp(45px,16.8vw,94px);font-weight:900;line-height:.84;text-align:center;text-decoration:none;text-transform:none;letter-spacing:-.02em;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;transition:transform .15s ease,filter .15s ease,box-shadow .15s ease}.center-control:focus-visible,.maps-attribution:focus-visible{outline:4px solid #ffffff;outline-offset:5px}.center-control:active{transform:scale(.975);filter:brightness(1.08)}.center-control--status{gap:clamp(12px,4vw,24px);font-family:Arial,Helvetica,sans-serif;font-size:clamp(16px,4.8vw,24px);font-weight:900;line-height:1;letter-spacing:.02em;text-transform:uppercase;cursor:wait}.loading-ring{width:29%;aspect-ratio:1;border:clamp(7px,2.2vw,12px) solid rgba(3,5,8,.25);border-top-color:#050608;border-radius:50%;animation:spin .8s linear infinite}.center-control--retry{font-size:clamp(44px,15.5vw,88px)}.center-control--result{justify-content:center;gap:1%;padding:9% 12% 7%}.arrow-rotator{display:grid;width:82%;height:64%;place-items:center;transform:rotate(var(--arrow-angle));transform-origin:50% 50%;transition:transform .26s cubic-bezier(.22,1,.36,1)}.direction-arrow{display:block;width:100%;height:100%;overflow:hidden;color:#050608;fill:currentColor;filter:drop-shadow(0 3px 0 rgba(255,222,57,.28))}.control-distance{display:block;color:#050608;font-size:clamp(35px,11.8vw,66px);font-weight:900;line-height:.92;letter-spacing:-.02em;white-space:nowrap}.map-fallback-title{display:block;font-size:clamp(37px,12.7vw,72px);line-height:.84}.map-fallback-title+.control-distance{margin-top:7%;font-size:clamp(27px,8.7vw,50px)}.status-copy{position:absolute;z-index:5;right:calc(env(safe-area-inset-right) + 20px);bottom:calc(env(safe-area-inset-bottom) + 8px);left:calc(env(safe-area-inset-left) + 20px);display:flex;min-height:54px;align-items:center;justify-content:center;flex-wrap:wrap;gap:2px 7px;color:#ffd21a;text-align:center;text-shadow:0 3px 12px #000000}.status-copy h2,.status-copy p{width:100%;margin:0}.status-copy h2{overflow:hidden;font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:clamp(26px,7.2vw,44px);font-weight:900;line-height:1;letter-spacing:-.015em;text-overflow:ellipsis;white-space:nowrap}.status-copy p,.helper-copy{font-size:clamp(16px,4.3vw,24px);font-weight:900;line-height:1.2}.maps-attribution,.compass-note{display:inline-flex;min-height:24px;align-items:center;justify-content:center;margin-top:3px;font-size:12px;font-weight:800;line-height:1;letter-spacing:.02em}.maps-attribution{min-width:88px;color:#fff;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.compass-note{color:#ffd21ad1}@keyframes spin{to{transform:rotate(1turn)}}@media(hover:hover)and (pointer:fine){.center-control:hover{filter:brightness(1.08);box-shadow:0 18px 32px #000000b8,inset 0 0 0 4px #ffe04d73,inset 0 -18px 24px #cf6e0033,0 0 0 3px #00000080}}@media(orientation:landscape)and (max-height:540px){.wordmark{top:calc(env(safe-area-inset-top) + 16px);font-size:clamp(18px,3.6vw,28px)}.control-stage{top:50%;width:min(49vw,62svh)}.status-copy{right:calc(env(safe-area-inset-right) + 16px);bottom:calc(env(safe-area-inset-bottom) + 13px);left:auto;width:min(37vw,320px)}.status-copy h2{font-size:clamp(25px,5vw,38px)}.status-copy p,.helper-copy{font-size:clamp(15px,2.7vw,21px)}}@media(prefers-reduced-motion:reduce){.center-control,.arrow-rotator{transition:none}.loading-ring{animation-duration:1.6s}}