*{
  box-sizing:border-box;
}

html,
body{
  min-height:100%;
  margin:0;
}

body{
  font-family:"Pretendard Variable","SUIT Variable","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  color:#f8fbff;
  background:#080c16;
}

.age-page{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  overflow:hidden;
  background:
    radial-gradient(circle at 14% 18%, rgba(0,217,255,.20), transparent 34%),
    radial-gradient(circle at 76% 22%, rgba(130,84,255,.27), transparent 35%),
    radial-gradient(circle at 70% 92%, rgba(177,76,255,.18), transparent 38%),
    linear-gradient(135deg,#06121d 0%,#131525 48%,#070b15 100%);
}

.age-page::before{
  content:"";
  position:fixed;
  inset:-20%;
  background:
    linear-gradient(115deg, transparent 0 34%, rgba(255,255,255,.045) 44%, transparent 55%),
    radial-gradient(circle at 50% 50%, transparent 0 38%, rgba(0,0,0,.34) 78%);
  pointer-events:none;
}

.age-card{
  position:relative;
  width:min(100%, 360px);
  min-height:540px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:34px 26px 28px;
  text-align:center;
  border-radius:18px;
  border:2px solid rgba(123,112,255,.88);
  background:
    radial-gradient(circle at 50% 6%, rgba(108,97,255,.22), transparent 32%),
    linear-gradient(180deg, rgba(18,22,38,.92), rgba(12,15,27,.92));
  box-shadow:
    0 0 44px rgba(117,91,255,.42),
    0 26px 90px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.age-badge{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
  border-radius:50%;
  border:1px dashed rgba(226,232,255,.65);
  color:rgba(234,240,255,.78);
  font-size:11px;
  font-weight:800;
}

.age-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  margin-bottom:26px;
}

.age-brand img{
  width:82px;
  height:82px;
  object-fit:contain;
  filter:drop-shadow(0 0 18px rgba(0,224,255,.35));
}

.age-brand strong,
.denied-brand strong{
  font-size:22px;
  line-height:1;
  font-weight:950;
  letter-spacing:.02em;
}

.age-brand span{
  margin-top:4px;
  color:rgba(255,255,255,.48);
  font-size:7px;
  font-weight:800;
  letter-spacing:.08em;
}

.age-card h1{
  margin:0 0 12px;
  font-size:27px;
  line-height:1.1;
  font-weight:950;
}

.age-card p{
  margin:0;
  color:rgba(236,241,255,.78);
  font-size:13px;
  line-height:1.45;
}

.age-actions{
  width:100%;
  display:grid;
  gap:12px;
  margin-top:30px;
}

.age-btn{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  text-decoration:none;
  font-size:13px;
  font-weight:900;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease, color .14s ease;
}

.age-btn-primary{
  color:#07101c;
  background:linear-gradient(100deg,#16d7ff 0%,#547cff 56%,#9c5cff 100%);
  box-shadow:0 14px 32px rgba(88,106,255,.42);
}

.age-btn-muted{
  color:rgba(219,225,247,.58);
  border:1px solid rgba(124,139,181,.42);
  background:rgba(255,255,255,.018);
}

.age-btn:hover{
  transform:translateY(-1px);
}

.age-btn-primary:hover{
  box-shadow:0 18px 38px rgba(88,106,255,.52);
}

.age-btn-muted:hover{
  color:#fff;
  border-color:rgba(255,255,255,.28);
}

.age-terms{
  margin-top:30px !important;
  color:rgba(214,221,244,.55) !important;
  font-size:10px !important;
}

.age-terms a{
  color:rgba(239,243,255,.78);
  text-decoration:none;
}

.age-denied-page{
  text-align:center;
}

.denied-panel{
  position:relative;
  width:min(100%, 820px);
  display:flex;
  flex-direction:column;
  align-items:center;
}

.denied-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
  margin-bottom:48px;
}

.denied-brand img{
  width:128px;
  height:128px;
  object-fit:contain;
  filter:drop-shadow(0 0 24px rgba(0,224,255,.28));
}

.denied-brand strong{
  font-size:38px;
}

.denied-panel h1{
  margin:0;
  font-size:clamp(34px, 5vw, 52px);
  line-height:1.18;
  font-weight:400;
  letter-spacing:-.04em;
}

.denied-panel p{
  margin:34px 0 46px;
  color:rgba(246,248,255,.82);
  font-size:clamp(20px, 2.6vw, 28px);
  line-height:1.35;
  letter-spacing:-.025em;
}

.denied-back{
  min-width:150px;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  border:1px solid rgba(133,104,255,.88);
  color:#fff;
  text-decoration:none;
  font-size:16px;
  letter-spacing:.02em;
  background:linear-gradient(135deg, rgba(13,224,255,.12), rgba(147,82,255,.18));
  box-shadow:0 0 28px rgba(92,118,255,.25), inset 0 1px 0 rgba(255,255,255,.12);
  transition:transform .14s ease, box-shadow .14s ease;
}

.denied-back:hover{
  transform:translateY(-1px);
  box-shadow:0 0 36px rgba(92,118,255,.38), inset 0 1px 0 rgba(255,255,255,.16);
}

@media (max-width: 640px){
  .age-page{
    padding:18px;
  }

  .age-card{
    min-height:auto;
    padding:30px 22px 24px;
  }

  .denied-brand{
    margin-bottom:34px;
  }

  .denied-brand img{
    width:104px;
    height:104px;
  }
}