:root{
  --game-bg:#07070b;
  --game-panel:#111018;
  --game-panel-2:#171420;
  --game-border:rgba(255,255,255,.09);
  --game-text:#fff;
  --game-muted:#aaa2b4;
  --game-purple:#9b5cff;
  --game-pink:#ff4fa3;
  --game-green:#6dffb1;
}

*{
  box-sizing:border-box;
}

body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(
      circle at 15% -10%,
      rgba(155,92,255,.16),
      transparent 36%
    ),
    radial-gradient(
      circle at 95% 10%,
      rgba(255,79,163,.11),
      transparent 30%
    ),
    var(--game-bg);
  color:var(--game-text);
  font-family:
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
}

a{
  color:inherit;
  text-decoration:none;
}

.gaming-shell{
  width:min(1400px,94vw);
  margin:0 auto;
  padding:30px 0 80px;
}

.gaming-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:28px;
}

.gaming-brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:950;
  font-size:1.05rem;
}

.gaming-brand-badge{
  width:40px;
  height:40px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:
    linear-gradient(
      135deg,
      var(--game-pink),
      var(--game-purple)
    );
  box-shadow:
    0 8px 28px
    rgba(155,92,255,.24);
}

.gaming-nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.gaming-nav a,
.game-btn{
  border:1px solid var(--game-border);
  background:rgba(255,255,255,.045);
  color:#fff;
  padding:10px 15px;
  border-radius:12px;
  font-weight:850;
  cursor:pointer;
}

.game-btn.primary{
  border:0;
  background:
    linear-gradient(
      135deg,
      var(--game-pink),
      var(--game-purple)
    );
}

.hero{
  display:grid;
  grid-template-columns:
    minmax(0,1.35fr)
    minmax(300px,.65fr);
  gap:18px;
  margin-bottom:30px;
}

.hero-main,
.hero-side,
.game-panel{
  border:1px solid var(--game-border);
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.045),
      rgba(255,255,255,.018)
    );
  border-radius:24px;
}

.hero-main{
  min-height:360px;
  padding:38px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  overflow:hidden;
}

.hero-main::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(
      circle at 78% 22%,
      rgba(255,79,163,.23),
      transparent 30%
    ),
    radial-gradient(
      circle at 62% 70%,
      rgba(155,92,255,.2),
      transparent 38%
    );
  pointer-events:none;
}

.hero-copy{
  position:relative;
  z-index:1;
  max-width:700px;
}

.hero-kicker{
  color:#d5baff;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:.72rem;
}

.hero h1{
  margin:10px 0 12px;
  font-size:
    clamp(2.3rem,6vw,5rem);
  line-height:.96;
  letter-spacing:-.055em;
}

.hero p{
  max-width:650px;
  margin:0 0 20px;
  color:#c8c1ce;
  font-size:1rem;
  line-height:1.6;
}

.hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.hero-side{
  padding:22px;
}

.live-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#ff405f;
  box-shadow:
    0 0 15px
    rgba(255,64,95,.8);
  display:inline-block;
  margin-right:7px;
}

.section-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:12px;
  margin:28px 0 14px;
}

.section-head h2{
  margin:0;
  font-size:1.25rem;
}

.section-head p{
  margin:4px 0 0;
  color:var(--game-muted);
  font-size:.88rem;
}

.category-grid{
  display:grid;
  grid-template-columns:
    repeat(auto-fit,minmax(150px,1fr));
  gap:10px;
}

.category-card{
  padding:18px;
  min-height:105px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border-radius:18px;
  border:1px solid var(--game-border);
  background:var(--game-panel);
}

.category-card strong{
  font-size:.94rem;
}

.category-card span{
  font-size:1.45rem;
}

.gamer-grid{
  display:grid;
  grid-template-columns:
    repeat(auto-fit,minmax(250px,1fr));
  gap:14px;
}

.gamer-card{
  overflow:hidden;
  border:1px solid var(--game-border);
  background:var(--game-panel);
  border-radius:20px;
}

.gamer-cover{
  height:130px;
  background:
    linear-gradient(
      135deg,
      rgba(255,79,163,.22),
      rgba(155,92,255,.18)
    );
  position:relative;
}

.gamer-avatar{
  width:70px;
  height:70px;
  border-radius:50%;
  object-fit:cover;
  border:4px solid var(--game-panel);
  background:#24202c;
  position:absolute;
  left:16px;
  bottom:-32px;
}

.gamer-body{
  padding:42px 16px 18px;
}

.gamer-name{
  font-weight:950;
  font-size:1rem;
}

.gamer-handle{
  color:var(--game-muted);
  font-size:.8rem;
  margin-top:2px;
}

.gamer-now{
  margin-top:12px;
  padding:9px 10px;
  background:rgba(255,255,255,.045);
  border-radius:11px;
  color:#ded6e5;
  font-size:.82rem;
}

.tag-row{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-top:11px;
}

.game-tag{
  padding:5px 8px;
  border-radius:999px;
  background:
    rgba(155,92,255,.12);
  border:
    1px solid rgba(155,92,255,.2);
  color:#dcc8ff;
  font-size:.7rem;
  font-weight:800;
}

.form-card{
  width:min(850px,100%);
  margin:20px auto;
  padding:24px;
  border-radius:24px;
  border:1px solid var(--game-border);
  background:var(--game-panel);
}

.form-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:14px;
}

