/* ==========================================================
   39GO SOCIAL — GLOBAL PREMIUM V1.0.0
   Direction: Apple / Stripe / Airbnb level restraint
   Warm neutral + charcoal + natural green
   ========================================================== */

:root{
  --gp-bg:#F6F4EF;
  --gp-surface:#FFFFFF;
  --gp-surface-2:#FAF8F3;
  --gp-text:#171717;
  --gp-text-2:#5F6368;
  --gp-line:#E7E3DA;
  --gp-green:#5C7F52;
  --gp-green-dark:#3E5C36;
  --gp-green-soft:#EEF4EB;
  --gp-gold:#C99745;
  --gp-red:#D74848;
  --gp-red-soft:#FFF1F1;
  --gp-shadow:0 10px 30px rgba(28,24,18,.07);
  --gp-shadow-lg:0 20px 60px rgba(28,24,18,.09);
  --gp-r16:16px;
  --gp-r20:20px;
  --gp-r24:24px;
  --gp-r28:28px;
}

/* ---------- Base ---------- */
html,body{
  background:var(--gp-bg)!important;
  color:var(--gp-text)!important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Noto Sans Thai","Segoe UI",sans-serif!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.go39-global-premium{
  font-size:18px!important;
  line-height:1.5!important;
}
body.go39-global-premium::before,
body.go39-global-premium::after{
  content:none!important;
}
body.go39-global-premium > *{
  position:relative;
  z-index:1;
}

/* ---------- Typography ---------- */
body.go39-global-premium :is(h1,.page-title,.screen-title){
  color:var(--gp-text)!important;
  font-size:clamp(34px,5vw,44px)!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.03em!important;
}
body.go39-global-premium h2{
  color:var(--gp-text)!important;
  font-size:28px!important;
  font-weight:760!important;
  letter-spacing:-.02em!important;
}
body.go39-global-premium h3{
  color:var(--gp-text)!important;
  font-size:22px!important;
  font-weight:720!important;
}
body.go39-global-premium :is(p,label,li,a,button,input,select,textarea,.text,.name,.value){
  font-size:18px!important;
}
body.go39-global-premium :is(.muted,.meta,.caption,.hint,.small,.subtitle,.sub,.status){
  color:var(--gp-text-2)!important;
  font-size:16px!important;
}

/* ---------- App roots ---------- */
body.go39-app-mode :is(
  #app,#root,main,.app,.app-shell,.social-app,.screen,.page,
  .content,.main-content,.screen-content,.page-content
){
  background:transparent!important;
  color:var(--gp-text)!important;
}

/* ---------- Cards / surfaces ---------- */
body.go39-global-premium :is(
  .card,.panel,.box,.tile,.section,.sheet,.drawer,.modal-box,.modal-content,
  .profile-card,.friend-card,.chat-card,.nearby-card,.user-card,
  [class*="card"],[class*="panel"]
){
  background:var(--gp-surface)!important;
  color:var(--gp-text)!important;
  border:1px solid var(--gp-line)!important;
  box-shadow:var(--gp-shadow)!important;
  border-radius:var(--gp-r24)!important;
}

/* ---------- Buttons ---------- */
body.go39-global-premium button,
body.go39-global-premium .btn,
body.go39-global-premium [role="button"]{
  min-height:54px!important;
  border-radius:16px!important;
  padding:10px 16px!important;
  font-size:18px!important;
  font-weight:700!important;
  color:var(--gp-text)!important;
  background:var(--gp-surface)!important;
  border:1px solid var(--gp-line)!important;
  box-shadow:none!important;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease!important;
}
body.go39-global-premium button:active,
body.go39-global-premium .btn:active,
body.go39-global-premium [role="button"]:active{
  transform:scale(.985);
}
body.go39-global-premium :is(.primary,.btn-primary,[data-primary="1"]){
  color:#fff!important;
  background:var(--gp-green)!important;
  border-color:var(--gp-green)!important;
}
body.go39-global-premium :is(.danger,.btn-danger,.sos,.sos-button,[data-action="sos"]){
  color:#fff!important;
  background:var(--gp-red)!important;
  border-color:var(--gp-red)!important;
}

