:root{

      --text:#e9e9e9;
      --muted:#a6a6a6; 
    }
    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      background:#000;
      color:var(--text);
      font-family: Papyrus, UnifrakturMaguntia, UnifrakturCook, Fraktur, Textura, Copperplate, fantasy, Garamond, serif;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:32px;
    }

    .container{
      width:100%;
      max-width:420px;
      text-align:center;
    }

    .pic{
      width:110px;
      height:110px;
      border-radius:0px;
      margin:0 auto 18px;
      display:flex;
      align-items:center;
      clip-path: circle();
     /*color:#000;
      box-shadow:0 6px 18px rgba(0,0,0,0.6);*/
    }

    h1{
      margin:6px 0 4px;
      font-size:20px;
    }
    p.handle{
      margin:0 0 18px;
      color:var(--muted);
      font-size:13px;
    }
    .info{
      color:var(--muted);
      font-size:16px;
      margin-left:auto;
    }

    .links{
      display:flex;
      flex-direction:column;
      gap:12px;
      margin-top:6px;
    }

    .link{
      text-decoration:none;
      background:linear-gradient(180deg, rgba(255,0,0,0.4), rgba(255,0,0,0.0));
      padding:14px 16px;
      border-radius:12px;
      color:var(--text);
      font-weight:600;
      box-shadow:0 4px 12px rgba(0,0,0,0.6);
      display:flex;
      align-items:center;
      justify-content:space-between;
      transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
      
    }

    .link:hover{
      transform:translateY(-4px);
      box-shadow:0 10px 30px rgba(0,0,0,0.7);
    }

    .link .label{ text-align:left; margin-left:12px; }
    span.symb{
      flex-shrink:0;
      margin-left:12px;
      opacity:0.9;
      color:var(--muted);
      font-size:14px;
    }
    .icon{
     width:10%;
     height:auto;
     object-fit:contain;
     flex-shrink:0;
     margin-left:12px;
     
    }

  

    footer{
      margin-top:20px;
      color:var(--muted);
      font-size:12px;
    }
.invert {
      filter: invert(1);
}

    
.popuptext {
  transition:opacity 3000ms;
  opacity:0;

  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
}

.popup .show {
  transition: opacity 250ms;
  opacity:1;
}

.popup {
  pointer-events: none;
  position:relative;
  display: inline-block;
}