.field{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.field.full{
  grid-column:1 / -1;
}

.field label{
  font-size:.82rem;
  font-weight:900;
  color:#ddd5e5;
}

.field input,
.field textarea,
.field select{
  width:100%;
  padding:13px 14px;
  border-radius:12px;
  border:1px solid var(--game-border);
  background:#0b0a10;
  color:#fff;
  font:inherit;
  outline:none;
}

.field textarea{
  min-height:110px;
  resize:vertical;
}

.field input:focus,
.field textarea:focus,
.field select:focus{
  border-color:
    rgba(155,92,255,.7);
  box-shadow:
    0 0 0 3px
    rgba(155,92,255,.1);
}

.checkbox-grid{
  display:grid;
  grid-template-columns:
    repeat(auto-fit,minmax(150px,1fr));
  gap:8px;
}

.check-card{
  display:flex;
  gap:8px;
  align-items:center;
  padding:10px 12px;
  border-radius:11px;
  border:1px solid var(--game-border);
  background:#0c0b11;
  font-size:.82rem;
}

.status-card{
  padding:14px;
  border-radius:14px;
  border:1px solid var(--game-border);
  background:
    rgba(255,255,255,.035);
}

.profile-hero{
  display:flex;
  align-items:center;
  gap:18px;
  padding:24px;
  border-radius:24px;
  border:1px solid var(--game-border);
  background:var(--game-panel);
}

.profile-avatar{
  width:110px;
  height:110px;
  border-radius:26px;
  object-fit:cover;
  background:#24202c;
}

.profile-meta h1{
  margin:0;
  font-size:1.7rem;
}

.profile-meta p{
  color:var(--game-muted);
  margin:6px 0 0;
}

.empty-state{
  padding:35px 20px;
  text-align:center;
  color:var(--game-muted);
  border:1px dashed var(--game-border);
  border-radius:18px;
}

@media(max-width:760px){
  .gaming-shell{
    width:min(94vw,700px);
    padding-top:16px;
  }

  .gaming-topbar{
    align-items:flex-start;
    flex-direction:column;
  }

  .hero{
    grid-template-columns:1fr;
  }

  .hero-main{
    min-height:330px;
    padding:24px;
  }

  .form-grid{
    grid-template-columns:1fr;
  }

  .field.full{
    grid-column:auto;
  }

  .profile-hero{
    align-items:flex-start;
  }

  .profile-avatar{
    width:82px;
    height:82px;
    border-radius:20px;
  }
}



/* =========================================================
   FREAKLIKEDAT GAMING PASSPORT — PREMIUM BUILDER
   ========================================================= */

.gaming-passport-page{
  background:
    radial-gradient(
      circle at 8% 5%,
      rgba(161,72,255,.19),
      transparent 30%
    ),
    radial-gradient(
      circle at 94% 4%,
      rgba(255,55,153,.12),
      transparent 28%
    ),
    linear-gradient(
      180deg,
      #08060d 0%,
      #050407 100%
    );
}

.premium-gaming-shell{
  width:min(1480px,94vw);
}

.premium-gaming-topbar{
  padding:6px 0 2px;
}

.gaming-brand-sub{
  display:block;
  margin-top:2px;
  color:#b985ff;
  font-size:.56rem;
  letter-spacing:.18em;
  font-weight:950;
}


/* HERO */

.passport-builder-hero{
  position:relative;
  overflow:hidden;

  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:25px;

  min-height:245px;

  margin-top:22px;
  padding:42px;

  border:
    1px solid rgba(255,255,255,.08);

  border-radius:28px;

  background:
    radial-gradient(
      circle at 88% 20%,
      rgba(255,70,164,.22),
      transparent 30%
    ),
    radial-gradient(
      circle at 70% 85%,
      rgba(122,70,255,.24),
      transparent 38%
    ),
    linear-gradient(
      135deg,
      rgba(20,14,28,.98),
      rgba(10,8,15,.98)
    );

  box-shadow:
    0 30px 80px rgba(0,0,0,.3);
}

.passport-builder-hero::after{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  right:-180px;
  top:-200px;

  border-radius:50%;

  border:
    1px solid rgba(255,255,255,.06);

  box-shadow:
    0 0 0 55px rgba(255,255,255,.012),
    0 0 0 110px rgba(255,255,255,.008);
}

.passport-builder-copy{
  position:relative;
  z-index:2;
  max-width:750px;
}

.gaming-eyebrow{
  color:#cd9cff;
  font-size:.72rem;
  font-weight:950;
  letter-spacing:.14em;
}

.passport-builder-copy h1{
  margin:9px 0 12px;

  font-size:
    clamp(2.2rem,5vw,4.7rem);

  line-height:.95;
  letter-spacing:-.055em;
}

.passport-builder-copy p{
  max-width:640px;
  margin:0;

  color:#bcb4c5;

  font-size:
    clamp(.95rem,1.5vw,1.08rem);

  line-height:1.55;
}

.passport-live-badge{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  gap:11px;

  min-width:190px;

  padding:13px 15px;

  border:
    1px solid rgba(255,255,255,.1);

  border-radius:16px;

  background:
    rgba(7,6,11,.6);

  backdrop-filter:blur(14px);
}

.passport-live-badge small{
  display:block;

  margin-bottom:2px;

  color:#8d8595;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.1em;
}

.passport-live-badge strong{
  font-size:.88rem;
}

.passport-live-dot{
  width:10px;
  height:10px;
  flex:0 0 auto;

  border-radius:50%;
}

.passport-live-dot.pending{
  background:#ffb64e;

  box-shadow:
    0 0 16px rgba(255,182,78,.55);
}

.passport-live-dot.approved{
  background:#59ff9d;

  box-shadow:
    0 0 16px rgba(89,255,157,.65);
}


/* LAYOUT */

.passport-builder-layout{
  display:grid;

  grid-template-columns:
    minmax(300px,.72fr)
    minmax(0,1.35fr);

  gap:24px;

  margin-top:24px;
}

.passport-preview-column{
  min-width:0;
}

.passport-sticky{
  position:sticky;
  top:20px;
}

.preview-label{
  margin:
    0 0 9px 5px;

  color:#6f6877;

  font-size:.63rem;
  font-weight:950;
  letter-spacing:.15em;
}


/* PASSPORT CARD */

.gaming-passport-card{
  position:relative;
  overflow:hidden;

  min-height:470px;

  padding:25px;

  border-radius:28px;

  border:
    1px solid rgba(214,171,255,.18);

  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(238,74,255,.23),
      transparent 32%
    ),
    radial-gradient(
      circle at 15% 90%,
      rgba(91,61,255,.22),
      transparent 38%
    ),
    linear-gradient(
      150deg,
      #181020,
      #0b0910 60%,
      #08070c
    );

  box-shadow:
    0 30px 80px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.passport-card-glow{
  position:absolute;
  width:220px;
  height:220px;
  right:-90px;
  bottom:-70px;

  border-radius:50%;

  background:
    rgba(180,65,255,.14);

  filter:blur(25px);
}

.passport-card-top{
  position:relative;
  z-index:2;

  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}

.passport-mini-brand{
  color:
    rgba(255,255,255,.42);

  font-size:.58rem;
  font-weight:950;
  letter-spacing:.18em;
}

.passport-card-type{
  margin-top:3px;

  color:#fff;

  font-size:.88rem;
  font-weight:950;
  letter-spacing:.07em;
}

.passport-controller{
  width:42px;
  height:42px;

  display:grid;
  place-items:center;

  border-radius:14px;

  background:
    linear-gradient(
      135deg,
      #ff4fa3,
      #955cff
    );

  box-shadow:
    0 8px 25px rgba(161,72,255,.28);
}

.passport-identity{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  gap:17px;

  margin-top:45px;
}

.passport-avatar-wrap{
  position:relative;

  width:92px;
  height:92px;

  flex:0 0 auto;
}

.passport-avatar{
  width:92px;
  height:92px;

  display:block;

  border-radius:26px;

  object-fit:cover;

  background:#201a27;

  border:
    1px solid rgba(255,255,255,.12);
}

.passport-avatar-ring{
  position:absolute;
  inset:-4px;

  pointer-events:none;

  border-radius:30px;

  border:
    1px solid rgba(203,118,255,.5);
}

.passport-person{
  min-width:0;
}

.passport-person h2{
  margin:0;

  overflow:hidden;
  text-overflow:ellipsis;

  font-size:1.35rem;
  letter-spacing:-.025em;
}

.passport-handle{
  margin-top:3px;

  color:#ad9bb7;
  font-size:.83rem;
}

.passport-role{
  display:inline-flex;

  margin-top:9px;
  padding:6px 9px;

  border:
    1px solid rgba(190,114,255,.26);

  border-radius:999px;

  background:
    rgba(160,77,255,.11);

  color:#d7b5ff;

  font-size:.68rem;
  font-weight:900;
}

.passport-now-playing{
  position:relative;
  z-index:2;

  margin-top:36px;
  padding:15px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:16px;

  background:
    rgba(255,255,255,.035);
}

.passport-section-label{
  margin-bottom:7px;

  color:#766d7f;

  font-size:.59rem;
  font-weight:950;
  letter-spacing:.13em;
}

.passport-preview-tags{
  position:relative;
  z-index:2;

  display:flex;
  flex-wrap:wrap;
  gap:6px;

  margin-top:5px;
}

.passport-preview-tags > span:not(.passport-preview-empty){
  padding:6px 8px;

  border-radius:999px;

  border:
    1px solid rgba(183,103,255,.23);

  background:
    rgba(166,78,255,.1);

  color:#dcc1ff;

  font-size:.66rem;
  font-weight:850;
}

.passport-preview-empty{
  color:#77707c;
  font-size:.78rem;
}

.passport-card-bottom{
  position:absolute;
  z-index:2;

  left:25px;
  right:25px;
  bottom:23px;

  display:flex;
  align-items:flex-end;
  justify-content:space-between;

  padding-top:15px;

  border-top:
    1px solid rgba(255,255,255,.075);
}

.passport-card-bottom small{
  display:block;

  color:#6f6877;
  font-size:.57rem;
  font-weight:950;
  letter-spacing:.13em;
}

.passport-card-bottom strong{
  display:block;

  margin-top:3px;

  font-size:.78rem;
}

.passport-id-mark{
  color:
    rgba(255,255,255,.15);

  font-size:1.5rem;
  font-weight:950;
  letter-spacing:-.08em;
}


/* LIVE ACCESS */

.gaming-live-access-card{
  display:flex;
  gap:13px;
  align-items:flex-start;

  margin-top:12px;
  padding:16px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:18px;

  background:
    rgba(255,255,255,.025);
}

.live-access-icon{
  width:33px;
  height:33px;

  flex:0 0 auto;

  display:grid;
  place-items:center;

  border-radius:50%;

  background:
    rgba(255,183,76,.11);

  color:#ffbc5d;
}

.live-access-icon.approved{
  background:
    rgba(89,255,157,.11);

  color:#59ff9d;
}

.gaming-live-access-card small{
  display:block;

  color:#79717f;

  font-size:.59rem;
  font-weight:950;
  letter-spacing:.12em;
}

.gaming-live-access-card strong{
  display:block;

  margin-top:2px;
}

.gaming-live-access-card p{
  margin:4px 0 0;

  color:#89818e;
  font-size:.73rem;
  line-height:1.4;
}

.approved-text{
  color:#64ffa6;
}


/* FORM */

.premium-passport-form{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.passport-form-section{
  padding:25px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:24px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.037),
      rgba(255,255,255,.018)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.02);
}

