/* Google-only vibrant styles */
:root{
  --bg1:#ff9a9e; --bg2:#fad0c4; --bg3:#f6d365; --bg4:#fda085; --bg5:#a18cd1; --bg6:#fbc2eb;
  --text:#fff7f0; --accent:#ffd166; --accent2:#06d6a0; --accent3:#118ab2; --shadow:rgba(0,0,0,.25);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;padding:0}
body{font-family:"Fredoka",system-ui; color:var(--text); background:#0d0f1b; overflow-x:hidden}
.bg{position:fixed; inset:0; z-index:-1;
  background: radial-gradient(1000px 500px at 10% -10%, var(--bg6), transparent),
              radial-gradient(1000px 600px at 110% 10%, var(--bg1), transparent),
              radial-gradient(800px 400px at -10% 110%, var(--bg3), transparent),
              radial-gradient(900px 450px at 120% 90%, var(--bg5), transparent),
              linear-gradient(120deg, #1d1f2a, #12131c 60%);
  filter:saturate(1.2) hue-rotate(0deg); animation:bgshift 22s linear infinite}
@keyframes bgshift{0%{filter:hue-rotate(0deg)} 50%{filter:hue-rotate(40deg)} 100%{filter:hue-rotate(0deg)}}
.site-header{text-align:center; padding: clamp(16px, 4vw, 32px) 16px 8px}
.site-header h1{font-family:"Bungee",system-ui; font-size:clamp(28px,8vw,64px); margin:6px 0 0; text-shadow:0 6px 16px var(--shadow)}
.site-header h1 span{color:var(--accent)}
.logo{ filter: drop-shadow(0 6px 12px var(--shadow)); }
.tagline{opacity:.9; margin:.25rem auto 1rem; font-size:clamp(14px,2.6vw,18px)}
.container{max-width:1000px; margin:0 auto; padding:0 16px 64px}
.cta{display:flex; flex-direction:column; align-items:center; gap:12px; margin: clamp(18px,6vw,36px) auto}
.cta-btn{font-family:"Bungee",system-ui; font-size:clamp(18px,5vw,30px); padding:18px 28px; border:none; border-radius:20px;
  background: linear-gradient(135deg, var(--accent), var(--accent2), var(--accent3)); box-shadow:0 12px 30px var(--shadow);
  cursor:pointer; transition: transform .08s ease, filter .2s ease}
.cta-btn:hover{ transform: translateY(-1px) scale(1.01); filter:brightness(1.05) }
.cta-btn:active{ transform: translateY(1px) scale(.99) }
.or{opacity:.85; margin:6px 0}
.manual{display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:center}
.manual input{width:min(80vw,360px); padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.15);
  background:#101225; color:var(--text); box-shadow: inset 0 3px 8px rgba(0,0,0,.25)}
.mini-btn{padding:10px 14px; border:none; border-radius:12px; cursor:pointer; background:#2c2f47; color:var(--text); font-weight:600}
.status{min-height:24px; font-size:14px; opacity:.95}
.results{display:grid; grid-template-columns:1fr; gap:14px}
@media(min-width:720px){ .results{ grid-template-columns:1fr 1fr } }
.card{background:rgba(12,14,28,.74); border:1px solid rgba(255,255,255,.12); border-radius:20px; backdrop-filter: blur(6px);
  padding:14px 16px 16px; box-shadow:0 8px 20px var(--shadow)}
.rank{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px;
  background: linear-gradient(135deg, var(--accent), var(--accent2)); color:#181a27; font-weight:900; margin-right:10px}
.card h3{display:flex; align-items:center; margin:0 0 6px 0; font-size:20px}
.addr{opacity:.9; font-size:14px; margin:0 0 8px 36px}
.combined{display:flex; align-items:center; gap:10px; margin-top:8px; font-size:14px; flex-wrap:wrap}
.badge{display:inline-block; padding:2px 8px; border-radius:999px; background:#25294a; font-size:12px; margin-right:6px}
.actions{margin-top:10px; display:flex; gap:8px; flex-wrap:wrap}
.linkbtn{text-decoration:none; padding:8px 10px; border-radius:12px; background:#1f2240; color:var(--text); font-weight:600; border:1px solid rgba(255,255,255,.1)}
.footer{text-align:center; opacity:.9; margin-top:20px; font-size:13px}
.powered{font-weight:700}
.smallprint{opacity:.8; margin-top:6px}
