/* ═══════════════════════════════════════════════════════════
   CSS CUSTOM PROPERTIES  v2.0
═══════════════════════════════════════════════════════════ */
:root {
  /* Dark theme — deep rich background */
  --bg:          #04081a;
  --bg2:         #080e22;
  --bg3:         #0c1530;
  --bg4:         #111c3a;
  --bg5:         #172246;
  --border:      #1e3566;
  --border-f:    #5b9aff;
  --txt:         #f0f6ff;
  --txt2:        #90b8f0;
  --txt3:        #3a5a8a;

  /* Brand colors — vivid & punchy */
  --blue:        #5b9aff;
  --blue2:       #2563eb;
  --blue-glow:   rgba(91,154,255,0.30);
  --cyan:        #00f0ff;
  --green:       #00e887;
  --green2:      #00c96e;
  --green-glow:  rgba(0,232,135,0.28);
  --red:         #ff3d6b;
  --yellow:      #ffe040;
  --purple:      #bf7fff;
  --orange:      #ff7a35;
  --pink:        #ff5fcc;
  --gold:        #ffcc44;

  /* Motion gradient stops — bright aurora */
  --grad-a: #5b9aff;
  --grad-b: #bf7fff;
  --grad-c: #00f0ff;
  --grad-d: #ff5fcc;

  --radius:      14px;
  --radius-sm:   9px;
  --radius-lg:   22px;
  --pill:        999px;
  --shadow:      0 8px 40px rgba(0,0,0,0.65);
  --shadow-blue: 0 0 60px rgba(91,154,255,0.22);
  --ease:        cubic-bezier(0.4,0,0.2,1);
  --spring:      cubic-bezier(0.34,1.56,0.64,1);
  --trans:       0.25s var(--ease);
}

[data-theme="light"] {
  --bg:    #e8f0ff;
  --bg2:   #f4f8ff;
  --bg3:   #ffffff;
  --bg4:   #eef4ff;
  --bg5:   #ddeaff;
  --border:#b0cbf5;
  --border-f:#1a4fd8;
  --txt:   #08102a;
  --txt2:  #2a4a7a;
  --txt3:  #6a8aaa;
  --shadow:0 8px 32px rgba(26,79,216,0.12);
  --shadow-blue: 0 0 40px rgba(91,154,255,0.15);
  --blue-glow: rgba(91,154,255,0.18);
  --green-glow: rgba(0,200,120,0.18);
  --blue:  #1a4fd8;
  --blue2: #1438b0;
  --cyan:  #0080a0;
  --green: #00a860;
  --green2:#007a44;
  --purple:#7020d0;
  --grad-a: #1a4fd8;
  --grad-b: #7020d0;
  --grad-c: #0080a0;
  --grad-d: #c020a0;
}

/* ═══════════════════════════════════════════════════════════
   RESET
═══════════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Nunito',sans-serif;
  background:var(--bg);color:var(--txt);
  min-height:100vh;line-height:1.6;
  transition:background 0.4s var(--ease),color 0.4s var(--ease);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}
button{cursor:pointer;font-family:inherit;border:none;background:none}
a{color:var(--blue);text-decoration:none;transition:opacity var(--trans)}
a:hover{opacity:0.8}

/* ═══════════════════════════════════════════════════════════
   ANIMATED BACKGROUND
═══════════════════════════════════════════════════════════ */
.bg-wrap{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}

.bg-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(91,154,255,0.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(91,154,255,0.07) 1px,transparent 1px);
  background-size:48px 48px;
  animation:gridDrift 20s linear infinite;
}
[data-theme="light"] .bg-grid{
  background-image:
    linear-gradient(rgba(26,79,216,0.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(26,79,216,0.08) 1px,transparent 1px);
}
@keyframes gridDrift{0%{background-position:0 0}100%{background-position:48px 48px}}

/* Motion gradient orbs */
.orb{position:absolute;border-radius:50%;filter:blur(80px);will-change:transform;contain:strict}
.orb-1{width:800px;height:800px;background:radial-gradient(circle,rgba(91,154,255,0.28) 0%,rgba(91,154,255,0.05) 55%,transparent 70%);top:-250px;left:-180px;animation:orbFloat 11s ease-in-out infinite}
.orb-2{width:650px;height:650px;background:radial-gradient(circle,rgba(191,127,255,0.24) 0%,rgba(191,127,255,0.04) 55%,transparent 70%);top:15%;right:-200px;animation:orbFloat 14s ease-in-out infinite reverse}
.orb-3{width:550px;height:550px;background:radial-gradient(circle,rgba(0,240,255,0.18) 0%,rgba(0,240,255,0.03) 55%,transparent 70%);bottom:-120px;left:20%;animation:orbFloat 18s ease-in-out infinite 4s}
.orb-4{width:450px;height:450px;background:radial-gradient(circle,rgba(255,95,204,0.18) 0%,rgba(255,95,204,0.03) 55%,transparent 70%);top:45%;left:-120px;animation:orbFloat 13s ease-in-out infinite 2s}
.orb-5{width:350px;height:350px;background:radial-gradient(circle,rgba(0,232,135,0.15) 0%,rgba(0,232,135,0.02) 55%,transparent 70%);top:30%;right:5%;animation:orbFloat 16s ease-in-out infinite 6s}
@keyframes orbFloat{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(40px,-35px) scale(1.08)}
  66%{transform:translate(-30px,28px) scale(0.92)}
}

