/* ── HERO ── */
    .hero { text-align:center; padding:80px 20px 60px; position:relative; overflow:hidden; background:radial-gradient(ellipse at 50% 0%,rgba(107,33,212,.15),transparent 65%); }
    .hero-scanline { position:absolute; left:0; right:0; height:2px; background:linear-gradient(90deg,transparent,rgba(107,33,212,.6),transparent); animation:scan 4s ease-in-out infinite; pointer-events:none; }
    @keyframes scan{ 0%{top:0;opacity:0} 10%{opacity:1} 90%{opacity:1} 100%{top:100%;opacity:0} }
    .ip-hero-display { margin:40px auto 0; max-width:700px; position:relative; z-index:1; }
    .ip-big { font-family:'Bebas Neue',sans-serif; font-size:clamp(36px,8vw,72px); letter-spacing:4px; color:var(--white); line-height:1; background:linear-gradient(135deg,var(--white),var(--purple-light)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; animation:ipglow 3s ease-in-out infinite; }
    @keyframes ipglow{ 0%,100%{filter:drop-shadow(0 0 8px rgba(155,95,227,.3))} 50%{filter:drop-shadow(0 0 24px rgba(155,95,227,.8))} }
    .ip-loading { color:rgba(155,95,227,.5); font-size:14px; letter-spacing:3px; }

    /* ── MAIN ── */
    .main { max-width:1100px; margin:0 auto; padding:60px 24px 100px; }

    /* ── SECTION HEADER ── */
    .section-hd { display:flex; align-items:center; gap:16px; margin:0 0 20px; }
    .section-hd h2 { font-family:'Bebas Neue',sans-serif; font-size:26px; letter-spacing:4px; color:rgba(255,255,255,.5); white-space:nowrap; }
    .section-hd h2 span { color:var(--purple-light); }
    .section-hd::after { content:''; flex:1; height:1px; background:rgba(107,33,212,.2); }

    /* ── CARD GRID ── */
    .info-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:48px; }
    @media(max-width:900px){ .info-grid{grid-template-columns:repeat(2,1fr);} }
    @media(max-width:560px){ .info-grid{grid-template-columns:1fr;} }

    .info-card {
      background:rgba(255,255,255,.03); border:1px solid rgba(107,33,212,.22);
      padding:24px 22px; position:relative; overflow:hidden;
      transition:border-color .3s, transform .3s, box-shadow .3s;
      animation:cardIn .6s ease both;
    }
    .info-card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(107,33,212,.06),transparent); opacity:0; transition:opacity .3s; }
    .info-card:hover::before { opacity:1; }
    .info-card:hover { border-color:rgba(155,95,227,.5); transform:translateY(-4px); box-shadow:0 12px 40px rgba(107,33,212,.2); }

    .card-tag { font-size:8px; letter-spacing:4px; color:rgba(155,95,227,.6); text-transform:uppercase; margin-bottom:10px; display:flex; align-items:center; gap:8px; }
    .card-tag::before { content:''; display:inline-block; width:20px; height:1px; background:rgba(155,95,227,.4); }
    .card-icon { font-size:26px; margin-bottom:12px; display:block; }
    .card-label { font-size:9px; letter-spacing:3px; color:rgba(255,255,255,.3); text-transform:uppercase; margin-bottom:6px; }
    .card-value { font-family:'Space Mono',monospace; font-size:clamp(13px,1.8vw,17px); color:#fff; font-weight:700; letter-spacing:1px; word-break:break-all; }
    .card-value.loading { color:rgba(107,33,212,.5); animation:pulse .8s ease-in-out infinite; }
    .card-sub { font-size:10px; color:rgba(255,255,255,.3); margin-top:6px; letter-spacing:1px; word-break:break-all; }
    .badge-on  { display:inline-block; padding:2px 10px; background:rgba(100,220,100,.12); border:1px solid rgba(100,220,100,.3); color:rgba(100,220,100,.9); font-size:9px; letter-spacing:2px; }
    .badge-off { display:inline-block; padding:2px 10px; background:rgba(255,80,80,.1); border:1px solid rgba(255,80,80,.25); color:rgba(255,80,80,.7); font-size:9px; letter-spacing:2px; }

    /* ── MAP ── */
    .map-section { margin-bottom:50px; }
    .map-frame-wrap {
      position:relative; overflow:hidden;
      border:1px solid rgba(107,33,212,.35);
      background:#0a0612;
    }
    /* Corner decorations */
    .map-frame-wrap::before, .map-frame-wrap::after { content:''; position:absolute; width:20px; height:20px; border-color:var(--purple-light); border-style:solid; z-index:2; pointer-events:none; }
    .map-frame-wrap::before { top:8px; left:8px; border-width:2px 0 0 2px; }
    .map-frame-wrap::after  { bottom:8px; right:8px; border-width:0 2px 2px 0; }
    #mapFrame { width:100%; height:420px; border:none; display:block; filter:hue-rotate(220deg) saturate(0.7) brightness(0.85); }
    .map-placeholder { width:100%; height:420px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; color:rgba(255,255,255,.2); }
    .map-placeholder span { font-size:48px; animation:pulse 2s ease-in-out infinite; }
    .map-placeholder p { font-size:9px; letter-spacing:3px; }

    /* ── GLOBE ── */
    .globe-wrap { text-align:center; margin-bottom:50px; }
    canvas#globe { display:inline-block; }

    /* ── YA COMMENT ── */
    .ya-comment { max-width:700px; margin:0 auto 60px; background:rgba(107,33,212,.08); border:1px solid rgba(107,33,212,.3); padding:32px 36px; position:relative; }
    .ya-comment::before { content:'✌️'; position:absolute; top:-16px; left:36px; font-size:28px; }
    .ya-label { font-size:8px; letter-spacing:4px; color:rgba(155,95,227,.5); margin-bottom:12px; }
    .ya-text { font-family:'Zen Kaku Gothic New',sans-serif; font-size:15px; line-height:1.8; color:rgba(255,255,255,.8); }
    .ya-sig { font-size:10px; letter-spacing:3px; color:rgba(155,95,227,.5); margin-top:16px; }

    /* ── RAW JSON ── */

    .footer { text-align:center; padding:40px 20px; font-size:9px; letter-spacing:3px; color:rgba(255,255,255,.15); }