/* Every level is a hard field. Arial Black stretched tall, like a sign seen too close. */
:root{--field:#b8ff00;--now:#65bbe1;--ink:#08081a;background:var(--field);color:var(--ink);font:900 12px/1 "Arial Black","Arial Bold",Arial,sans-serif;-webkit-text-size-adjust:100%}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none}
a{color:inherit}
button{font:inherit;color:inherit;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}

#scene{position:fixed;inset:0;touch-action:none;cursor:ns-resize;-webkit-user-select:none;user-select:none}
#scene canvas{display:block;width:100%;height:100%}

#signs{position:fixed;inset:0;pointer-events:none;z-index:2}
.sign{position:absolute;left:0;top:0;pointer-events:auto;white-space:nowrap;text-decoration:none;text-transform:uppercase;letter-spacing:-.03em;line-height:1;background:var(--ink);padding:.18em .3em .12em;transform-origin:0 50%;will-change:transform}
.sign[hidden]{display:none}
.sign:not([href]){pointer-events:none}

.counter{position:fixed;left:10px;top:calc(6px + env(safe-area-inset-top));margin:0;z-index:3;display:flex;flex-direction:column;pointer-events:none}
.counter span{font-size:11px;letter-spacing:.02em}
#level{font-size:clamp(56px,19vw,150px);letter-spacing:-.08em;line-height:.9;transform:scaleY(1.6);transform-origin:0 0;margin:2px 0 calc(clamp(56px,19vw,150px) * .55);color:var(--now);-webkit-text-stroke:2px var(--ink)}
#hint{position:fixed;left:0;right:0;bottom:calc(84px + env(safe-area-inset-bottom));margin:0;text-align:center;z-index:3;text-transform:uppercase;pointer-events:none}
#hint[hidden]{display:none}
.depth{position:fixed;right:10px;bottom:calc(30px + env(safe-area-inset-bottom));z-index:3;display:flex;gap:6px}
.depth button{min-height:44px;padding:0 12px;background:var(--ink);color:var(--now);text-transform:uppercase;font-size:12px}
#loading{position:fixed;inset:45% 0 auto;text-align:center;margin:0}
.fine{position:fixed;left:10px;right:10px;bottom:calc(8px + env(safe-area-inset-bottom));margin:0;z-index:3;font:9px/1.3 Verdana,sans-serif;text-transform:uppercase}