/* Floating particles */
.particles{position:absolute;inset:0}
.particle{
  position:absolute;width:3px;height:3px;border-radius:50%;
  background:var(--blue);opacity:0;
  animation:particleFloat var(--dur,8s) linear infinite;
  animation-delay:var(--delay,0s);
  will-change:transform,opacity;
}
@keyframes particleFloat{
  0%{opacity:0;transform:translateY(100vh) scale(0)}
  10%{opacity:0.6}
  90%{opacity:0.3}
  100%{opacity:0;transform:translateY(-100px) scale(1.5)}
}

/* ═══════════════════════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════════════════════ */
.page{position:relative;z-index:1;max-width:700px;margin:0 auto;padding:0 16px 80px}

/* ═══════════════════════════════════════════════════════════
   HEADER
═══════════════════════════════════════════════════════════ */
.header{
  position:sticky;top:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 20px;
  background:rgba(6,12,26,0.9);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  margin:0 -16px 36px;
  transition:background var(--trans);
}
[data-theme="light"] .header{background:rgba(238,243,255,0.92)}

.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-icon{
  width:38px;height:38px;
  background:linear-gradient(135deg,var(--grad-a) 0%,var(--grad-c) 50%,var(--grad-b) 100%);
  border-radius:11px;display:flex;align-items:center;justify-content:center;
  font-size:19px;transition:transform 0.5s var(--spring);
  box-shadow:0 4px 20px rgba(91,154,255,0.5);
}
.logo:hover .logo-icon{transform:rotate(-15deg) scale(1.1)}
.logo-text{display:flex;flex-direction:column;line-height:1.15}
.logo-name{font-family:'Sora',sans-serif;font-weight:800;font-size:15px;color:var(--txt);letter-spacing:-0.02em}
.logo-name span{background:linear-gradient(90deg,var(--grad-a),var(--grad-c));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.logo-sub{font-size:10px;color:var(--txt2);font-weight:600;letter-spacing:0.05em;text-transform:uppercase}

.header-right{display:flex;align-items:center;gap:10px}
.theme-toggle{
  width:46px;height:26px;
  background:var(--bg4);border:1px solid var(--border);
  border-radius:var(--pill);cursor:pointer;position:relative;
  transition:all var(--trans);
}
.theme-toggle::after{
  content:'';position:absolute;left:4px;top:4px;
  width:18px;height:18px;border-radius:50%;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  transition:transform 0.35s var(--spring);
  box-shadow:0 2px 6px rgba(0,0,0,0.3);
}
[data-theme="light"] .theme-toggle::after{
  transform:translateX(20px);
  background:linear-gradient(135deg,var(--blue),var(--purple));
}
.theme-icon{position:absolute;font-size:10px;top:50%;transform:translateY(-50%);transition:opacity var(--trans)}
.theme-icon.sun{right:6px;opacity:1}
.theme-icon.moon{left:6px;opacity:0}
[data-theme="light"] .theme-icon.sun{opacity:0}
[data-theme="light"] .theme-icon.moon{opacity:1}

/* ═══════════════════════════════════════════════════════════
   LIVE TICKER
═══════════════════════════════════════════════════════════ */
.live-ticker{
  background:linear-gradient(135deg,rgba(79,142,247,0.08),rgba(167,139,250,0.08));
  border:1px solid rgba(79,142,247,0.18);
  border-radius:var(--pill);
  padding:7px 18px;
  font-size:11.5px;font-weight:600;color:var(--txt2);
  display:flex;align-items:center;gap:8px;
  overflow:hidden;margin-bottom:28px;
}
[data-theme="light"] .live-ticker{
  background:linear-gradient(135deg,rgba(37,99,235,0.07),rgba(124,58,237,0.05));
  border-color:rgba(37,99,235,0.2);
  color:var(--txt2);
}
.ticker-dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex-shrink:0;animation:pulse 2s ease-in-out infinite;box-shadow:0 0 10px var(--green)}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(0,232,135,0.7)}50%{box-shadow:0 0 0 9px rgba(0,232,135,0)}}
.ticker-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ticker-live{color:var(--green);font-weight:800;margin-right:4px;text-shadow:0 0 14px rgba(0,232,135,0.5)}

/* ═══════════════════════════════════════════════════════════
   STATS BAR
═══════════════════════════════════════════════════════════ */
.stats-bar{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:32px}
.stat-pill{
  display:flex;align-items:center;gap:7px;
  padding:8px 16px;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--pill);font-size:12px;font-weight:700;
  transition:all var(--trans);cursor:default;
}
[data-theme="light"] .stat-pill{background:var(--bg3);box-shadow:0 2px 8px rgba(37,99,235,0.07)}
.stat-pill:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 6px 28px var(--blue-glow),0 0 0 1px rgba(91,154,255,0.2)}
.stat-ico{font-size:14px}
.stat-val{color:var(--blue);font-weight:800;letter-spacing:-0.01em}
.stat-lbl{color:var(--txt2)}
.stat-pill.sk{
  background:linear-gradient(90deg,var(--bg3) 25%,var(--bg4) 50%,var(--bg3) 75%);
  background-size:200% 100%;animation:shimmer 1.5s infinite;
  width:130px;height:34px;border-radius:var(--pill);
}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ═══════════════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════════════ */
.hero{text-align:center;margin-bottom:36px;animation:heroReveal 0.9s var(--ease) both}
@keyframes heroReveal{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

.flag-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 18px;border-radius:var(--pill);
  background:linear-gradient(135deg,rgba(220,38,38,0.12),rgba(0,86,163,0.12));
  border:1px solid rgba(220,38,38,0.2);
  font-size:11px;font-weight:800;color:var(--txt2);
  text-transform:uppercase;letter-spacing:0.1em;margin-bottom:18px;
}
[data-theme="light"] .flag-badge{color:var(--txt2)}
.flag-badge .flag{font-size:16px;animation:waveflag 2s ease-in-out infinite}
@keyframes waveflag{0%,100%{transform:rotate(0)}25%{transform:rotate(5deg)}75%{transform:rotate(-5deg)}}