.passport-section-head{
  display:flex;
  align-items:flex-start;
  gap:13px;

  margin-bottom:22px;
}

.passport-section-number{
  width:36px;
  height:36px;

  flex:0 0 auto;

  display:grid;
  place-items:center;

  border-radius:11px;

  background:
    linear-gradient(
      135deg,
      rgba(255,79,163,.16),
      rgba(155,92,255,.18)
    );

  color:#ceabff;

  font-size:.68rem;
  font-weight:950;
}

.passport-section-head h2{
  margin:0;

  font-size:1.08rem;
  letter-spacing:-.015em;
}

.passport-section-head p{
  margin:4px 0 0;

  color:#8e8695;
  font-size:.8rem;
}

.premium-form-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:13px;
}

.premium-field{
  display:flex;
  flex-direction:column;
  gap:7px;

  margin-top:14px;
}

.premium-field label{
  color:#d9d1df;
  font-size:.78rem;
  font-weight:900;
}

.premium-field input,
.premium-field textarea{
  width:100%;

  padding:13px 14px;

  border:
    1px solid rgba(255,255,255,.085);

  border-radius:13px;

  outline:none;

  background:
    rgba(3,3,7,.62);

  color:#fff;

  font:inherit;

  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    background .16s ease;
}

.premium-field input{
  min-height:48px;
}

