:root{
      color-scheme:dark;
      --bg:#050506;
      --surface:rgba(15,15,17,.80);
      --surface-2:rgba(20,20,23,.82);
      --line:rgba(255,255,255,.08);
      --line-strong:rgba(255,255,255,.14);
      --text:#f5f5f7;
      --muted:#8c8c94;
      --muted-2:#66666e;
      --green:#74df9a;
      --yellow:#ffd16d;
      --red:#ff7474;
      --page:min(1160px,calc(100vw - 40px));
      --radius-xl:28px;
      --radius-lg:22px;
      --radius-md:16px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      min-width:320px;
      background:var(--bg);
      color:var(--text);
      font-family:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      font-size:16px;
      line-height:1.5;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
    }
    body.modal-open{overflow:hidden}
    button,input{font:inherit}
    button{color:inherit}
    a{color:inherit;text-decoration:none}
    button,a{-webkit-tap-highlight-color:transparent}
    [hidden]{display:none!important}
    ::selection{background:rgba(255,255,255,.18)}

    .page{
      position:relative;
      min-height:100vh;
      min-height:100svh;
      display:flex;
      flex-direction:column;
      overflow:hidden;
      isolation:isolate;
      background:
        radial-gradient(circle at 50% 24%,rgba(255,255,255,.025),transparent 34%),
        var(--bg);
    }

    .hero-art{
      position:absolute;
      z-index:-2;
      inset:0 0 auto 0;
      height:min(760px,82vh);
      background-color:#050506;
      background-image:
        linear-gradient(to right,
          rgba(5,5,6,.56),
          rgba(5,5,6,.10) 34%,
          rgba(5,5,6,.10) 66%,
          rgba(5,5,6,.56)),
        url("../../background.webp");
      background-size:cover;
      background-position:center top;
    }
    .hero-art:before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(to bottom,
          rgba(5,5,6,.12) 0%,
          rgba(5,5,6,.18) 30%,
          rgba(5,5,6,.42) 56%,
          rgba(5,5,6,.82) 78%,
          #050506 96%,
          #050506 100%);
    }
    .hero-art:after{
      content:"";
      position:absolute;
      left:0;right:0;bottom:-2px;
      height:180px;
      background:linear-gradient(to bottom,rgba(5,5,6,0),#050506 82%,#050506 100%);
    }

    .noise{
      pointer-events:none;
      position:absolute;
      z-index:-1;
      inset:0;
      opacity:.028;
      background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
    }

    .header{
      width:var(--page);
      height:82px;
      margin:0 auto;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
      position:relative;
      z-index:20;
    }

    .brand{
      display:inline-flex;
      align-items:center;
      gap:10px;
      min-width:0;
      font-weight:700;
      letter-spacing:-.035em;
      font-size:18px;
    }
    .brand img{
      display:block;
      width:38px;
      height:38px;
      object-fit:contain;
      filter:drop-shadow(0 12px 24px rgba(0,0,0,.32));
    }

    .language-btn{
      height:40px;
      display:inline-flex;
      align-items:center;
      gap:9px;
      padding:0 13px;
      border:1px solid rgba(255,255,255,.09);
      border-radius:999px;
      background:rgba(7,7,8,.44);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
      color:#d4d4d9;
      font-size:12px;
      font-weight:600;
      cursor:pointer;
      transition:background .18s ease,border-color .18s ease,transform .18s ease;
    }
    .language-btn:hover{
      background:rgba(255,255,255,.07);
      border-color:rgba(255,255,255,.14);
      transform:translateY(-1px);
    }
    .language-flag{
      width:20px;
      height:14px;
      display:block;
      object-fit:cover;
      border-radius:3px;
      box-shadow:0 0 0 1px rgba(255,255,255,.10);
    }

    main{
      position:relative;
      z-index:2;
      flex:1 0 auto;
      display:flex;
      flex-direction:column;
    }

    .hero{
      width:var(--page);
      min-height:0;
      flex:1 0 auto;
      margin:0 auto;
      padding:54px 0;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      text-align:center;
    }

    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:#c9c9cf;
      font-size:12px;
      font-weight:600;
      padding:8px 11px;
      border:1px solid rgba(255,255,255,.08);
      background:rgba(7,7,8,.34);
      border-radius:999px;
      backdrop-filter:blur(16px);
      -webkit-backdrop-filter:blur(16px);
    }

    h1{
      margin:24px 0 0;
      width:max-content;
      max-width:100%;
      font-size:clamp(38px,6.1vw,82px);
      line-height:1;
      letter-spacing:-.06em;
      font-weight:700;
      white-space:normal;
      text-wrap:balance;
      text-shadow:0 10px 42px rgba(0,0,0,.32);
    }

    .lookup-wrap{
      width:min(560px,100%);
      margin-top:31px;
    }
    .search-shell{
      padding:5px;
      border-radius:18px;
      background:rgba(13,13,15,.70);
      border:1px solid rgba(255,255,255,.11);
      box-shadow:0 24px 70px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);
      backdrop-filter:blur(24px) saturate(1.15);
      -webkit-backdrop-filter:blur(24px) saturate(1.15);
    }
    .search-row{
      display:flex;
      align-items:center;
      min-height:52px;
      border-radius:13px;
      background:rgba(4,4,5,.68);
      border:1px solid rgba(255,255,255,.05);
      overflow:hidden;
      transition:border-color .18s ease,box-shadow .18s ease;
    }
    .search-row:focus-within{
      border-color:rgba(255,255,255,.17);
      box-shadow:0 0 0 4px rgba(255,255,255,.03);
    }
    .search-icon{
      width:44px;
      display:grid;
      place-items:center;
      flex:0 0 auto;
      color:#73737b;
    }
    .search-row input{
      flex:1;
      min-width:0;
      height:50px;
      padding:0 8px 0 0;
      border:0;
      outline:0;
      background:transparent;
      color:#fff;
      font-size:15px;
      font-weight:500;
      letter-spacing:-.01em;
    }
    .search-row input::placeholder{color:#66666e}
    .lookup-btn{
      width:43px;
      height:43px;
      flex:0 0 43px;
      margin-right:4px;
      border:1px solid rgba(255,255,255,.10);
      border-radius:11px;
      display:grid;
      place-items:center;
      color:#f2f2f4;
      background:#0b0b0d;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
      cursor:pointer;
      transition:transform .18s ease,background .18s ease,border-color .18s ease,opacity .18s ease;
    }
    .lookup-btn:hover{
      background:#141417;
      border-color:rgba(255,255,255,.16);
      transform:translateY(-1px);
    }
    .lookup-btn:active{transform:scale(.97)}
    .lookup-btn:disabled{opacity:.58;cursor:wait}

    .quick-ips{
      min-height:30px;
      margin-top:8px;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:7px;
      color:#717179;
      font-size:13px;
    }
    .quick-ips button{
      padding:2px 3px;
      border:0;
      background:none;
      color:#a8a8ae;
      cursor:pointer;
    }
    .quick-ips button:hover{color:#fff}
    .search-error{
      min-height:20px;
      margin-top:6px;
      color:#ff9292;
      font-size:13px;
    }
    .search-error.detected{
      color:#8f8f97;
    }

    .results-section{
      width:var(--page);
      margin:0 auto;
      padding:4px 0 80px;
      transition:opacity .3s ease,transform .3s ease;
    }
    .results-section.is-hidden{
      display:none;
    }
    .results-section.loading{
      opacity:1;
    }
    .results-section.loading .results-head h2,
    .results-section.loading .results-head p,
    .results-section.loading .status-pill,
    .results-section.loading .stat strong,
    .results-section.loading .row strong,
    .results-section.loading .signal strong,
    .results-section.loading .risk-line strong{
      opacity:.08;
    }
    .results-section.loading .meter i{
      width:36%!important;
      opacity:.22;
    }
    .results-head{
      display:flex;
      align-items:end;
      justify-content:space-between;
      gap:20px;
      margin-bottom:20px;
    }
    .results-head small{
      display:block;
      margin-bottom:7px;
      color:#77777f;
      text-transform:uppercase;
      letter-spacing:.13em;
      font-size:12px;
      font-weight:700;
    }
    .results-head h2{
      margin:0;
      font-size:32px;
      letter-spacing:-.045em;
      font-weight:650;
    }
    .results-head p{
      margin:7px 0 0;
      color:#95959d;
      font-size:14px;
      line-height:1.45;
    }
    .status-pill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:9px 12px;
      border-radius:999px;
      border:1px solid rgba(115,223,154,.18);
      background:rgba(115,223,154,.07);
      color:#a7edbf;
      font-size:13px;
      font-weight:600;
      white-space:nowrap;
    }
    .live-dot{
      width:7px;
      height:7px;
      border-radius:50%;
      background:var(--green);
      box-shadow:0 0 0 4px rgba(115,223,154,.09);
    }

    .overview{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:12px;
      margin-bottom:12px;
    }
    .stat{
      min-height:112px;
      padding:18px;
      position:relative;
      overflow:hidden;
      border-radius:var(--radius-lg);
      border:1px solid var(--line);
      background:
        radial-gradient(circle at 88% 10%,rgba(255,255,255,.055),transparent 34%),
        linear-gradient(180deg,rgba(21,21,24,.82),rgba(13,13,15,.76));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 12px 34px rgba(0,0,0,.12);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
    }
    .stat:after{
      content:"";
      position:absolute;
      width:74px;
      height:74px;
      right:-28px;
      bottom:-34px;
      border-radius:50%;
      background:rgba(255,255,255,.025);
      pointer-events:none;
    }
    .stat-top{
      display:flex;
      align-items:center;
      gap:9px;
      color:#92929a;
      font-size:13px;
      font-weight:500;
    }
    .stat-top re-icon{
      width:28px;
      height:28px;
      display:grid;
      place-items:center;
      border:1px solid rgba(255,255,255,.07);
      border-radius:9px;
      background:rgba(255,255,255,.035);
      color:#d8d8dc;
    }
    .stat strong{
      display:block;
      margin-top:15px;
      overflow:hidden;
      color:#ececef;
      font-size:17px;
      font-weight:600;
      letter-spacing:-.02em;
      text-overflow:ellipsis;
      white-space:nowrap;
    }

    .grid{
      display:grid;
      grid-template-columns:minmax(0,1fr) minmax(0,1fr);
      gap:12px;
      align-items:start;
      grid-auto-rows:max-content;
    }
    .card{
      overflow:hidden;
      min-height:0;
      height:auto;
      align-self:start;
      border:1px solid var(--line);
      border-radius:var(--radius-xl);
      background:
        radial-gradient(circle at 92% 0%,rgba(255,255,255,.035),transparent 30%),
        linear-gradient(180deg,rgba(18,18,21,.86),rgba(10,10,12,.84));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 18px 44px rgba(0,0,0,.10);
      backdrop-filter:blur(20px);
      -webkit-backdrop-filter:blur(20px);
    }
    .card-head{
      padding:20px 21px 16px;
      display:flex;
      align-items:center;
      gap:12px;
    }
    .card-icon{
      width:38px;
      height:38px;
      flex:0 0 38px;
      border:1px solid rgba(255,255,255,.08);
      border-radius:12px;
      display:grid;
      place-items:center;
      background:rgba(255,255,255,.035);
      color:#d8d8dc;
    }
    .card-head h3{
      margin:0;
      font-size:16px;
      font-weight:600;
      letter-spacing:-.015em;
    }
    .card-head p{
      margin:4px 0 0;
      color:#7f7f87;
      font-size:13px;
      line-height:1.4;
    }
    .rows{padding:0 21px 19px}
    .row{
      min-height:52px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:18px;
      border-top:1px solid rgba(255,255,255,.055);
      font-size:14px;
    }
    .row-label{
      min-width:0;
      display:flex;
      align-items:center;
      gap:9px;
      color:#898991;
    }
    .row-label re-icon{
      width:24px;
      height:24px;
      flex:0 0 24px;
      display:grid;
      place-items:center;
      color:#8f8f98;
    }
    .row strong{
      min-width:0;
      max-width:58%;
      color:#e0e0e4;
      font-size:14px;
      font-weight:500;
      text-align:right;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      overflow-wrap:normal;
    }

    .signals{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:8px;
      padding:0 20px 18px;
    }
    .signal{
      min-height:88px;
      padding:14px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      border:1px solid rgba(255,255,255,.065);
      border-radius:16px;
      background:linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.015));
    }
    .signal > span{
      display:flex;
      align-items:center;
      gap:8px;
      margin-bottom:12px;
      color:#8d8d95;
      font-size:13px;
      line-height:1.2;
    }
    .signal > span > .ri-duotone{
      margin:0;
      flex:0 0 auto;
      display:inline-grid;
      align-self:center;
    }
    .signal strong{
      display:block;
      font-size:13px;
      font-weight:600;
      line-height:1.25;
    }
    .signal.good strong{color:#99e9b5}
    .signal.warn strong{color:#ffd784}
    .signal.bad strong{color:#ff9292}

    .risk{
      margin:0 20px 20px;
      padding-top:16px;
      border-top:1px solid rgba(255,255,255,.055);
    }
    .risk-line{
      display:flex;
      align-items:end;
      justify-content:space-between;
      margin-bottom:10px;
    }
    .risk-line span{color:#77777f;font-size:10px}
    .risk-line strong{font-size:22px;font-weight:650;letter-spacing:-.04em}
    .meter{
      height:6px;
      overflow:hidden;
      border-radius:999px;
      background:#202024;
    }
    .meter i{
      display:block;
      width:18%;
      height:100%;
      border-radius:inherit;
      background:linear-gradient(90deg,#6fda95,#f7d074);
      transition:width .5s cubic-bezier(.2,.8,.2,1);
    }


    .map-card{
      margin-top:12px;
      overflow:hidden;
      border:1px solid var(--line);
      border-radius:var(--radius-xl);
      background:
        radial-gradient(circle at 92% 0%,rgba(255,255,255,.035),transparent 30%),
        linear-gradient(180deg,rgba(18,18,21,.86),rgba(10,10,12,.84));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 18px 44px rgba(0,0,0,.10);
    }
    .map-card-head{
      min-height:66px;
      padding:14px 18px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      border-bottom:1px solid rgba(255,255,255,.055);
    }
    .map-title{
      min-width:0;
      display:flex;
      align-items:center;
      gap:11px;
    }
    .map-title .map-icon{
      width:36px;
      height:36px;
      flex:0 0 36px;
      display:grid;
      place-items:center;
      border:1px solid rgba(255,255,255,.08);
      border-radius:11px;
      background:rgba(255,255,255,.035);
      color:#d7d7dc;
    }
    .map-title h3{
      margin:0;
      font-size:15px;
      font-weight:600;
      letter-spacing:-.015em;
    }
    .map-title p{
      margin:3px 0 0;
      color:#74747c;
      font-size:12px;
    }
    .map-coordinates{
      flex:0 0 auto;
      color:#8d8d95;
      font-size:12px;
      font-variant-numeric:tabular-nums;
    }
    #ipMap{
      width:100%;
      height:340px;
      background:#09090b;
    }

    /* Dark MapLibre polish */
    #ipMap .maplibregl-ctrl-top-left{
      top:10px;
      left:10px;
    }
    #ipMap .maplibregl-ctrl-group{
      overflow:hidden;
      border:1px solid rgba(255,255,255,.10);
      border-radius:12px;
      background:rgba(12,12,14,.90);
      box-shadow:0 12px 30px rgba(0,0,0,.32);
    }
    #ipMap .maplibregl-ctrl-group button{
      width:34px;
      height:34px;
      background-color:transparent;
    }
    #ipMap .maplibregl-ctrl-group button + button{
      border-top:1px solid rgba(255,255,255,.07);
    }
    #ipMap .maplibregl-ctrl-group button:hover{
      background-color:rgba(255,255,255,.06);
    }
    #ipMap .maplibregl-ctrl button .maplibregl-ctrl-icon{
      filter:invert(1) opacity(.78);
    }
    #ipMap .maplibregl-ctrl-attrib{
      margin:0 8px 8px 0;
      padding:4px 7px;
      border-radius:8px;
      background:rgba(5,5,6,.72);
      color:#686870;
      font-size:9px;
      backdrop-filter:blur(8px);
    }
    #ipMap .maplibregl-ctrl-attrib a{
      color:#8d8d95;
    }
    #ipMap .maplibregl-canvas{
      outline:none;
    }

    .ip-map-marker{
      width:24px;
      height:24px;
      position:relative;
      border:3px solid rgba(255,255,255,.92);
      border-radius:50%;
      background:#111114;
      box-shadow:
        0 0 0 8px rgba(255,255,255,.08),
        0 8px 24px rgba(0,0,0,.48);
    }
    .ip-map-marker:after{
      content:"";
      position:absolute;
      inset:5px;
      border-radius:50%;
      background:#fff;
    }

    .time-live{
      display:inline-flex;
      align-items:center;
      justify-content:flex-end;
      gap:7px;
    }
    .time-live .time-dot{
      width:5px;
      height:5px;
      border-radius:50%;
      background:#a7a7ae;
      box-shadow:0 0 0 3px rgba(255,255,255,.04);
    }

    @media(max-width:600px){
      .map-card{border-radius:22px}
      .map-card-head{
        min-height:72px;
        padding:13px 15px;
        align-items:flex-start;
      }
      .map-title h3{font-size:14px}
      .map-title p{font-size:11px}
      .map-coordinates{
        max-width:42%;
        text-align:right;
        font-size:10px;
      }
      #ipMap{height:270px}
    }

    .source{
      display:flex;
      align-items:center;
      justify-content:center;
      gap:7px;
      margin-top:18px;
      color:#65656d;
      font-size:12px;
    }

    footer{
      width:var(--page);
      min-height:88px;
      flex:0 0 88px;
      margin:auto auto 0;
      border-top:1px solid rgba(255,255,255,.055);
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
      color:#64646b;
      font-size:12px;
    }
    footer .brand{font-size:14px;color:#c9c9ce}
    footer .brand img{width:31px;height:31px}

    .skeleton{
      position:relative;
      overflow:hidden;
    }
    .skeleton:after{
      content:"";
      position:absolute;
      inset:0;
      z-index:4;
      pointer-events:none;
      background:
        linear-gradient(
          100deg,
          transparent 0%,
          rgba(255,255,255,.02) 28%,
          rgba(255,255,255,.085) 46%,
          rgba(255,255,255,.025) 64%,
          transparent 100%
        );
      transform:translateX(-115%);
      animation:shimmer 1.15s cubic-bezier(.4,0,.2,1) infinite;
    }
    @keyframes shimmer{to{transform:translateX(115%)}}

    .fade-up{animation:fadeUp .42s cubic-bezier(.2,.8,.2,1) both}
    @keyframes fadeUp{
      from{opacity:0;transform:translateY(10px)}
      to{opacity:1;transform:none}
    }

    /* Language modal / mobile sheet */
    .lang-overlay{
      position:fixed;
      z-index:100;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:22px;
      background:rgba(0,0,0,.56);
      backdrop-filter:blur(10px);
      -webkit-backdrop-filter:blur(10px);
      opacity:0;
      visibility:hidden;
      transition:opacity .22s ease,visibility .22s ease;
    }
    .lang-overlay.open{
      opacity:1;
      visibility:visible;
    }
    .lang-panel{
      width:min(500px,100%);
      max-height:min(680px,calc(100vh - 44px));
      display:flex;
      flex-direction:column;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.11);
      border-radius:26px;
      background:rgba(16,16,18,.95);
      box-shadow:0 30px 100px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.045);
      transform:translateY(8px) scale(.985);
      transition:transform .24s cubic-bezier(.2,.8,.2,1);
    }
    .lang-overlay.open .lang-panel{transform:none}

    .lang-head{
      padding:20px 20px 13px;
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:18px;
    }
    .lang-head h3{
      margin:0;
      font-size:18px;
      font-weight:600;
      letter-spacing:-.025em;
    }
    .lang-head p{
      margin:5px 0 0;
      color:#77777f;
      font-size:12px;
    }
    .close-btn{
      width:34px;
      height:34px;
      flex:0 0 34px;
      display:grid;
      place-items:center;
      border:1px solid rgba(255,255,255,.07);
      border-radius:50%;
      background:rgba(255,255,255,.04);
      color:#b7b7bd;
      cursor:pointer;
    }

    .lang-search-wrap{padding:0 20px 14px}
    .lang-search{
      height:44px;
      display:flex;
      align-items:center;
      gap:10px;
      padding:0 13px;
      border:1px solid rgba(255,255,255,.07);
      border-radius:14px;
      background:#0b0b0d;
      color:#73737b;
    }
    .lang-search input{
      flex:1;
      min-width:0;
      height:42px;
      border:0;
      outline:0;
      background:transparent;
      color:#fff;
      font-size:12px;
    }
    .lang-search input::placeholder{color:#62626a}

    .lang-list{
      overflow:auto;
      padding:0 10px 14px;
      overscroll-behavior:contain;
    }
    .lang-item{
      width:100%;
      min-height:54px;
      display:grid;
      grid-template-columns:32px 1fr auto;
      align-items:center;
      gap:10px;
      padding:7px 10px;
      border:0;
      border-radius:13px;
      background:transparent;
      text-align:left;
      cursor:pointer;
      transition:background .16s ease;
    }
    .lang-item:hover{background:rgba(255,255,255,.045)}
    .lang-item.active{background:rgba(255,255,255,.065)}
    .lang-item .flag{
      width:28px;
      height:20px;
      display:block;
      object-fit:cover;
      border-radius:4px;
      box-shadow:0 0 0 1px rgba(255,255,255,.10);
    }
    .lang-item strong{
      display:block;
      color:#e8e8eb;
      font-size:12px;
      font-weight:500;
    }
    .lang-item small{
      display:block;
      margin-top:2px;
      color:#686870;
      font-size:12px;
    }
    .lang-check{
      width:28px;
      height:28px;
      display:none;
      place-items:center;
      color:#fff;
    }
    .lang-item.active .lang-check{display:grid}
    .lang-empty{
      padding:28px 18px;
      color:#74747c;
      text-align:center;
      font-size:13px;
    }


    /* Semantic Reicon treatment */
    .stat:nth-child(1) .stat-top re-icon{color:#a8c8ff}
    .stat:nth-child(2) .stat-top re-icon{color:#b9b4ff}
    .stat:nth-child(3) .stat-top re-icon{color:#ffd27f}
    .stat:nth-child(4) .stat-top re-icon{color:#b7e7ca}

    .card:nth-child(1) .card-icon{color:#a8c8ff}
    .card:nth-child(2) .card-icon{color:#b9b4ff}
    .card:nth-child(3) .card-icon{color:#b7e7ca}
    .card:nth-child(4) .card-icon{color:#c9c9d2}

    .row-label re-icon{
      opacity:.92;
      transition:color .18s ease,opacity .18s ease,transform .18s ease;
    }
    .row:hover .row-label re-icon{
      color:#eeeeF2;
      opacity:1;
      transform:translateY(-1px);
    }

    .signal span re-icon{
      opacity:.92;
    }
    .signal.good > span > .ri-duotone re-icon,
    .signal.warn > span > .ri-duotone re-icon,
    .signal.bad > span > .ri-duotone re-icon{
      color:#a8a8b0 !important;
    }


    .header re-icon,
    .hero re-icon,
    .results-head re-icon,
    .stat-top re-icon{
      color:#d4d4da;
    }


    /* Real Reicon duotone treatment:
       official Filled layer + official Outline layer, monochrome only. */
    .ri-duotone{
      --ri-icon-size:24px;
      width:var(--ri-icon-size);
      height:var(--ri-icon-size);
      position:relative;
      display:inline-grid;
      place-items:center;
      flex:0 0 auto;
      line-height:0;
      color:currentColor;
      vertical-align:middle;
    }
    .ri-duotone > re-icon{
      grid-area:1 / 1;
      width:var(--ri-icon-size);
      height:var(--ri-icon-size);
      display:block;
      color:currentColor !important;
      pointer-events:none;
    }
    .ri-duotone > .ri-duo-fill{
      opacity:.24;
    }
    .ri-duotone > .ri-duo-outline{
      opacity:1;
    }

    /* Absolutely no category colours on dashboard icons. */
    .stat .stat-top,
    .stat .stat-top .ri-duotone,
    .stat .stat-top .ri-duotone re-icon,
    .card .card-icon,
    .card .card-icon .ri-duotone,
    .card .card-icon .ri-duotone re-icon,
    .row-label,
    .row-label .ri-duotone,
    .row-label .ri-duotone re-icon,
    .signal > span,
    .signal > span > .ri-duotone,
    .signal > span > .ri-duotone re-icon{
      color:#a8a8b0 !important;
    }

    .stat .stat-top .ri-duotone,
    .stat .stat-top .ri-duotone re-icon{
      color:#d7d7dc !important;
    }
    .card .card-icon,
    .card .card-icon .ri-duotone,
    .card .card-icon .ri-duotone re-icon{
      color:#d7d7dc !important;
    }

    /* Keep the top summary icon tiles neutral. */
    .stat-top .ri-duotone{
      width:28px;
      height:28px;
      display:grid;
      place-items:center;
      border:1px solid rgba(255,255,255,.07);
      border-radius:9px;
      background:rgba(255,255,255,.035);
    }

    /* Row icon boxes stay subtle and neutral. */
    .row-label .ri-duotone{
      width:24px;
      height:24px;
      display:grid;
      place-items:center;
      opacity:.94;
      transition:opacity .18s ease,transform .18s ease;
    }
    .row:hover .row-label .ri-duotone{
      opacity:1;
      transform:translateY(-1px);
    }

    /* Privacy status text can still communicate state;
       the icons themselves remain monochrome. */
    .signal.good > span > .ri-duotone re-icon,
    .signal.warn > span > .ri-duotone re-icon,
    .signal.bad > span > .ri-duotone re-icon{
      color:#a8a8b0 !important;
    }

    /* Top-area icons are monochrome as well. */
    .header .ri-duotone,
    .header .ri-duotone re-icon,
    .hero .ri-duotone,
    .hero .ri-duotone re-icon,
    .results-head .ri-duotone,
    .results-head .ri-duotone re-icon{
      color:#d2d2d7 !important;
    }


    /* Empty state = exactly one viewport. Results state can grow normally. */
    .page.has-results{
      min-height:100vh;
      min-height:100svh;
      overflow:visible;
    }
    .page.has-results main{
      flex:0 0 auto;
    }
    .page.has-results .hero{
      min-height:455px;
      flex:0 0 auto;
      padding:68px 0 58px;
    }
    .page.has-results footer{
      flex:0 0 88px;
    }

    @media(max-width:600px){
      .page.has-results .hero{
        min-height:100svh;
        min-height:100dvh;
        padding:24px 0 34px;
      }
      .page.has-results footer{
        flex:0 0 76px;
      }
    }


    html[dir="rtl"] body{
      text-align:right;
    }
    html[dir="rtl"] #ipInput,
    html[dir="rtl"] #reportIp,
    html[dir="rtl"] .map-coordinates,
    html[dir="rtl"] #coordinates,
    html[dir="rtl"] #asn,
    html[dir="rtl"] #range,
    html[dir="rtl"] #hostname,
    html[dir="rtl"] #reverseDns{
      direction:ltr;
      text-align:left;
    }
    html[dir="rtl"] .search-row{
      direction:ltr;
    }
    html[dir="rtl"] .lang-item{
      text-align:right;
    }
    html[dir="rtl"] .row strong{
      text-align:left;
    }

    @media(max-width:900px){
      .hero{padding-top:66px}
      .overview{grid-template-columns:1fr 1fr}
      .grid{
        display:flex;
        flex-direction:column;
        gap:10px;
      }
      .grid .card{
        width:100%;
        min-height:0!important;
        height:auto!important;
        align-self:stretch;
      }
      .grid .card .rows{
        height:auto!important;
        min-height:0!important;
      }
    }

    @media(max-width:600px){
      :root{--page:min(100% - 24px,1160px)}
      .header{height:68px}
      .brand{font-size:16px}
      .brand img{width:33px;height:33px}
      .language-btn{
        width:40px;
        padding:0;
        justify-content:center;
      }
      .language-btn .language-name,
      .language-btn re-icon{display:none}

      .hero{
        min-height:0;
        height:auto;
        flex:1 0 auto;
        padding:24px 0 30px;
        justify-content:center;
      }
      .eyebrow{
        padding:8px 11px;
        font-size:12px;
      }
      h1{
        margin-top:22px;
        max-width:92vw;
        font-size:clamp(36px,11.2vw,54px);
        line-height:1.03;
        white-space:normal;
        text-wrap:balance;
      }
      .lookup-wrap{margin-top:27px}
      .search-shell{border-radius:17px}
      .search-row{min-height:50px}
      .search-row input{
        height:48px;
        font-size:13px;
      }
      .lookup-btn{
        width:41px;
        height:41px;
        flex-basis:41px;
      }
      .quick-ips{font-size:10px}
      .results-section{
        padding-top:18px;
        padding-bottom:52px;
      }
      .results-section.is-hidden{
        display:none;
      }
      .results-head{
        align-items:flex-start;
        gap:14px;
      }
      .results-head h2{font-size:27px}
      .results-head p{font-size:11px}
      .status-pill{
        padding:8px 9px;
        font-size:0;
      }
      .overview{
        grid-template-columns:minmax(0,1fr) minmax(0,1fr);
        gap:8px;
      }
      .stat{
        min-height:108px;
        padding:14px;
        border-radius:18px;
      }
      .stat strong{font-size:13px}
      .grid{gap:9px}
      .card{border-radius:22px}
      .card-head{padding:17px 17px 14px}
      .rows{padding:0 17px 16px}
      .signals{
        grid-template-columns:1fr 1fr;
        padding:0 17px 16px;
      }
      .risk{margin:0 17px 17px}
      .row{font-size:10px}

      .card,
      .rows,
      .signals,
      .risk{
        min-height:0!important;
      }
      footer{
        min-height:76px;
        flex:0 0 76px;
        flex-wrap:wrap;
        padding:16px 0;
      }
      footer p{display:none}

      .lang-overlay{
        align-items:flex-end;
        padding:0;
      }
      .lang-panel{
        width:100%;
        max-height:min(78vh,720px);
        border-radius:26px 26px 0 0;
        border-bottom:0;
        transform:translateY(26px);
        padding-bottom:max(8px,env(safe-area-inset-bottom));
      }
      .lang-overlay.open .lang-panel{transform:translateY(0)}
      .lang-panel:before{
        content:"";
        width:38px;
        height:4px;
        margin:9px auto -3px;
        border-radius:999px;
        background:rgba(255,255,255,.18);
      }
      .lang-head{padding-top:18px}
    }

    @media(max-width:390px){
      .overview{
        grid-template-columns:minmax(0,1fr) minmax(0,1fr);
        gap:8px;
      }
      .stat{
        min-height:106px;
        padding:13px;
      }
      .stat strong{
        margin-top:11px;
        font-size:14px;
      }
      .stat-top{
        gap:7px;
        font-size:11px;
      }
      .stat-top .ri-duotone{
        width:25px;
        height:25px;
      }
      .results-head{display:block}
      .status-pill{margin-top:13px}
    }

    @media(prefers-reduced-motion:reduce){
      *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
    }
  
    .footer-links{
      display:flex;
      align-items:center;
      justify-content:center;
      gap:14px;
      color:#77777f;
      font-size:11px;
      white-space:nowrap;
    }
    .footer-links a{
      transition:color .18s ease;
    }
    .footer-links a:hover{color:#d7d7dc}

    .api-error-card{
      display:none;
      margin:0 0 14px;
      padding:14px 16px;
      border:1px solid rgba(255,116,116,.18);
      border-radius:16px;
      background:rgba(255,116,116,.055);
      color:#ffaaaa;
      font-size:13px;
      line-height:1.55;
    }
    .api-error-card.show{display:block}

    @media(max-width:600px){
      .footer-links{display:none}
    }

    /* Content / SEO pages */
    .content-page{
      width:min(860px,calc(100vw - 40px));
      margin:0 auto;
      padding:54px 0 90px;
    }
    .content-page .content-kicker{
      color:#8f8f97;
      font-size:12px;
      font-weight:600;
      text-transform:uppercase;
      letter-spacing:.12em;
    }
    .content-page h1{
      width:auto;
      max-width:820px;
      margin:13px 0 20px;
      white-space:normal;
      font-size:clamp(38px,6vw,64px);
      line-height:1.03;
    }
    .content-page .lead{
      max-width:760px;
      margin:0 0 34px;
      color:#a4a4ac;
      font-size:17px;
      line-height:1.75;
    }
    .content-panel{
      padding:28px;
      border:1px solid var(--line);
      border-radius:24px;
      background:linear-gradient(180deg,rgba(18,18,21,.86),rgba(10,10,12,.84));
    }
    .content-panel + .content-panel{margin-top:12px}
    .content-panel h2{
      margin:0 0 12px;
      color:#f1f1f4;
      font-size:23px;
      line-height:1.3;
      letter-spacing:-.03em;
    }
    .content-panel h3{
      margin:22px 0 8px;
      color:#e4e4e8;
      font-size:17px;
    }
    .content-panel p,
    .content-panel li{
      color:#aaaab2;
      font-size:14px;
      line-height:1.8;
    }
    .content-panel p:last-child{margin-bottom:0}
    .content-panel a{
      color:#f0f0f2;
      text-decoration:underline;
      text-underline-offset:3px;
    }
    .content-panel ul{padding-left:21px}
    .content-page .back-home{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:28px;
      color:#aaaab2;
      font-size:13px;
    }
    @media(max-width:600px){
      .content-page{
        width:min(100% - 24px,860px);
        padding:34px 0 60px;
      }
      .content-page h1{font-size:36px}
      .content-page .lead{font-size:15px}
      .content-panel{padding:20px;border-radius:20px}
    }

    .quick-ips .your-ip-btn{
      color:#ececf0;
      font-weight:600;
      font-variant-numeric:tabular-nums;
    }
    .quick-ips .your-ip-btn:hover{
      color:#fff;
    }
    .quick-separator{
      color:#4f4f56;
      margin:0 1px;
    }
    @media(max-width:600px){
      .quick-ips{
        flex-wrap:wrap;
        row-gap:4px;
      }
    }

    /* SEO guide hub + long-form content */
    .guide-hub,
    .guide-article{
      width:min(1040px,calc(100vw - 40px));
      margin:0 auto;
      padding:54px 0 92px;
    }
    .guide-hero{
      max-width:860px;
      margin-bottom:34px;
    }
    .guide-kicker{
      color:#8c8c94;
      font-size:12px;
      font-weight:600;
      text-transform:uppercase;
      letter-spacing:.12em;
    }
    .guide-hero h1{
      width:auto;
      max-width:900px;
      margin:12px 0 18px;
      white-space:normal;
      font-size:clamp(40px,6vw,68px);
      line-height:1.04;
      text-wrap:balance;
    }
    .guide-hero .lead{
      max-width:780px;
      margin:0;
      color:#a4a4ac;
      font-size:17px;
      line-height:1.75;
    }
    .guide-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:12px;
    }
    .guide-card{
      min-height:214px;
      padding:24px;
      display:flex;
      flex-direction:column;
      border:1px solid var(--line);
      border-radius:22px;
      background:
        radial-gradient(circle at 94% 0%,rgba(255,255,255,.04),transparent 34%),
        linear-gradient(180deg,rgba(19,19,22,.88),rgba(10,10,12,.84));
      transition:transform .18s ease,border-color .18s ease,background .18s ease;
    }
    .guide-card:hover{
      transform:translateY(-2px);
      border-color:rgba(255,255,255,.14);
      background:
        radial-gradient(circle at 94% 0%,rgba(255,255,255,.055),transparent 34%),
        linear-gradient(180deg,rgba(21,21,24,.92),rgba(11,11,13,.88));
    }
    .guide-card .category{
      margin-bottom:15px;
      color:#85858d;
      font-size:11px;
      font-weight:600;
      text-transform:uppercase;
      letter-spacing:.1em;
    }
    .guide-card h2{
      margin:0;
      color:#f0f0f3;
      font-size:21px;
      line-height:1.35;
      letter-spacing:-.03em;
    }
    .guide-card p{
      margin:11px 0 20px;
      color:#909098;
      font-size:13px;
      line-height:1.7;
    }
    .guide-card .guide-link{
      margin-top:auto;
      color:#d8d8dd;
      font-size:12px;
      font-weight:600;
    }

    .guide-layout{
      display:grid;
      grid-template-columns:minmax(0,1fr) 250px;
      gap:36px;
      align-items:start;
    }
    .guide-main{
      min-width:0;
    }
    .article-meta{
      display:flex;
      flex-wrap:wrap;
      gap:8px 16px;
      margin:0 0 24px;
      color:#76767e;
      font-size:11px;
    }
    .quick-answer{
      margin:0 0 14px;
      padding:22px 24px;
      border:1px solid rgba(255,255,255,.10);
      border-radius:22px;
      background:linear-gradient(180deg,rgba(25,25,28,.84),rgba(14,14,16,.78));
    }
    .quick-answer strong{
      display:block;
      margin-bottom:8px;
      color:#ededf0;
      font-size:12px;
      text-transform:uppercase;
      letter-spacing:.08em;
    }
    .quick-answer p{
      margin:0;
      color:#c0c0c6;
      font-size:15px;
      line-height:1.72;
    }
    .article-section{
      padding:27px 0;
      border-bottom:1px solid rgba(255,255,255,.065);
    }
    .article-section h2{
      margin:0 0 12px;
      color:#f0f0f2;
      font-size:25px;
      line-height:1.32;
      letter-spacing:-.035em;
      scroll-margin-top:24px;
    }
    .article-section p,
    .article-section li{
      color:#aaaab2;
      font-size:15px;
      line-height:1.82;
    }
    .article-section p{margin:0 0 15px}
    .article-section p:last-child{margin-bottom:0}
    .article-section ul,
    .article-section ol{padding-left:22px}
    .article-section li + li{margin-top:7px}
    .article-section a{
      color:#f0f0f2;
      text-decoration:underline;
      text-decoration-color:rgba(255,255,255,.28);
      text-underline-offset:3px;
    }
    .article-section code{
      padding:2px 6px;
      border:1px solid rgba(255,255,255,.07);
      border-radius:6px;
      background:#0b0b0d;
      color:#dedee2;
      font-size:.9em;
    }
    .article-section table{
      width:100%;
      border-collapse:collapse;
      margin:18px 0;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.08);
      border-radius:14px;
    }
    .article-section th,
    .article-section td{
      padding:12px 13px;
      border-bottom:1px solid rgba(255,255,255,.07);
      text-align:left;
      vertical-align:top;
      color:#aaaab2;
      font-size:13px;
      line-height:1.55;
    }
    .article-section th{
      color:#e8e8ec;
      background:rgba(255,255,255,.035);
      font-weight:600;
    }
    .article-section tr:last-child td{border-bottom:0}

    .guide-sidebar{
      position:sticky;
      top:20px;
      padding:17px;
      border:1px solid var(--line);
      border-radius:18px;
      background:rgba(12,12,14,.80);
    }
    .guide-sidebar strong{
      display:block;
      margin-bottom:11px;
      color:#ddddE1;
      font-size:12px;
    }
    .guide-sidebar a{
      display:block;
      padding:7px 0;
      color:#85858d;
      font-size:11px;
      line-height:1.5;
    }
    .guide-sidebar a:hover{color:#e3e3e7}

    .tool-cta{
      margin:22px 0 0;
      padding:24px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
      border:1px solid rgba(255,255,255,.10);
      border-radius:22px;
      background:
        radial-gradient(circle at 100% 0%,rgba(255,255,255,.06),transparent 40%),
        #101012;
    }
    .tool-cta h2{
      margin:0 0 5px;
      font-size:19px;
      color:#f1f1f4;
    }
    .tool-cta p{
      margin:0;
      color:#85858d;
      font-size:12px;
    }
    .tool-cta a{
      flex:0 0 auto;
      padding:11px 15px;
      border:1px solid rgba(255,255,255,.10);
      border-radius:12px;
      background:#08080a;
      color:#eeeef1;
      font-size:12px;
      font-weight:600;
    }

    .related-guides{
      margin-top:34px;
    }
    .related-guides h2{
      margin:0 0 14px;
      font-size:21px;
    }
    .related-list{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:10px;
    }
    .related-list a{
      padding:17px;
      border:1px solid var(--line);
      border-radius:16px;
      background:rgba(255,255,255,.02);
      color:#d0d0d5;
      font-size:12px;
      line-height:1.5;
    }

    .guide-footer-nav{
      display:flex;
      align-items:center;
      gap:15px;
    }

    @media(max-width:820px){
      .guide-layout{grid-template-columns:1fr}
      .guide-sidebar{position:static;order:-1}
      .guide-sidebar nav{
        display:flex;
        flex-wrap:wrap;
        gap:4px 14px;
      }
      .guide-sidebar a{display:inline-block}
      .related-list{grid-template-columns:1fr}
    }
    @media(max-width:600px){
      .guide-hub,
      .guide-article{
        width:min(100% - 24px,1040px);
        padding:34px 0 64px;
      }
      .guide-hero h1{font-size:38px}
      .guide-hero .lead{font-size:15px}
      .guide-grid{grid-template-columns:1fr}
      .guide-card{min-height:0;padding:20px}
      .article-section h2{font-size:22px}
      .article-section p,
      .article-section li{font-size:14px}
      .tool-cta{align-items:flex-start;flex-direction:column}
    }

    .report-ip-line{
      display:flex;
      align-items:center;
      gap:10px;
      min-width:0;
    }
    .report-ip-line h2{
      min-width:0;
    }
    .report-country-flag{
      width:28px;
      height:20px;
      flex:0 0 28px;
      display:block;
      object-fit:cover;
      border-radius:4px;
      box-shadow:0 0 0 1px rgba(255,255,255,.10);
    }

    @media(max-width:600px){
      .report-ip-line{gap:8px}
      .report-country-flag{
        width:24px;
        height:17px;
        flex-basis:24px;
        border-radius:3px;
      }
    }


    .report-heading{
      min-width:0;
    }
    .report-ip-line{
      display:flex;
      align-items:center;
      justify-content:flex-start;
      gap:10px;
      min-width:0;
      width:max-content;
      max-width:100%;
    }
    .report-ip-line h2{
      margin:0;
      min-width:0;
      max-width:100%;
      overflow-wrap:anywhere;
      font-variant-numeric:tabular-nums;
    }
    .report-country-flag{
      width:28px;
      height:20px;
      flex:0 0 28px;
      display:block;
      object-fit:cover;
      border-radius:4px;
      box-shadow:0 0 0 1px rgba(255,255,255,.12);
    }
    .report-country-flag[hidden]{
      display:none!important;
    }
    @media(max-width:600px){
      .report-ip-line{
        gap:8px;
      }
      .report-country-flag{
        width:24px;
        height:17px;
        flex-basis:24px;
        border-radius:3px;
      }
    }


    .report-self-label{
      flex:0 0 auto;
      display:inline-flex;
      align-items:center;
      min-height:24px;
      padding:4px 8px;
      border:1px solid rgba(255,255,255,.09);
      border-radius:999px;
      background:rgba(255,255,255,.035);
      color:#96969e;
      font-size:10px;
      font-weight:600;
      line-height:1;
      white-space:nowrap;
    }
    .report-self-label[hidden]{
      display:none!important;
    }

    @media(max-width:600px){
      .report-self-label{
        min-height:22px;
        padding:4px 7px;
        font-size:9px;
      }
    }