.hero h1{
  font-family:'Sora',sans-serif;
  font-size:clamp(24px,5.5vw,38px);
  font-weight:800;line-height:1.15;
  margin-bottom:14px;letter-spacing:-0.03em;
}
.hero h1 .hl{
  background:linear-gradient(135deg,var(--grad-a) 0%,var(--grad-c) 30%,var(--grad-b) 65%,var(--grad-d) 100%);
  background-size:300% 300%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  animation:gradientShift 4s ease-in-out infinite alternate;
  filter:drop-shadow(0 0 20px rgba(91,154,255,0.4));
}
@keyframes gradientShift{0%{background-position:0% 50%}100%{background-position:100% 50%}}
.hero p{color:var(--txt);opacity:0.8;font-size:15px;max-width:500px;margin:0 auto;line-height:1.7}

/* Animated car emoji */
.hero-car{
  font-size:40px;display:block;margin-bottom:12px;
  animation:carDrive 4s ease-in-out infinite;
}
@keyframes carDrive{
  0%,100%{transform:translateX(0) rotate(0deg)}
  25%{transform:translateX(8px) rotate(2deg)}
  75%{transform:translateX(-8px) rotate(-2deg)}
}

/* ═══════════════════════════════════════════════════════════
   SEARCH CARD
═══════════════════════════════════════════════════════════ */
.search-card{
  background:linear-gradient(145deg,var(--bg3) 0%,rgba(91,154,255,0.04) 100%);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:30px;
  box-shadow:var(--shadow),0 0 0 1px rgba(91,154,255,0.06);
  margin-bottom:22px;
  transition:box-shadow var(--trans),border-color var(--trans);
  animation:cardRise 0.8s var(--spring) 0.15s both;
  position:relative;overflow:hidden;
}
[data-theme="light"] .search-card{box-shadow:0 4px 24px rgba(37,99,235,0.09)}
.search-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(79,142,247,0.03),rgba(167,139,250,0.03));
  pointer-events:none;
}
.search-card:focus-within{
  border-color:var(--border-f);
  box-shadow:var(--shadow),0 0 0 4px rgba(91,154,255,0.22),0 0 70px rgba(91,154,255,0.12);
}
@keyframes cardRise{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:none}}

.search-card-header{margin-bottom:22px}
.search-card h2{
  font-family:'Sora',sans-serif;font-size:19px;font-weight:800;
  margin-bottom:5px;color:var(--txt);letter-spacing:-0.02em;
}
.search-card .sub{font-size:13px;color:var(--txt2)}

/* Single field layout */
.field{position:relative;margin-bottom:16px}
.field label{
  display:block;font-size:11.5px;font-weight:800;
  color:var(--txt2);margin-bottom:7px;text-transform:uppercase;letter-spacing:0.06em;
}
.field label .req{color:var(--red)}
.field input{
  width:100%;padding:15px 46px 15px 16px;
  background:var(--bg5);border:1.5px solid var(--border);
  border-radius:var(--radius-sm);color:var(--txt);
  font-size:16px;transition:all var(--trans);outline:none;
  font-family:'JetBrains Mono',monospace;letter-spacing:0.1em;
}
[data-theme="light"] .field input{background:var(--bg5);border-color:var(--border)}
.field input:focus{border-color:var(--border-f);box-shadow:0 0 0 4px rgba(91,154,255,0.25),0 0 30px rgba(91,154,255,0.1);background:var(--bg4)}
.field input::placeholder{color:var(--txt3);font-family:'Nunito',sans-serif;letter-spacing:normal;font-size:14px}
.field input.valid{border-color:var(--green)}
.field input.invalid{border-color:var(--red)}

.field-icon{
  position:absolute;right:14px;top:41px;
  font-size:15px;pointer-events:none;opacity:0;
  transition:opacity var(--trans),transform var(--trans);
}
.field-icon.show{opacity:1;transform:scale(1.1)}
.field-hint{font-size:11px;color:var(--txt3);margin-top:5px}

