:root{--bg-color:#09090b;--panel-bg:#18181b66;--panel-border:#ffffff14;--text-main:#f4f4f5;--text-muted:#a1a1aa;--primary:#4f46e5;--primary-hover:#4338ca;--primary-glow:#4f46e559;--secondary:#06b6d4;--secondary-glow:#06b6d433;--success:#10b981;--font-inter:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-inter);background-color:var(--bg-color);color:var(--text-main);-webkit-font-smoothing:antialiased;background-image:radial-gradient(at top,#4f46e526 0%,#0000 60%);background-attachment:fixed;flex-direction:column;min-height:100svh;margin:0;padding:0;display:flex;overflow:hidden auto}#root{flex-direction:column;flex:1;width:100%;max-width:600px;height:auto;min-height:100svh;margin:0 auto;padding:16px;display:flex}button{cursor:pointer;background:0 0;border:none;outline:none;font-family:inherit}.btn-glow{position:relative}.btn-glow:before{content:"";border-radius:inherit;background:inherit;filter:blur(16px);opacity:.5;z-index:-1;transition:opacity .3s;position:absolute;inset:0}.btn-glow:active:before{opacity:.2}.app-container{flex-direction:column;flex:1;align-items:center;width:100%;min-height:100%;padding:6vh 0 2vh;display:flex}.header{text-align:center;margin-bottom:4vh}.header h1{justify-content:center;align-items:center;gap:16px;margin-bottom:8px;font-size:min(34px,8vw);font-weight:700;display:flex}.title-text{color:var(--text-main);letter-spacing:-.5px;font-family:Outfit,sans-serif}.header p{color:var(--text-muted);font-size:min(16px,4vw)}.btn-primary{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;box-shadow:0 4px 20px var(--primary-glow);z-index:10;border-radius:99px;align-items:center;gap:12px;padding:min(18px,3vh) min(44px,8vw);font-size:min(18px,4.5vw);font-weight:600;transition:transform .2s,box-shadow .2s;display:flex}.btn-primary:active{transform:scale(.96);box-shadow:0 2px 10px #4f46e54d}.btn-primary:disabled{opacity:.7;cursor:not-allowed;transform:none}.loading-spinner{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.steps-container{justify-content:center;align-items:center;gap:min(12px,2vw);width:100%;max-width:480px;margin-top:6vh;margin-bottom:2vh;display:flex}.step-card{text-align:center;background:linear-gradient(#ffffff14 0%,#ffffff05 100%);border:1px solid #ffffff14;border-radius:16px;flex-direction:column;flex:1;align-items:center;gap:8px;padding:16px 8px;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),border-color .3s;display:flex;transform:perspective(500px)translateZ(0);box-shadow:0 10px 20px #0000004d,inset 0 1px 1px #ffffff26,inset 0 -2px 4px #0003}.step-card:hover{border-color:#ffffff40;transform:perspective(500px)translateZ(30px)translateY(-6px)}.step-icon{filter:drop-shadow(0 2px 5px #0006);font-size:24px}.step-card span{color:var(--text-main);letter-spacing:-.2px;font-size:min(12px,3.2vw);font-weight:600}.step-arrow{color:#ffffff26;font-size:18px;font-weight:700}@media (width<=480px){.steps-container{background:linear-gradient(#ffffff0d 0%,#ffffff03 100%);border:1px solid #ffffff14;border-radius:16px;flex-direction:column;align-items:stretch;gap:10px;max-width:100%;padding:20px;box-shadow:0 10px 20px #0003}.step-card{text-align:left;box-shadow:none;background:0 0;border:none;flex-direction:row;gap:16px;padding:8px 12px;transform:none!important}.step-card:hover{background:#ffffff08;border-color:#0000;border-radius:10px;transform:translate(4px)!important}.step-card span{font-size:15px}.step-arrow{display:none}}.location-card{background:var(--panel-bg);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:20px;width:100%;max-width:480px;margin-top:4vh;padding:min(24px,4vh) min(24px,5vw);animation:.4s ease-out forwards slideUp;box-shadow:0 10px 40px #0006}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.card-header{border-bottom:1px solid var(--panel-border);align-items:center;gap:16px;margin-bottom:min(20px,3vh);padding-bottom:min(20px,3vh);display:flex}.pin-icon{color:var(--text-main);border:1px solid var(--panel-border);background:#ffffff0d;border-radius:12px;padding:10px}.location-name{color:var(--text-main);font-size:min(18px,4.5vw);font-weight:500;line-height:1.3}.coords{color:var(--text-muted);margin-top:4px;font-family:monospace;font-size:min(13px,3.5vw)}.action-buttons{grid-template-columns:1fr 1fr;gap:10px;display:grid}.btn-secondary{border:1px solid var(--panel-border);color:var(--text-main);background:#ffffff08;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:min(12px,2.5vh);font-size:min(14px,3.8vw);font-weight:500;transition:all .2s;display:flex}.btn-secondary:hover{background:#ffffff14}.btn-secondary:active{transform:scale(.96)}.btn-map{color:var(--success);background:#10b9810d;border-color:#10b98133}.btn-map:hover{background:#10b9811a;border-color:#10b9814d}.use-cases{width:100%;max-width:480px;margin-top:5vh}.use-cases-header{justify-content:center;align-items:center;gap:10px;margin-bottom:min(20px,3vh);display:flex}.use-cases-header h2{color:var(--text-main);font-size:min(18px,5vw);font-weight:600}.use-cases-grid{grid-template-columns:repeat(2,1fr);gap:min(16px,3vw);display:grid}@media (width<=480px){.use-cases-grid{grid-template-columns:1fr;gap:12px}}.use-case-card{background:var(--panel-bg);border:1px solid var(--panel-border);text-align:left;border-radius:12px;padding:min(14px,2.5vh)}.use-case-card:hover{background:#ffffff05;transform:translateY(-2px)}.use-case-title{color:var(--text-main);align-items:center;gap:8px;margin-bottom:4px;font-size:min(14px,4vw);font-weight:600;display:flex}.use-case-desc{color:var(--text-muted);font-size:min(12.5px,3.5vw);line-height:1.3}.footer{text-align:center;color:var(--text-muted);margin-top:6vh;font-size:13px}.blog-list{flex-direction:column;gap:12px;width:100%;display:flex}.blog-link{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:12px;align-items:center;gap:14px;padding:16px;text-decoration:none;transition:all .2s;display:flex}.blog-link:hover{background:#ffffff0d;border-color:#fff3;transform:translate(4px)}.blog-link-icon{background:#ffffff0d;border-radius:8px;justify-content:center;align-items:center;padding:8px;font-size:20px;display:flex}.blog-link-text{color:var(--text-main);font-size:14.5px;font-weight:500;line-height:1.4}