/* ---------- Inputs ---------- */
body.go39-global-premium input,
body.go39-global-premium select,
body.go39-global-premium textarea{
  min-height:52px!important;
  padding:12px 14px!important;
  color:var(--gp-text)!important;
  background:var(--gp-surface)!important;
  border:1px solid var(--gp-line)!important;
  border-radius:14px!important;
  font-size:18px!important;
  box-shadow:none!important;
}
body.go39-global-premium :is(input,select,textarea):focus{
  outline:3px solid rgba(92,127,82,.13)!important;
  border-color:var(--gp-green)!important;
}

/* ---------- Public/Login ---------- */
body:not(.go39-app-mode) #go39HomeShell{
  width:min(760px,calc(100% - 24px))!important;
  margin:12px auto 0!important;
  padding:0!important;
  background:transparent!important;
}
body:not(.go39-app-mode) #go39HomeShell .go39-home-hero,
body:not(.go39-app-mode) #go39HomeShell .go39-home-copy,
body:not(.go39-app-mode) #go39HomeShell .go39-home-visual{
  display:none!important;
}
body:not(.go39-app-mode) #go39HomeShell .go39-home-topbar{
  padding:8px 2px 12px!important;
}
body:not(.go39-app-mode) #go39HomeShell .go39-home-logo{
  background:var(--gp-text)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:14px!important;
}
body:not(.go39-app-mode) #go39HomeShell .go39-home-title strong{
  color:var(--gp-text)!important;
  font-size:20px!important;
  letter-spacing:-.01em!important;
}
body:not(.go39-app-mode) #go39HomeShell .go39-home-title span{
  color:var(--gp-text-2)!important;
  font-size:12px!important;
}
body:not(.go39-app-mode) #go39HomeShell .go39-home-live{
  background:var(--gp-green-soft)!important;
  color:var(--gp-green-dark)!important;
  border:0!important;
}

body:not(.go39-app-mode) .go39-login-top-panel{
  width:min(760px,calc(100% - 24px))!important;
  margin:0 auto!important;
  padding:0!important;
}
body:not(.go39-app-mode) .go39-login-top-card{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  padding:18px!important;
  background:var(--gp-surface)!important;
  border:1px solid var(--gp-line)!important;
  box-shadow:var(--gp-shadow-lg)!important;
  border-radius:28px!important;
}
body:not(.go39-app-mode) .go39-login-top-brand{
  display:flex!important;
  flex-direction:row!important;
  align-items:baseline!important;
  justify-content:space-between!important;
  padding:0 2px 4px!important;
}
body:not(.go39-app-mode) .go39-login-top-brand strong{
  color:var(--gp-text)!important;
  font-size:30px!important;
  font-weight:800!important;
}
body:not(.go39-app-mode) .go39-login-top-brand span{
  color:var(--gp-text-2)!important;
  font-size:15px!important;
}
body:not(.go39-app-mode) .go39-login-top-age{
  min-height:56px!important;
  background:var(--gp-surface-2)!important;
  color:var(--gp-text)!important;
  border:1px solid var(--gp-line)!important;
  border-radius:16px!important;
}
body:not(.go39-app-mode) .go39-login-top-btn{
  min-height:60px!important;
  font-size:19px!important;
  border-radius:16px!important;
}
body:not(.go39-app-mode) .go39-login-top-google{
  background:#fff!important;
  color:var(--gp-text)!important;
  border:1px solid var(--gp-line)!important;
}
body:not(.go39-app-mode) .go39-login-top-line{
  background:#06C755!important;
  color:#fff!important;
  border-color:#06C755!important;
}
#go39PolicyFooter{
  color:var(--gp-text-2)!important;
  font-size:13px!important;
  padding:10px 8px 16px!important;
}
#go39PolicyFooter a{
  color:var(--gp-green-dark)!important;
}

/* ---------- Quick logout ---------- */
#go39QuickLogout{
  min-height:42px!important;
  padding:8px 12px!important;
  background:rgba(255,255,255,.92)!important;
  color:var(--gp-text)!important;
  border:1px solid var(--gp-line)!important;
  box-shadow:0 8px 22px rgba(28,24,18,.08)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  font-size:14px!important;
}
#go39QuickLogout .dot{
  background:var(--gp-green)!important;
  box-shadow:none!important;
}