.premium-field textarea{
  min-height:120px;
  resize:vertical;
}

.premium-field input:focus,
.premium-field textarea:focus{
  border-color:
    rgba(181,103,255,.58);

  background:
    rgba(6,5,10,.9);

  box-shadow:
    0 0 0 3px rgba(161,76,255,.09);
}

.premium-field small{
  color:#716a77;
  font-size:.68rem;
}

.premium-input-shell{
  display:flex;
  align-items:center;

  min-height:48px;

  padding-left:13px;

  border:
    1px solid rgba(255,255,255,.085);

  border-radius:13px;

  background:
    rgba(3,3,7,.62);

  transition:
    border-color .16s ease,
    box-shadow .16s ease;
}

.premium-input-shell:focus-within{
  border-color:
    rgba(181,103,255,.58);

  box-shadow:
    0 0 0 3px rgba(161,76,255,.09);
}

.premium-input-shell > span{
  color:#8c8194;
  font-weight:900;
}

.premium-input-shell input{
  border:0;
  background:transparent;
  box-shadow:none;
}

.premium-input-shell input:focus{
  border:0;
  box-shadow:none;
  background:transparent;
}

.game-input-shell > span{
  font-size:.9rem;
}

.field-meta{
  display:flex;
  justify-content:space-between;

  color:#6f6875;
  font-size:.66rem;
}


/* AVATAR */

.gaming-avatar-picker{
  display:flex;
  align-items:center;
  gap:14px;

  margin-top:16px;
  padding:15px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:17px;

  background:
    rgba(255,255,255,.025);
}

.gaming-avatar-preview img{
  width:70px;
  height:70px;

  display:block;

  object-fit:cover;

  border-radius:19px;

  background:#1b1720;

  border:
    1px solid rgba(255,255,255,.1);
}

.gaming-avatar-copy{
  min-width:0;
  flex:1;
}

.gaming-avatar-copy > strong{
  font-size:.85rem;
}

.gaming-avatar-copy p{
  margin:3px 0 9px;

  color:#817a87;
  font-size:.71rem;
}

.gaming-avatar-actions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.passport-secondary-btn,
.passport-text-btn{
  border:0;
  cursor:pointer;

  font:inherit;
  font-size:.7rem;
  font-weight:900;
}

.passport-secondary-btn{
  padding:8px 11px;

  border:
    1px solid rgba(177,99,255,.25);

  border-radius:9px;

  background:
    rgba(155,92,255,.1);

  color:#d2adff;
}

.passport-text-btn{
  padding:8px 5px;

  background:transparent;

  color:#8e8497;
}


/* INTENT */

.gaming-intent-picker{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:7px;
}

.gaming-intent{
  min-height:65px;

  display:flex;
  align-items:center;
  gap:9px;

  padding:10px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:12px;

  background:
    rgba(4,4,8,.55);

  color:#b9b0bf;

  cursor:pointer;

  text-align:left;

  transition:.16s ease;
}

.gaming-intent > span{
  font-size:1rem;
}

.gaming-intent strong{
  font-size:.72rem;
}

.gaming-intent:hover{
  border-color:
    rgba(172,101,255,.25);

  background:
    rgba(155,92,255,.05);
}

.gaming-intent.selected{
  border-color:
    rgba(201,105,255,.62);

  background:
    linear-gradient(
      135deg,
      rgba(255,79,163,.12),
      rgba(137,79,255,.15)
    );

  color:#fff;

  box-shadow:
    0 0 0 2px rgba(162,79,255,.07);
}


/* CATEGORY CARDS */

.premium-category-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:9px;
}

.gaming-category-option{
  position:relative;

  display:grid;

  grid-template-columns:
    36px minmax(0,1fr) 22px;

  align-items:center;
  gap:10px;

  min-height:77px;

  padding:12px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:15px;

  background:
    rgba(4,4,8,.53);

  cursor:pointer;

  transition:
    transform .16s ease,
    border-color .16s ease,
    background .16s ease,
    box-shadow .16s ease;
}

.gaming-category-option:hover{
  transform:
    translateY(-1px);

  border-color:
    rgba(173,104,255,.24);
}

.gaming-category-option input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.category-icon{
  width:36px;
  height:36px;

  display:grid;
  place-items:center;

  border-radius:11px;

  background:
    rgba(255,255,255,.04);

  font-size:1rem;
}

.gaming-category-option strong{
  display:block;

  font-size:.76rem;
}

