:root{--bg: #1a1206;--bg2: #2a1d0c;--accent: #ffb347;--accent2: #ff7a18;--text: #fdf6ec;--muted: #c8b89a;--error: #ff6b6b}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(circle at 50% 0%,var(--bg2),var(--bg) 70%);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}.app{min-height:100%;display:flex;flex-direction:column;align-items:center;padding:max(env(safe-area-inset-top),16px) 16px max(env(safe-area-inset-bottom),16px)}.header{text-align:center;margin-bottom:8px}.header h1{margin:0;font-size:1.6rem}.subtitle{margin:4px 0 0;color:var(--muted);font-size:.9rem}.main,.center-box{flex:1;width:100%;max-width:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.intro{text-align:center;color:var(--muted);line-height:1.5}.primary-btn{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#2a1500;border:none;border-radius:999px;padding:16px 40px;font-size:1.2rem;font-weight:700;cursor:pointer;box-shadow:0 8px 24px #ff7a1859}.primary-btn:active{transform:scale(.97)}.banner{width:100%;text-align:center;padding:10px 14px;border-radius:12px;background:#ffffff0f;color:var(--muted);font-size:.9rem}.banner.error{background:#ff6b6b1f;color:var(--error)}.compass{display:flex;flex-direction:column;align-items:center;gap:12px}.compass-ring{position:relative;width:min(78vw,320px);height:min(78vw,320px);border-radius:50%;border:3px solid rgba(255,179,71,.35);background:radial-gradient(circle at 50% 50%,rgba(255,179,71,.08),transparent 70%);box-shadow:inset 0 0 40px #00000080}.cardinal{position:absolute;font-size:.85rem;color:var(--muted);transform:translate(-50%,-50%)}.cardinal.n{top:8%;left:50%;color:var(--accent);font-weight:700}.cardinal.s{top:92%;left:50%}.cardinal.e{top:50%;left:92%}.cardinal.w{top:50%;left:8%}.arrow{position:absolute;top:50%;left:50%;width:0;height:0;transition:transform .15s ease-out}.arrow-shape{position:absolute;left:50%;bottom:0;transform:translate(-50%);width:0;height:0;border-left:26px solid transparent;border-right:26px solid transparent;border-bottom:min(34vw,140px) solid var(--accent2);filter:drop-shadow(0 4px 12px rgba(255,122,24,.5))}.arrow-center{position:absolute;top:50%;left:50%;width:18px;height:18px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%)}.distance{text-align:center;min-height:2.5rem}.distance .big{font-size:2.6rem;font-weight:800;color:var(--accent)}.muted{color:var(--muted);font-size:.9rem}.hint{color:var(--muted);font-size:.8rem;text-align:center;max-width:320px;line-height:1.4}.arrived{text-align:center}.arrived-emoji{font-size:4rem}.footer{height:24px;display:flex;align-items:center}