/* ---------- Radar ---------- */
body.go39-global-premium :is(
  .radar,.radar-wrap,.radar-stage,.radar-circle,.nearby-radar,[class*="radar"]
){
  background:
    radial-gradient(circle at center,rgba(92,127,82,.06),transparent 48%),
    repeating-radial-gradient(circle at center,transparent 0 36px,rgba(23,23,23,.07) 37px 38px),
    var(--gp-surface)!important;
  border:1px solid var(--gp-line)!important;
  color:var(--gp-text)!important;
  box-shadow:var(--gp-shadow)!important;
}
body.go39-global-premium :is(
  .radar-dot,.pulse-dot,.me-dot,.center-dot,[class*="radar"] .dot
){
  background:var(--gp-green)!important;
  box-shadow:0 0 0 10px rgba(92,127,82,.11)!important;
}

/* ---------- Bottom navigation ---------- */
body.go39-global-premium :is(
  .bottom-nav,.bottom-bar,.tabbar,.tab-bar,.nav-bottom,.mobile-nav,
  .go39-wood-bottom-nav,[class*="bottom-nav"],[class*="tabbar"]
){
  background:rgba(255,255,255,.94)!important;
  border:1px solid var(--gp-line)!important;
  box-shadow:0 14px 40px rgba(28,24,18,.10)!important;
  border-radius:28px!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
}
body.go39-global-premium :is(
  .bottom-nav,.bottom-bar,.tabbar,.tab-bar,.nav-bottom,.mobile-nav,
  .go39-wood-bottom-nav,[class*="bottom-nav"],[class*="tabbar"]
) :is(a,button,.item,.tab,span){
  color:var(--gp-text)!important;
  font-size:15px!important;
  font-weight:650!important;
}
body.go39-global-premium :is(
  .bottom-nav,.bottom-bar,.tabbar,.tab-bar,.nav-bottom,.mobile-nav,
  .go39-wood-bottom-nav,[class*="bottom-nav"],[class*="tabbar"]
) :is(.active,[aria-current="page"]){
  background:var(--gp-green-soft)!important;
  color:var(--gp-green-dark)!important;
}

/* ---------- Runtime normalized legacy dark blocks ---------- */
body.go39-global-premium .gp-dark-surface{
  background:var(--gp-surface)!important;
  color:var(--gp-text)!important;
  border:1px solid var(--gp-line)!important;
  box-shadow:var(--gp-shadow)!important;
}
body.go39-global-premium .gp-light-text{
  color:var(--gp-text)!important;
  -webkit-text-fill-color:var(--gp-text)!important;
  opacity:1!important;
}
body.go39-global-premium .gp-soft-text{
  color:var(--gp-text-2)!important;
  -webkit-text-fill-color:var(--gp-text-2)!important;
  opacity:1!important;
}
body.go39-global-premium .gp-row{
  background:var(--gp-surface)!important;
  border-bottom:1px solid var(--gp-line)!important;
}

/* ---------- SOS ---------- */
body.go39-global-premium .gp-sos-screen{
  background:var(--gp-bg)!important;
}
body.go39-global-premium .gp-sos-screen .gp-sos-hero{
  background:var(--gp-surface)!important;
  border:1px solid var(--gp-line)!important;
  border-radius:28px!important;
  box-shadow:var(--gp-shadow)!important;
}
body.go39-global-premium .gp-sos-screen .gp-sos-main{
  background:var(--gp-red)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 12px 30px rgba(215,72,72,.18)!important;
}

/* ---------- Profile ---------- */
body.go39-global-premium .gp-profile-hero{
  background:var(--gp-surface)!important;
  border:1px solid var(--gp-line)!important;
  box-shadow:var(--gp-shadow)!important;
}

/* ---------- Mobile ---------- */
@media(max-width:720px){
  body.go39-global-premium{
    font-size:18px!important;
  }
  body.go39-global-premium :is(h1,.page-title,.screen-title){
    font-size:34px!important;
  }
  body.go39-global-premium h2{
    font-size:26px!important;
  }
  body.go39-global-premium button,
  body.go39-global-premium .btn,
  body.go39-global-premium [role="button"]{
    min-height:56px!important;
  }
}

/* ---------- Desktop ---------- */
@media(min-width:900px){
  body.go39-global-premium :is(.app-shell,.social-app,main,#app,#root){
    max-width:1180px;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}