.search-btn{
  width:100%;padding:17px;
  background:linear-gradient(135deg,#5b9aff 0%,#bf7fff 35%,#00f0ff 65%,#5b9aff 100%);
  background-size:300% 300%;
  color:#fff;border:none;border-radius:var(--radius-sm);
  font-size:15px;font-weight:800;font-family:'Sora',sans-serif;
  transition:all 0.25s var(--ease);position:relative;overflow:hidden;
  margin-bottom:14px;letter-spacing:0.02em;
  animation:btnGradient 3s ease-in-out infinite;
  box-shadow:0 4px 28px rgba(91,154,255,0.45),0 2px 8px rgba(0,0,0,0.3);
  text-shadow:0 1px 4px rgba(0,0,0,0.3);
  will-change:transform;
}
@keyframes btnGradient{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
.search-btn::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);
  transform:translateX(-100%);transition:transform 0.7s;
}
.search-btn:hover:not(:disabled)::before{transform:translateX(100%)}
.search-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 14px 40px rgba(91,154,255,0.6),0 0 60px rgba(0,240,255,0.2)}
.search-btn:active:not(:disabled){transform:translateY(0)}
.search-btn:disabled{opacity:0.35;cursor:not-allowed;animation:none;background:var(--bg5);box-shadow:none;color:var(--txt3)}
.btn-inner{display:flex;align-items:center;justify-content:center;gap:9px}
.spinner{width:17px;height:17px;border:2.5px solid rgba(255,255,255,0.3);border-top-color:#fff;border-radius:50%;animation:spin 0.7s linear infinite;display:none}
@keyframes spin{to{transform:rotate(360deg)}}
.privacy-note{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11.5px;color:var(--txt3)}

/* ═══════════════════════════════════════════════════════════
   RESULT AREA
═══════════════════════════════════════════════════════════ */
#result-area{margin-bottom:26px;min-height:0}

/* Loading */
.loading-state{
  text-align:center;padding:44px 20px;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--radius-lg);animation:fadeIn 0.3s;
}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.loading-car{font-size:42px;margin-bottom:16px;display:block;animation:loadingBounce 0.8s ease-in-out infinite}
@keyframes loadingBounce{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.05)}}

.dots{display:flex;justify-content:center;gap:10px;margin-bottom:14px}
.dots span{width:10px;height:10px;background:var(--blue);border-radius:50%;animation:dotBounce 1.2s ease-in-out infinite}
.dots span:nth-child(2){animation-delay:0.2s;background:var(--purple)}
.dots span:nth-child(3){animation-delay:0.4s;background:var(--cyan)}
@keyframes dotBounce{0%,80%,100%{transform:scale(0.5);opacity:0.3}40%{transform:scale(1.4);opacity:1}}

.loading-text{font-family:'Sora',sans-serif;font-size:15px;color:var(--txt);margin-bottom:4px;font-weight:700}
.loading-sub{font-size:12.5px;color:var(--txt2)}
.loading-bar{
  width:180px;height:3px;margin:18px auto 0;
  background:var(--bg4);border-radius:var(--pill);overflow:hidden;
}
.loading-bar-inner{
  height:100%;width:0;
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b),var(--grad-c));
  border-radius:var(--pill);
  animation:loadBar 0.9s var(--ease) forwards;
}
@keyframes loadBar{to{width:85%}}

/* ── FOUND CARD ── */
.found-card{
  background:linear-gradient(145deg,var(--bg3) 0%,rgba(0,232,135,0.04) 100%);
  border:1.5px solid var(--green);
  border-radius:var(--radius-lg);padding:28px;
  box-shadow:0 0 0 1px rgba(0,232,135,0.18),var(--shadow),0 0 60px rgba(0,232,135,0.08);
  animation:cardRise 0.6s var(--spring) both;
  position:relative;overflow:hidden;
}
[data-theme="light"] .found-card{background:#fff;box-shadow:0 4px 30px rgba(5,150,105,0.12)}
.found-card::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at top left,rgba(16,185,129,0.08),transparent 55%);
  pointer-events:none;
}

/* Motion gradient shimmer on found card top */
.found-card::after{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--green),var(--cyan),var(--blue),var(--purple),var(--pink),var(--green));
  background-size:300% 100%;
  animation:rainbowBar 3s linear infinite;
}
@keyframes rainbowBar{0%{background-position:0% 0}100%{background-position:300% 0}}