.gaming-category-option small{
  display:block;

  margin-top:2px;

  color:#706976;

  font-size:.62rem;
  line-height:1.25;
}

.gaming-category-option i{
  width:20px;
  height:20px;

  display:grid;
  place-items:center;

  border-radius:50%;

  border:
    1px solid rgba(255,255,255,.12);

  color:transparent;

  font-size:.65rem;
  font-style:normal;
}

.gaming-category-option:has(input:checked){
  border-color:
    rgba(204,102,255,.62);

  background:
    linear-gradient(
      135deg,
      rgba(255,79,163,.11),
      rgba(140,77,255,.13)
    );

  box-shadow:
    0 8px 28px rgba(120,48,190,.09);
}

.gaming-category-option:has(input:checked)
.category-icon{
  background:
    linear-gradient(
      135deg,
      rgba(255,79,163,.22),
      rgba(137,74,255,.25)
    );
}

.gaming-category-option:has(input:checked)
i{
  color:#fff;

  border-color:transparent;

  background:
    linear-gradient(
      135deg,
      #ff4fa3,
      #945cff
    );
}


/* SAVE */

.passport-save-bar{
  position:sticky;
  bottom:12px;
  z-index:20;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;

  margin-top:2px;
  padding:14px 15px;

  border:
    1px solid rgba(255,255,255,.1);

  border-radius:18px;

  background:
    rgba(10,8,14,.87);

  backdrop-filter:
    blur(22px);

  box-shadow:
    0 18px 55px rgba(0,0,0,.42);
}

.passport-save-bar > div{
  display:flex;
  flex-direction:column;
}

.passport-save-bar strong{
  font-size:.82rem;
}

.passport-save-bar small{
  margin-top:2px;

  color:#776f7d;
  font-size:.66rem;
}

.premium-save-btn{
  display:flex;
  align-items:center;
  gap:16px;

  min-height:47px;

  padding:0 17px;

  border:0;
  border-radius:13px;

  background:
    linear-gradient(
      135deg,
      #ff4fa3,
      #8f57ff
    );

  color:#fff;

  font:inherit;
  font-size:.77rem;
  font-weight:950;

  cursor:pointer;

  box-shadow:
    0 10px 30px rgba(147,65,230,.25);
}

.premium-save-btn b{
  font-size:1.2rem;
}

.premium-save-btn:disabled{
  opacity:.55;
  cursor:wait;
}

.passport-save-message{
  min-height:20px;
  margin:0 4px;
}

.passport-save-success{
  display:flex;
  align-items:center;
  gap:9px;

  padding:12px;

  border-radius:13px;

  border:
    1px solid rgba(87,255,156,.18);

  background:
    rgba(87,255,156,.06);
}

.passport-save-success > span{
  color:#62ffa4;
}

.passport-save-success strong{
  display:block;

  color:#fff;
  font-size:.77rem;
}

.passport-save-success small{
  display:block;

  margin-top:2px;

  color:#8c9f93;
  font-size:.66rem;
}

.save-success{
  color:#63ffa6;
}

.save-warning{
  color:#ffafc9;
}

.save-working{
  color:#c7a8ee;
}

.view-passport-link{
  display:inline-flex;

  margin-top:10px;

  color:#cba5ff;

  font-size:.75rem;
  font-weight:900;
}


/* MOBILE / TABLET */

@media(max-width:980px){

  .passport-builder-layout{
    grid-template-columns:
      1fr;
  }

  .passport-sticky{
    position:static;
  }

  .gaming-passport-card{
    min-height:420px;
  }

}


@media(max-width:700px){

  .passport-builder-hero{
    min-height:auto;

    align-items:flex-start;
    flex-direction:column;

    padding:25px 20px;
  }

  .passport-live-badge{
    width:100%;
  }

  .premium-form-grid,
  .premium-category-grid{
    grid-template-columns:
      1fr;
  }

  .passport-form-section{
    padding:18px 15px;
  }

  .gaming-avatar-picker{
    align-items:flex-start;
  }

  .gaming-intent-picker{
    grid-template-columns:
      1fr 1fr;
  }

  .passport-save-bar{
    bottom:
      calc(
        8px +
        env(safe-area-inset-bottom)
      );

    align-items:stretch;
    flex-direction:column;
  }

  .premium-save-btn{
    justify-content:space-between;
  }

}




/* =========================================================
   FREAKLIKEDAT GAMING — PREMIUM HOME
   ========================================================= */

.gaming-home-shell{
  width:min(1480px,94vw);
}

.gaming-nav a.active{
  color:#fff;

  border-color:
    rgba(187,111,255,.32);

  background:
    rgba(155,92,255,.11);
}


/* HERO */

.gaming-home-hero{
  display:grid;

  grid-template-columns:
    minmax(0,1.2fr)
    minmax(360px,.8fr);

  gap:18px;

  min-height:510px;

  margin-top:24px;
}

.gaming-home-hero-copy{
  position:relative;
  overflow:hidden;

  display:flex;
  flex-direction:column;
  justify-content:flex-end;

  padding:46px;

  border:
    1px solid rgba(255,255,255,.08);

  border-radius:30px;

  background:
    radial-gradient(
      circle at 82% 15%,
      rgba(255,70,165,.22),
      transparent 27%
    ),
    radial-gradient(
      circle at 68% 84%,
      rgba(119,63,255,.25),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      #17101f,
      #09080d 72%
    );

  box-shadow:
    0 30px 90px rgba(0,0,0,.32);
}

.gaming-home-hero-copy::after{
  content:"🎮";

  position:absolute;

  right:7%;
  top:8%;

  font-size:
    clamp(6rem,13vw,12rem);

  opacity:.055;

  transform:rotate(-9deg);
}

