*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#000;-webkit-user-select:none;user-select:none;cursor:none;touch-action:none}#viewport{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(100vw,100vh);height:min(100vw,100vh);border-radius:50%;overflow:hidden;background:#000}#face-container{display:flex;width:100%;height:100%;transition:transform .4s cubic-bezier(.25,.46,.45,.94)}.face{flex:0 0 100%;width:100%;height:100%;position:relative;overflow:hidden}#face-dots{position:absolute;bottom:8%;left:50%;transform:translate(-50%);display:flex;gap:8px;z-index:10;pointer-events:none}.dot{width:6px;height:6px;border-radius:50%;background:#ffffff4d;transition:background .3s,transform .3s}.dot.active{background:#ffffffe6;transform:scale(1.4)}#alert-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#000000d9;z-index:100;transition:opacity .3s}#alert-overlay.hidden{opacity:0;pointer-events:none}#alert-content{color:#fff;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;text-align:center;padding:15%;font-size:4.5vmin;line-height:1.4}#grid-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2vmin;background:#000000f0;z-index:50;opacity:0;visibility:hidden;transform:scale(.82);pointer-events:none;transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s;will-change:transform,opacity}#grid-overlay.grid-visible{opacity:1;visibility:visible;transform:scale(1);pointer-events:auto;transition:opacity .3s ease,transform .3s ease,visibility 0s linear}.grid-row{display:flex;gap:2.5vmin}.grid-cell{width:17vmin;height:17vmin;border-radius:50%;background:#ffffff0f;border:1.5px solid rgba(255,255,255,.12);position:relative;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent}.grid-face-wrapper{position:absolute;width:100vmin;height:100vmin;top:50%;left:50%;transform:translate(-50%,-50%) scale(.17);pointer-events:none;overflow:hidden;border-radius:50%}.grid-cell:active{transform:scale(.93)}.grid-cell.grid-active{border-color:#fff9;background:#ffffff1a}.grid-label{position:absolute;bottom:10%;left:50%;transform:translate(-50%);color:#ffffffe6;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:1.5vmin;line-height:1;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 6px rgba(0,0,0,.6);pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1}#face-dots.grid-hidden{opacity:0;pointer-events:none}.face-label{position:absolute;bottom:15%;left:50%;transform:translate(-50%);color:#fff6;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-size:2.5vmin;letter-spacing:.15em;text-transform:uppercase;white-space:nowrap}