.found-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:24px}
.check-circle{
  width:58px;height:58px;flex-shrink:0;
  background:rgba(0,232,135,0.15);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:2px solid var(--green);
  box-shadow:0 0 24px rgba(0,232,135,0.3);
  animation:checkPop 0.5s var(--spring) both;
}
@keyframes checkPop{from{transform:scale(0)}to{transform:scale(1)}}
.check-circle svg{width:26px;height:26px;stroke:var(--green);stroke-width:2.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.check-circle svg path{stroke-dasharray:40;stroke-dashoffset:40;animation:drawCheck 0.7s 0.3s var(--ease) forwards}
@keyframes drawCheck{to{stroke-dashoffset:0}}

.found-title{font-family:'Sora',sans-serif;font-size:19px;font-weight:800;color:var(--green);text-shadow:0 0 30px rgba(0,232,135,0.4)}
.found-sub{font-size:13px;color:var(--txt2);margin-top:3px}

/* Name reveal banner */
.name-reveal{
  background:linear-gradient(135deg,rgba(16,185,129,0.1),rgba(79,142,247,0.08));
  border:1px solid rgba(16,185,129,0.25);
  border-radius:var(--radius-sm);
  padding:14px 18px;margin-bottom:18px;
  display:flex;align-items:center;gap:12px;
  animation:slideIn 0.5s var(--spring) 0.2s both;
}
[data-theme="light"] .name-reveal{background:linear-gradient(135deg,rgba(5,150,105,0.08),rgba(37,99,235,0.06))}
.name-reveal-emoji{font-size:28px;animation:emojiPop 0.6s var(--spring) 0.4s both;opacity:0}
@keyframes emojiPop{from{opacity:0;transform:scale(0) rotate(-20deg)}to{opacity:1;transform:scale(1) rotate(0)}}
.name-reveal-body{}
.name-reveal-label{font-size:10px;font-weight:800;color:var(--txt2);text-transform:uppercase;letter-spacing:0.07em;margin-bottom:2px}
.name-reveal-name{font-family:'Sora',sans-serif;font-size:18px;font-weight:800;color:var(--txt);letter-spacing:-0.01em}

.result-divider{height:1px;background:var(--border);margin:16px 0}
.result-grid{display:grid;grid-template-columns:auto 1fr;gap:9px 16px;align-items:start;margin-bottom:22px}
.r-label{font-size:11px;font-weight:800;color:var(--txt2);text-transform:uppercase;letter-spacing:0.07em;padding-top:2px;white-space:nowrap}
.r-val{font-size:14.5px;color:var(--txt);word-break:break-word}
.r-val.mono{font-family:'JetBrains Mono',monospace;font-size:13.5px;cursor:copy;transition:color var(--trans)}
.r-val.mono:hover{color:var(--blue)}

.cat-badges{display:flex;flex-wrap:wrap;gap:7px}
.cat-badge{
  padding:4px 12px;border-radius:var(--pill);font-size:12px;font-weight:800;
  border:1px solid;display:inline-flex;align-items:center;gap:5px;
  animation:badgePop 0.4s var(--spring) both;
}
.cat-A{background:rgba(91,154,255,0.2);color:#80bcff;border-color:rgba(91,154,255,0.4)}
.cat-B{background:rgba(0,232,135,0.2);color:#00e887;border-color:rgba(0,232,135,0.4)}
.cat-C{background:rgba(255,122,53,0.2);color:#ff8c5a;border-color:rgba(255,122,53,0.4)}
.cat-D{background:rgba(255,61,107,0.2);color:#ff6888;border-color:rgba(255,61,107,0.4)}
.cat-E{background:rgba(191,127,255,0.2);color:#bf7fff;border-color:rgba(191,127,255,0.4)}
.cat-F{background:rgba(255,224,64,0.2);color:#ffe040;border-color:rgba(255,224,64,0.4)}
.cat-G{background:rgba(0,240,255,0.2);color:#00f0ff;border-color:rgba(0,240,255,0.4)}
.cat-other{background:rgba(255,95,204,0.2);color:#ff5fcc;border-color:rgba(255,95,204,0.4)}
@keyframes badgePop{from{transform:scale(0)}to{transform:scale(1)}}

[data-theme="light"] .cat-A{background:rgba(37,99,235,0.1);color:#1d4ed8;border-color:rgba(37,99,235,0.25)}
[data-theme="light"] .cat-B{background:rgba(5,150,105,0.1);color:#047857;border-color:rgba(5,150,105,0.25)}
[data-theme="light"] .cat-C{background:rgba(234,88,12,0.1);color:#c2410c;border-color:rgba(234,88,12,0.25)}
[data-theme="light"] .cat-D{background:rgba(225,29,72,0.1);color:#be123c;border-color:rgba(225,29,72,0.25)}
[data-theme="light"] .cat-E{background:rgba(109,40,217,0.1);color:#6d28d9;border-color:rgba(109,40,217,0.25)}
[data-theme="light"] .cat-F{background:rgba(180,83,9,0.1);color:#b45309;border-color:rgba(180,83,9,0.25)}
[data-theme="light"] .cat-G{background:rgba(8,145,178,0.1);color:#0e7490;border-color:rgba(8,145,178,0.25)}
[data-theme="light"] .cat-other{background:rgba(190,24,93,0.1);color:#be185d;border-color:rgba(190,24,93,0.25)}

.records-section{margin-bottom:20px}
.records-title{font-size:11.5px;font-weight:800;color:var(--txt2);text-transform:uppercase;letter-spacing:0.07em;margin-bottom:12px}
.timeline-item{
  display:flex;gap:14px;padding:13px;
  background:var(--bg4);border-radius:var(--radius-sm);
  border:1px solid var(--border);margin-bottom:9px;
  animation:slideIn 0.4s var(--ease) both;
  transition:border-color var(--trans);
}
[data-theme="light"] .timeline-item{background:var(--bg5)}
.timeline-item:hover{border-color:var(--green)}
@keyframes slideIn{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
.tl-dot{width:9px;height:9px;border-radius:50%;background:var(--green);margin-top:5px;flex-shrink:0;box-shadow:0 0 8px var(--green)}
.tl-body{flex:1}
.tl-cats{margin-bottom:5px}
.tl-meta{font-size:12px;color:var(--txt2)}

.found-actions{display:flex;gap:10px;flex-wrap:wrap}
.action-btn{
  padding:9px 17px;border-radius:var(--radius-sm);
  font-size:13px;font-weight:700;border:1px solid var(--border);
  background:var(--bg4);color:var(--txt);
  transition:all var(--trans);display:flex;align-items:center;gap:7px;
}
[data-theme="light"] .action-btn{background:var(--bg5)}
.action-btn:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-3px);box-shadow:0 6px 24px var(--blue-glow),0 0 0 1px rgba(91,154,255,0.15)}

/* Confetti */
.confetti-wrap{position:absolute;top:0;left:50%;transform:translateX(-50%);pointer-events:none;width:100%;height:300px;overflow:hidden}
.conf{position:absolute;width:8px;height:8px;border-radius:2px;opacity:0;animation:confFly 1.8s ease-out forwards}
@keyframes confFly{
  0%{opacity:1;transform:translate(0,0) rotate(0deg)}
  100%{opacity:0;transform:translate(var(--tx),var(--ty)) rotate(var(--rot,360deg))}
}

/* ── NOT FOUND CARD ── */
.notfound-card{
  background:var(--bg3);border:1.5px solid var(--border);
  border-radius:var(--radius-lg);padding:28px;
  box-shadow:var(--shadow);animation:cardRise 0.6s var(--spring) both;
  position:relative;overflow:hidden;text-align:center;
}
[data-theme="light"] .notfound-card{background:#fff;box-shadow:0 4px 24px rgba(37,99,235,0.08)}

/* Motion gradient shimmer on not-found card top */
.notfound-card::after{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--red),var(--orange),var(--yellow),var(--orange),var(--red));
  background-size:300% 100%;
  animation:rainbowBarRed 3s linear infinite;
}
@keyframes rainbowBarRed{0%{background-position:0% 0}100%{background-position:300% 0}}

.nf-anim{font-size:52px;margin-bottom:8px;display:block;animation:nfAnimBounce 0.8s var(--spring) both}
@keyframes nfAnimBounce{from{transform:scale(0) rotate(-20deg)}50%{transform:scale(1.2) rotate(5deg)}to{transform:scale(1) rotate(0)}}

/* Emoji continuous float animation */
.nf-anim.float{animation:nfAnimBounce 0.8s var(--spring) both, floatLoop 3s ease-in-out 1s infinite}
@keyframes floatLoop{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-8px) rotate(5deg)}}

.nf-title{font-family:'Sora',sans-serif;font-size:19px;font-weight:800;margin-bottom:10px;color:var(--txt)}
.nf-funny{
  font-size:14px;color:var(--txt2);margin-bottom:18px;
  min-height:22px;font-style:italic;line-height:1.6;
}
.nf-cursor{display:inline-block;width:2px;height:16px;background:var(--blue);animation:blink 0.8s step-end infinite;vertical-align:middle}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

.nf-reasons{
  background:var(--bg4);border:1px solid var(--border);
  border-radius:var(--radius);padding:16px;margin-bottom:16px;text-align:left;
}
[data-theme="light"] .nf-reasons{background:var(--bg5)}
.nf-reasons h4{font-size:12px;font-weight:800;color:var(--txt2);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:10px}
.reason-item{display:flex;align-items:center;gap:9px;font-size:13px;margin-bottom:7px;color:var(--txt2)}
.reason-item:last-child{margin-bottom:0}
.ri{font-size:15px;flex-shrink:0}

.name-tips{
  background:rgba(251,191,36,0.07);border:1px solid rgba(251,191,36,0.2);
  border-radius:var(--radius-sm);padding:12px;font-size:12.5px;color:var(--yellow);
  margin-bottom:16px;text-align:left;line-height:1.6;
}
[data-theme="light"] .name-tips{background:rgba(180,83,9,0.07);border-color:rgba(180,83,9,0.2);color:#b45309}

.data-coverage{font-size:12px;color:var(--txt3);margin-bottom:16px;font-style:italic}
.nf-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* ═══════════════════════════════════════════════════════════
   SMS SECTION
═══════════════════════════════════════════════════════════ */
.sms-section{
  background:linear-gradient(145deg,var(--bg3) 0%,rgba(91,154,255,0.03) 100%);
  border:1.5px solid var(--border);
  border-radius:var(--radius-lg);padding:24px;margin-bottom:20px;
  transition:all 0.5s var(--ease);
}
[data-theme="light"] .sms-section{background:#fff;box-shadow:0 2px 12px rgba(37,99,235,0.07)}
.sms-section.highlight{
  border-color:var(--blue);
  box-shadow:0 0 0 3px var(--blue-glow),var(--shadow-blue);
}

.sms-title{font-family:'Sora',sans-serif;font-size:15px;font-weight:800;margin-bottom:5px;display:flex;align-items:center;gap:8px}
.sms-sub{font-size:12.5px;color:var(--txt2);margin-bottom:18px}

.sms-preview{
  background:var(--bg4);border:1px solid var(--border);
  border-radius:var(--radius-sm);padding:11px 16px;
  font-family:'JetBrains Mono',monospace;font-size:13px;
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;margin-bottom:14px;flex-wrap:wrap;
}
[data-theme="light"] .sms-preview{background:var(--bg5)}
.sms-copy-btn{
  font-size:12px;font-weight:700;color:var(--blue);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:5px 11px;transition:all var(--trans);background:none;cursor:pointer;
}
.sms-copy-btn:hover{background:var(--blue-glow);border-color:var(--blue)}

.sms-btns{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:12px}
@media(max-width:380px){.sms-btns{grid-template-columns:1fr}}
.sms-btn{
  padding:12px;border-radius:var(--radius-sm);
  background:linear-gradient(135deg,rgba(79,142,247,0.1),rgba(79,142,247,0.05));
  border:1.5px solid rgba(79,142,247,0.2);
  color:var(--txt);font-size:13px;font-weight:700;
  display:flex;flex-direction:column;align-items:center;gap:4px;
  transition:all var(--trans);cursor:pointer;
}
.sms-btn:hover{background:rgba(79,142,247,0.18);border-color:var(--blue);transform:translateY(-2px);box-shadow:0 6px 20px var(--blue-glow)}
.sms-btn-num{font-family:'JetBrains Mono',monospace;font-size:17px;font-weight:800;color:var(--blue)}
.sms-btn-label{font-size:10.5px;color:var(--txt2)}
.sms-note{font-size:11px;color:var(--txt3);text-align:center}

/* ═══════════════════════════════════════════════════════════
   ACCORDION
═══════════════════════════════════════════════════════════ */
.accordion{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--radius-lg);margin-bottom:16px;overflow:hidden;
  transition:border-color var(--trans);
}
[data-theme="light"] .accordion{background:#fff}
.accordion:hover{border-color:var(--border-f)}
.accordion-header{
  padding:17px 22px;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;
  font-family:'Sora',sans-serif;font-size:14px;font-weight:700;
  transition:background var(--trans);user-select:none;
}
.accordion-header:hover{background:var(--bg4)}
.accordion-arrow{transition:transform var(--trans);font-size:12px;color:var(--txt2)}
.accordion.open .accordion-arrow{transform:rotate(180deg)}
.accordion-body{display:none;padding:0 22px 20px}
.accordion.open .accordion-body{display:block}

.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:9px;margin-top:8px}
.cat-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--radius-sm);background:var(--bg4);border:1px solid transparent;transition:border-color var(--trans)}
[data-theme="light"] .cat-row{background:var(--bg5)}
.cat-row:hover{border-color:var(--border-f)}
.cat-code{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;min-width:32px}
.cat-ico{font-size:16px}
.cat-desc{font-size:12.5px;color:var(--txt2)}

/* ═══════════════════════════════════════════════════════════
   HOW IT WORKS
═══════════════════════════════════════════════════════════ */
.how-section{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:26px;margin-bottom:16px;
}
[data-theme="light"] .how-section{background:#fff;box-shadow:0 2px 12px rgba(37,99,235,0.06)}
.section-title{font-family:'Sora',sans-serif;font-size:16px;font-weight:800;margin-bottom:22px;display:flex;align-items:center;gap:9px;letter-spacing:-0.01em;color:var(--txt)}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;position:relative}
.steps-connector{
  position:absolute;top:30px;left:calc(100%/6);right:calc(100%/6);
  height:2px;background:linear-gradient(90deg,var(--grad-a),var(--grad-b));
  z-index:0;
}
@media(max-width:500px){.steps{grid-template-columns:1fr}.steps-connector{display:none}}
.step{text-align:center;position:relative;z-index:1}
.step-num{
  width:44px;height:44px;border-radius:50%;
  background:linear-gradient(135deg,var(--grad-a),var(--grad-b));
  color:#fff;font-family:'Sora',sans-serif;font-weight:800;font-size:16px;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 12px;
  box-shadow:0 4px 24px rgba(91,154,255,0.55),0 0 40px rgba(91,154,255,0.2);
}
.step-icon{font-size:24px;margin-bottom:7px;display:block}
.step-name{font-weight:800;font-size:13px;margin-bottom:4px;font-family:'Sora',sans-serif}
.step-desc{font-size:12px;color:var(--txt2);line-height:1.5}

/* ═══════════════════════════════════════════════════════════
   HOW TO FIND GUIDE
═══════════════════════════════════════════════════════════ */
.guide-section{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:26px;margin-bottom:16px;
}
[data-theme="light"] .guide-section{background:#fff;box-shadow:0 2px 12px rgba(37,99,235,0.06)}
.guide-intro{font-size:13.5px;color:var(--txt2);margin-bottom:20px;line-height:1.7}
.guide-steps{counter-reset:gs}
.guide-step{
  display:flex;gap:14px;padding:14px;border-radius:var(--radius-sm);
  background:var(--bg4);border:1px solid var(--border);
  margin-bottom:10px;transition:border-color var(--trans);
}
[data-theme="light"] .guide-step{background:var(--bg5)}
.guide-step:hover{border-color:var(--border-f)}
.guide-step-num{
  width:28px;height:28px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--grad-a),var(--grad-c));
  color:#fff;font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.guide-step-body h4{font-size:13px;font-weight:800;margin-bottom:3px}
.guide-step-body p{font-size:12px;color:var(--txt2);line-height:1.6}
.guide-step-body code{
  font-family:'JetBrains Mono',monospace;font-size:11.5px;
  background:var(--bg5);padding:2px 7px;border-radius:5px;
  color:var(--cyan);border:1px solid var(--border);
}
[data-theme="light"] .guide-step-body code{background:var(--bg);color:var(--blue2);border-color:var(--border)}

/* ═══════════════════════════════════════════════════════════
   FAQ
═══════════════════════════════════════════════════════════ */
.faq-section{margin-bottom:16px}
.faq-item{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--radius);margin-bottom:9px;overflow:hidden;
  transition:border-color var(--trans);
}
[data-theme="light"] .faq-item{background:#fff;box-shadow:0 1px 6px rgba(37,99,235,0.06)}
.faq-item:hover{border-color:var(--border-f)}
.faq-q{
  padding:15px 19px;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  font-size:13.5px;font-weight:700;
  transition:background var(--trans);user-select:none;
}
.faq-q:hover{background:var(--bg4)}
.faq-arrow{color:var(--txt2);font-size:12px;transition:transform var(--trans);flex-shrink:0}
.faq-item.open .faq-arrow{transform:rotate(180deg)}
.faq-a{display:none;padding:4px 19px 16px;font-size:13px;color:var(--txt2);line-height:1.7}
.faq-item.open .faq-a{display:block}
.faq-a a{color:var(--blue)}

/* ═══════════════════════════════════════════════════════════
   GOV LINKS
═══════════════════════════════════════════════════════════ */
.gov-section{
  background:linear-gradient(135deg,rgba(79,142,247,0.05),rgba(167,139,250,0.05));
  border:1px solid rgba(79,142,247,0.15);
  border-radius:var(--radius-lg);padding:22px;margin-bottom:16px;
}
[data-theme="light"] .gov-section{
  background:linear-gradient(135deg,rgba(37,99,235,0.05),rgba(124,58,237,0.04));
  border-color:rgba(37,99,235,0.15);
}
.gov-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-top:14px}
.gov-link{
  display:flex;align-items:center;gap:10px;padding:12px;
  background:var(--bg4);border:1px solid var(--border);border-radius:var(--radius-sm);
  color:var(--txt);font-size:13px;font-weight:600;
  transition:all var(--trans);text-decoration:none;
}
[data-theme="light"] .gov-link{background:var(--bg5)}
.gov-link:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px);box-shadow:0 4px 16px var(--blue-glow);opacity:1}
.gov-link-ico{font-size:20px;flex-shrink:0}
.gov-link-body small{display:block;font-size:11px;color:var(--txt3);font-weight:400}
.gov-ext{font-size:11px;color:var(--txt3);margin-left:auto}

/* ═══════════════════════════════════════════════════════════
   DISCLAIMER
═══════════════════════════════════════════════════════════ */
.disclaimer-section{
  background:rgba(251,191,36,0.05);
  border:1px solid rgba(251,191,36,0.15);
  border-radius:var(--radius-lg);padding:20px;margin-bottom:16px;
}
[data-theme="light"] .disclaimer-section{background:rgba(180,83,9,0.04);border-color:rgba(180,83,9,0.15)}
.disclaimer-title{display:flex;align-items:center;gap:8px;font-family:'Sora',sans-serif;font-size:14px;font-weight:800;color:var(--yellow);margin-bottom:12px}
[data-theme="light"] .disclaimer-title{color:#b45309}
.disclaimer-body{font-size:12.5px;color:var(--txt2);line-height:1.8}
.disclaimer-body p{margin-bottom:8px}
.disclaimer-body p:last-child{margin-bottom:0}
.disclaimer-body strong{color:var(--txt)}
.disclaimer-body a{color:var(--blue)}

/* ═══════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════ */
.footer{
  text-align:center;padding:28px 0 0;
  border-top:1px solid var(--border);
  font-size:12px;color:var(--txt3);
}
.footer-gov-bar{
  background:rgba(220,38,38,0.06);border:1px solid rgba(220,38,38,0.12);
  border-radius:var(--radius-sm);padding:11px 16px;margin-bottom:16px;
  font-size:12px;color:var(--red);display:flex;align-items:flex-start;gap:8px;text-align:left;
}
.footer-links{display:flex;justify-content:center;gap:22px;margin-bottom:12px;flex-wrap:wrap}
.footer-links a{color:var(--txt2);transition:color var(--trans);font-size:12px}
.footer-links a:hover{color:var(--blue)}
.footer-bottom{font-size:11px;color:var(--txt3);margin-top:10px;padding-bottom:20px}
.footer-heart{color:var(--red);animation:heartbeat 1.2s ease-in-out infinite}
@keyframes heartbeat{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}

/* ═══════════════════════════════════════════════════════════
   TOAST
═══════════════════════════════════════════════════════════ */
.toast{
  position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(120px);
  background:var(--bg2);border:1px solid var(--border);
  border-radius:var(--pill);padding:11px 22px;
  font-size:13px;font-weight:700;box-shadow:var(--shadow);
  z-index:1000;transition:transform 0.4s var(--spring);white-space:nowrap;
}
[data-theme="light"] .toast{background:var(--bg3)}
.toast.show{transform:translateX(-50%) translateY(0)}
.toast.success{border-color:var(--green);color:var(--green)}
.toast.error{border-color:var(--red);color:var(--red)}

/* ═══════════════════════════════════════════════════════════
   SCROLL REVEAL
═══════════════════════════════════════════════════════════ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity 0.65s var(--ease),transform 0.65s var(--ease)}
.reveal.in-view{opacity:1;transform:none}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════════ */
@media(max-width:480px){
  .search-card{padding:20px}
  .found-card,.notfound-card{padding:20px}
  .sms-section,.how-section,.guide-section,.gov-section,.disclaimer-section{padding:18px}
  .accordion-header{padding:14px 18px}
  .hero h1{font-size:24px}
  .stat-pill{padding:6px 12px}
  .footer-links{gap:14px}
}
@media(max-width:360px){
  .sms-btns{grid-template-columns:1fr}
  .found-actions{flex-direction:column}
  .nf-actions{flex-direction:column}
}

/* ═══════════════════════════════════════════════════════════
   SKIP LINK (Accessibility)
═══════════════════════════════════════════════════════════ */
.skip-link{
  position:absolute;top:-100px;left:50%;transform:translateX(-50%);
  background:var(--blue);color:#fff;padding:10px 20px;border-radius:var(--pill);
  font-weight:700;z-index:9999;transition:top 0.2s;
}
.skip-link:focus{top:8px}

/* Nepal flag colors */
.np-red{color:#dc2626}.np-blue{color:#0056a3}