.gaming-home-hero-copy h1{
  position:relative;
  z-index:2;

  margin:11px 0 15px;

  font-size:
    clamp(3rem,6vw,6rem);

  line-height:.88;

  letter-spacing:-.065em;
}

.gaming-home-hero-copy p{
  position:relative;
  z-index:2;

  max-width:690px;

  margin:0;

  color:#bbb2c2;

  font-size:1rem;
  line-height:1.65;
}

.gaming-home-actions{
  position:relative;
  z-index:2;

  display:flex;
  gap:9px;
  flex-wrap:wrap;

  margin-top:24px;
}

.gaming-hero-btn{
  min-height:48px;

  display:inline-flex;
  align-items:center;
  gap:8px;
}


/* FEATURE CARD */

.gaming-hero-feature{
  display:flex;
  flex-direction:column;

  overflow:hidden;

  border:
    1px solid rgba(255,255,255,.08);

  border-radius:30px;

  background:#100d15;
}

.gaming-feature-screen{
  position:relative;

  flex:1;

  min-height:390px;

  display:flex;
  flex-direction:column;

  padding:20px;

  background:
    radial-gradient(
      circle at 30% 30%,
      rgba(165,78,255,.24),
      transparent 30%
    ),
    radial-gradient(
      circle at 80% 65%,
      rgba(255,60,150,.18),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      #15101c,
      #09080d
    );
}

.gaming-feature-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;

  color:#847b8b;

  font-size:.68rem;
  font-weight:850;
}

.gaming-live-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;

  padding:6px 9px;

  border-radius:999px;

  background:#f43259;

  color:#fff;

  font-weight:950;
}

.gaming-live-pill i{
  width:6px;
  height:6px;

  border-radius:50%;
  background:#fff;
}

.gaming-feature-center{
  flex:1;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  text-align:center;
}

.gaming-feature-center > span{
  font-size:4.5rem;

  filter:
    drop-shadow(
      0 15px 30px rgba(143,70,255,.3)
    );
}

.gaming-feature-center strong{
  margin-top:15px;

  font-size:1.2rem;
}

.gaming-feature-center small{
  max-width:280px;

  margin-top:7px;

  color:#817989;

  line-height:1.5;
}

.gaming-feature-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:18px 20px;

  border-top:
    1px solid rgba(255,255,255,.07);
}

.gaming-feature-footer small{
  display:block;

  color:#756e7a;

  font-size:.58rem;
  font-weight:950;
  letter-spacing:.12em;
}

.gaming-feature-footer strong{
  display:block;

  margin-top:3px;

  font-size:.82rem;
}


/* SECTIONS */

.gaming-home-section{
  margin-top:42px;
}

.gaming-premium-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:15px;

  margin-bottom:14px;
}

.gaming-premium-section-head h2{
  margin:5px 0 0;

  font-size:
    clamp(1.35rem,2.4vw,2rem);

  letter-spacing:-.025em;
}

.gaming-premium-section-head p{
  margin:4px 0 0;

  color:#817987;

  font-size:.78rem;
}

.gaming-premium-section-head > a{
  color:#b98dff;

  font-size:.75rem;
  font-weight:900;
}

.gaming-section-kicker{
  color:#8c7c99;

  font-size:.61rem;
  font-weight:950;
  letter-spacing:.13em;
}


/* LIVE EMPTY */

.gaming-live-empty{
  display:grid;

  grid-template-columns:
    auto minmax(0,1fr) auto;

  gap:16px;
  align-items:center;

  padding:22px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:20px;

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.035),
      rgba(255,255,255,.014)
    );
}

.gaming-live-empty-icon{
  width:50px;
  height:50px;

  display:grid;
  place-items:center;

  border-radius:16px;

  background:
    rgba(244,50,89,.1);
}

.gaming-live-empty strong{
  font-size:.9rem;
}

.gaming-live-empty p{
  margin:4px 0 0;

  color:#817987;

  font-size:.75rem;
  line-height:1.45;
}


/* VIBES */

.gaming-vibe-grid{
  display:grid;

  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:10px;
}

.gaming-vibe-card{
  display:flex;
  align-items:center;
  gap:12px;

  min-height:95px;

  padding:16px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:17px;

  background:
    rgba(255,255,255,.025);

  transition:
    transform .16s ease,
    border-color .16s ease,
    background .16s ease;
}

.gaming-vibe-card:hover{
  transform:translateY(-2px);

  border-color:
    rgba(184,104,255,.27);

  background:
    rgba(155,92,255,.055);
}

.gaming-vibe-card > span{
  width:42px;
  height:42px;

  flex:0 0 auto;

  display:grid;
  place-items:center;

  border-radius:13px;

  background:
    linear-gradient(
      135deg,
      rgba(255,79,163,.12),
      rgba(155,92,255,.14)
    );

  font-size:1.15rem;
}

.gaming-vibe-card strong{
  display:block;

  font-size:.78rem;
}

.gaming-vibe-card small{
  display:block;

  margin-top:3px;

  color:#756e7b;

  font-size:.63rem;
}


/* GAMER CARDS */

.premium-gamer-grid{
  display:grid;

  grid-template-columns:
    repeat(
      auto-fill,
      minmax(245px,1fr)
    );

  gap:13px;
}

.premium-gamer-card{
  overflow:hidden;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:20px;

  background:#100d14;

  transition:
    transform .18s ease,
    border-color .18s ease;
}

.premium-gamer-card:hover{
  transform:translateY(-3px);

  border-color:
    rgba(181,105,255,.3);
}

.premium-gamer-cover{
  position:relative;

  height:140px;

  background:
    radial-gradient(
      circle at 75% 30%,
      rgba(255,79,163,.22),
      transparent 35%
    ),
    linear-gradient(
      135deg,
      rgba(131,72,255,.2),
      rgba(17,13,23,.8)
    );
}

.premium-gamer-avatar-wrap{
  position:absolute;

  left:16px;
  bottom:-34px;

  width:74px;
  height:74px;

  padding:3px;

  border-radius:22px;

  background:
    linear-gradient(
      135deg,
      #ff4fa3,
      #925cff
    );
}

.premium-gamer-avatar-wrap img{
  width:100%;
  height:100%;

  display:block;

  border-radius:19px;

  object-fit:cover;

  background:#1b1720;
}

.gaming-approved-badge,
.gaming-member-badge{
  position:absolute;

  top:12px;
  right:12px;

  padding:6px 8px;

  border-radius:999px;

  font-size:.54rem;
  font-weight:950;
  letter-spacing:.07em;
}

.gaming-approved-badge{
  background:
    rgba(89,255,157,.12);

  color:#75ffb0;

  border:
    1px solid rgba(89,255,157,.2);
}

.gaming-member-badge{
  background:
    rgba(155,92,255,.13);

  color:#c69cff;

  border:
    1px solid rgba(155,92,255,.2);
}

.premium-gamer-body{
  padding:44px 16px 15px;
}

.premium-gamer-name{
  font-size:.94rem;
  font-weight:950;
}

.premium-gamer-handle{
  margin-top:2px;

  color:#77707e;

  font-size:.69rem;
}

.premium-now-playing{
  margin-top:13px;
  padding:10px;

  border-radius:12px;

  background:
    rgba(255,255,255,.035);
}

.premium-now-playing small{
  display:block;

  color:#6d6572;

  font-size:.52rem;
  font-weight:950;
  letter-spacing:.1em;
}

.premium-now-playing strong{
  display:block;

  margin-top:4px;

  font-size:.71rem;
}

.premium-gamer-tags{
  display:flex;
  flex-wrap:wrap;
  gap:5px;

  margin-top:11px;
}

.gaming-card-tag{
  padding:5px 7px;

  border-radius:999px;

  border:
    1px solid rgba(168,94,255,.18);

  background:
    rgba(155,92,255,.08);

  color:#bea1df;

  font-size:.58rem;
  font-weight:850;
}

.premium-gamer-view{
  display:flex;
  justify-content:space-between;

  margin-top:14px;
  padding-top:11px;

  border-top:
    1px solid rgba(255,255,255,.055);

  color:#9c8ca9;

  font-size:.66rem;
  font-weight:850;
}

.gaming-directory-empty,
.gaming-directory-loading{
  grid-column:1 / -1;

  padding:45px 20px;

  text-align:center;

  border:
    1px dashed rgba(255,255,255,.09);

  border-radius:20px;

  color:#827987;
}

.gaming-directory-empty > div{
  font-size:2rem;
}

.gaming-directory-empty strong{
  display:block;
  margin-top:10px;
  color:#fff;
}

.gaming-directory-empty p{
  max-width:430px;

  margin:7px auto 18px;

  font-size:.78rem;
  line-height:1.5;
}


/* WORLD */

.gaming-world-grid{
  display:grid;

  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:10px;
}

.gaming-world-card{
  min-height:180px;

  padding:18px;

  display:flex;
  flex-direction:column;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:19px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.035),
      rgba(255,255,255,.014)
    );
}

.gaming-world-card > span{
  font-size:1.5rem;
}

.gaming-world-card strong{
  margin-top:auto;
  font-size:.84rem;
}

.gaming-world-card p{
  margin:5px 0 0;

  color:#77707c;

  font-size:.68rem;
  line-height:1.4;
}


/* FOOTER */

.gaming-home-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;

  margin-top:50px;
  padding:20px 0;

  border-top:
    1px solid rgba(255,255,255,.06);

  color:#675f6d;

  font-size:.68rem;
}


/* LIVE DIRECTORY */

.live-directory-hero{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;

  margin-top:25px;
  padding:38px;

  border:
    1px solid rgba(255,255,255,.08);

  border-radius:28px;

  background:
    radial-gradient(
      circle at 90% 15%,
      rgba(244,50,89,.17),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #171018,
      #09080c
    );
}

.live-directory-hero h1{
  margin:8px 0 8px;

  font-size:
    clamp(2.4rem,5vw,4.8rem);

  letter-spacing:-.055em;
}

.live-directory-hero p{
  max-width:620px;

  margin:0;

  color:#918896;
}

.gaming-live-directory-empty{
  min-height:420px;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  text-align:center;

  padding:40px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:24px;

  background:
    radial-gradient(
      circle at 50% 45%,
      rgba(151,71,255,.08),
      transparent 32%
    ),
    rgba(255,255,255,.015);
}

.gaming-live-orb{
  position:relative;

  width:95px;
  height:95px;

  display:grid;
  place-items:center;

  border-radius:50%;

  background:
    rgba(155,92,255,.1);

  font-size:2rem;
}

.gaming-live-orb > span{
  position:absolute;

  top:7px;
  right:8px;

  width:14px;
  height:14px;

  border-radius:50%;

  background:#f43259;

  box-shadow:
    0 0 20px rgba(244,50,89,.8);
}

.gaming-live-directory-empty h2{
  margin:20px 0 7px;
}

.gaming-live-directory-empty p{
  max-width:500px;

  margin:0;

  color:#817987;

  font-size:.8rem;
  line-height:1.55;
}

.gaming-live-roadmap{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;

  margin-top:22px;
}

.gaming-live-roadmap span{
  padding:8px 11px;

  border-radius:10px;

  border:
    1px solid rgba(255,255,255,.08);

  background:
    rgba(255,255,255,.035);

  font-size:.68rem;
  font-weight:850;
}

.gaming-live-roadmap b{
  color:#745e82;
}


/* RESPONSIVE */

@media(max-width:1050px){

  .gaming-home-hero{
    grid-template-columns:1fr;
  }

  .gaming-feature-screen{
    min-height:310px;
  }

  .gaming-vibe-grid,
  .gaming-world-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:700px){

  .gaming-home-hero{
    min-height:auto;
  }

  .gaming-home-hero-copy{
    padding:27px 21px;
    min-height:420px;
  }

  .gaming-home-hero-copy h1{
    font-size:3.2rem;
  }

  .gaming-live-empty{
    grid-template-columns:1fr;
    text-align:center;
  }

  .gaming-live-empty-icon{
    margin:auto;
  }

  .gaming-vibe-grid,
  .gaming-world-grid{
    grid-template-columns:1fr;
  }

  .gaming-vibe-card{
    min-height:80px;
  }

  .gaming-world-card{
    min-height:140px;
  }

  .live-directory-hero{
    align-items:flex-start;
    flex-direction:column;

    padding:26px 20px;
  }

  .gaming-home-footer{
    align-items:flex-start;
    flex-direction:column;
    gap:5px;
  }

}




/* =========================================================
   GAMING LIVE DIRECTORY CARDS
   ========================================================= */

.gaming-stream-grid{
  display:grid;

  grid-template-columns:
    repeat(
      auto-fill,
      minmax(290px,1fr)
    );

  gap:14px;
}


.gaming-live-stream-card{
  overflow:hidden;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:20px;

  background:#100d14;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}


.gaming-live-stream-card:hover{
  transform:
    translateY(-3px);

  border-color:
    rgba(195,101,255,.34);

  box-shadow:
    0 18px 45px rgba(0,0,0,.23);
}


.gaming-stream-preview{
  position:relative;

  aspect-ratio:16 / 9;

  overflow:hidden;

  background:
    radial-gradient(
      circle at 30% 30%,
      rgba(151,73,255,.24),
      transparent 32%
    ),
    radial-gradient(
      circle at 80% 70%,
      rgba(255,65,155,.17),
      transparent 35%
    ),
    #070609;
}


.gaming-stream-preview-bg{
  position:absolute;
  inset:0;

  display:grid;
  place-items:center;

  font-size:3.5rem;

  opacity:.8;
}


.gaming-live-card-badge{
  position:absolute;

  top:11px;
  left:11px;

  display:flex;
  align-items:center;
  gap:5px;

  padding:6px 8px;

  border-radius:999px;

  background:#f33359;

  color:#fff;

  font-size:.57rem;
  font-weight:950;
}


.gaming-live-card-badge i{
  width:6px;
  height:6px;

  border-radius:50%;

  background:#fff;
}


.gaming-stream-access{
  position:absolute;

  top:11px;
  right:11px;

  padding:6px 8px;

  border-radius:999px;

  background:
    rgba(5,4,8,.72);

  border:
    1px solid rgba(255,255,255,.09);

  color:#fff;

  font-size:.54rem;
  font-weight:950;
}


.gaming-stream-viewers{
  position:absolute;

  right:10px;
  bottom:9px;

  padding:5px 7px;

  border-radius:8px;

  background:
    rgba(0,0,0,.66);

  color:#fff;

  font-size:.58rem;
  font-weight:850;
}


.gaming-stream-card-body{
  display:flex;
  gap:11px;

  padding:13px;
}


.gaming-stream-avatar{
  width:48px;
  height:48px;

  flex:0 0 auto;

  border-radius:14px;

  object-fit:cover;

  background:#211a26;
}


.gaming-stream-card-copy{
  min-width:0;
}


.gaming-stream-card-copy > strong{
  display:block;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  font-size:.82rem;
}


.gaming-stream-card-copy > span{
  display:block;

  margin-top:4px;

  color:#c1b6c7;

  font-size:.68rem;
}


.gaming-stream-card-copy > small{
  display:block;

  margin-top:2px;

  color:#746b79;

  font-size:.61rem;
}


.gaming-stream-game{
  margin-top:8px;

  color:#aa9ab7;

  font-size:.65rem;
}


/* UPCOMING */

.gaming-upcoming-grid{
  display:flex;
  flex-direction:column;
  gap:8px;
}


.gaming-upcoming-card{
  display:grid;

  grid-template-columns:
    auto minmax(0,1fr) auto;

  gap:12px;
  align-items:center;

  padding:13px;

  border:
    1px solid rgba(255,255,255,.07);

  border-radius:15px;

  background:
    rgba(255,255,255,.024);

  transition:
    background .15s ease,
    border-color .15s ease;
}


.gaming-upcoming-card:hover{
  border-color:
    rgba(173,96,255,.24);

  background:
    rgba(155,92,255,.045);
}


.gaming-upcoming-avatar img{
  width:52px;
  height:52px;

  display:block;

  object-fit:cover;

  border-radius:14px;

  background:#211a26;
}


.gaming-upcoming-copy{
  min-width:0;
}


.gaming-upcoming-time{
  display:block;

  margin-bottom:3px;

  color:#c595ff;

  font-size:.59rem;
  font-weight:950;
}


.gaming-upcoming-copy strong{
  display:block;

  font-size:.78rem;
}


.gaming-upcoming-copy small{
  display:block;

  margin-top:4px;

  color:#766e7b;

  font-size:.63rem;
}


.gaming-upcoming-arrow{
  color:#a579db;
  font-size:1.1rem;
}


@media(max-width:620px){

  .gaming-stream-grid{
    grid-template-columns:1fr;
  }

}