/* ==== css/81-admin-finance-ledger-v11.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ================================================================
   ADMIN > การเงิน — รายการเงินเข้า
   ไฟล์แยกเพื่อไม่แตะ CSS ของ Admin ส่วนอื่น
   ================================================================ */

#adminView-payments{
  --money-cyan:#38bdf8;
  --money-green:#34d399;
  --money-text:#eef7fb;
  --money-sub:#8195a6;
}

#adminView-payments .admin-money-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin:6px 0 18px;
}

#adminView-payments .admin-money-eyebrow{
  display:block;
  margin-bottom:3px;
  font-size:8px;
  line-height:1;
  letter-spacing:2.2px;
  font-weight:900;
  color:var(--money-cyan);
  opacity:.85;
}

#adminView-payments .admin-money-head h2{
  margin:0;
  color:#fff;
  font-size:23px;
  line-height:1.18;
  font-weight:950;
}

#adminView-payments .admin-money-head p{
  margin:6px 0 0;
  color:#788c9d;
  font-size:10.5px;
  line-height:1.45;
}

#adminView-payments .admin-money-live{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(56,189,248,.17);
  background:rgba(8,25,36,.70);
  color:#99aec0;
  font-size:9.5px;
  font-weight:800;
}

#adminView-payments .admin-money-live i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#34d399;
  box-shadow:0 0 10px rgba(52,211,153,.7);
}

#adminView-payments .admin-money-summary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin-bottom:12px;
}

#adminView-payments .admin-money-stat{
  position:relative;
  min-height:78px;
  overflow:hidden;
  padding:13px 14px;
  border-radius:19px;
  border:1px solid rgba(56,189,248,.15);
  background:
    radial-gradient(circle at 100% 0,rgba(56,189,248,.10),transparent 48%),
    linear-gradient(150deg,rgba(10,28,39,.94),rgba(5,14,23,.97));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 10px 30px rgba(0,0,0,.16);
}

#adminView-payments .admin-money-stat.wide{
  grid-column:1 / -1;
  min-height:84px;
}

#adminView-payments .admin-money-stat small{
  display:block;
  color:#7890a2;
  font-size:9px;
  font-weight:700;
  margin-bottom:7px;
}

#adminView-payments .admin-money-stat strong{
  display:block;
  color:#72e6ad;
  font-size:21px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.3px;
}

#adminView-payments .admin-money-stat.wide strong{
  font-size:26px;
}

#adminView-payments .admin-money-filterbar{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(120px,.7fr);
  gap:8px;
  margin-bottom:18px;
}

#adminView-payments .admin-money-search-wrap{
  height:48px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 13px;
  border-radius:16px;
  border:1px solid rgba(120,151,173,.18);
  background:rgba(7,19,29,.86);
}

#adminView-payments .admin-money-search-wrap > span{
  color:#748b9e;
  font-size:16px;
}

#adminView-payments .admin-money-search-wrap input,
#adminView-payments .admin-money-filterbar select{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:#dce8ef;
  font-family:inherit;
  font-size:11px;
}

#adminView-payments .admin-money-search-wrap input::placeholder{
  color:#617586;
}

#adminView-payments .admin-money-filterbar select{
  height:48px;
  padding:0 11px;
  border:1px solid rgba(120,151,173,.18);
  border-radius:16px;
  background:#081621;
}

#adminView-payments .admin-money-list-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 1px 10px;
}

#adminView-payments .admin-money-list-head strong{
  color:#e7f0f5;
  font-size:13px;
  font-weight:900;
}

#adminView-payments .admin-money-list-head span{
  color:#75899a;
  font-size:9.5px;
}

#adminView-payments .admin-money-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

#adminView-payments .admin-money-card{
  position:relative;
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:12px;
  padding:14px;
  border-radius:21px;
  border:1px solid rgba(56,189,248,.16);
  background:
    radial-gradient(circle at 100% 0,rgba(16,185,129,.055),transparent 40%),
    linear-gradient(150deg,rgba(10,28,39,.96),rgba(5,14,23,.985));
  box-shadow:0 12px 30px rgba(0,0,0,.19),inset 0 1px 0 rgba(255,255,255,.025);
}

#adminView-payments .admin-money-avatar{
  width:52px;
  height:52px;
  border-radius:16px;
  overflow:hidden;
  background:#0c202e;
  border:1px solid rgba(56,189,248,.24);
  box-shadow:0 6px 18px rgba(0,0,0,.22);
}

#adminView-payments .admin-money-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

#adminView-payments .admin-money-avatar-fallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-size:22px;
}

#adminView-payments .admin-money-main{
  min-width:0;
}

#adminView-payments .admin-money-topline{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

#adminView-payments .admin-money-person{
  min-width:0;
}

#adminView-payments .admin-money-person strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#f4f8fa;
  font-size:13.5px;
  font-weight:900;
}

#adminView-payments .admin-money-person span{
  display:block;
  margin-top:2px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#728697;
  font-size:9px;
}

#adminView-payments .admin-money-amount{
  flex:0 0 auto;
  color:#45e79a;
  font-size:18px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.25px;
  text-shadow:0 0 18px rgba(52,211,153,.16);
}

#adminView-payments .admin-money-kind{
  width:max-content;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin:9px 0 8px;
  padding:4px 7px;
  border-radius:999px;
  border:1px solid rgba(56,189,248,.18);
  background:rgba(56,189,248,.065);
  color:#8fdcff;
  font-size:8px;
  font-weight:900;
}

#adminView-payments .admin-money-kind.rental{
  color:#fde68a;
  border-color:rgba(245,158,11,.20);
  background:rgba(245,158,11,.07);
}

#adminView-payments .admin-money-kind.trip-full{
  color:#8cecb8;
  border-color:rgba(52,211,153,.20);
  background:rgba(52,211,153,.07);
}

#adminView-payments .admin-money-kind-icon{
  font-size:8px;
  opacity:.9;
}

#adminView-payments .admin-money-description{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:4px 6px;
  line-height:1.45;
}

#adminView-payments .admin-money-description strong{
  color:#dce8ee;
  font-size:10.5px;
  font-weight:900;
}

#adminView-payments .admin-money-description span{
  color:#a8bac7;
  font-size:10.5px;
  font-weight:700;
}

#adminView-payments .admin-money-subdetail{
  margin-top:5px;
  color:#708697;
  font-size:9px;
  line-height:1.45;
}

#adminView-payments .admin-money-foot{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px 10px;
  margin-top:10px;
  padding-top:9px;
  border-top:1px dashed rgba(125,155,176,.12);
  color:#607687;
  font-size:8.5px;
}

#adminView-payments .admin-money-slip-btn{
  margin-left:auto;
  border:1px solid rgba(56,189,248,.18);
  border-radius:999px;
  padding:4px 8px;
  background:rgba(56,189,248,.065);
  color:#7dd3fc;
  font:800 8.5px/1.2 inherit;
}

#adminView-payments .admin-money-data-note{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin:15px 2px 3px;
  padding:10px 11px;
  border-radius:14px;
  border:1px solid rgba(120,151,173,.10);
  background:rgba(8,18,27,.48);
}

#adminView-payments .admin-money-data-note > span{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(56,189,248,.10);
  color:#6bcfff;
  font-size:9px;
  font-weight:900;
}

#adminView-payments .admin-money-data-note p{
  margin:0;
  color:#5f7485;
  font-size:8.5px;
  line-height:1.5;
}

#adminView-payments .admin-money-empty{
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border:1px dashed rgba(120,151,173,.14);
  border-radius:20px;
  color:#718697;
}

#adminView-payments .admin-money-empty > div{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin-bottom:9px;
  border-radius:15px;
  background:rgba(56,189,248,.07);
  color:#55c9ff;
  font-size:22px;
  font-weight:900;
}

#adminView-payments .admin-money-empty strong{
  color:#aebdc8;
  font-size:12px;
}

#adminView-payments .admin-money-empty span{
  margin-top:4px;
  color:#617484;
  font-size:9px;
}

@media (max-width:430px){
  #adminView-payments .admin-money-filterbar{
    grid-template-columns:1fr;
  }

  #adminView-payments .admin-money-card{
    grid-template-columns:48px minmax(0,1fr);
    padding:13px;
    gap:11px;
  }

  #adminView-payments .admin-money-avatar{
    width:48px;
    height:48px;
  }

  #adminView-payments .admin-money-amount{
    font-size:16px;
  }
}


/* ================================================================
   ADMIN > การเงิน — ล็อคแบบหน้าเข้าสู่ ADMIN
   ================================================================ */

#adminView-payments .admin-money-head-right{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

#adminView-payments .admin-money-order-badge{
  display:inline-flex;
  align-items:center;
  padding:7px 9px;
  border-radius:999px;
  border:1px solid rgba(56,189,248,.16);
  background:rgba(56,189,248,.06);
  color:#7dd3fc;
  font-size:8.5px;
  font-weight:900;
}

.swal2-container.admin-finance-lock-container{
  z-index:2147483000!important;
}

.admin-finance-login-popup{
  width:min(90vw,390px)!important;
  padding:0!important;
  border-radius:28px!important;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,rgba(3,10,17,.72),rgba(3,10,17,.92)),
    url('/ximg.php?f=1448375240586-882707db888b-1200.jpg')
    center/cover no-repeat!important;
  border:1px solid rgba(56,189,248,.22)!important;
  box-shadow:
    0 30px 90px rgba(0,0,0,.72),
    inset 0 1px 0 rgba(255,255,255,.05)!important;
}

.admin-finance-lock-html{
  margin:0!important;
  padding:0!important;
}

.admin-finance-login-shell{
  padding:28px 24px 24px;
  color:#fff;
  text-align:center;
}

.admin-finance-login-logo{
  display:block;
  width:72px;
  height:72px;
  margin:0 auto 14px;
  border-radius:20px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 10px 28px rgba(0,0,0,.34);
}

.admin-finance-login-copy span{
  display:block;
  margin-bottom:5px;
  color:#57cfff;
  font-size:8px;
  letter-spacing:2.2px;
  font-weight:900;
}

.admin-finance-login-copy h2{
  margin:0;
  color:#fff;
  font-size:24px;
  font-weight:950;
}

.admin-finance-login-copy p{
  margin:6px 0 18px;
  color:#8da0b1;
  font-size:10px;
  line-height:1.45;
}

.admin-finance-login-field{
  position:relative;
  display:flex;
  align-items:center;
  gap:9px;
  height:54px;
  padding:0 12px;
  border-radius:16px;
  border:1px solid rgba(86,152,186,.28);
  background:rgba(4,15,24,.76);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

.admin-finance-login-lock{
  flex:0 0 auto;
  color:#6fbfdc;
  font-size:17px;
}

.admin-finance-login-field input{
  min-width:0;
  flex:1;
  height:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font-family:inherit;
  font-size:15px;
  font-weight:800;
  letter-spacing:3px;
  text-align:left;
}

.admin-finance-login-field input::placeholder{
  color:#667d8e;
  letter-spacing:0;
  font-size:11px;
  font-weight:600;
}

.admin-finance-login-eye{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border:0;
  border-radius:10px;
  background:rgba(56,189,248,.06);
  color:#7dcff0;
  font-size:14px;
}

.admin-finance-login-error{
  display:none;
  margin-top:8px;
  padding:8px 10px;
  border-radius:11px;
  background:rgba(239,68,68,.09);
  border:1px solid rgba(239,68,68,.18);
  color:#fca5a5;
  font-size:9.5px;
  font-weight:700;
}

.admin-finance-login-error.show{
  display:block;
}

.admin-finance-login-submit{
  width:100%;
  margin-top:14px;
  padding:12px 14px;
  border:1px solid rgba(56,189,248,.30);
  border-radius:14px;
  background:linear-gradient(135deg,#0284c7,#0369a1);
  color:#fff;
  font-family:inherit;
  font-size:12px;
  font-weight:900;
  box-shadow:0 8px 24px rgba(2,132,199,.18);
}

.admin-finance-login-submit:disabled{
  opacity:.6;
}

.admin-finance-login-cancel{
  margin-top:10px;
  padding:8px 12px;
  border:0;
  background:transparent;
  color:#8296a8;
  font-family:inherit;
  font-size:10px;
  font-weight:800;
}

.admin-finance-login-field input.shake{
  animation:adminFinanceFieldShake .35s ease;
}

.admin-finance-locked-state{
  min-height:55vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#8ca0b0;
}

.admin-finance-locked-icon{
  width:72px;
  height:72px;
  display:grid;
  place-items:center;
  border-radius:24px;
  margin-bottom:14px;
  background:rgba(56,189,248,.07);
  border:1px solid rgba(56,189,248,.16);
  font-size:28px;
}

.admin-finance-locked-state strong{
  color:#e7f2f7;
  font-size:16px;
}

.admin-finance-locked-state span{
  margin-top:5px;
  font-size:10px;
}

.admin-finance-locked-state button{
  margin-top:15px;
  border:1px solid rgba(56,189,248,.28);
  border-radius:13px;
  padding:9px 14px;
  background:rgba(56,189,248,.08);
  color:#7dd3fc;
  font-family:inherit;
  font-size:10px;
  font-weight:900;
}

@keyframes adminFinanceFieldShake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-7px)}
  40%{transform:translateX(6px)}
  60%{transform:translateX(-4px)}
  80%{transform:translateX(2px)}
}


/* ================================================================
   Finance Ledger v7 — loading/error/real-ledger notes
   ================================================================ */
.admin-finance-loading-ledger,
.admin-finance-ledger-error{
  min-height:48vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
  color:#8da2b1;
}

.admin-finance-loading-ledger > span{
  width:34px;
  height:34px;
  margin-bottom:12px;
  border-radius:50%;
  border:3px solid rgba(56,189,248,.12);
  border-top-color:#38bdf8;
  animation:adminFinanceLedgerSpin .8s linear infinite;
}

.admin-finance-loading-ledger strong,
.admin-finance-ledger-error strong{
  color:#e7f4fa;
  font-size:13px;
}

.admin-finance-ledger-error span{
  margin-top:6px;
  font-size:10px;
  line-height:1.5;
}

.admin-finance-ledger-error button{
  margin-top:14px;
  border:1px solid rgba(56,189,248,.26);
  border-radius:12px;
  padding:9px 14px;
  background:rgba(56,189,248,.08);
  color:#7dd3fc;
  font-family:inherit;
  font-size:10px;
  font-weight:900;
}

.admin-money-data-note-warn{
  margin-top:8px;
  border-color:rgba(245,158,11,.16)!important;
  background:rgba(245,158,11,.045)!important;
}

.admin-money-kind.remaining{
  border-color:rgba(168,85,247,.20);
  background:rgba(168,85,247,.07);
  color:#d8b4fe;
}

@keyframes adminFinanceLedgerSpin{
  to{transform:rotate(360deg)}
}


/* ================================================================
   Finance v8 — แยกตามทริป + ยอดเดิม
   ================================================================ */

.admin-money-stat em{
  display:block;
  margin-top:5px;
  color:#7590a1;
  font-size:8.5px;
  font-style:normal;
  font-weight:700;
}

.admin-finance-trip-toolbar{
  display:flex;
  align-items:center;
  gap:10px;
  margin:16px 0 14px;
}

.admin-finance-trip-toolbar .admin-money-search-wrap{
  flex:1;
}

.admin-finance-trip-count{
  flex:0 0 auto;
  color:#7dd3fc;
  font-size:9px;
  font-weight:900;
  padding:8px 10px;
  border-radius:999px;
  background:rgba(56,189,248,.06);
  border:1px solid rgba(56,189,248,.14);
}

.admin-finance-section-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin:6px 2px 12px;
}

.admin-finance-section-title strong{
  display:block;
  color:#ecf7fb;
  font-size:16px;
  font-weight:950;
}

.admin-finance-section-title span{
  display:block;
  margin-top:3px;
  color:#718696;
  font-size:9px;
}

.admin-finance-trip-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

.admin-finance-trip-card{
  width:100%;
  padding:16px;
  border:1px solid rgba(56,189,248,.14);
  border-radius:22px;
  background:
    linear-gradient(145deg,rgba(11,35,47,.88),rgba(5,18,28,.92));
  color:#fff;
  text-align:left;
  font-family:inherit;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 10px 28px rgba(0,0,0,.12);
}

.admin-finance-trip-card:active{
  transform:scale(.985);
}

.admin-finance-trip-top{
  display:flex;
  align-items:center;
  gap:11px;
}

.admin-finance-trip-icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(56,189,248,.08);
  border:1px solid rgba(56,189,248,.13);
  color:#67d7ff;
  font-size:19px;
  font-weight:950;
}

.admin-finance-trip-title{
  flex:1;
  min-width:0;
}

.admin-finance-trip-title strong{
  display:block;
  color:#edf8fb;
  font-size:13px;
  font-weight:950;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.admin-finance-trip-title span{
  display:block;
  margin-top:3px;
  color:#79909f;
  font-size:8.5px;
}

.admin-finance-trip-arrow{
  color:#5c7a8b;
  font-size:26px;
  line-height:1;
}

.admin-finance-trip-total{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  margin-top:15px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.055);
}

.admin-finance-trip-total small{
  color:#8498a6;
  font-size:9px;
  font-weight:700;
}

.admin-finance-trip-total strong{
  color:#6ee7b7;
  font-size:21px;
  font-weight:950;
}

.admin-finance-trip-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:10px;
}

.admin-finance-trip-meta span{
  padding:5px 8px;
  border-radius:999px;
  background:rgba(148,163,184,.055);
  border:1px solid rgba(148,163,184,.09);
  color:#879aaa;
  font-size:8px;
  font-weight:800;
}

.admin-finance-trip-meta span.live{
  color:#69d5ff;
  border-color:rgba(56,189,248,.13);
  background:rgba(56,189,248,.05);
}

.admin-finance-trip-detail-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.admin-finance-trip-back{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  border:1px solid rgba(56,189,248,.15);
  background:rgba(56,189,248,.055);
  color:#8edcff;
  font-family:inherit;
  font-size:27px;
}

.admin-finance-trip-detail-head span{
  display:block;
  color:#52cafa;
  font-size:7.5px;
  font-weight:950;
  letter-spacing:1.8px;
}

.admin-finance-trip-detail-head h2{
  margin:2px 0 0;
  color:#fff;
  font-size:20px;
  font-weight:950;
}

.admin-finance-trip-detail-head p{
  margin:3px 0 0;
  color:#7c91a0;
  font-size:9px;
}

.admin-finance-trip-detail-total{
  margin-bottom:14px;
  padding:17px;
  border-radius:21px;
  border:1px solid rgba(56,189,248,.14);
  background:linear-gradient(145deg,rgba(9,34,46,.9),rgba(4,17,26,.92));
}

.admin-finance-trip-detail-total > small{
  color:#8298a7;
  font-size:9px;
  font-weight:800;
}

.admin-finance-trip-detail-total > strong{
  display:block;
  margin-top:4px;
  color:#6ee7b7;
  font-size:29px;
  font-weight:950;
}

.admin-finance-trip-detail-total > div{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px;
}

.admin-finance-trip-detail-total > div span{
  padding:5px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.035);
  color:#8197a5;
  font-size:8px;
  font-weight:800;
}

.admin-money-badge-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
}

.admin-money-history-badge,
.admin-money-live-badge{
  display:inline-flex;
  align-items:center;
  padding:4px 7px;
  border-radius:999px;
  font-size:7px;
  font-weight:950;
}

.admin-money-history-badge{
  color:#fbbf24;
  background:rgba(245,158,11,.07);
  border:1px solid rgba(245,158,11,.14);
}

.admin-money-live-badge{
  color:#67d7ff;
  background:rgba(56,189,248,.06);
  border:1px solid rgba(56,189,248,.13);
}

.admin-money-card.is-historical{
  border-color:rgba(245,158,11,.10);
}

.admin-money-kind.historical-deposit,
.admin-money-kind.historical-full,
.admin-money-kind.historical-rental{
  color:#fbbf24;
  background:rgba(245,158,11,.06);
  border-color:rgba(245,158,11,.14);
}

@media (min-width:760px){
  .admin-finance-trip-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* ================================================================
   Finance v10 — สลับ รายทริป / เงินเข้าเรียลไทม์แบบธนาคาร
   ================================================================ */

.admin-finance-mode-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:14px 0 16px;
  padding:5px;
  border-radius:18px;
  background:rgba(4,15,23,.72);
  border:1px solid rgba(56,189,248,.10);
}

.admin-finance-mode-btn{
  min-height:47px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid transparent;
  border-radius:14px;
  background:transparent;
  color:#6e8494;
  font-family:inherit;
}

.admin-finance-mode-btn span{
  font-size:14px;
}

.admin-finance-mode-btn b{
  font-size:10px;
  font-weight:900;
}

.admin-finance-mode-btn.active{
  color:#eefaff;
  background:linear-gradient(145deg,rgba(15,48,63,.96),rgba(7,28,40,.96));
  border-color:rgba(56,189,248,.25);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 8px 18px rgba(0,0,0,.16);
}

.admin-bank-balance{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:19px;
  border-radius:23px;
  background:
    radial-gradient(circle at 88% 18%,rgba(16,185,129,.12),transparent 30%),
    linear-gradient(145deg,rgba(11,41,49,.94),rgba(4,20,29,.96));
  border:1px solid rgba(52,211,153,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.admin-bank-balance small{
  display:block;
  color:#7e949f;
  font-size:9px;
  font-weight:800;
}

.admin-bank-balance strong{
  display:block;
  margin-top:4px;
  color:#6ee7b7;
  font-size:31px;
  line-height:1;
  font-weight:950;
}

.admin-bank-balance > div:first-child > span{
  display:block;
  margin-top:7px;
  color:#59727f;
  font-size:8px;
  font-weight:800;
}

.admin-bank-live-orb{
  width:63px;
  height:63px;
  flex:0 0 63px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  border-radius:22px;
  background:rgba(16,185,129,.06);
  border:1px solid rgba(52,211,153,.13);
}

.admin-bank-live-orb span{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#34d399;
  box-shadow:0 0 0 5px rgba(52,211,153,.08),0 0 18px rgba(52,211,153,.5);
  animation:adminBankPulse 1.8s ease-in-out infinite;
}

.admin-bank-live-orb b{
  color:#6ee7b7;
  font-size:7px;
  letter-spacing:1.4px;
}

.admin-bank-latest{
  position:relative;
  margin-top:10px;
  padding:16px 17px;
  overflow:hidden;
  border-radius:20px;
  background:linear-gradient(145deg,rgba(8,29,40,.9),rgba(4,18,27,.92));
  border:1px solid rgba(56,189,248,.12);
}

.admin-bank-latest:after{
  content:"";
  position:absolute;
  width:100px;
  height:100px;
  right:-35px;
  top:-40px;
  border-radius:50%;
  background:rgba(56,189,248,.055);
  filter:blur(3px);
}

.admin-bank-latest-label{
  display:flex;
  align-items:center;
  gap:7px;
  color:#6f8796;
  font-size:8px;
  font-weight:900;
}

.admin-bank-latest-label span{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#34d399;
}

.admin-bank-latest > strong{
  display:block;
  margin-top:7px;
  color:#6ee7b7;
  font-size:22px;
  font-weight:950;
}

.admin-bank-latest p{
  margin:4px 0 0;
  color:#d8e8ef;
  font-size:10px;
  font-weight:800;
}

.admin-bank-latest small{
  display:block;
  margin-top:3px;
  color:#657d8b;
  font-size:8px;
}

.admin-bank-toolbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) 112px;
  gap:8px;
  margin:15px 0 12px;
}

.admin-bank-toolbar select{
  min-width:0;
  border:1px solid rgba(56,189,248,.13);
  border-radius:14px;
  background:rgba(4,17,26,.82);
  color:#b6c7d0;
  padding:0 10px;
  font-family:inherit;
  font-size:9px;
  font-weight:800;
  outline:none;
}

.admin-bank-list-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin:6px 2px 10px;
}

.admin-bank-list-head strong{
  display:block;
  color:#edf7fb;
  font-size:15px;
  font-weight:950;
}

.admin-bank-list-head div span{
  display:block;
  margin-top:2px;
  color:#6e8391;
  font-size:8px;
}

.admin-bank-list-head > span{
  color:#7190a1;
  font-size:8px;
  font-weight:800;
}

.admin-bank-feed{
  display:flex;
  flex-direction:column;
  gap:13px;
}

.admin-bank-day-group{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.admin-bank-day-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 3px;
}

.admin-bank-day-title strong{
  color:#93a8b4;
  font-size:9px;
  font-weight:900;
}

.admin-bank-day-title span{
  color:#607784;
  font-size:7px;
}

.admin-bank-day-list{
  overflow:hidden;
  border-radius:20px;
  background:rgba(5,18,27,.76);
  border:1px solid rgba(56,189,248,.085);
}

.admin-bank-row{
  display:flex;
  gap:11px;
  padding:14px 13px;
  background:transparent;
}

.admin-bank-row + .admin-bank-row{
  border-top:1px solid rgba(255,255,255,.045);
}

.admin-bank-avatar{
  position:relative;
  width:44px;
  height:44px;
  flex:0 0 44px;
  border-radius:15px;
  overflow:visible;
  background:rgba(56,189,248,.07);
  border:1px solid rgba(56,189,248,.10);
}

.admin-bank-avatar img,
.admin-bank-avatar .admin-money-avatar-fallback{
  width:100%;
  height:100%;
  border-radius:14px;
  object-fit:cover;
}

.admin-bank-avatar i{
  position:absolute;
  right:-2px;
  bottom:-2px;
  width:11px;
  height:11px;
  border-radius:50%;
  background:#34d399;
  border:2px solid #06141d;
}

.admin-bank-main{
  flex:1;
  min-width:0;
}

.admin-bank-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:9px;
}

.admin-bank-person{
  min-width:0;
  flex:1;
}

.admin-bank-person strong{
  display:block;
  color:#eaf6fa;
  font-size:11px;
  font-weight:950;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.admin-bank-person span{
  display:block;
  margin-top:3px;
  color:#748a98;
  font-size:7.8px;
  line-height:1.35;
}

.admin-bank-money{
  flex:0 0 auto;
  text-align:right;
}

.admin-bank-money strong{
  display:block;
  color:#6ee7b7;
  font-size:13px;
  font-weight:950;
}

.admin-bank-money span{
  display:block;
  margin-top:2px;
  color:#3f9b7b;
  font-size:7px;
  font-weight:900;
}

.admin-bank-bottom{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  margin-top:8px;
  color:#5f7684;
  font-size:7px;
}

.admin-bank-bottom button{
  margin-left:auto;
  padding:4px 7px;
  border-radius:8px;
  border:1px solid rgba(56,189,248,.12);
  background:rgba(56,189,248,.04);
  color:#6ecdf3;
  font-family:inherit;
  font-size:7px;
  font-weight:900;
}

.admin-bank-empty{
  min-height:250px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#6f8592;
}

.admin-bank-empty div{
  width:60px;
  height:60px;
  display:grid;
  place-items:center;
  margin-bottom:11px;
  border-radius:19px;
  background:rgba(56,189,248,.06);
  color:#53c9f8;
  font-size:25px;
  font-weight:950;
}

.admin-bank-empty strong{
  color:#dcecf2;
  font-size:13px;
}

.admin-bank-empty span{
  margin-top:4px;
  font-size:8px;
}

@keyframes adminBankPulse{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(.72);opacity:.55}
}

@media (max-width:430px){
  .admin-bank-toolbar{
    grid-template-columns:minmax(0,1fr) 104px;
  }
}


/* ================================================================
   Finance v11 — การ์ดรายทริปใช้รูปทริปจริงเป็นพื้นหลัง
   เปลี่ยนไอคอน ฿/B เป็น Bootstrap Icons cash-stack ผ่าน jsDelivr
   ================================================================ */

.admin-finance-trip-card.has-trip-photo{
  position:relative;
  isolation:isolate;
  min-height:190px;
  padding:0;
  overflow:hidden;
  background:#06131c;
  border:1px solid rgba(97,205,255,.20);
  box-shadow:
    0 14px 34px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-bg{
  position:absolute;
  inset:0;
  z-index:-4;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.025);
  filter:saturate(.94) contrast(1.06) brightness(.78);
  transition:transform .45s ease,filter .45s ease;
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-photo-shade{
  position:absolute;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(2,10,16,.94) 0%,rgba(3,13,20,.79) 45%,rgba(3,13,20,.40) 100%),
    linear-gradient(0deg,rgba(2,9,14,.94) 0%,rgba(2,11,17,.22) 61%,rgba(2,10,16,.40) 100%);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-photo-glow{
  position:absolute;
  inset:auto -30px -60px auto;
  z-index:-2;
  width:180px;
  height:180px;
  border-radius:50%;
  pointer-events:none;
  background:rgba(45,212,191,.12);
  filter:blur(42px);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-content{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:190px;
  padding:16px;
}

.admin-finance-trip-card.has-trip-photo:active{
  transform:scale(.985);
}

@media (hover:hover){
  .admin-finance-trip-card.has-trip-photo:hover .admin-finance-trip-bg{
    transform:scale(1.07);
    filter:saturate(1.02) contrast(1.08) brightness(.84);
  }
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  border-radius:15px;
  overflow:hidden;
  background:
    linear-gradient(145deg,rgba(14,61,76,.90),rgba(5,31,43,.90));
  border:1px solid rgba(108,220,255,.28);
  box-shadow:
    0 8px 20px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-icon img{
  width:23px;
  height:23px;
  object-fit:contain;
  filter:
    invert(81%)
    sepia(26%)
    saturate(1228%)
    hue-rotate(151deg)
    brightness(105%)
    contrast(101%);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-icon.icon-fallback::before{
  content:"฿";
  color:#67d7ff;
  font-size:20px;
  font-weight:950;
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-title strong{
  color:#fff;
  text-shadow:0 2px 12px rgba(0,0,0,.78);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-title span{
  color:#b0c2cb;
  text-shadow:0 1px 8px rgba(0,0,0,.72);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-arrow{
  color:#d2eef8;
  text-shadow:0 2px 10px rgba(0,0,0,.7);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-total{
  border-top:1px solid rgba(255,255,255,.12);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-total small{
  color:#b6c7ce;
  text-shadow:0 1px 8px rgba(0,0,0,.78);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-total strong{
  color:#72f0ba;
  text-shadow:0 2px 14px rgba(0,0,0,.68);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-meta span{
  background:rgba(3,16,24,.54);
  border-color:rgba(255,255,255,.10);
  color:#c6d5dc;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.admin-finance-trip-card.has-trip-photo .admin-finance-trip-meta span.live{
  color:#8fe5ff;
  border-color:rgba(90,208,255,.20);
  background:rgba(10,76,100,.30);
}
/* ==== css/82-admin-investors.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ADMIN > นักลงทุน — โทนเดียวกับหน้าแอดมิน (น้ำเงินเข้ม) + เขียวมรกตแทน "เงินที่คืนแล้ว" */
#adminView-investors{
  --iv-card:linear-gradient(150deg,rgba(15,33,49,.82),rgba(8,20,31,.72));
  --iv-line:rgba(148,163,184,.13); --iv-txt:#e6f0f6; --iv-mut:#8299ab; --iv-dim:#5f7688;
  --iv-mint:#34d399; --iv-mint-d:#059669; --iv-sky:#7dd3fc; --iv-gold:#fcd34d; --iv-red:#fb7185;
  color:var(--iv-txt);font-size:13px;padding-bottom:84px
}
#adminView-investors svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.inv-wrap{display:flex;flex-direction:column;gap:12px}

/* หัวหน้า */
.inv-head{display:flex;align-items:center;gap:10px;margin:2px 0 2px}
.inv-head>div:first-child,.inv-head-t{flex:1;min-width:0}
.inv-head h2{margin:0;font-size:20px;font-weight:800;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-head p{margin:2px 0 0;font-size:11.5px;color:var(--iv-mut)}
.inv-icon{flex:none;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;border:1px solid var(--iv-line);background:rgba(10,25,39,.6);color:#b6cad8;cursor:pointer;padding:0}
.inv-icon svg{width:19px;height:19px}
.inv-icon.danger{color:var(--iv-red);border-color:rgba(251,113,133,.28)}
.inv-icon:active{transform:scale(.94)}

/* สรุปรวม (หน้ารายชื่อ) */
.inv-total{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:18px;border:1px solid var(--iv-line);background:var(--iv-card);overflow:hidden}
.inv-total div{padding:12px 12px 11px}
.inv-total div+div{border-left:1px solid var(--iv-line)}
.inv-total small{display:block;font-size:10.5px;color:var(--iv-mut)}
.inv-total b{display:block;margin-top:2px;font-size:16px;color:#fff;font-variant-numeric:tabular-nums}
.inv-total b.g{color:var(--iv-mint)}

/* วงแหวนความคืบหน้า */
.inv-ring{position:relative;flex:none;width:var(--s);height:var(--s)}
.inv-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.inv-ring .trk{stroke:rgba(148,163,184,.16);stroke-width:8}
.inv-ring .val{stroke:var(--iv-mint);stroke-width:8;stroke-linecap:round;transition:stroke-dashoffset .5s ease}
.inv-ring-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.1}
.inv-ring-c b{font-size:13px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.inv-hero .inv-ring-c b{font-size:19px}
.inv-ring-c small{font-size:10px;color:var(--iv-mut);margin-top:3px}

/* การ์ดนักลงทุน */
.inv-list{display:flex;flex-direction:column;gap:9px}
.inv-card{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:13px;padding:12px 12px 12px 12px;border-radius:18px;border:1px solid var(--iv-line);background:var(--iv-card)}
.inv-card:active{transform:scale(.985)}
.inv-card:focus-visible{outline:2px solid var(--iv-sky);outline-offset:2px}
.inv-card-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.inv-card-top{display:flex;align-items:center;gap:8px}
.inv-card-top b{font-size:15px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-card small{font-size:11px;color:var(--iv-mut)}
.inv-card-num{display:flex;gap:14px;font-size:11.5px;color:#9fb3c3}
.inv-card-num b{color:#fff;font-variant-numeric:tabular-nums}
.inv-chev{font-style:normal;font-size:22px;color:var(--iv-dim)}
.inv-chip{flex:none;font-size:10.5px;font-weight:800;padding:2px 9px;border-radius:99px}
.inv-chip.on{background:rgba(52,211,153,.13);color:#6ee7b7}
.inv-chip.done{background:rgba(252,211,77,.14);color:var(--iv-gold)}
.inv-chip.new{background:rgba(125,211,252,.12);color:var(--iv-sky)}

/* ส่วนหัวรายคน */
.inv-hero{display:flex;align-items:center;gap:16px;padding:16px;border-radius:22px;border:1px solid rgba(52,211,153,.2);
  background:radial-gradient(120% 140% at 0 0,rgba(52,211,153,.13),transparent 55%),var(--iv-card)}
.inv-hero-tx{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.inv-hero-tx small{display:block;font-size:10.5px;color:var(--iv-mut)}
.inv-hero-tx b{font-size:22px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.inv-hero-tx b i{font-style:normal;font-size:12px;font-weight:600;color:var(--iv-mut)}
.inv-hero-tx .two{display:flex;gap:16px;width:100%}
.inv-hero-tx .two b{font-size:14px}

/* บัตรบัญชีรับเงิน */
.inv-paycard{position:relative;display:flex;flex-direction:column;gap:2px;padding:13px 15px;border-radius:18px;overflow:hidden;
  background:linear-gradient(135deg,#0f3d33 0%,#0b2a2f 60%,#0a1f2c 100%);border:1px solid rgba(52,211,153,.22)}
.inv-paycard::after{content:'';position:absolute;right:-30px;top:-40px;width:120px;height:120px;border-radius:50%;background:rgba(52,211,153,.08)}
.inv-paycard-top{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center}
.inv-paycard-top span{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#a7f3d0}
.inv-paycard-top svg{width:16px;height:16px}
.inv-paycard .acc{position:relative;z-index:1;font-size:20px;letter-spacing:1.5px;color:#fff;font-variant-numeric:tabular-nums;margin-top:6px}
.inv-paycard>small{position:relative;z-index:1;font-size:12px;color:#c3e9db}
.inv-paycard.empty{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:18px;border:1.5px dashed rgba(52,211,153,.35);color:#a7f3d0}
.inv-paycard.empty svg{width:22px;height:22px;flex:none}
.inv-paycard.empty b{display:block;font-size:13px}
.inv-paycard.empty small{font-size:11px;color:var(--iv-mut)}

/* กล่องหัวข้อ */
.inv-sec{padding:14px;border-radius:20px;border:1px solid var(--iv-line);background:var(--iv-card)}
.inv-sec.edit{border-color:rgba(125,211,252,.3)}
.inv-sec-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.inv-sec-hd h3{margin:0;font-size:14.5px;font-weight:800;color:#fff}
.inv-count{font-size:11px;color:var(--iv-mut)}
.inv-link{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;color:var(--iv-sky);padding:4px 8px;border-radius:9px}
.inv-link svg{width:15px;height:15px}
.inv-link:focus-visible{outline:2px solid var(--iv-sky)}
.inv-dl{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;margin:0}
.inv-dl div{min-width:0}.inv-dl .full{grid-column:1/-1}
.inv-dl dt{font-size:10.5px;color:var(--iv-mut)}
.inv-dl dd{margin:2px 0 0;font-size:13.5px;font-weight:700;color:#fff}
.inv-dl dd small{font-weight:500;color:var(--iv-mut)}
.inv-sub-hd{display:flex;align-items:center;gap:7px;margin:16px 0 9px;color:#a7f3d0;font-size:13px}
.inv-sub-hd svg{width:17px;height:17px}

/* ฟอร์ม */
.inv-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.inv-form label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--iv-mut);font-weight:700;min-width:0}
.inv-form .full{grid-column:1/-1}
.inv-form input,.inv-form select{font:inherit;font-size:15px;color:#fff;background:rgba(3,10,16,.55);border:1px solid rgba(148,163,184,.18);border-radius:12px;padding:0 12px;height:44px;min-width:0;width:100%;box-sizing:border-box;color-scheme:dark;-webkit-appearance:none;appearance:none}
.inv-form input::placeholder{color:#4e6577}
.inv-form input[type=date]{display:block;max-width:100%;line-height:44px;text-align:left}
.inv-form input[type=date]::-webkit-date-and-time-value{text-align:left;margin:0}
.inv-form select{background-image:linear-gradient(45deg,transparent 50%,#7f97aa 50%),linear-gradient(135deg,#7f97aa 50%,transparent 50%);background-position:calc(100% - 16px) 52%,calc(100% - 11px) 52%;background-size:5px 5px;background-repeat:no-repeat;padding-right:28px}
.inv-form input:focus,.inv-form select:focus{outline:none;border-color:#38bdf8;box-shadow:0 0 0 3px rgba(56,189,248,.15)}
/* สวิตช์ */
.inv-switch{flex-direction:row!important;align-items:center;gap:10px!important;font-weight:600!important;color:#c7d6e0!important;font-size:12px!important;cursor:pointer;padding:4px 0}
.inv-switch input{position:absolute;opacity:0;width:1px;height:1px}
.inv-switch .sw{flex:none;position:relative;width:42px;height:25px;border-radius:25px;background:rgba(148,163,184,.25);transition:background .15s}
.inv-switch .sw::after{content:'';position:absolute;left:3px;top:3px;width:19px;height:19px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.35)}
.inv-switch input:checked+.sw{background:var(--iv-mint-d)}
.inv-switch input:checked+.sw::after{transform:translateX(17px)}
.inv-switch input:focus-visible+.sw{outline:2px solid var(--iv-sky);outline-offset:2px}

/* ปุ่มเครื่องมือรายอาทิตย์ */
.inv-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
.inv-actions button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;padding:11px 4px 10px;border-radius:15px;border:1px solid var(--iv-line);background:rgba(3,10,16,.35);text-align:center;color:#d6e4ee}
.inv-actions svg{width:21px;height:21px;color:var(--iv-sky)}
.inv-actions span{font-size:11px;font-weight:700;line-height:1.3}
.inv-actions button:first-child svg{color:var(--iv-mint)}
.inv-actions button:active{transform:scale(.96);background:rgba(125,211,252,.08)}
.inv-actions button:focus-visible{outline:2px solid var(--iv-sky)}
.inv-sumtext{width:100%;box-sizing:border-box;font:inherit;font-size:12.5px;color:#fff;background:rgba(3,10,16,.6);border:1px solid rgba(148,163,184,.2);border-radius:12px;padding:10px;margin-bottom:10px}

/* แถวรายอาทิตย์ */
.inv-wks{display:flex;flex-direction:column;gap:7px}
.inv-wk{display:grid;grid-template-columns:30px minmax(0,1fr) 30px;grid-template-areas:"n d x" "n in p";gap:6px 10px;align-items:center;padding:10px 10px 10px 10px;border-radius:15px;background:rgba(3,10,16,.35);border:1px solid rgba(148,163,184,.08)}
.inv-wk-n{grid-area:n;align-self:start;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:12px;font-weight:800;color:var(--iv-sky);background:rgba(125,211,252,.1)}
.inv-wk-d{grid-area:d;min-width:0}
.inv-wk-d b{display:block;font-size:13px;color:#fff}
.inv-wk-d small{display:block;font-size:10.5px;color:var(--iv-dim);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-wk-x{grid-area:x;all:unset;grid-area:x;cursor:pointer;width:30px;height:30px;display:grid;place-items:center;border-radius:9px;color:var(--iv-dim)}
.inv-wk-x svg{width:15px;height:15px}
.inv-wk-in{grid-area:in;display:flex;align-items:center;gap:8px;min-width:0}
.inv-wk-in span,.inv-wk-p span{font-size:10.5px;color:var(--iv-mut);white-space:nowrap}
.inv-wk-in span{display:none}
.inv-wk-in input{font:inherit;font-size:15px;font-weight:700;color:#fff;width:100%;min-width:0;height:38px;box-sizing:border-box;padding:0 10px;text-align:right;border-radius:11px;border:1px solid rgba(148,163,184,.18);background:rgba(3,10,16,.6);font-variant-numeric:tabular-nums}
.inv-wk-in input:focus{outline:none;border-color:#38bdf8}
.inv-wk{grid-template-columns:30px minmax(0,1fr) 96px;grid-template-areas:"n d x" "n in p"}
.inv-wk-x{justify-self:end}
.inv-wk-p{flex-direction:column;align-items:flex-end!important;justify-content:center!important;height:38px;box-sizing:border-box;padding:3px 10px!important}
.inv-wk-p span{font-size:9.5px!important}
.inv-wk-p{grid-area:p;display:flex;justify-content:space-between;align-items:center;padding:6px 10px;border-radius:10px;background:rgba(148,163,184,.06)}
.inv-wk-p b{font-size:14px;color:var(--iv-dim);font-variant-numeric:tabular-nums}
.inv-wk-p.pos{background:rgba(52,211,153,.09)}
.inv-wk-p.pos b{color:var(--iv-mint)}
.inv-wk.neg .inv-wk-in input{color:#fda4af;border-color:rgba(251,113,133,.4)}
.inv-wk.end{border-color:rgba(252,211,77,.35);background:rgba(252,211,77,.05)}
.inv-hint{font-size:10.5px;color:var(--iv-dim);margin:10px 2px 0;line-height:1.55}

/* ว่าง / ล็อก / โหลด */
.inv-empty{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:28px 12px;color:var(--iv-mut);border-radius:20px;border:1px dashed var(--iv-line)}
.inv-empty.sm{padding:16px 10px}
.inv-empty b{color:#d6e4ee;font-size:14px}
.inv-empty span{font-size:11.5px}
.inv-empty .inv-btn{margin-top:10px}
.inv-empty-ic{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:rgba(125,211,252,.08);color:var(--iv-sky);margin-bottom:6px}
.inv-empty-ic svg{width:24px;height:24px}
.inv-lock{display:flex;flex-direction:column;align-items:center;text-align:center;padding:60px 20px}
.inv-lock-ic{width:64px;height:64px;border-radius:21px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(52,211,153,.18),rgba(14,165,233,.12));color:#a7f3d0;margin-bottom:14px}
.inv-lock-ic svg{width:30px;height:30px}
.inv-lock h3{margin:0;font-size:17px;color:#fff}
.inv-lock p{margin:5px 0 18px;font-size:12px;color:var(--iv-mut)}
.inv-loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:60px 0;color:var(--iv-mut)}

/* ปุ่ม */
.inv-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font:inherit;font-size:13.5px;font-weight:800;height:46px;padding:0 18px;border-radius:14px;border:1px solid var(--iv-line);background:rgba(10,25,39,.6);color:#dbe7ef;cursor:pointer}
.inv-btn svg{width:18px;height:18px}
.inv-btn.pri{background:linear-gradient(135deg,#0ea5e9,#0284c7);border-color:transparent;color:#fff;box-shadow:0 10px 22px -12px rgba(14,165,233,.9)}
.inv-btn.save{background:linear-gradient(135deg,#34d399,#059669);border-color:transparent;color:#03261a;height:42px;padding:0 16px}
.inv-btn.wide{width:100%}
.inv-btn:disabled{opacity:.6;cursor:default}
.inv-btn:active{transform:scale(.97)}
.inv-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.inv-spin{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:invSpin .7s linear infinite;display:inline-block}
@keyframes invSpin{to{transform:rotate(360deg)}}

/* แถบบันทึกลอยล่าง */
.inv-savebar{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:5;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding:8px 8px 8px 16px;border-radius:18px;
  background:rgba(8,22,33,.94);border:1px solid rgba(52,211,153,.35);box-shadow:0 14px 30px -10px rgba(0,0,0,.7);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.inv-savebar span{font-size:12.5px;font-weight:700;color:#c3e9db}

/* แจ้งเตือนลอย */
.inv-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:100000;display:flex;align-items:center;gap:9px;max-width:min(92vw,420px);padding:11px 16px 11px 12px;border-radius:16px;
  background:rgba(8,22,33,.97);border:1px solid rgba(148,163,184,.2);color:#e6f0f6;font-size:13px;font-weight:700;box-shadow:0 16px 36px -12px rgba(0,0,0,.8);
  transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:transform .22s ease,opacity .22s ease}
.inv-toast.show{transform:translate(-50%,0);opacity:1}
.inv-toast i{flex:none;width:26px;height:26px;border-radius:9px;display:grid;place-items:center}
.inv-toast i svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.inv-toast.ok i{background:rgba(52,211,153,.18);color:#6ee7b7}
.inv-toast.warn i,.inv-toast.error i{background:rgba(251,113,133,.16);color:#fda4af}
.inv-toast i.dot::after{content:'';width:8px;height:8px;border-radius:50%;background:#7dd3fc;animation:invPulse 1s ease-in-out infinite}
@keyframes invPulse{50%{opacity:.3}}

/* หน้าต่างยืนยัน */
.inv-cf-bg{position:fixed;inset:0;z-index:100001;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,0);transition:background .2s}
.inv-cf-bg.show{background:rgba(2,8,13,.6)}
.inv-cf{width:100%;max-width:440px;box-sizing:border-box;padding:22px 20px calc(18px + env(safe-area-inset-bottom,0px));border-radius:24px 24px 0 0;background:#0b1b28;border:1px solid rgba(148,163,184,.14);text-align:center;color:#e6f0f6;transform:translateY(100%);transition:transform .22s ease}
.inv-cf-bg.show .inv-cf{transform:none}
.inv-cf-ic{width:52px;height:52px;margin:0 auto 12px;border-radius:17px;display:grid;place-items:center;background:rgba(252,211,77,.12);color:var(--iv-gold,#fcd34d)}
.inv-cf-ic.danger{background:rgba(251,113,133,.14);color:#fb7185}
.inv-cf-ic svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.inv-cf h3{margin:0;font-size:17px;color:#fff}
.inv-cf p{margin:6px 0 18px;font-size:12.5px;color:#8299ab;line-height:1.5}
.inv-cf-btns{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.inv-cf-btns button{font:inherit;font-size:14px;font-weight:800;height:48px;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:rgba(10,25,39,.7);color:#dbe7ef;cursor:pointer}
.inv-cf-btns .danger{background:#e11d48;border-color:#e11d48;color:#fff}
.inv-cf-btns .pri{background:#0284c7;border-color:#0284c7;color:#fff}
.inv-cf-btns button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media(min-width:700px){.inv-cf-bg{align-items:center}.inv-cf{border-radius:24px}}
@media(max-width:360px){.inv-form{grid-template-columns:1fr}.inv-hero{flex-direction:column;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){.inv-toast,.inv-cf,.inv-cf-bg,.inv-ring .val{transition:none}.inv-spin{animation-duration:1.6s}}
/* ทริปในอาทิตย์ + สถานะค่าใช้จ่าย */
.inv-wk{grid-template-areas:"n d x" "n in p" "n tr tr"}
.inv-wk-trips{grid-area:tr;display:flex;flex-direction:column;gap:5px;min-width:0}
.inv-trip{all:unset;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 10px;border-radius:10px;font-size:11.5px;min-width:0}
.inv-trip span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#d6e4ee;font-weight:700}
.inv-trip em{flex:none;font-style:normal;font-weight:800;font-size:11px}
.inv-trip.ok{background:rgba(125,211,252,.07)}
.inv-trip.ok em{color:var(--iv-sky)}
.inv-trip.miss{background:rgba(252,211,77,.1);border:1px dashed rgba(252,211,77,.45)}
.inv-trip.miss em{color:var(--iv-gold)}
.inv-trip:focus-visible{outline:2px solid var(--iv-sky)}
.inv-trip:active{transform:scale(.98)}

/* ===== หน้าแอดมินบนมือถือ: กันหน้าหลักโผล่ตอนกรอกข้อมูล =====
   iPhone จะซูมเข้าเมื่อแตะช่องกรอกที่ตัวหนังสือเล็กกว่า 16px แล้วเลื่อนจอ → เห็นหน้าเว็บหลักด้านหลัง
   จึงให้ช่องกรอกในหน้าแอดมินใช้ 16px และล็อกหน้าเว็บด้านหลังไม่ให้เลื่อนขณะเปิดหน้าแอดมิน */
@media (max-width:899px){
  #adminCenter input:not([type=checkbox]):not([type=radio]),#adminCenter select,#adminCenter textarea{font-size:16px!important}
}
html.adm-open,html.adm-open body{overflow:hidden!important;overscroll-behavior:none;height:100%} /* คลาส adm-open ใส่โดย js/196-perf.js */
#adminCenter.show{height:100%;height:100dvh;overscroll-behavior:none}
#adminCenter .admin-body{overscroll-behavior:contain}
/* ==== css/124-admin-refunds.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · TNH-ECAEB7B82022 */
/* ADMIN > คืนเงิน — โทนเดียวกับหน้านักลงทุน */
#adminView-refunds{--rf-card:linear-gradient(150deg,rgba(15,33,49,.82),rgba(8,20,31,.72));--rf-line:rgba(148,163,184,.13);--rf-mut:#8299ab;
  --rf-mint:#34d399;--rf-amber:#fbbf24;--rf-sky:#7dd3fc;color:#e6f0f6;font-size:13px;padding-bottom:84px}
#adminView-refunds svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.rf-wrap{display:flex;flex-direction:column;gap:12px;max-width:760px;margin:0 auto}
.rf-head{display:flex;align-items:center;gap:10px}
.rf-head>div{flex:1;min-width:0}
.rf-head h2{margin:0;font-size:20px;font-weight:800;color:#fff}
.rf-head p{margin:2px 0 0;font-size:11.5px;color:var(--rf-mut)}
.rf-icon{flex:none;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;border:1px solid var(--rf-line);background:rgba(10,25,39,.6);color:#b6cad8;cursor:pointer;padding:0}
.rf-icon svg{width:19px;height:19px}
.rf-sum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:18px;border:1px solid var(--rf-line);background:var(--rf-card);overflow:hidden}
.rf-sum div{padding:12px}
.rf-sum div+div{border-left:1px solid var(--rf-line)}
.rf-sum div.warn{background:rgba(251,191,36,.08)}
.rf-sum small{display:block;font-size:10.5px;color:var(--rf-mut)}
.rf-sum b{display:block;margin-top:2px;font-size:17px;color:var(--rf-amber);font-variant-numeric:tabular-nums}
.rf-sum b.g{color:var(--rf-mint)}.rf-sum b.s{color:var(--rf-sky)}
.rf-sum em{display:block;font-style:normal;font-size:10.5px;color:var(--rf-mut)}
.rf-tabs{display:flex;gap:6px}
.rf-tabs button{flex:1;height:38px;border-radius:12px;border:1px solid var(--rf-line);background:rgba(10,25,39,.55);color:#b6cad8;font:inherit;font-weight:700;cursor:pointer}
.rf-tabs button.on{background:linear-gradient(135deg,rgba(52,211,153,.2),rgba(52,211,153,.05));border-color:rgba(52,211,153,.5);color:#fff}
.rf-tabs i{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:4px;border-radius:9px;background:var(--rf-amber);color:#1f1300;font-style:normal;font-size:11px}
.rf-list{display:flex;flex-direction:column;gap:10px}
.rf-card{padding:14px;border-radius:18px;border:1px solid rgba(251,191,36,.35);background:var(--rf-card)}
.rf-card.paid{border-color:var(--rf-line);opacity:.85}
.rf-top{display:flex;align-items:flex-start;gap:10px}
.rf-who{flex:1;min-width:0}
.rf-who b{display:block;font-size:15px;color:#fff}
.rf-who small{display:block;font-size:11px;color:var(--rf-mut)}
.rf-amt{text-align:right}
.rf-amt b{font-size:22px;color:var(--rf-amber);font-variant-numeric:tabular-nums}
.rf-card.paid .rf-amt b{color:var(--rf-mint)}
.rf-amt small{margin-left:3px;font-size:11px;color:var(--rf-mut)}
.rf-trip{margin-top:6px;font-size:12px;color:#cfe0ea}
.rf-trip span{display:block;font-size:10.5px;color:var(--rf-mut)}
.rf-to{display:flex;align-items:center;gap:8px;margin-top:10px;padding:10px 10px 10px 12px;border-radius:14px;background:rgba(3,10,16,.5);border:1px solid var(--rf-line)}
.rf-to>div{flex:1;min-width:0}
.rf-to small{display:block;font-size:10.5px;color:var(--rf-mut)}
.rf-to b{display:block;font-size:15px;color:#fff;word-break:break-all;font-variant-numeric:tabular-nums}
.rf-ic{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;border:1px solid rgba(125,211,252,.35);background:rgba(125,211,252,.1);color:var(--rf-sky);cursor:pointer;padding:0;text-decoration:none}
.rf-ic svg{width:18px;height:18px}
.rf-note{margin-top:8px;font-size:11px;color:var(--rf-mut);line-height:1.5}
.rf-go{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;margin-top:12px;border:0;border-radius:14px;background:linear-gradient(135deg,#34d399,#059669);color:#04221a;font:inherit;font-size:14px;font-weight:800;cursor:pointer;box-shadow:0 10px 24px rgba(5,150,105,.3)}
.rf-go svg{width:18px;height:18px}
.rf-go.armed{background:linear-gradient(135deg,#fbbf24,#d97706);color:#1f1300;animation:rfPulse 1s ease-in-out infinite}
.rf-go:disabled{opacity:.6}
@keyframes rfPulse{50%{transform:scale(1.015)}}
.rf-done{display:flex;align-items:center;gap:8px;margin-top:12px;color:var(--rf-mint);font-weight:700;font-size:12.5px}
.rf-done>svg{width:18px;height:18px}
.rf-done span{flex:1}
.rf-undo{display:flex;align-items:center;gap:5px;height:32px;padding:0 10px;border-radius:10px;border:1px solid var(--rf-line);background:transparent;color:var(--rf-mut);font:inherit;font-size:11.5px;cursor:pointer}
.rf-undo svg{width:14px;height:14px}
.rf-empty{padding:30px 12px;text-align:center;color:var(--rf-mut);border-radius:18px;border:1px dashed var(--rf-line)}
.rf-err{padding:12px;border-radius:14px;background:rgba(244,63,94,.12);border:1px solid rgba(244,63,94,.4);color:#fecdd3}
.rf-toast{position:fixed;left:50%;bottom:90px;z-index:100000;transform:translate(-50%,20px);opacity:0;padding:11px 16px;border-radius:14px;background:rgba(3,10,16,.94);border:1px solid rgba(52,211,153,.5);color:#fff;font-size:13px;transition:.25s;pointer-events:none;max-width:88vw;text-align:center}
.rf-toast.show{opacity:1;transform:translate(-50%,0)}
.rf-acn{display:block;margin-top:2px;font-size:12px;color:#cfe0ea}
.rf-bank{flex:none;width:38px;height:38px;border-radius:50%;background:#fff}

/* ---------- แท็บเครดิตรายคน ---------- */
.rf-sum .cr-sum{cursor:pointer}
.rf-sum .cr-sum:hover,.rf-sum .cr-sum:focus-visible{background:rgba(125,211,252,.07);outline:none}
.rf-sum .cr-sum em{color:var(--rf-sky)}
.cr-search input{width:100%;height:42px;padding:0 14px;border-radius:13px;border:1px solid var(--rf-line);background:rgba(3,10,16,.5);color:#e6f0f6;font:inherit;font-size:14px;box-sizing:border-box}
.cr-search input:focus{outline:none;border-color:rgba(125,211,252,.5)}
.cr-sec{margin:4px 2px -2px;font-size:11.5px;font-weight:700;color:var(--rf-mut)}
.cr-card{border-radius:18px;border:1px solid rgba(125,211,252,.3);background:var(--rf-card);overflow:hidden}
.cr-card.zero{border-color:var(--rf-line);opacity:.75}
.cr-card.zero .rf-amt b{color:var(--rf-mut)}
.cr-card .rf-amt b{color:var(--rf-sky)}
.cr-top{display:flex;align-items:center;gap:11px;width:100%;padding:12px 14px;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.cr-av{flex:none;width:40px;height:40px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:rgba(125,211,252,.14);color:var(--rf-sky);font-weight:800;font-size:16px}
.cr-av img{width:100%;height:100%;object-fit:cover}
.cr-body{padding:0 14px 14px}
.cr-mini{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.cr-mini span{flex:1;min-width:84px;padding:7px 9px;border-radius:11px;background:rgba(3,10,16,.5);border:1px solid var(--rf-line);font-size:10.5px;color:var(--rf-mut)}
.cr-mini b{display:block;font-size:14px;color:#e6f0f6;font-variant-numeric:tabular-nums}
.cr-mini b.g{color:var(--rf-mint)}.cr-mini b.s{color:var(--rf-sky)}
.cr-hist{list-style:none;margin:0;padding:0}
.cr-hist li{display:flex;align-items:flex-start;gap:10px;padding:9px 2px;border-top:1px solid var(--rf-line)}
.cr-hist li div{flex:1;min-width:0}
.cr-hist b{display:block;font-size:12.5px;color:#e6f0f6}
.cr-hist small{display:block;font-size:10.5px;color:var(--rf-mut);overflow-wrap:anywhere}
.cr-hist em{flex:none;font-style:normal;font-weight:800;font-size:14px;font-variant-numeric:tabular-nums}
.cr-hist em.pos{color:var(--rf-mint)}.cr-hist em.neg{color:#fca5a5}
.cr-call{display:flex;align-items:center;justify-content:center;gap:7px;height:40px;margin-top:10px;border-radius:12px;border:1px solid rgba(125,211,252,.35);background:rgba(125,211,252,.1);color:var(--rf-sky);font-weight:700;text-decoration:none}
.cr-call svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* ==== css/90-equipment-payment.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ============================================================
   EQUIPMENT PAYMENT — QR / SLIP / RECEIPT
   ============================================================ */
#equipPayModal{
  position:fixed;
  inset:0;
  z-index:22000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(2,7,13,.82);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
#equipPayModal.show{display:flex;animation:eqPayFade .18s ease both}
@keyframes eqPayFade{from{opacity:0}to{opacity:1}}
.eq-pay-box{
  position:relative;
  width:min(100%,430px);
  max-height:90vh;
  overflow-y:auto;
  padding:22px 18px 18px;
  border:1px solid rgba(125,211,252,.18);
  border-radius:22px;
  background:
    radial-gradient(circle at 100% 0,rgba(56,189,248,.09),transparent 28%),
    linear-gradient(145deg,#102033,#0c1524);
  box-shadow:0 28px 80px rgba(0,0,0,.55);
}
.eq-pay-x{
  position:absolute;right:11px;top:11px;
  width:36px;height:36px;border-radius:12px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(6,16,26,.68);color:#dbeafe;font-size:20px
}
.eq-pay-head{text-align:center;margin-top:4px}
.eq-pay-head h3{margin:0;color:#fff;font-size:19px}
.eq-pay-head p{margin:5px 0 0;color:#8197aa;font-size:10px;line-height:1.5}
.eq-pay-trip{
  margin:13px 0 0;
  padding:10px 11px;
  border:1px solid rgba(148,163,184,.12);
  border-radius:13px;
  background:rgba(5,16,26,.50);
  color:#b8c9d7;font-size:10px;line-height:1.5
}
.eq-pay-trip strong{color:#eef8ff}
.eq-pay-total{
  margin:10px 0 13px;
  padding:12px;
  text-align:center;
  border:1px solid rgba(125,211,252,.15);
  border-radius:15px;
  background:rgba(56,189,248,.055)
}
.eq-pay-total small{display:block;color:#7d94a8;font-size:9px}
.eq-pay-total strong{
  display:block;margin-top:4px;color:#7dd3fc;font-size:27px;line-height:1;font-weight:900
}
.eq-pay-qr{
  width:185px;
  margin:0 auto 13px;
  display:block;
  border:5px solid #fff;
  border-radius:15px;
  background:#fff;
  box-shadow:0 10px 28px rgba(0,0,0,.26)
}
#equipPayModal .slip-upload{margin:8px 0 12px}
#equipPayModal .btn-pay-ok{
  width:100%;
  min-height:48px;
  border:0;border-radius:14px;
  background:linear-gradient(135deg,#0284c7,#38bdf8);
  color:#fff;font:inherit;font-size:12px;font-weight:850;
  box-shadow:0 10px 25px rgba(2,132,199,.20)
}
#equipPayModal .btn-pay-ok:disabled{opacity:.45;box-shadow:none}
.eq-pay-note{
  margin-top:10px;text-align:center;color:#6f8598;font-size:9px;line-height:1.55
}
#equipReceiptPage .eqr-paid-status{
  margin:10px 0 0;
  padding:9px 11px;
  border-radius:11px;
  text-align:center;
  background:rgba(34,197,94,.08);
  border:1px solid rgba(34,197,94,.16);
  color:#86efac;
  font-size:10px;
  font-weight:800
}
@media(min-width:900px){
  .eq-pay-box{width:min(900px,92vw);display:grid;grid-template-columns:300px minmax(0,1fr);gap:12px 24px;padding:26px}
  .eq-pay-x{grid-column:1/-1}
  .eq-pay-head{grid-column:1/-1;text-align:left}
  .eq-pay-head h3{font-size:27px}
  .eq-pay-head p{font-size:14px}
  .eq-pay-trip{grid-column:1;grid-row:2;font-size:13px}
  .eq-pay-total{grid-column:1;grid-row:3}
  .eq-pay-qr{grid-column:1;grid-row:4;width:245px}
  #equipPayModal .slip-upload{grid-column:2;grid-row:2/5;margin:0}
  #equipPayModal .btn-pay-ok{grid-column:2;grid-row:5;font-size:17px}
  .eq-pay-note{grid-column:1/-1;font-size:12px}
}

/* ================================================================
   EQUIPMENT PAYMENT — FOREST GLASS VISUAL ONLY
   ไม่แตะระบบเช่า / QR / slip / submit / EasySlip / receipt
   ================================================================ */
#equipPayModal{
  background:
    linear-gradient(180deg,rgba(3,8,13,.72),rgba(3,8,13,.88)),
    url('/ximg.php?f=1448375240586-882707db888b-1200.jpg') center/cover fixed no-repeat!important;
  backdrop-filter:blur(9px)!important;
  -webkit-backdrop-filter:blur(9px)!important;
}

#equipPayModal .eq-pay-box{
  background:
    linear-gradient(145deg,rgba(8,20,31,.82),rgba(6,15,25,.88)),
    url('/ximg.php?f=1448375240586-882707db888b-1200.jpg') center/cover no-repeat!important;
  border:1px solid rgba(125,211,252,.14)!important;
  box-shadow:
    0 28px 72px rgba(0,0,0,.50),
    inset 0 1px 0 rgba(255,255,255,.04)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}

#equipPayModal .eq-pay-box::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  border-radius:inherit!important;
  background:
    radial-gradient(circle at 10% 0%,rgba(56,189,248,.07),transparent 29%),
    linear-gradient(180deg,rgba(5,12,21,.08),rgba(3,9,16,.30))!important;
}

#equipPayModal .eq-pay-box > *{
  position:relative!important;
  z-index:1!important;
}

#equipPayModal .eq-pay-trip{
  background:rgba(7,18,30,.60)!important;
  border-color:rgba(148,163,184,.10)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}

#equipPayModal .eq-pay-total{
  background:rgba(9,31,43,.58)!important;
  border-color:rgba(125,211,252,.16)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}

#equipPayModal .slip-drop{
  background:rgba(8,20,32,.66)!important;
  border-color:rgba(148,163,184,.14)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}

#equipPayModal .slip-drop.has-file{
  background:rgba(8,42,32,.54)!important;
  border-color:rgba(52,211,153,.34)!important;
}

#equipPayModal .eq-pay-qr{
  background:#fff!important;
  box-shadow:
    0 12px 30px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,255,255,.15)!important;
}

#equipPayModal .eq-pay-x{
  background:rgba(7,16,27,.72)!important;
  border-color:rgba(148,163,184,.13)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}

#equipPayModal .eq-pay-note{
  color:#7d91a3!important;
}

@media(max-width:430px){
  #equipPayModal{
    background:
      linear-gradient(180deg,rgba(3,8,13,.76),rgba(3,8,13,.90)),
      url('/ximg.php?f=1448375240586-882707db888b-1200.jpg') center/cover no-repeat!important;
  }
}

/* ================================================================
   EQUIPMENT QR PAYMENT HEADER ALIGNMENT — VISUAL ONLY
   ================================================================ */
#equipPayModal .eq-pay-box{
  position:relative!important;
  padding-top:58px!important;
}

/* ปุ่มปิดอยู่มุมขวาบนจริง */
#equipPayModal .eq-pay-x{
  position:absolute!important;
  top:14px!important;
  right:14px!important;
  left:auto!important;
  margin:0!important;
  z-index:8!important;
  width:36px!important;
  height:36px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:50%!important;
}

/* หัวส่วนค่าเช่าให้อยู่สูงขึ้นและสมดุลกับ QR pages อื่น */
#equipPayModal .eq-pay-head{
  position:relative!important;
  z-index:2!important;
  margin:0 38px 12px!important;
  text-align:center!important;
}

#equipPayModal .eq-pay-head h3{
  margin:0 0 4px!important;
  line-height:1.22!important;
}

#equipPayModal .eq-pay-head p{
  margin:0!important;
  line-height:1.4!important;
}

/* ขยับองค์ประกอบแรกขึ้นให้ไม่เกิดช่องว่างด้านบน */
#equipPayModal .eq-pay-trip{
  margin-top:0!important;
}

@media(max-width:430px){
  #equipPayModal .eq-pay-box{
    padding-top:54px!important;
  }

  #equipPayModal .eq-pay-x{
    top:12px!important;
    right:12px!important;
    width:34px!important;
    height:34px!important;
  }

  #equipPayModal .eq-pay-head{
    margin-left:30px!important;
    margin-right:30px!important;
  }
}
/* ==== css/91-admin-trip-navigation.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ============================================================
   ADMIN CENTER — FOREST TRIP-FIRST NAVIGATION
   การจอง / เช่าอุปกรณ์ / จุดขึ้นรถ เริ่มจากการ์ดรายทริป
   ============================================================ */
#adminCenter{
  background:
    linear-gradient(180deg,rgba(3,10,16,.91),rgba(3,10,16,.97)),
    url('/ximg.php?f=1448375240586-882707db888b-1800.jpg')
    center center / cover no-repeat fixed !important;
}
#adminCenter::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 88% 4%,rgba(56,189,248,.09),transparent 28%),
    radial-gradient(circle at 8% 78%,rgba(22,101,52,.10),transparent 30%);
}
#adminCenter > *{position:relative;z-index:1}
#adminCenter .admin-topbar{
  background:rgba(4,13,21,.72);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
#adminCenter .admin-nav{
  background:rgba(4,13,21,.62);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
#adminCenter .admin-body{
  background:transparent;
}

/* หน้าเลือกทริป */
.admin-trip-first-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  margin:2px 1px 13px;
}
.admin-trip-first-head h2{
  margin:0;color:#fff;font-size:18px;font-weight:850;
}
.admin-trip-first-head p{
  margin:4px 0 0;color:#7890a4;font-size:9px;line-height:1.45;
}
.admin-trip-first-count{
  flex:0 0 auto;
  padding:6px 8px;
  border:1px solid rgba(125,211,252,.14);
  border-radius:10px;
  background:rgba(56,189,248,.06);
  color:#8bdfff;font-size:8.5px;font-weight:800;
}
.admin-trip-first-search{
  position:relative;
  margin-bottom:11px;
}
.admin-trip-first-search::before{
  content:"⌕";
  position:absolute;left:12px;top:50%;transform:translateY(-50%);
  color:#6f879b;font-size:17px;pointer-events:none;
}
.admin-trip-first-search input{
  width:100%;height:44px;padding:0 12px 0 36px;
  border:1px solid rgba(148,163,184,.13);
  border-radius:13px;outline:none;
  background:rgba(7,20,31,.55);
  color:#e7f4fd;font:inherit;font-size:10px;
  backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);
}
.admin-trip-first-search input:focus{
  border-color:rgba(125,211,252,.42);
  box-shadow:0 0 0 3px rgba(56,189,248,.055);
}

.admin-group-trip-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.admin-group-trip-card{
  position:relative;
  min-height:145px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.14);
  border-radius:19px;
  background:rgba(8,22,34,.62);
  box-shadow:0 13px 30px rgba(0,0,0,.18);
  cursor:pointer;
  isolation:isolate;
  animation:admTripCardIn .30s ease both;
  animation-delay:var(--adm-delay,0ms);
}
@keyframes admTripCardIn{
  from{opacity:0;transform:translateY(7px)}
  to{opacity:1;transform:none}
}
.admin-group-trip-card:active{transform:scale(.988)}
.admin-group-trip-card .adm-trip-bg{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;
  filter:brightness(.48) saturate(.78);
  transition:transform .45s ease,filter .25s ease;
}
.admin-group-trip-card::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(90deg,rgba(3,10,17,.96) 0%,rgba(3,10,17,.72) 57%,rgba(3,10,17,.28) 100%),
    linear-gradient(0deg,rgba(3,10,17,.46),transparent 60%);
}
.admin-group-trip-card:active .adm-trip-bg{transform:scale(1.025)}
.admin-group-trip-content{
  position:relative;z-index:2;
  min-height:145px;padding:15px;
  display:flex;flex-direction:column;justify-content:flex-end;
}
.admin-group-trip-date{
  width:max-content;
  margin-bottom:7px;padding:4px 7px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:8px;
  background:rgba(3,12,20,.48);
  color:#b7c9d8;font-size:8px;font-weight:750;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.admin-group-trip-title{
  margin:0;color:#fff;font-size:15px;font-weight:900;line-height:1.25;
  text-shadow:0 2px 10px rgba(0,0,0,.45);
}
.admin-group-trip-sub{
  margin:4px 0 0;color:#a2b4c3;font-size:9px;line-height:1.4;
}
.admin-group-kpis{
  display:flex;flex-wrap:wrap;gap:5px;margin-top:9px;
}
.admin-group-kpi{
  padding:5px 7px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  background:rgba(3,12,20,.48);
  color:#aebfcd;font-size:8px;
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
}
.admin-group-kpi b{color:#eaf7ff;font-weight:850}
.admin-group-open{
  position:absolute;z-index:3;right:13px;top:13px;
  width:32px;height:32px;border-radius:11px;
  display:grid;place-items:center;
  border:1px solid rgba(125,211,252,.18);
  background:rgba(4,14,23,.58);
  color:#7dd3fc;font-size:17px;
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
}

/* รายละเอียดทริป */
.admin-detail-top{
  display:flex;align-items:center;gap:9px;margin-bottom:12px;
}
.admin-back-trip{
  width:39px;height:39px;flex:0 0 auto;
  border:1px solid rgba(148,163,184,.14);border-radius:12px;
  background:rgba(8,22,34,.60);color:#d5e7f3;font-size:18px;
}
.admin-detail-copy{min-width:0;flex:1}
.admin-detail-copy h2{
  margin:0;color:#fff;font-size:15px;font-weight:850;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.admin-detail-copy p{margin:3px 0 0;color:#748ca1;font-size:8.5px}
.admin-detail-summary{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;
  margin-bottom:11px;
}
.admin-detail-stat{
  padding:10px;
  border:1px solid rgba(148,163,184,.12);
  border-radius:13px;
  background:rgba(8,22,34,.53);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.admin-detail-stat strong{
  display:block;color:#eef8ff;font-size:17px;line-height:1;
}
.admin-detail-stat small{
  display:block;margin-top:4px;color:#71889d;font-size:8px;
}
.admin-rental-detail-summary .admin-rental-total-stat{
  grid-column:1 / -1;
}

/* จุดขึ้นรถ */
.admin-pickup-point-list{display:grid;gap:8px;margin-bottom:12px}
.admin-pickup-point{
  overflow:hidden;
  border:1px solid rgba(148,163,184,.12);
  border-radius:15px;
  background:rgba(8,22,34,.53);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.admin-pickup-point-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:10px 11px;
  border-bottom:1px solid rgba(148,163,184,.08);
}
.admin-pickup-point-head strong{color:#e9f6ff;font-size:10.5px}
.admin-pickup-point-head span{
  padding:4px 6px;border-radius:8px;
  background:rgba(56,189,248,.07);color:#7dd3fc;font-size:8px;font-weight:800;
}
.admin-pickup-persons{padding:5px 9px 8px}
.admin-pickup-person{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;
  padding:7px 2px;border-bottom:1px dashed rgba(148,163,184,.08);
}
.admin-pickup-person:last-child{border-bottom:0}
.admin-pickup-person b{
  color:#cfe0ec;font-size:9px;font-weight:750;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.admin-pickup-person small{color:#70879b;font-size:8px}

/* รายการเช่า */
.admin-rent-paid{
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 6px;border-radius:8px;
  background:rgba(52,211,153,.07);
  border:1px solid rgba(52,211,153,.14);
  color:#6ee7b7;font-size:7.5px;font-weight:800;
}
.admin-rent-unpaid{
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 6px;border-radius:8px;
  background:rgba(251,191,36,.07);
  border:1px solid rgba(251,191,36,.14);
  color:#fcd34d;font-size:7.5px;font-weight:800;
}

@media(min-width:700px){
  .admin-group-trip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:1100px){
  .admin-group-trip-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
  .admin-group-trip-card,.admin-group-trip-content{min-height:190px}
  .admin-group-trip-title{font-size:19px}
  .admin-group-trip-sub,.admin-group-kpi{font-size:11px}
  .admin-detail-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
  .admin-rental-detail-summary{grid-template-columns:repeat(5,minmax(0,1fr))}
  .admin-rental-detail-summary .admin-rental-total-stat{grid-column:auto}
  .admin-detail-copy h2{font-size:23px}
  .admin-detail-copy p{font-size:12px}
  .admin-pickup-point-head strong{font-size:14px}
  .admin-pickup-person b{font-size:12px}
  .admin-pickup-person small{font-size:11px}
}




/* ================================================================
   ADMIN BOOKING DETAIL — สรุปจำนวนผู้โดยสารตามจุดขึ้นรถ
   ================================================================ */
.admin-pickup-summary-card{
  position:relative;
  overflow:hidden;
  margin:12px 0 13px;
  padding:13px;
  border-radius:18px;
  border:1px solid rgba(125,211,252,.11);
  background:
    linear-gradient(135deg,rgba(7,20,33,.95),rgba(5,15,25,.97)),
    url('/ximg.php?f=1448375240586-882707db888b-900.jpg') center/cover no-repeat;
  box-shadow:0 14px 34px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025);
}
.admin-pickup-summary-card::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 10% 0%,rgba(56,189,248,.065),transparent 32%),
    linear-gradient(100deg,transparent 22%,rgba(255,255,255,.022) 50%,transparent 76%);
  transform:translateX(-75%);
  animation:admPickupSweep 7s ease-in-out infinite;
}
.admin-pickup-summary-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.admin-pickup-summary-head small{
  display:block;
  margin-bottom:3px;
  color:#78a7c0;
  font-size:8px;
  font-weight:800;
  letter-spacing:.2px;
}
.admin-pickup-summary-head h3{
  margin:0;
  color:#eff8fd;
  font-size:11px;
  line-height:1.25;
  font-weight:850;
}
.admin-pickup-summary-head > span{
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(56,189,248,.14);
  background:rgba(56,189,248,.06);
  color:#a6ddf6;
  font-size:8px;
  font-weight:850;
}
.admin-pickup-summary-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.admin-pickup-summary-item{
  min-width:0;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  padding:9px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.085);
  background:rgba(4,14,23,.56);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
  animation:admPickupItemIn .38s cubic-bezier(.2,.82,.2,1) both;
  animation-delay:var(--pickup-delay,0ms);
}
.admin-pickup-summary-item.missing{
  border-color:rgba(251,191,36,.14);
  background:rgba(55,38,8,.20);
}
.admin-pickup-summary-icon{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:10px;
  border:1px solid rgba(56,189,248,.11);
  background:rgba(56,189,248,.055);
  font-size:13px;
}
.admin-pickup-summary-item.missing .admin-pickup-summary-icon{
  border-color:rgba(251,191,36,.13);
  background:rgba(251,191,36,.055);
}
.admin-pickup-summary-copy{
  min-width:0;
}
.admin-pickup-summary-copy strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#dcecf5;
  font-size:8.8px;
  font-weight:800;
}
.admin-pickup-summary-copy small{
  display:block;
  margin-top:2px;
  color:#667f92;
  font-size:7px;
}
.admin-pickup-summary-item.missing .admin-pickup-summary-copy strong{
  color:#f7d88b;
}
.admin-pickup-summary-count{
  min-width:42px;
  padding:5px 6px;
  border-radius:10px;
  text-align:center;
  border:1px solid rgba(56,189,248,.10);
  background:rgba(56,189,248,.045);
}
.admin-pickup-summary-count b{
  display:block;
  color:#7dd3fc;
  font-size:14px;
  line-height:1;
  font-weight:900;
}
.admin-pickup-summary-count small{
  display:block;
  margin-top:2px;
  color:#6e879a;
  font-size:6.5px;
  font-weight:750;
}
.admin-pickup-summary-item.missing .admin-pickup-summary-count{
  border-color:rgba(251,191,36,.12);
  background:rgba(251,191,36,.045);
}
.admin-pickup-summary-item.missing .admin-pickup-summary-count b{
  color:#fbbf24;
}
@keyframes admPickupItemIn{
  from{opacity:0;transform:translateY(6px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes admPickupSweep{
  0%,70%,100%{transform:translateX(-75%);opacity:.25}
  82%{transform:translateX(75%);opacity:.65}
}
@media(max-width:390px){
  .admin-pickup-summary-grid{grid-template-columns:1fr}
}
@media(min-width:900px){
  .admin-pickup-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .admin-pickup-summary-head h3{font-size:14px}
  .admin-pickup-summary-copy strong{font-size:11px}
  .admin-pickup-summary-count b{font-size:18px}
}
/* ==== css/92-leaderboard-premium.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ============================================================
   สายลุยตัวจริง — PREMIUM FOREST CHAMPIONS
   ============================================================ */
#topTravelersPodium{
  position:relative;
  margin:2px 0 4px;
  overflow:hidden;
  border:1px solid rgba(244,210,116,.16);
  border-radius:24px;
  background:
    linear-gradient(180deg,rgba(3,11,16,.70),rgba(3,10,15,.94)),
    url('/ximg.php?f=1448375240586-882707db888b-1200.jpg')
    center 42% / cover no-repeat;
  box-shadow:
    0 18px 42px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.025);
  isolation:isolate;
}
#topTravelersPodium::before{
  content:"";
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(circle at 50% 38%,rgba(244,194,65,.13),transparent 25%),
    radial-gradient(circle at 15% 58%,rgba(148,163,184,.07),transparent 24%),
    radial-gradient(circle at 86% 61%,rgba(217,160,102,.07),transparent 24%);
}
#topTravelersPodium::after{
  content:"";
  position:absolute;
  left:10%;right:10%;bottom:-30px;height:70px;
  border-radius:50%;
  background:rgba(239,183,56,.12);
  filter:blur(28px);
  pointer-events:none;
  animation:tnhChampionFloorGlow 3.2s ease-in-out infinite;
}
@keyframes tnhChampionFloorGlow{
  0%,100%{opacity:.42;transform:scaleX(.84)}
  50%{opacity:.9;transform:scaleX(1.08)}
}

/* Header */
.tnh-champion-head{
  position:relative;
  z-index:3;
  padding:17px 16px 5px;
}
.tnh-champion-kicker{
  display:flex;
  align-items:center;
  gap:7px;
  color:#f2d27c;
  font-size:8px;
  font-weight:850;
  letter-spacing:1.15px;
}
.tnh-champion-kicker::before{
  content:"";
  width:19px;height:1px;
  background:linear-gradient(90deg,#f4c94e,transparent);
  box-shadow:0 0 8px rgba(244,201,78,.5);
}
.tnh-champion-title{
  margin:4px 0 0;
  font-size:23px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.5px;
  color:#fff;
}
.tnh-champion-title .gold{
  color:#f5c94f;
  text-shadow:0 0 18px rgba(245,201,79,.18);
}
.tnh-champion-sub{
  margin:6px 0 0;
  max-width:88%;
  color:#8fa3b3;
  font-size:9px;
  line-height:1.5;
}

/* floating light particles */
.tnh-champion-sparks{
  position:absolute;inset:0;z-index:1;
  overflow:hidden;pointer-events:none;
}
.tnh-champion-spark{
  position:absolute;
  width:4px;height:4px;border-radius:50%;
  background:#f8d76d;
  box-shadow:0 0 9px currentColor;
  opacity:0;
  animation:tnhChampionSpark 4.2s ease-in-out infinite;
}
.tnh-champion-spark:nth-child(1){left:10%;top:37%;animation-delay:.2s;color:#f8d76d}
.tnh-champion-spark:nth-child(2){left:23%;top:27%;animation-delay:1.4s;color:#7dd3fc}
.tnh-champion-spark:nth-child(3){left:40%;top:42%;animation-delay:2.3s;color:#f0abfc}
.tnh-champion-spark:nth-child(4){left:61%;top:25%;animation-delay:.8s;color:#fde68a}
.tnh-champion-spark:nth-child(5){left:76%;top:39%;animation-delay:2.9s;color:#67e8f9}
.tnh-champion-spark:nth-child(6){left:90%;top:30%;animation-delay:1.9s;color:#f9a8d4}
.tnh-champion-spark:nth-child(7){left:17%;top:66%;animation-delay:3.2s;color:#fde047}
.tnh-champion-spark:nth-child(8){left:82%;top:67%;animation-delay:.45s;color:#f4c94e}
@keyframes tnhChampionSpark{
  0%,100%{opacity:0;transform:translateY(8px) scale(.5)}
  30%{opacity:.95}
  65%{opacity:.55;transform:translateY(-16px) scale(1.15)}
}

/* Podium layout */
#topTravelersPodium .podium-row{
  position:relative;
  z-index:2;
  isolation:isolate;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:7px;
  min-height:265px;
  padding:43px 10px 0;
  overflow:visible;
  border-radius:0;
}
#topTravelersPodium .podium-row::before,
#topTravelersPodium .podium-row::after{
  display:none !important;
}
#topTravelersPodium .podium-slot{
  position:relative;
  flex:1;
  max-width:120px;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  z-index:2;
}
#topTravelersPodium .podium-1st{z-index:4}

/* Avatar ring */
#topTravelersPodium .podium-avatar{
  position:relative;
  overflow:visible;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:8px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,#12344a,#0ea5e9);
  transform:translateZ(0);
}
#topTravelersPodium .podium-avatar::before{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.10);
  opacity:.65;
}
#topTravelersPodium .podium-avatar::after{
  content:"";
  position:absolute;
  inset:-11px;
  border-radius:50%;
  border:1px dashed rgba(255,255,255,.08);
  animation:tnhChampionOrbit 9s linear infinite;
}
@keyframes tnhChampionOrbit{to{transform:rotate(360deg)}}

#topTravelersPodium .podium-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
  animation:tnhChampionAvatarFloat 3.4s ease-in-out infinite;
  transform-origin:center;
  will-change:transform;
}
@keyframes tnhChampionAvatarFloat{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-3px) scale(1.025)}
}
#topTravelersPodium .podium-avatar span:not(.podium-medal):not(.tnh-rank-crown){
  font-size:21px;
}

/* Rank 1 — crown fixed to the circular frame */
#topTravelersPodium .podium-1st .podium-avatar{
  width:91px;
  height:91px;
  border:3px solid #f5d66f;
  box-shadow:
    0 0 0 4px rgba(245,214,111,.08),
    0 0 24px rgba(245,201,79,.34),
    0 13px 25px rgba(0,0,0,.32);
  animation:tnhChampionRingPulse 2.4s ease-in-out infinite;
}
#topTravelersPodium .podium-1st .podium-avatar::before{
  border-color:rgba(255,224,119,.34);
  box-shadow:0 0 18px rgba(245,201,79,.20);
}
#topTravelersPodium .podium-1st .podium-avatar::after{
  border-color:rgba(245,201,79,.22);
}
@keyframes tnhChampionRingPulse{
  0%,100%{
    box-shadow:
      0 0 0 4px rgba(245,214,111,.06),
      0 0 20px rgba(245,201,79,.28),
      0 13px 25px rgba(0,0,0,.32)
  }
  50%{
    box-shadow:
      0 0 0 8px rgba(245,214,111,.025),
      0 0 34px rgba(245,201,79,.52),
      0 15px 28px rgba(0,0,0,.34)
  }
}
.tnh-rank-crown{
  position:absolute;
  z-index:8;
  left:50%;
  top:-34px;
  transform:translateX(-50%) rotate(-3deg);
  font-size:36px !important;
  line-height:1;
  filter:
    drop-shadow(0 3px 2px rgba(0,0,0,.45))
    drop-shadow(0 0 8px rgba(255,205,67,.60));
  transform-origin:50% 85%;
  animation:tnhChampionCrown 2.5s cubic-bezier(.18,.9,.22,1) infinite;
}
@keyframes tnhChampionCrown{
  0%,100%{transform:translateX(-50%) translateY(0) rotate(-5deg) scale(1)}
  38%{transform:translateX(-50%) translateY(-5px) rotate(4deg) scale(1.12)}
  55%{transform:translateX(-50%) translateY(-2px) rotate(-1deg) scale(1.04)}
}

/* crown shine */
.tnh-rank-crown::after{
  content:"";
  position:absolute;
  width:7px;height:7px;
  right:2px;top:0;
  border-radius:50%;
  background:#fff8c7;
  box-shadow:0 0 11px #fff1a6;
  animation:tnhCrownShine 1.8s ease-in-out infinite;
}
@keyframes tnhCrownShine{
  0%,100%{opacity:0;transform:scale(.2)}
  45%{opacity:1;transform:scale(1.15)}
  70%{opacity:0;transform:scale(.3)}
}

/* 2nd / 3rd rings */
#topTravelersPodium .podium-2nd .podium-avatar{
  width:69px;height:69px;
  border:3px solid #cbd5e1;
  box-shadow:0 0 16px rgba(203,213,225,.25),0 10px 22px rgba(0,0,0,.25);
}
#topTravelersPodium .podium-3rd .podium-avatar{
  width:69px;height:69px;
  border:3px solid #d89a5a;
  box-shadow:0 0 16px rgba(216,154,90,.25),0 10px 22px rgba(0,0,0,.25);
}

/* medal badge */
#topTravelersPodium .podium-medal{
  position:absolute;
  z-index:7;
  right:-7px;
  bottom:-5px;
  width:27px;height:27px;
  display:grid;place-items:center;
  border-radius:50%;
  background:rgba(5,13,20,.92);
  border:1px solid rgba(255,255,255,.16);
  font-size:17px;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.45));
  animation:tnhMedalPop 2.8s ease-in-out infinite;
}
#topTravelersPodium .podium-2nd .podium-medal{animation-delay:-.8s}
#topTravelersPodium .podium-3rd .podium-medal{animation-delay:-1.4s}
@keyframes tnhMedalPop{
  0%,100%{transform:scale(1) rotate(0)}
  45%{transform:scale(1.12) rotate(7deg)}
  60%{transform:scale(.98) rotate(-3deg)}
}

/* Names */
#topTravelersPodium .podium-name{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#f5f8fb;
  font-size:11.5px;
  font-weight:850;
  text-align:center;
  line-height:1.3;
}
#topTravelersPodium .podium-1st .podium-name{
  color:#fff7d8;
  font-size:13.5px;
  text-shadow:0 0 12px rgba(245,201,79,.18);
}
#topTravelersPodium .podium-count{
  margin:2px 0 8px;
  color:#8297a9;
  font-size:9.5px;
}
#topTravelersPodium .podium-1st .podium-count{color:#d8bd6e}

/* Podium stands — less toy-like */
#topTravelersPodium .podium-stand{
  position:relative;
  width:100%;
  overflow:hidden;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:9px;
  border-radius:14px 14px 0 0;
  color:rgba(5,12,17,.68);
  font-weight:950;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32);
}
#topTravelersPodium .podium-stand::before{
  content:"";
  position:absolute;
  left:-25%;top:-25%;
  width:40%;height:160%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.30),transparent);
  transform:skewX(-18deg);
  animation:tnhPodiumSweep 4.6s ease-in-out infinite;
}
@keyframes tnhPodiumSweep{
  0%,62%{left:-45%;opacity:0}
  72%{opacity:.7}
  100%{left:125%;opacity:0}
}
#topTravelersPodium .podium-1st .podium-stand{
  height:78px;
  background:linear-gradient(180deg,#f8df8a,#d3a322 62%,#9b7110);
  font-size:27px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    0 -5px 18px rgba(245,201,79,.10);
}
#topTravelersPodium .podium-2nd .podium-stand{
  height:55px;
  background:linear-gradient(180deg,#dbe4ed,#a9b7c7 65%,#758497);
  font-size:21px;
}
#topTravelersPodium .podium-3rd .podium-stand{
  height:43px;
  background:linear-gradient(180deg,#e4ae78,#bd7940 65%,#8c4f26);
  font-size:21px;
}

/* Champion footer */
.tnh-champion-foot{
  position:relative;
  z-index:4;
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 11px 11px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(4,13,20,.55);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.tnh-champion-foot-ico{
  width:32px;height:32px;flex:0 0 auto;
  display:grid;place-items:center;
  border:1px solid rgba(245,201,79,.14);
  border-radius:11px;
  background:rgba(245,201,79,.055);
  font-size:15px;
}
.tnh-champion-foot strong{
  display:block;color:#dce9f2;font-size:9.5px;
}
.tnh-champion-foot small{
  display:block;margin-top:2px;color:#647b8f;font-size:7.5px;
}

/* wow entrance when section is rendered */
#topTravelersPodium .podium-slot{
  animation:tnhChampionEnter .58s cubic-bezier(.18,.9,.22,1) both;
}
#topTravelersPodium .podium-2nd{animation-delay:.10s}
#topTravelersPodium .podium-1st{animation-delay:.22s}
#topTravelersPodium .podium-3rd{animation-delay:.34s}
@keyframes tnhChampionEnter{
  from{opacity:0;transform:translateY(22px) scale(.88)}
  70%{opacity:1;transform:translateY(-4px) scale(1.025)}
  to{opacity:1;transform:none}
}

@media(max-width:380px){
  #topTravelersPodium .podium-row{gap:5px;padding-left:7px;padding-right:7px}
  #topTravelersPodium .podium-1st .podium-avatar{width:82px;height:82px}
  #topTravelersPodium .podium-2nd .podium-avatar,
  #topTravelersPodium .podium-3rd .podium-avatar{width:62px;height:62px}
  .tnh-rank-crown{font-size:32px !important;top:-31px}
  .tnh-champion-title{font-size:21px}
}

@media(prefers-reduced-motion:reduce){
  #topTravelersPodium *,
  #topTravelersPodium *::before,
  #topTravelersPodium *::after{
    animation:none !important;
  }
}
/* ==== css/93-leaderboard-3d-wow.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ============================================================
   สายลุยตัวจริง — 3D WOW UPGRADE
   ============================================================ */
#topTravelersPodium .podium-row{
  perspective:900px;
  padding-top:58px;
}
#topTravelersPodium .podium-1st::before{
  content:"";
  position:absolute;
  z-index:-2;
  left:50%;top:-38px;
  width:145px;height:190px;
  transform:translateX(-50%);
  background:
    radial-gradient(ellipse at 50% 33%,rgba(255,222,112,.28),transparent 38%),
    conic-gradient(from 335deg at 50% 18%,
      transparent 0 7%,rgba(255,223,116,.10) 8% 12%,
      transparent 13% 26%,rgba(255,223,116,.08) 27% 31%,
      transparent 32% 100%);
  animation:tnhChampionSpotlight 3.4s ease-in-out infinite;
  pointer-events:none;
}
@keyframes tnhChampionSpotlight{
  0%,100%{opacity:.48;transform:translateX(-50%) scale(.94)}
  50%{opacity:1;transform:translateX(-50%) scale(1.08)}
}
.tnh-champion-halo{
  position:absolute;
  z-index:-1;
  left:50%;top:50%;
  width:126px;height:126px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:repeating-conic-gradient(
    from 0deg,rgba(255,218,94,.78) 0 2deg,transparent 2deg 13deg);
  -webkit-mask:radial-gradient(circle,transparent 0 55%,#000 57% 61%,transparent 63%);
  mask:radial-gradient(circle,transparent 0 55%,#000 57% 61%,transparent 63%);
  opacity:.48;
  animation:tnhChampionHaloSpin 12s linear infinite;
}
@keyframes tnhChampionHaloSpin{
  to{transform:translate(-50%,-50%) rotate(360deg)}
}

/* มงกุฎ SVG ทอง */
.tnh-rank-crown{
  top:-39px !important;
  width:54px;height:43px;
  display:block;
  font-size:0 !important;
  filter:drop-shadow(0 5px 3px rgba(0,0,0,.46))
         drop-shadow(0 0 10px rgba(255,205,67,.48));
}
.tnh-rank-crown svg{width:100%;height:100%;overflow:visible}
.tnh-rank-crown::after{width:6px;height:6px;right:5px;top:6px}
.tnh-crown-gem{
  animation:tnhCrownGem 1.8s ease-in-out infinite;
  transform-origin:center;
}
@keyframes tnhCrownGem{
  0%,100%{opacity:.65}
  45%{opacity:1;filter:drop-shadow(0 0 4px #fff)}
}

/* วงแหวนอันดับ 1 */
#topTravelersPodium .podium-1st .podium-avatar{
  border-width:3px;background:#08141d;
}
#topTravelersPodium .podium-1st .podium-avatar::before{
  inset:-8px;
  border:2px solid rgba(255,216,94,.46);
  box-shadow:0 0 0 3px rgba(255,216,94,.035),0 0 22px rgba(255,203,56,.34);
}
#topTravelersPodium .podium-1st .podium-avatar::after{
  inset:-14px;border:1px dashed rgba(255,222,113,.30);
}

/* แท่น 3D */
#topTravelersPodium .podium-stand{
  overflow:hidden;
  transform-style:preserve-3d;
  border-radius:11px 11px 3px 3px;
  border:1px solid rgba(255,255,255,.16);
  text-shadow:0 1px 0 rgba(255,255,255,.24),0 2px 5px rgba(0,0,0,.18);
}
#topTravelersPodium .podium-stand::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;height:10px;
  transform:none;
  border-radius:0;
  filter:brightness(.58);
  box-shadow:none;
  opacity:.20;
  pointer-events:none;
}
#topTravelersPodium .podium-1st .podium-stand{
  height:84px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.20),transparent 17% 80%,rgba(88,56,0,.14)),
    linear-gradient(180deg,#ffe99a 0%,#e9bd3d 43%,#b57b08 100%);
  border-color:rgba(255,229,139,.52);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.56),
             inset 0 -10px 18px rgba(112,70,0,.18),
             0 -7px 25px rgba(255,205,54,.14),
             0 13px 18px rgba(0,0,0,.23);
}
#topTravelersPodium .podium-1st .podium-stand::after{background:#8e610b}
#topTravelersPodium .podium-2nd .podium-stand{
  height:58px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.28),transparent 18% 80%,rgba(56,70,85,.15)),
    linear-gradient(180deg,#edf3f8,#b9c7d5 48%,#77889b);
  border-color:rgba(225,235,245,.40);
}
#topTravelersPodium .podium-2nd .podium-stand::after{background:#687889}
#topTravelersPodium .podium-3rd .podium-stand{
  height:47px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.22),transparent 18% 80%,rgba(83,40,12,.16)),
    linear-gradient(180deg,#efbd89,#c47c43 48%,#8f4d24);
  border-color:rgba(238,183,128,.38);
}
#topTravelersPodium .podium-3rd .podium-stand::after{background:#77401f}
#topTravelersPodium .podium-stand::before{
  content:"";
  position:absolute;
  z-index:2;
  top:-20%;
  bottom:-20%;
  left:-40%;
  width:30%;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,.08) 18%,
    rgba(255,255,255,.42) 50%,
    rgba(255,255,255,.08) 82%,
    transparent 100%
  );
  transform:skewX(-18deg) translateX(0);
  animation:tnhPodiumSweepContained 4.2s ease-in-out infinite;
  pointer-events:none;
  will-change:transform,opacity;
}
@keyframes tnhPodiumSweepContained{
  0%,58%{
    transform:skewX(-18deg) translateX(0);
    opacity:0;
  }
  66%{
    opacity:.65;
  }
  100%{
    transform:skewX(-18deg) translateX(520%);
    opacity:0;
  }
}

/* Winner impact */
#topTravelersPodium .podium-1st{
  animation-name:tnhChampionWinnerEnter;
  animation-duration:.82s;
}
@keyframes tnhChampionWinnerEnter{
  0%{opacity:0;transform:translateY(34px) scale(.78)}
  58%{opacity:1;transform:translateY(-9px) scale(1.08)}
  78%{transform:translateY(3px) scale(.98)}
  100%{opacity:1;transform:none}
}
.tnh-champion-stage-light{
  position:absolute;
  z-index:1;
  left:9%;right:9%;bottom:11px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,213,82,.55),transparent);
  box-shadow:0 0 12px rgba(255,207,58,.34);
  animation:tnhStageLight 2.8s ease-in-out infinite;
  pointer-events:none;
}
@keyframes tnhStageLight{
  0%,100%{opacity:.25;transform:scaleX(.75)}
  50%{opacity:.9;transform:scaleX(1)}
}
.tnh-champion-foot{
  border-color:rgba(125,211,252,.10);
}
.tnh-champion-foot-ico{
  background:rgba(56,189,248,.055);
  border-color:rgba(125,211,252,.13);
}
.tnh-champion-foot strong{color:#e7f5ff;font-size:10px}

@media(max-width:380px){
  .tnh-rank-crown{width:48px;height:39px;top:-36px !important}
  .tnh-champion-halo{width:115px;height:115px}
}


/* จำกัดแสงวาบให้อยู่ภายในแท่นเท่านั้น */
#topTravelersPodium .podium-stand{
  contain:paint;
}
#topTravelersPodium .podium-stand::before{
  mix-blend-mode:screen;
}
/* ==== css/94-live-interactions.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ============================================================
   เที่ยวนี่เหอะ — VISUAL INTERACTION LAYER
   ไฟล์นี้มีเฉพาะเอฟเฟกต์ภาพเท่านั้น
   - ไม่แตะ JS / API / onclick / state / backend
   - ไม่เปลี่ยน layout หลัก
   - ไม่ใช้ backdrop-filter / filter หนัก ๆ
   - pointer-events เดิมทุกส่วนคงเดิม
   ============================================================ */

:root{
  --tnh-live-cyan: rgba(56,189,248,.78);
  --tnh-live-cyan-soft: rgba(56,189,248,.18);
  --tnh-live-green: rgba(52,211,153,.72);
  --tnh-live-amber: rgba(251,191,36,.70);
  --tnh-live-red: rgba(248,113,113,.68);
}

/* ------------------------------------------------------------
   1) การ์ด / กล่องหลัก
   แค่ transition + GPU hint เท่านั้น
   ------------------------------------------------------------ */
:is(
  .lux-body,
  .trip-hcard,
  .trip-hcard2,
  .thc-overlay,
  .calendar-entry-card,
  .month-photo-card,
  .my-profile,
  .hist-card,
  .past-card,
  .review-card,
  .review-summary-card,
  .eq-trip-card,
  .eq-item-card,
  .eq-summary-card,
  .van-premium-card,
  .van-trip-select-card,
  .van-number-card-content,
  .prep-item-card,
  .line-profile-card,
  .modal-card,
  .form-sec,
  .seat-form-card,
  .admin-row-card,
  .admin-passenger-card,
  .admin-group-trip-card,
  .admin-trip-card,
  .admin-detail-stat,
  .admin-checkin-summary,
  .admin-pickup-premium,
  .admin-pickup-premium-item,
  .tnh-checkin-qr-box,
  .podium-slot,
  .receipt
){
  transition:
    transform .18s cubic-bezier(.2,.8,.2,1),
    box-shadow .22s ease,
    border-color .22s ease,
    opacity .18s ease;
  -webkit-tap-highlight-color: transparent;
}

/* ------------------------------------------------------------
   2) ตอนแตะ — ยุบตัว + วาบขอบ
   ไม่เปลี่ยน onclick / ไม่กิน event
   ------------------------------------------------------------ */
:is(
  .trip-hcard,
  .trip-hcard2,
  .calendar-entry-card,
  .month-photo-card,
  .hist-card,
  .past-card,
  .review-card,
  .eq-trip-card,
  .eq-item-card,
  .van-premium-card,
  .van-trip-select-card,
  .prep-item-card,
  .admin-row-card,
  .admin-passenger-card,
  .admin-group-trip-card,
  .admin-trip-card,
  .admin-pickup-premium-item,
  .podium-slot
):active{
  transform: scale(.985);
  border-color: rgba(125,211,252,.36) !important;
  box-shadow:
    0 0 0 1px rgba(56,189,248,.12),
    0 0 24px rgba(56,189,248,.14),
    0 10px 28px rgba(0,0,0,.18) !important;
  animation: tnhLiveCardFlash .42s ease-out;
}

/* กล่องที่เป็นข้อมูล ไม่ใช่ปุ่ม — แตะแล้ววาบเบากว่า */
:is(
  .admin-detail-stat,
  .admin-checkin-summary,
  .admin-pickup-premium,
  .review-summary-card,
  .eq-summary-card,
  .tnh-checkin-qr-box,
  .receipt
):active{
  transform: scale(.992);
  animation: tnhLiveSoftFlash .38s ease-out;
}

/* ------------------------------------------------------------
   3) ปุ่ม / Tab / Nav
   ------------------------------------------------------------ */
:is(
  button,
  .btn-book,
  .btn-confirm,
  .btn-home,
  .btn-login,
  .btn-logout,
  .btn-pay-ok,
  .remain-pay-btn,
  .eq-step-btn,
  .review-action-btn,
  .review-comment-send-btn,
  .van-role-btn,
  .van-number-btn,
  .admin-action-btn,
  .admin-mini-action,
  .admin-icon-btn,
  .admin-nav-btn,
  .admin-back-trip,
  .my-payment-filter-btn,
  .bnav-item,
  .qa-mini,
  .qa-mytrips-mini,
  .qa-rent-mini,
  .qa-trip-mini
){
  transition:
    transform .14s cubic-bezier(.2,.8,.2,1),
    box-shadow .20s ease,
    opacity .16s ease,
    border-color .20s ease;
  -webkit-tap-highlight-color: transparent;
}

:is(
  button,
  .btn-book,
  .btn-confirm,
  .btn-home,
  .btn-login,
  .btn-logout,
  .btn-pay-ok,
  .remain-pay-btn,
  .eq-step-btn,
  .review-action-btn,
  .review-comment-send-btn,
  .van-role-btn,
  .van-number-btn,
  .admin-action-btn,
  .admin-mini-action,
  .admin-icon-btn,
  .admin-nav-btn,
  .admin-back-trip,
  .my-payment-filter-btn,
  .bnav-item,
  .qa-mini,
  .qa-mytrips-mini,
  .qa-rent-mini,
  .qa-trip-mini
):active{
  transform: scale(.955);
  box-shadow:
    0 0 0 1px rgba(56,189,248,.12),
    0 0 18px rgba(56,189,248,.17) !important;
  animation: tnhLiveButtonFlash .30s ease-out;
}

/* ------------------------------------------------------------
   4) เบาะ — แตะให้รู้สึกตอบสนองขึ้น
   ไม่แตะ class สถานะ / สี / lock logic
   ------------------------------------------------------------ */
:is(.seat,.mini-seat,.onsite-slot,.h-seat):active{
  transform: scale(.93);
  box-shadow:
    0 0 0 2px rgba(255,255,255,.09),
    0 0 22px rgba(250,204,21,.22) !important;
  transition: transform .10s ease, box-shadow .15s ease;
}

/* ------------------------------------------------------------
   5) สถานะสำคัญ — มีชีวิตแบบเบามาก
   ------------------------------------------------------------ */
.admin-checkin-badge,
.paid-full-badge,
.chip-green{
  animation: tnhLiveGreenBreath 3.2s ease-in-out infinite;
}

:is(.admin-pickup-premium-item.no-pickup,.chip-yellow):active{
  box-shadow: 0 0 22px rgba(251,191,36,.18) !important;
}

:is(.chip,.admin-status):active{
  transform: scale(.96);
}

/* ------------------------------------------------------------
   6) Hover เฉพาะเครื่องที่มีเมาส์จริง
   มือถือจะไม่ค้าง hover
   ------------------------------------------------------------ */
@media (hover:hover) and (pointer:fine){
  :is(
    .trip-hcard,
    .trip-hcard2,
    .calendar-entry-card,
    .month-photo-card,
    .hist-card,
    .past-card,
    .review-card,
    .eq-trip-card,
    .eq-item-card,
    .van-premium-card,
    .van-trip-select-card,
    .prep-item-card,
    .admin-row-card,
    .admin-passenger-card,
    .admin-group-trip-card,
    .admin-trip-card,
    .admin-pickup-premium-item
  ):hover{
    transform: translateY(-2px);
    border-color: rgba(125,211,252,.24) !important;
    box-shadow:
      0 0 0 1px rgba(56,189,248,.06),
      0 16px 34px rgba(0,0,0,.20),
      0 0 24px rgba(56,189,248,.07) !important;
  }
}

/* ------------------------------------------------------------
   7) Keyframes — ใช้เฉพาะ transform / box-shadow / opacity
   ------------------------------------------------------------ */
@keyframes tnhLiveCardFlash{
  0%{
    box-shadow:
      0 0 0 0 rgba(56,189,248,0),
      0 0 0 rgba(56,189,248,0);
  }
  38%{
    box-shadow:
      0 0 0 2px rgba(125,211,252,.16),
      0 0 30px rgba(56,189,248,.24);
  }
  100%{
    box-shadow:
      0 0 0 1px rgba(56,189,248,.08),
      0 0 12px rgba(56,189,248,.05);
  }
}

@keyframes tnhLiveSoftFlash{
  0%,100%{ box-shadow: inherit; }
  45%{
    box-shadow:
      0 0 0 1px rgba(125,211,252,.12),
      0 0 24px rgba(56,189,248,.12);
  }
}

@keyframes tnhLiveButtonFlash{
  0%{ opacity:1; }
  45%{ opacity:.78; }
  100%{ opacity:1; }
}

@keyframes tnhLiveGreenBreath{
  0%,100%{
    box-shadow: 0 0 0 rgba(52,211,153,0);
  }
  50%{
    box-shadow: 0 0 16px rgba(52,211,153,.10);
  }
}

/* ------------------------------------------------------------
   8) Accessibility / Battery
   ถ้าเครื่องตั้ง Reduce Motion จะปิด animation อัตโนมัติ
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}
/* ==== css/95-checkin-scanner-nav.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ================================================================
   CHECK-IN SCANNER — ปุ่มกลาง Bottom Nav + กล้องสแกน QR
   ================================================================ */
@media (max-width:1023px){
  .bnav{overflow:visible}
  .bnav-checkin-action{position:relative;padding-top:3px!important;overflow:visible}
  .bnav-checkin-action .checkin-fab{
    position:relative;width:49px;height:49px;margin-top:-19px;flex:0 0 49px;
    display:grid;place-items:center;border-radius:50%;color:#f8fdff;
    background:
      radial-gradient(circle at 35% 24%,rgba(125,211,252,.28),transparent 33%),
      linear-gradient(145deg,#173b68 0%,#102743 55%,#071627 100%);
    border:2px solid rgba(56,189,248,.88);
    box-shadow:0 0 0 4px rgba(3,15,26,.92),0 7px 18px rgba(0,0,0,.42),inset 0 1px 1px rgba(255,255,255,.22);
    transform:translateZ(0);transition:transform .16s ease,filter .16s ease;
  }
  .bnav-checkin-action .checkin-fab::before{
    content:"";position:absolute;inset:4px;border-radius:50%;
    border:1px solid rgba(125,211,252,.18);pointer-events:none
  }
  .bnav-checkin-action .checkin-fab svg{position:relative;z-index:2;width:29px!important;height:29px!important}
  .bnav-checkin-action .checkin-fab-scanline{
    position:absolute;z-index:1;left:9px;right:9px;top:23px;height:1px;
    background:linear-gradient(90deg,transparent,#67e8f9 25%,#fff 50%,#67e8f9 75%,transparent);
    opacity:.65;box-shadow:0 0 5px rgba(103,232,249,.55);
    animation:tnhCheckinScan 2.4s ease-in-out infinite
  }
  .bnav-checkin-action .lbl{margin-top:0;color:#83dcff!important}
  .bnav-checkin-action:active .checkin-fab{transform:scale(.93);filter:brightness(1.12)}
  @keyframes tnhCheckinScan{0%,100%{transform:translateY(-7px);opacity:.25}50%{transform:translateY(7px);opacity:.85}}
}

@media (min-width:1024px){
  #appShell .bnav-checkin-action .checkin-fab{display:flex;width:24px;height:24px;flex:0 0 24px;color:#8fa5bf;background:none;border:0;box-shadow:none;margin:0}
  #appShell .bnav-checkin-action .checkin-fab svg{display:block;width:23px;height:23px}
  #appShell .bnav-checkin-action .checkin-fab-scanline{display:none}
}

.tnh-scanner-overlay{
  position:fixed;inset:0;z-index:50000;display:none;align-items:center;justify-content:center;
  padding:18px;background:rgba(2,8,15,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.tnh-scanner-overlay.show{display:flex}
.tnh-scanner-card{position:relative;width:min(100%,430px);padding:20px 16px 18px;border-radius:26px;border:1px solid rgba(125,211,252,.18);background:linear-gradient(180deg,rgba(3,12,18,.82),rgba(2,10,15,.95)),url('/ximg.php?f=1448375240586-882707db888b-900.jpg') center/cover no-repeat;box-shadow:0 24px 70px rgba(0,0,0,.6);color:#f1f5f9;text-align:center}
.tnh-scanner-upload-btn{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:12px;background:rgba(255,255,255,.08);border:1px solid rgba(125,211,252,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:14px;padding:12px;font-size:12.5px;font-weight:700;color:#e0f2fe;cursor:pointer}
.tnh-scanner-upload-btn:active{transform:scale(.98);background:rgba(255,255,255,.14)}

/* ============================================================
   SELF CHECK-IN CONFIRM POPUP — ป็อบอัพติ๊กยืนยันตัวตน
   ============================================================ */
.checkin-confirm-swal{border-radius:26px!important;border:1px solid rgba(125,211,252,.18)!important}
.checkin-confirm-shell{text-align:center;padding:4px 2px 2px}
.checkin-confirm-icon{
  width:64px;height:64px;margin:0 auto 14px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:28px;
  background:linear-gradient(135deg,rgba(2,132,199,.28),rgba(56,189,248,.14));
  border:2px solid rgba(125,211,252,.35);
  box-shadow:0 8px 22px rgba(2,132,199,.3);
}
.checkin-confirm-shell h3{font-size:18px;font-weight:800;color:#fff;margin:0 0 6px}
.checkin-confirm-sub{font-size:12.5px;color:#b7cade;line-height:1.6;margin:0 0 16px}
.checkin-confirm-empty-text{font-size:13px;color:#cbd5e1;line-height:1.7;margin:4px 0 2px}
.checkin-confirm-trip-card{
  background:rgba(255,255,255,.06);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(125,211,252,.22);border-radius:16px;
  padding:14px 16px;margin-bottom:16px;text-align:left;
}
.checkin-confirm-trip-card strong{display:block;color:#fff;font-size:15px;font-weight:800;margin-bottom:6px}
.checkin-confirm-trip-card small{display:block;color:#a8c4da;font-size:12px;margin-top:3px}
.checkin-confirm-check{
  display:flex;align-items:flex-start;gap:10px;text-align:left;
  background:rgba(56,189,248,.07);border:1px solid rgba(56,189,248,.2);
  border-radius:14px;padding:12px 14px;cursor:pointer;
}
.checkin-confirm-check input{position:absolute;opacity:0;width:0;height:0}
.checkin-confirm-check span{
  flex-shrink:0;width:22px;height:22px;border-radius:7px;margin-top:1px;
  border:2px solid rgba(148,163,184,.45);background:rgba(255,255,255,.04);position:relative;
  transition:background .15s ease,border-color .15s ease;
}
.checkin-confirm-check input:checked + span{background:#0284c7;border-color:#38bdf8}
.checkin-confirm-check input:checked + span::after{
  content:'';position:absolute;left:6px;top:2px;width:6px;height:11px;
  border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);
}
.checkin-confirm-check em{font-style:normal;font-size:12.5px;color:#dce9f5;line-height:1.6}
.tnh-scanner-card h3{margin:3px 42px 4px;font-size:20px}.tnh-scanner-card>p{margin:0 20px 15px;color:#8fa6ba;font-size:11px;line-height:1.55}
.tnh-scanner-close{position:absolute;right:14px;top:14px;width:36px;height:36px;border:1px solid rgba(148,163,184,.14);border-radius:12px;background:#101e2d;color:#dbeafe;font-size:20px}
.tnh-scanner-frame{position:relative;overflow:hidden;min-height:270px;border-radius:20px;border:1px solid rgba(56,189,248,.22);background:#02070c}
#tnhQrReader{width:100%;min-height:270px;border:0!important}#tnhQrReader video{width:100%!important;min-height:270px;object-fit:cover;border-radius:19px}#tnhQrReader img{max-width:72px}#tnhQrReader__dashboard_section{padding:10px!important;color:#c8d7e6}#tnhQrReader__dashboard_section_csr button,#tnhQrReader__dashboard_section_fsr input{font:inherit!important}
.tnh-scanner-corners{display:none;position:absolute;inset:29px;z-index:3;pointer-events:none;background:linear-gradient(#67e8f9,#67e8f9) 0 0/34px 3px no-repeat,linear-gradient(#67e8f9,#67e8f9) 0 0/3px 34px no-repeat,linear-gradient(#67e8f9,#67e8f9) 100% 0/34px 3px no-repeat,linear-gradient(#67e8f9,#67e8f9) 100% 0/3px 34px no-repeat,linear-gradient(#67e8f9,#67e8f9) 0 100%/34px 3px no-repeat,linear-gradient(#67e8f9,#67e8f9) 0 100%/3px 34px no-repeat,linear-gradient(#67e8f9,#67e8f9) 100% 100%/34px 3px no-repeat,linear-gradient(#67e8f9,#67e8f9) 100% 100%/3px 34px no-repeat}
.tnh-scanner-beam{position:absolute;z-index:4;left:35px;right:35px;top:50%;height:2px;pointer-events:none;background:linear-gradient(90deg,transparent,#67e8f9 18%,#fff 50%,#67e8f9 82%,transparent);box-shadow:0 0 10px rgba(103,232,249,.8);animation:tnhCameraBeam 2.2s ease-in-out infinite}
@keyframes tnhCameraBeam{0%,100%{transform:translateY(-82px);opacity:.3}50%{transform:translateY(82px);opacity:1}}
.tnh-scanner-status{min-height:18px;margin-top:12px;color:#8edcff;font-size:11px}.tnh-scanner-status.error{color:#fda4af}
@media(prefers-reduced-motion:reduce){.checkin-fab-scanline,.tnh-scanner-beam{animation:none!important}}
/* ==== css/96-system-popup-theme.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ================================================================
   SYSTEM POPUP THEME — ใช้เฉพาะ SweetAlert ที่ไม่มีงานออกแบบเฉพาะ
   ================================================================ */
.tnh-system-swal-container{
  z-index:40000!important;
  padding:16px!important;
  background:rgba(1,7,13,.70)!important;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.tnh-system-swal{
  --tnh-alert:56,189,248;
  width:min(88vw,360px)!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:24px!important;
  border:1px solid rgba(var(--tnh-alert),.18)!important;
  background:
    linear-gradient(180deg,rgba(3,12,18,.84),rgba(2,10,15,.96)),
    url('/ximg.php?f=1448375240586-882707db888b-900.jpg') center/cover no-repeat!important;
  color:#f1f5f9!important;
  box-shadow:0 24px 70px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.035)!important;
  font-family:inherit!important;
}
.tnh-system-swal-success{--tnh-alert:52,211,153}
.tnh-system-swal-error{--tnh-alert:251,113,133}
.tnh-system-swal-warning{--tnh-alert:251,146,60}
.tnh-system-swal-info{--tnh-alert:56,189,248}
.tnh-system-swal-question{--tnh-alert:167,139,250}

.tnh-system-swal-icon{
  width:76px!important;
  height:76px!important;
  margin:28px auto 14px!important;
  border-width:2px!important;
  border-color:rgba(var(--tnh-alert),.52)!important;
  color:rgb(var(--tnh-alert))!important;
  filter:drop-shadow(0 0 15px rgba(var(--tnh-alert),.13));
}
.tnh-system-swal-icon .swal2-icon-content{font-size:48px!important;color:rgb(var(--tnh-alert))!important}
.tnh-system-swal-icon.swal2-success .swal2-success-ring,
.tnh-system-swal-icon.swal2-success .swal2-success-fix,
.tnh-system-swal-icon.swal2-success [class^=swal2-success-line]{display:none!important}
.tnh-system-swal-icon.swal2-success{
  width:48px!important;
  height:48px!important;
  border:0!important;
  background:#10b981!important;
  box-shadow:0 0 20px rgba(16,185,129,.38)!important;
}
.tnh-system-swal-icon.swal2-success::after{
  content:'✓';
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  color:#fff;
  font-family:Arial,sans-serif;
  font-size:24px;
  font-weight:700;
  line-height:1;
}
.tnh-system-swal-icon.swal2-error [class^=swal2-x-mark-line]{background-color:rgb(var(--tnh-alert))!important}

.tnh-system-swal-title{
  margin:0!important;
  padding:0 24px!important;
  color:#f7fbff!important;
  font-size:20px!important;
  line-height:1.35!important;
  font-weight:850!important;
}
.tnh-system-swal-neutral .tnh-system-swal-title{padding-top:27px!important}
.tnh-system-swal-content{
  margin:8px 0 0!important;
  padding:0 24px!important;
  color:#91a6b5!important;
  font-size:11px!important;
  line-height:1.65!important;
}
.tnh-system-swal-content:empty{display:none!important}
.tnh-system-swal-actions{
  width:100%!important;
  margin:20px 0 0!important;
  padding:0 22px 24px!important;
  gap:9px!important;
  display:flex!important;
}
.tnh-system-swal-actions:empty{display:none!important}
.tnh-system-swal-actions .swal2-styled{
  flex:1 1 0!important;
  min-height:44px!important;
  margin:0!important;
  padding:10px 14px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:13px!important;
  font-family:inherit!important;
  font-size:11px!important;
  font-weight:850!important;
  box-shadow:0 9px 22px rgba(0,0,0,.20)!important;
}
.tnh-system-swal-confirm:focus,.tnh-system-swal-deny:focus,.tnh-system-swal-cancel:focus{
  box-shadow:0 0 0 3px rgba(var(--tnh-alert),.20)!important;
}
.tnh-system-swal-input{
  width:calc(100% - 44px)!important;
  min-height:46px!important;
  margin:17px 22px 0!important;
  padding:10px 13px!important;
  border:1px solid rgba(148,163,184,.18)!important;
  border-radius:13px!important;
  background:rgba(3,12,20,.72)!important;
  color:#f1f5f9!important;
  font-family:inherit!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:1.4!important;
  box-shadow:none!important;
}
.tnh-system-swal-input:focus{border-color:rgba(var(--tnh-alert),.55)!important;box-shadow:0 0 0 3px rgba(var(--tnh-alert),.10)!important}
.tnh-system-swal-loader{border-color:rgb(var(--tnh-alert)) transparent rgb(var(--tnh-alert)) transparent!important}
.tnh-system-swal-close{color:#8fa5b6!important;font-size:26px!important}
.tnh-system-swal .swal2-validation-message{
  margin:12px 22px 0!important;
  border-radius:11px!important;
  background:rgba(127,29,29,.26)!important;
  color:#fecdd3!important;
  font-size:10px!important;
}
.tnh-system-swal .swal2-timer-progress-bar{background:rgba(var(--tnh-alert),.70)!important}

/* หน้าแบบฟอร์มราชการใช้ธีมกระดาษ/สีเขียว แทนธีมมืดของเว็บหลัก */
body.tnh-popup-paper-page .tnh-system-swal-container{
  background:rgba(20,36,27,.40)!important;
}
body.tnh-popup-paper-page .tnh-system-swal{
  --tnh-alert:47,111,79;
  border-color:rgba(47,111,79,.22)!important;
  background:linear-gradient(180deg,#fff,#fbf9f3)!important;
  color:#1f2b23!important;
  box-shadow:0 24px 65px rgba(31,77,54,.22)!important;
}
body.tnh-popup-paper-page .tnh-system-swal-title{color:#1f2b23!important}
body.tnh-popup-paper-page .tnh-system-swal-content{color:#5b6b60!important}
body.tnh-popup-paper-page .tnh-system-swal-input{background:#fff!important;color:#1f2b23!important}

@media(max-width:380px){
  .tnh-system-swal{width:min(91vw,348px)!important}
  .tnh-system-swal-title{font-size:18px!important}
  .tnh-system-swal-actions{padding-left:18px!important;padding-right:18px!important}
}
@media(prefers-reduced-motion:reduce){
  .tnh-system-swal,.tnh-system-swal-icon{animation:none!important}
}
/* ==== css/97-forest-page-theme.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ================================================================
   FOREST PAGE THEME — พื้นหลังป่ากลางคืนชุดเดียวกับ popup
   สำคัญ: ไม่แตะ #loadingScreen เพื่อคงรูปและแอนิเมชันรีโหลดเดิม
   ================================================================ */
:root{
  --tnh-forest-photo:url('/ximg.php?f=1448375240586-882707db888b-1800.jpg');
  --tnh-forest-base:#030b0d;
}

html{
  min-height:100%;
  background:var(--tnh-forest-base);
}
body{
  min-height:100vh;
  min-height:100dvh;
  background:
    radial-gradient(circle at 88% 4%,rgba(31,122,105,.13),transparent 30%),
    radial-gradient(circle at 5% 72%,rgba(14,73,61,.10),transparent 28%),
    linear-gradient(180deg,rgba(3,12,18,.86),rgba(2,10,15,.97)),
    var(--tnh-forest-photo) center top/cover no-repeat fixed!important;
  background-color:var(--tnh-forest-base)!important;
}

/* หน้าเข้าสู่ระบบใช้ป่าชุดเดียวกัน แต่หน้ารีโหลดข้อมูลไม่ถูกเลือกในกฎนี้ */
#loginPage{
  background:
    radial-gradient(circle at 50% 8%,rgba(34,139,116,.15),transparent 34%),
    linear-gradient(180deg,rgba(3,12,18,.77),rgba(2,10,15,.95)),
    var(--tnh-forest-photo) center/cover no-repeat!important;
}

/* 4 หน้าหลักใช้พื้นเดียวกับหน้ารีวิวและหน้าผังเบาะ */
#appShell{
  min-height:100vh;
  min-height:100dvh;
  background:#060b13!important;
  background-color:#060b13!important;
}
#appShell>.view-page,
#appShell>.view-page>.main{
  background:transparent!important;
}
#appShell>.hdr{
  background:#060b13!important;
  border-bottom:0!important;
  margin-bottom:0!important;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#appShell>.bnav,
#appShell .bnav{
  background:linear-gradient(180deg,rgba(7,18,22,.92),rgba(2,9,13,.97))!important;
  border-color:rgba(105,170,151,.13)!important;
}

/* หน้าจอเต็มทั้งหมดใช้รูปป่าเดียวกัน — ไม่รวม loadingScreen */
#bookingPage2,
#successPage2,
#equipPage,
#equipReceiptPage,
#reviewPage,
#adminCenter,
#tripCalendarModal,
#vanLocationModal,
#monthTripsModal{
  background:
    radial-gradient(circle at 92% 2%,rgba(31,122,105,.12),transparent 30%),
    radial-gradient(circle at 0 78%,rgba(22,90,72,.08),transparent 27%),
    linear-gradient(180deg,rgba(3,12,18,.86),rgba(2,10,15,.97)),
    var(--tnh-forest-photo) center top/cover no-repeat fixed!important;
  background-color:var(--tnh-forest-base)!important;
}

/* หน้ารวมทริปรายเดือนใช้พื้นหลังกลาง
   หมายเหตุ: ไม่แตะ #tripCalendarModal .calendar-bg-layer เพราะเป็นภาพฤดูกาลไทยรายเดือน */
#monthTripsModal .calendar-bg-layer{
  display:none!important;
}

/* แถบหัวและแถบคำสั่งเป็นกระจกทึบ อ่านง่ายบนภาพป่า */
#bookingPage2>.bk-hdr,
#equipPage>.bk-hdr,
#reviewPage>.bk-hdr,
#equipReceiptPage>.bk-hdr{
  background:rgba(4,14,18,.82)!important;
  border-color:rgba(105,170,151,.13)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
#bookingPage2 .sticky-bar,
#equipPage .sticky-bar,
#reviewPage .sticky-bar,
#successPage2 .succ-sticky-bar{
  background:rgba(3,12,16,.91)!important;
  border-color:rgba(105,170,151,.13)!important;
  backdrop-filter:blur(15px);
  -webkit-backdrop-filter:blur(15px);
}

/* Admin Center: ให้ภาพลอดเฉพาะพื้นหลัง ไม่รบกวนการ์ดและตาราง */
#adminCenter .admin-topbar,
#adminCenter .admin-nav{
  background:rgba(3,13,17,.84)!important;
  border-color:rgba(105,170,151,.12)!important;
}
#adminCenter .admin-body,
#adminCenter .admin-view{
  background:transparent!important;
}

/* หน้า admin.html แยกเดิม */
body>.app,
body>.admin-app,
body>.main-wrap{
  background:transparent!important;
}

/* แบบฟอร์มราชการคงกระดาษสีขาว แต่ฉากนอกเป็นป่าชุดเดียวกัน */
body.tnh-popup-paper-page{
  background:
    radial-gradient(circle at 88% 4%,rgba(31,122,105,.13),transparent 30%),
    linear-gradient(180deg,rgba(3,12,18,.78),rgba(2,10,15,.94)),
    var(--tnh-forest-photo) center top/cover no-repeat fixed!important;
}
body.tnh-popup-paper-page .sec{
  box-shadow:0 12px 32px rgba(0,0,0,.20);
}

@media(max-width:767px){
  body,#bookingPage2,#successPage2,#equipPage,#equipReceiptPage,#reviewPage,
  #adminCenter,#tripCalendarModal,#vanLocationModal,#monthTripsModal{
    background-position:center top!important;
    background-attachment:scroll!important;
  }

  /* ล็อกภาพพื้นหลัง 4 แท็บไว้กับหน้าจอเหมือนหน้ารีวิว/ผังเบาะ
     เนื้อหาเลื่อนได้โดยรูปไม่เลื่อน ไม่ยืดตามความยาวหน้า และไม่เบลอ */
  #appShell{
    position:relative;
    isolation:isolate;
    background:transparent!important;
  }
  #appShell::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
      radial-gradient(circle at 92% 2%,rgba(31,122,105,.12),transparent 30%),
      radial-gradient(circle at 0 78%,rgba(22,90,72,.08),transparent 27%),
      linear-gradient(180deg,rgba(3,12,18,.86),rgba(2,10,15,.97)),
      var(--tnh-forest-photo) center/cover no-repeat;
    background-color:var(--tnh-forest-base);
    transform:translateZ(0);
  }
  #appShell>.hdr,
  #appShell>.view-page{
    position:relative;
    z-index:1;
  }

  /* เฟดตัวภาพเฮดจริงให้โปร่งใสลงสู่พื้นหลัง แทนการวางแถบดำทับรูป */
  #appShell>.hdr,
  #appShell .home-banner{
    background:transparent!important;
  }
  #appShell .home-banner>img{
    -webkit-mask-image:linear-gradient(180deg,
      #000 0%,
      #000 70%,
      rgba(0,0,0,.96) 76%,
      rgba(0,0,0,.78) 84%,
      rgba(0,0,0,.42) 93%,
      transparent 100%);
    mask-image:linear-gradient(180deg,
      #000 0%,
      #000 70%,
      rgba(0,0,0,.96) 76%,
      rgba(0,0,0,.78) 84%,
      rgba(0,0,0,.42) 93%,
      transparent 100%);
  }
  #appShell .home-banner-fade{
    display:none!important;
  }
}

@media print{
  body.tnh-popup-paper-page{
    background:#fff!important;
  }
}
/* ==== css/94-seat-pickup-per-seat.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* จุดขึ้นรถแยกตามเบาะ — v2
   สำคัญ: CSS ไม่ซ่อนช่องเดิมเอง เพื่อกันกรณี JS ติด cache แล้วตัวเลือกหายทั้งหมด
   ช่องเดิมจะถูกซ่อนโดย JS เฉพาะเมื่อฟอร์มจุดขึ้นรถรายเบาะสร้างสำเร็จแล้ว
*/

#bookingPage2 .seat-form-card .seat-pickup-field {
  display: block;
}

@media (min-width: 900px) {
  #bookingPage2 .seat-form-card .seat-pickup-field {
    grid-column: 1 / -1;
  }
}
/* ==== css/98-desktop-v2.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ======================================================================
   TIAEW NEE HUR — DESKTOP V2
   Desktop-only presentation layer. Nothing in this file applies below
   1024px, so the existing mobile layout and interactions stay untouched.
   ====================================================================== */
@media (min-width:1024px) {
  :root {
    --d-rail:268px;
    --d-top:72px;
    --d-bg:#050b12;
    --d-panel:#0b1623;
    --d-panel-2:#101e2d;
    --d-line:rgba(154,184,214,.14);
    --d-line-strong:rgba(125,211,252,.28);
    --d-text:#f4f8fc;
    --d-sub:#a9bacb;
    --d-blue:#38bdf8;
    --d-blue-2:#087fb2;
    --d-green:#34d399;
    --d-gold:#e0bd76;
    --d-orange:#fb923c;
    --d-radius:22px;
    --d-shadow:0 22px 55px rgba(0,0,0,.34);
  }

  html { background:var(--d-bg); scrollbar-color:#29435a #07101a; }
  body {
    min-width:1024px;
    background:
      radial-gradient(900px 520px at 78% -8%,rgba(22,154,207,.12),transparent 64%),
      radial-gradient(760px 480px at 5% 92%,rgba(16,185,129,.07),transparent 64%),
      var(--d-bg);
    color:var(--d-text);
  }
  body::before {
    content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.12;
    background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
    background-size:42px 42px;
    mask-image:linear-gradient(to bottom,black,transparent 80%);
  }
  .mobile-only { display:none!important; }
  .pc-only { display:flex!important; }

  /* ---------- App frame / desktop navigation ---------- */
  #appShell {
    min-height:100vh!important;
    padding-left:var(--d-rail)!important;
    background:transparent!important;
    color:var(--d-text);
  }
  #appShell .bnav {
    position:fixed!important;inset:0 auto 0 0!important;z-index:920!important;
    width:var(--d-rail)!important;height:100vh!important;min-height:0!important;
    padding:22px 18px 20px!important;margin:0!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:7px!important;
    overflow-y:auto!important;overflow-x:hidden!important;
    border:0!important;border-right:1px solid rgba(215,233,249,.11)!important;
    background:linear-gradient(180deg,rgba(11,22,35,.985),rgba(5,11,19,.99))!important;
    box-shadow:18px 0 55px rgba(0,0,0,.3)!important;
    backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  }
  #appShell .pc-brand {
    order:0!important;display:grid!important;grid-template-columns:50px 1fr!important;grid-template-rows:auto auto!important;
    column-gap:12px!important;align-items:center!important;padding:0 5px 22px!important;margin:0 0 8px!important;
    border-bottom:1px solid var(--d-line)!important;
  }
  #appShell .pc-brand img { grid-row:1/3;width:50px!important;height:50px!important;border-radius:50%!important;box-shadow:0 0 0 4px rgba(56,189,248,.08),0 10px 25px rgba(0,0,0,.35)!important; }
  #appShell .pc-brand strong { font-size:20px!important;line-height:1.2!important;color:#fff!important;letter-spacing:.1px!important; }
  #appShell .pc-brand small { display:block!important;font-size:9px!important;color:#6f879b!important;letter-spacing:1.5px!important; }
  #appShell .bnav-item {
    order:1!important;flex:0 0 auto!important;width:100%!important;min-height:52px!important;margin:0!important;padding:11px 13px!important;
    display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:13px!important;
    border:1px solid transparent!important;border-radius:14px!important;background:transparent!important;color:#8fa6bb!important;cursor:pointer!important;
    transition:background .22s ease,border-color .22s ease,color .22s ease,transform .22s ease!important;
  }
  #appShell .bnav-item:hover { transform:translateX(3px)!important;background:rgba(255,255,255,.045)!important;border-color:rgba(255,255,255,.065)!important;color:#eaf4fc!important; }
  #appShell .bnav-item.active {
    background:linear-gradient(105deg,rgba(14,165,233,.19),rgba(16,185,129,.055))!important;
    border-color:rgba(56,189,248,.25)!important;color:#e9f8ff!important;
    box-shadow:inset 3px 0 0 var(--d-blue),0 9px 22px rgba(0,0,0,.16)!important;
  }
  #appShell .bnav-item .ico { width:26px!important;height:26px!important;min-width:26px!important;display:grid!important;place-items:center!important;color:inherit!important;font-size:22px!important; }
  #appShell .bnav-item .ico svg { width:23px!important;height:23px!important; }
  #appShell .bnav-item .lbl { font-size:15px!important;line-height:1.3!important;color:inherit!important;text-align:left!important;font-weight:650!important; }
  #appShell .nav-avatar { width:27px!important;height:27px!important;border:2px solid rgba(125,211,252,.55)!important; }
  #appShell .bnav-checkin-action .checkin-fab { position:static!important;width:30px!important;height:30px!important;min-width:30px!important;border-radius:10px!important;border:1px solid rgba(56,189,248,.32)!important;box-shadow:none!important;background:rgba(14,165,233,.12)!important; }
  #appShell .bnav-checkin-action .checkin-fab svg { width:20px!important;height:20px!important; }
  #appShell .pc-side-services {
    order:2!important;display:flex!important;flex-direction:column!important;gap:5px!important;margin:13px 0 0!important;padding:15px 0 0!important;border-top:1px solid var(--d-line)!important;
  }
  #appShell .pc-side-services::before { content:"บริการเพิ่มเติม";padding:0 12px 7px;color:#5e768b;font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase; }
  #appShell .pc-side-services button {
    width:100%!important;padding:10px 13px!important;border:0!important;border-radius:11px!important;background:transparent!important;color:#9db0c2!important;
    font:inherit!important;font-size:13px!important;text-align:left!important;cursor:pointer!important;transition:.2s!important;
  }
  #appShell .pc-side-services button:hover { color:#dff5ff!important;background:rgba(56,189,248,.075)!important; }
  #appShell .pc-nav-contact {
    order:3!important;margin:14px 0 0!important;width:100%!important;padding:12px 15px!important;border:1px solid rgba(125,211,252,.3)!important;border-radius:13px!important;
    background:linear-gradient(135deg,#087ca9,#0c9fc2)!important;color:#fff!important;font-size:14px!important;font-weight:750!important;box-shadow:0 12px 24px rgba(3,105,145,.22)!important;
  }
  #appShell .pc-entry-return { order:4!important;margin-top:auto!important;min-height:40px!important;border:1px solid var(--d-line)!important;border-radius:11px!important;background:rgba(255,255,255,.025)!important;color:#71899e!important;font-size:11px!important;cursor:pointer!important; }

  #appShell .pc-top {
    position:fixed!important;top:0!important;left:var(--d-rail)!important;right:0!important;z-index:900!important;height:var(--d-top)!important;
    padding:0 30px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;
    border-bottom:1px solid var(--d-line)!important;background:rgba(5,11,18,.82)!important;
    backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;box-shadow:0 10px 35px rgba(0,0,0,.13)!important;
  }
  #appShell .pc-top > div:first-child { display:flex;flex-direction:column;gap:2px; }
  #appShell .pc-top strong { font-size:18px;color:#f5f9fc;line-height:1.2; }
  #appShell .pc-top small { font-size:10px;color:#698195;letter-spacing:.5px; }
  #appShell .pc-top-actions { display:flex;gap:9px; }
  #appShell .pc-top-actions button { height:38px;padding:0 15px;border:1px solid var(--d-line);border-radius:11px;background:rgba(255,255,255,.035);color:#b8cad9;font:inherit;font-size:12px;cursor:pointer; }
  #appShell .pc-top-actions button:last-child { border-color:rgba(56,189,248,.26);background:rgba(56,189,248,.09);color:#bfeaff; }

  /* ---------- Home hero ---------- */
  #appShell > .hdr { display:block!important;margin:0!important;padding:calc(var(--d-top) + 24px) 30px 0!important;background:transparent!important;border:0!important; }
  #appShell > .hdr.no-greet { display:none!important; }
  #appShell .home-banner {
    position:relative!important;width:min(100%,1500px)!important;height:clamp(340px,31vw,500px)!important;margin:0 auto!important;overflow:hidden!important;
    border:1px solid rgba(208,229,247,.14)!important;border-radius:28px!important;background:#08121d!important;box-shadow:var(--d-shadow)!important;
  }
  #appShell .home-banner > img { width:100%!important;height:100%!important;max-height:none!important;display:block!important;object-fit:cover!important;object-position:center!important;border-radius:0!important; }
  #appShell .home-banner::after { content:""!important;display:block!important;position:absolute!important;inset:0!important;z-index:1!important;pointer-events:none!important;background:linear-gradient(90deg,rgba(3,9,16,.78),rgba(3,9,16,.12) 54%,rgba(3,9,16,.25)),linear-gradient(0deg,rgba(3,9,16,.86),transparent 50%)!important; }
  #appShell .home-banner-fade { display:none!important; }
  #appShell .home-banner-actions { display:none!important; }
  #appShell .home-booking-steps {
    position:absolute!important;right:28px!important;bottom:25px!important;z-index:3!important;width:390px!important;max-width:44%!important;padding:14px 16px!important;
    border:1px solid rgba(255,255,255,.12)!important;border-radius:17px!important;background:rgba(4,12,20,.62)!important;backdrop-filter:blur(14px)!important;
  }
  #appShell .home-step-icon { width:35px!important;height:35px!important;font-size:15px!important; }
  #appShell .home-step-label { font-size:9px!important;color:#b7c9d8!important; }
  #appShell .home-step-line { margin-top:17px!important; }
  #appShell .home-banner .hdr-greet {
    position:absolute!important;left:28px!important;bottom:25px!important;right:auto!important;z-index:3!important;width:min(540px,46%)!important;max-width:none!important;margin:0!important;padding:15px 17px!important;
    display:flex!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:18px!important;background:rgba(4,12,20,.64)!important;box-shadow:0 14px 38px rgba(0,0,0,.25)!important;
    backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
  }
  #appShell .hdr-greet img { width:52px!important;height:52px!important; }
  #appShell .hdr-greet h2 { font-size:17px!important;color:#fff!important; }
  #appShell .hdr-greet p { font-size:12px!important;color:#b8c8d7!important; }
  #appShell .hdr-greet button { font-size:12px!important; }

  /* ---------- Main workspace ---------- */
  #appShell .view-page { min-height:calc(100vh - var(--d-top)); }
  #appShell .view-page > .main,
  #appShell .main { width:min(100%,1560px)!important;max-width:1560px!important;margin:0 auto!important;padding:36px 34px 88px!important; }
  #appShell #tab-home .main { padding-top:28px!important; }
  #appShell :is(#tab-trips,#tab-mytrips,#tab-notif) > .main { padding-top:calc(var(--d-top) + 34px)!important; }
  #appShell .pc-layout { display:grid!important;grid-template-columns:minmax(0,1fr) 330px!important;gap:28px!important;align-items:start!important; }
  #appShell .pc-intro { display:none!important; }
  #appShell .pc-toolbar { grid-column:1/-1!important;display:block!important;margin:0 0 2px!important;padding:0!important;border:0!important; }
  #appShell .pc-main { grid-column:1!important;min-width:0!important; }
  #appShell .pc-support { grid-column:2!important;display:flex!important;flex-direction:column!important;gap:14px!important;margin:0!important;padding:0!important;border:0!important;position:sticky!important;top:calc(var(--d-top) + 24px)!important; }
  #appShell .pc-footer { width:100%!important;margin:24px 0 0!important; }
  #appShell .home-quick-actions { display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:13px!important;margin:0 0 30px!important; }
  #appShell .home-quick-actions .qa-mini { min-height:72px!important;height:auto!important;padding:15px 18px!important;display:flex!important;flex-direction:row!important;justify-content:flex-start!important;gap:12px!important;border:1px solid var(--d-line)!important;border-radius:17px!important;background:linear-gradient(145deg,rgba(16,30,45,.9),rgba(9,20,31,.86))!important;box-shadow:0 13px 30px rgba(0,0,0,.18)!important;animation:none!important; }
  #appShell .home-quick-actions .qa-mini:hover { transform:translateY(-3px)!important;border-color:var(--d-line-strong)!important; }
  #appShell .qa-mini .qa-mini-ico { font-size:27px!important; }
  #appShell .qa-mini .qa-mini-label { font-size:14px!important;color:#edf6fd!important; }
  #appShell .qa-mini::after { margin-left:auto;font-size:15px!important;color:#7dd3fc!important; }
  #appShell .sec-hdr { margin:3px 0 17px!important;display:flex!important;align-items:center!important;justify-content:space-between!important; }
  #appShell .sec-hdr h3 { font-family:'Sarabun',sans-serif!important;font-size:22px!important;font-weight:800!important;color:#f5f9fc!important;letter-spacing:-.2px!important; }
  #appShell .sec-hdr h3::before { content:"";display:inline-block;width:4px;height:21px;margin-right:10px;border-radius:9px;background:linear-gradient(#38bdf8,#2dd4bf);vertical-align:-3px;box-shadow:0 0 16px rgba(56,189,248,.45); }
  #appShell .sec-hdr > *:last-child { font-size:12px!important;color:#7dd3fc!important; }
  #appShell .divider { height:1px!important;margin:33px 0!important;background:linear-gradient(90deg,transparent,var(--d-line),transparent)!important;border:0!important; }

  #appShell #upcomingList,
  #appShell #tripListFull { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px!important; }
  #appShell #tripListFull { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #appShell #tripListFull > p { grid-column:1/-1; }
  #appShell .trip-hcard2 {
    min-width:0!important;height:100%!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;
    border:1px solid var(--d-line)!important;border-radius:22px!important;background:linear-gradient(160deg,rgba(15,30,45,.96),rgba(7,17,27,.94))!important;
    box-shadow:0 16px 40px rgba(0,0,0,.24)!important;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease!important;
  }
  #appShell .trip-hcard2:hover { transform:translateY(-6px)!important;border-color:rgba(125,211,252,.34)!important;box-shadow:0 26px 56px rgba(0,0,0,.38)!important; }
  #appShell .trip-hcard2 .thc-photo { aspect-ratio:16/9!important;overflow:hidden!important; }
  #appShell .trip-hcard2 .thc-photo > img { width:100%!important;height:100%!important;object-fit:cover!important;transition:transform .55s ease!important; }
  #appShell .trip-hcard2:hover .thc-photo > img { transform:scale(1.04)!important; }
  #appShell .trip-hcard2 .thc-overlay { flex:1!important;padding:18px 19px 19px!important;display:flex!important;flex-direction:column!important; }
  #appShell .pc-card-caption { display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin:0 0 8px!important;color:#8196a9!important;font-size:11px!important; }
  #appShell .pc-card-caption > span:last-child { color:#7dd3fc!important; }
  #appShell .trip-hcard2 .thc-title { font-size:19px!important;line-height:1.45!important;color:#fff!important;margin-bottom:8px!important; }
  #appShell .trip-hcard2 .thc-meta-row { font-size:12px!important;line-height:1.65!important;color:#a9bacb!important; }
  #appShell .trip-hcard2 .thc-bottom-row { margin-top:auto!important;padding-top:14px!important;border-top:1px solid var(--d-line)!important; }
  #appShell .trip-hcard2 .thc-price strong { font-size:25px!important;color:#f7dfad!important; }
  #appShell .trip-hcard2 .thc-price > span { font-size:11px!important;color:#8ea3b6!important; }
  #appShell .trip-hcard2 .thc-seats-pill,#appShell .thc-status-pill { font-size:11px!important;padding:6px 10px!important; }

  #appShell .pc-support .stat-bar,
  #appShell .pc-support > a { width:100%!important;margin:0!important;padding:18px!important;border:1px solid var(--d-line)!important;border-radius:18px!important;background:linear-gradient(145deg,rgba(16,30,45,.9),rgba(8,18,29,.88))!important;box-shadow:0 12px 30px rgba(0,0,0,.17)!important;color:#eaf4fb!important; }
  #appShell .stat-bar .ico { font-size:27px!important; }
  #appShell .stat-bar .txt h4 { font-size:14px!important;color:#eef7fd!important; }
  #appShell .stat-bar .txt p { font-size:11px!important;line-height:1.6!important;color:#8298aa!important; }
  #appShell .past-grid { display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:15px!important; }
  #appShell .past-card { border-radius:18px!important;overflow:hidden!important;border:1px solid var(--d-line)!important; }

  /* ---------- Trips / profile ---------- */
  #appShell .search-wrap { max-width:none!important;margin:0 0 26px!important; }
  #appShell .search-wrap input { width:100%!important;height:54px!important;padding-left:48px!important;border:1px solid var(--d-line)!important;border-radius:15px!important;background:rgba(12,25,39,.88)!important;color:#eff7fd!important;font-size:14px!important;box-shadow:0 12px 30px rgba(0,0,0,.14)!important; }
  #appShell .my-profile { max-width:none!important;margin:0 0 24px!important;padding:25px 27px!important;border:1px solid var(--d-line)!important;border-radius:22px!important;background:linear-gradient(130deg,rgba(18,42,55,.93),rgba(9,21,33,.95))!important;box-shadow:var(--d-shadow)!important; }
  #appShell .my-ava { width:76px!important;height:76px!important;box-shadow:0 0 0 5px rgba(56,189,248,.08)!important; }
  #appShell .my-info h3 { font-size:24px!important;color:#fff!important; }
  #appShell .my-info > p { font-size:13px!important;color:#9fb1c1!important; }
  #appShell .my-stats { margin-top:18px!important;display:grid!important;grid-template-columns:repeat(3,minmax(120px,1fr))!important;gap:12px!important; }
  #appShell .my-stat { padding:14px!important;border:1px solid rgba(255,255,255,.075)!important;border-radius:14px!important;background:rgba(2,10,17,.25)!important;text-align:center!important; }
  #appShell .my-stat h4 { font-size:25px!important; }
  #appShell .my-stat p { font-size:10px!important;color:#7f94a6!important; }
  #appShell .my-profile-edit-btn { top:22px!important;right:24px!important;padding:9px 14px!important;font-size:12px!important; }
  #appShell .my-payment-filter { margin:0 0 29px!important;padding:6px!important;display:inline-flex!important;border:1px solid var(--d-line)!important;border-radius:14px!important;background:rgba(6,15,24,.72)!important; }
  #appShell .my-payment-filter-btn { min-width:130px!important;padding:10px 17px!important;font-size:12px!important;border-radius:10px!important; }
  #appShell #bookingUpcomingList,
  #appShell #bookingHistoryList { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px!important; }
  #appShell #bookingHistoryList.my-past-fade-list > * { display:block!important;animation:none!important; }
  #appShell .hist-card { min-height:280px!important;border-radius:20px 20px 0 0!important;border:1px solid var(--d-line)!important;box-shadow:0 15px 38px rgba(0,0,0,.24)!important; }
  #appShell .hist-card-overlay h4 { font-size:19px!important; }
  #appShell .hist-card-overlay p { font-size:12px!important; }
  #appShell .pickup-manage-box { min-height:82px!important;padding:14px 15px!important;border-radius:0 0 20px 20px!important; }
  #appShell .pickup-manage-copy small { font-size:10px!important; }
  #appShell .pickup-manage-copy strong { font-size:13px!important; }
  #appShell .pickup-manage-btn { min-width:150px!important;padding:10px 13px!important;font-size:11px!important; }

  /* ---------- Learning / necessary ---------- */
  #appShell #notifContent { display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:15px!important;align-content:start!important; }
  #appShell #notifContent > :not(.prep-item-card) { grid-column:1/-1!important; }
  #appShell .learning-page-intro { padding:25px 27px!important;border-radius:22px!important; }
  #appShell .learning-page-intro h3 { font-size:25px!important; }
  #appShell .learning-page-intro p { font-size:13px!important; }
  #appShell .learning-summary-card { grid-template-columns:1fr 88px!important;padding:22px 24px!important;border-radius:20px!important; }
  #appShell .learning-score-ring { width:76px!important;height:76px!important; }
  #appShell .learning-summary-copy strong { font-size:26px!important; }
  #appShell .learning-summary-card p { font-size:12px!important; }
  #appShell .prep-item-card { min-height:108px!important;margin:0!important;padding:18px!important;border-radius:18px!important; }
  #appShell .prep-item-card:hover { transform:translateY(-3px)!important;border-color:rgba(251,146,60,.4)!important; }
  #appShell .prep-item-icon { width:48px!important;height:48px!important;font-size:23px!important; }
  #appShell .prep-item-title { font-size:14px!important; }
  #appShell .prep-item-copy small { font-size:10px!important; }
  .prep-detail-box { width:min(960px,calc(100vw - 100px))!important;max-width:960px!important;max-height:calc(100vh - 80px)!important;padding:34px 36px 38px!important;border-radius:26px!important; }
  .prep-detail-box h2 { font-size:26px!important; }
  .prep-detail-body { grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important; }
  .learning-row { min-height:92px!important; }
  .learning-row-title { font-size:14px!important; }

  /* ---------- Detail modal ---------- */
  #modalBg { padding:34px!important;align-items:center!important; }
  #modalBg .modal-sheet { width:min(1120px,calc(100vw - 100px))!important;max-width:1120px!important;max-height:calc(100vh - 68px)!important;padding:0!important;display:grid!important;grid-template-columns:46% 54%!important;grid-template-rows:1fr auto!important;overflow:hidden!important;border:1px solid rgba(199,220,240,.18)!important;border-radius:28px!important;background:linear-gradient(145deg,#122235,#09131f)!important;box-shadow:0 38px 100px rgba(0,0,0,.62)!important; }
  #modalBg .modal-img { grid-column:1!important;grid-row:1/3!important;width:100%!important;height:100%!important;min-height:610px!important;padding:0!important;object-fit:cover!important;border-right:1px solid var(--d-line)!important; }
  #modalBg .modal-body { grid-column:2!important;grid-row:1!important;min-width:0!important;padding:34px 35px 20px!important;overflow-y:auto!important; }
  #modalBg .modal-body h2 { font-size:29px!important;line-height:1.3!important;color:#fff!important; }
  #modalBg .modal-date { font-size:14px!important;color:#9fdfff!important; }
  #modalBg .modal-price { font-size:24px!important; }
  #modalBg .modal-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important; }
  #modalBg .modal-card { min-height:82px!important;padding:14px!important;border:1px solid var(--d-line)!important;border-radius:14px!important;background:rgba(255,255,255,.035)!important; }
  #modalBg .modal-card span { font-size:11px!important; }
  #modalBg .modal-card strong { font-size:15px!important; }
  #modalBg .modal-sheet > .btn-book { grid-column:2!important;grid-row:2!important;position:static!important;width:auto!important;max-width:none!important;height:54px!important;margin:0 35px 30px!important;border-radius:14px!important;font-size:15px!important; }

  /* ---------- Booking workspace ---------- */
  #bookingPage2,
  #equipPage,
  #reviewPage,
  #successPage2,
  #equipReceiptPage { background:linear-gradient(rgba(4,11,18,.92),rgba(4,11,18,.97)),url('../assets/optimized/hero-900.webp') center/cover fixed!important; }
  #bookingPage2 .bk-hdr,
  #equipPage .bk-hdr,
  #reviewPage .bk-hdr { position:sticky!important;top:0!important;z-index:20!important;height:72px!important;padding:0 max(32px,calc((100vw - 1480px)/2))!important;display:flex!important;align-items:center!important;justify-content:space-between!important;border-bottom:1px solid var(--d-line)!important;background:rgba(5,12,20,.84)!important;backdrop-filter:blur(18px)!important; }
  :is(#bookingPage2,#equipPage,#reviewPage) .btn-back { min-width:122px!important;height:40px!important;border:1px solid var(--d-line)!important;border-radius:11px!important;background:rgba(255,255,255,.035)!important;color:#d8e6f2!important;font-size:12px!important; }
  #bookingPage2 .bk-body { width:min(100%,1480px)!important;max-width:1480px!important;margin:0 auto!important;padding:32px 34px 130px!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(460px,600px)!important;grid-template-rows:auto!important;gap:16px 28px!important;align-items:start!important; }
  #bookingPage2 .bk-body > div:first-child { grid-column:1!important;grid-row:auto!important;text-align:left!important;margin:0 0 5px!important; }
  #bookingPage2 .bk-body > div:first-child h2 { font-size:27px!important;text-align:left!important; }
  #bookingPage2 .bk-body > div:first-child p { font-size:13px!important;text-align:left!important; }
  #bookingPage2 .bk-body > .ig { grid-column:1!important;margin:0!important; }
  #bookingPage2 .bk-body > label { grid-column:1!important;margin:6px 0 0!important;font-size:13px!important; }
  #bookingPage2 .bk-body > .seat-map-img { grid-column:2!important;grid-row:1/6!important;width:100%!important;max-height:440px!important;margin:0!important;padding:12px!important;object-fit:contain!important;border:1px solid var(--d-line)!important;border-radius:20px!important;background:rgba(8,19,30,.78)!important; }
  #bookingPage2 .seat-legend { grid-column:1!important;margin:5px 0 0!important;padding:12px 14px!important;border:1px solid var(--d-line)!important;border-radius:13px!important;background:rgba(8,19,30,.66)!important; }
  #bookingPage2 .van-blocks-row { grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important;margin-top:18px!important; }
  #bookingPage2 .van-blocks-row .van-block { min-width:0!important;margin:0!important;padding:18px!important;border:1px solid var(--d-line)!important;border-radius:20px!important;background:linear-gradient(150deg,rgba(16,31,47,.9),rgba(8,18,29,.9))!important;box-shadow:0 15px 38px rgba(0,0,0,.22)!important; }
  #bookingPage2 .bk-body > .van-block { grid-column:1/-1!important;padding:19px!important;border:1px solid var(--d-line)!important;border-radius:20px!important;background:rgba(10,23,36,.84)!important; }
  #bookingPage2 .van-block-title { font-size:15px!important; }
  #bookingPage2 .van-grid-seats { gap:9px!important; }
  #bookingPage2 #formFieldsBox2 { grid-column:1/-1!important;margin-top:7px!important;padding:24px!important;border:1px solid var(--d-line)!important;border-radius:22px!important;background:rgba(9,21,33,.88)!important;box-shadow:0 18px 45px rgba(0,0,0,.2)!important; }
  #bookingPage2 #seatFormsContainer { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important; }
  #bookingPage2 .seat-form-card { margin:0!important;padding:19px!important;border-radius:18px!important; }
  #bookingPage2 :is(.ig input,.ig select,.pickup-select,.pickup-other-input) { min-height:50px!important;font-size:14px!important; }
  #bookingPage2 .sticky-bar { left:0!important;right:0!important;bottom:0!important;z-index:40!important;padding:15px 34px!important;border-top:1px solid var(--d-line)!important;background:rgba(5,12,20,.88)!important;backdrop-filter:blur(18px)!important; }
  #bookingPage2 .sticky-bar .btn-confirm { max-width:720px!important;height:54px!important;margin:0 auto!important;border-radius:14px!important;font-size:15px!important; }

  /* ---------- Payment / receipt ---------- */
  .pay-modal { padding:32px!important;align-items:center!important; }
  .pay-modal .pay-box { width:min(560px,calc(100vw - 80px))!important;max-width:560px!important;max-height:calc(100vh - 64px)!important;padding:31px 32px!important;overflow-y:auto!important;border:1px solid rgba(193,218,239,.2)!important;border-radius:25px!important;background:linear-gradient(145deg,#13263a,#091521 68%)!important;box-shadow:0 35px 95px rgba(0,0,0,.58)!important; }
  #payModal .pay-box,
  #remainingPayModal .pay-box { width:min(980px,calc(100vw - 100px))!important;max-width:980px!important;display:grid!important;grid-template-columns:330px minmax(0,1fr)!important;gap:14px 24px!important;align-items:start!important; }
  :is(#payModal,#remainingPayModal) .pay-x { position:absolute!important; }
  :is(#payModal,#remainingPayModal) .pay-box > h3,
  :is(#payModal,#remainingPayModal) .pay-box > .sub,
  #payModal .pay-box > .chip { grid-column:1/-1!important; }
  :is(#payModal,#remainingPayModal) .qr-img { grid-column:1!important;grid-row:4/7!important;width:100%!important;max-width:310px!important;margin:0 auto!important; }
  :is(#payModal,#remainingPayModal) .deposit-summary-box { grid-column:2!important;margin:0!important;min-height:150px!important;padding:21px!important;border-radius:18px!important; }
  #payModal .bank-shortcut-box { grid-column:1/-1!important;margin-top:4px!important; }
  #payModal .bank-shortcut-list { display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:9px!important; }
  #payModal .bank-shortcut-item { min-width:0!important; }
  #payModal .seat-lock-timer,
  :is(#payModal,#remainingPayModal) .slip-upload,
  :is(#payModal,#remainingPayModal) .btn-confirm { grid-column:1/-1!important; }
  :is(#payModal,#remainingPayModal) .slip-drop { min-height:92px!important; }
  #paymentChoiceModal .pay-box { max-width:560px!important; }
  #equipPayModal { align-items:center!important;padding:32px!important; }
  #equipPayModal .eq-pay-box { width:min(700px,calc(100vw - 80px))!important;max-width:700px!important;max-height:calc(100vh - 64px)!important;padding:30px!important;overflow-y:auto!important;border-radius:25px!important; }
  :is(#successPage2,#equipReceiptPage) .succ-body { max-width:760px!important;padding:48px 32px 90px!important; }
  :is(#successPage2,#equipReceiptPage) .receipt { padding:28px!important;border-radius:22px!important; }
  :is(#successPage2,#equipReceiptPage) .r-row { font-size:14px!important;padding:9px 0!important; }

  /* ---------- Equipment / reviews ---------- */
  #equipPage .bk-body,
  #reviewPage .bk-body { width:min(100%,1280px)!important;max-width:1280px!important;margin:0 auto!important;padding:34px 34px 120px!important; }
  #equipPage .bk-body { display:grid!important;grid-template-columns:minmax(0,1fr) 420px!important;gap:0 30px!important;align-items:start!important; }
  #equipPage .bk-body > div:first-child,
  #equipPage .eq-sec-title,
  #equipPage #eqTripList { grid-column:1/-1!important; }
  #equipPage #eqItemList { grid-column:1!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:15px!important; }
  #equipPage .eq-summary-card { grid-column:2!important;grid-row:4!important;position:sticky!important;top:100px!important;margin:0!important;padding:22px!important;border-radius:20px!important; }
  #equipPage .eq-item-card { margin:0!important;padding:15px!important;border-radius:18px!important; }
  #equipPage .eq-item-img { width:92px!important;height:92px!important; }
  #equipPage .sticky-bar { padding:15px 34px!important; }
  #equipPage .sticky-bar .btn-confirm { max-width:720px!important;margin:0 auto!important; }
  #reviewPage .bk-body { display:grid!important;grid-template-columns:340px minmax(0,1fr)!important;gap:24px 30px!important; }
  #reviewPage .bk-body > div:first-child,
  #reviewPage #reviewSummary,
  #reviewPage .btn-login { grid-column:1!important; }
  #reviewPage #writeReviewBox { grid-column:1!important; }
  #reviewPage #reviewList { grid-column:2!important;grid-row:1/6!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;align-content:start!important; }
  #reviewPage .review-card { margin:0!important;padding:18px!important;border-radius:19px!important; }
  #reviewPage .review-photo { max-height:340px!important; }

  /* ---------- Drawer / secondary overlays ---------- */
  #drawer { align-items:stretch!important; }
  #drawer .drawer-box { width:min(520px,42vw)!important;max-width:520px!important;padding:30px!important; }
  :is(#tripCalendarModal,#vanLocationModal,#monthTripsModal) .calendar-box,
  :is(#tripCalendarModal,#vanLocationModal,#monthTripsModal) .van-location-box,
  :is(#tripCalendarModal,#vanLocationModal,#monthTripsModal) .month-trips-box { width:min(900px,calc(100vw - 100px))!important;max-width:900px!important;max-height:calc(100vh - 80px)!important;border-radius:26px!important; }
  #adminPopup > div { width:min(560px,calc(100vw - 80px))!important;max-width:560px!important;border-radius:24px!important; }
  .admin-tab { right:20px!important;bottom:22px!important; }

  /* ---------- Login / loading ---------- */
  #loginPage:not(.hidden) { display:grid!important;grid-template-columns:minmax(420px,1fr) minmax(460px,620px)!important;align-items:center!important;gap:70px!important;padding:70px max(70px,calc((100vw - 1400px)/2))!important;background:linear-gradient(90deg,rgba(3,10,17,.38),rgba(3,10,17,.88)),url('../assets/optimized/hero-900.webp') center/cover!important; }
  #loginPage .login-logo { text-align:left!important;align-items:flex-start!important; }
  #loginPage .login-logo img { width:130px!important;height:130px!important; }
  #loginPage .login-logo h1 { font-size:43px!important; }
  #loginPage .login-logo p { font-size:18px!important; }
  #loginPage .login-card { width:100%!important;max-width:620px!important;padding:38px!important;border:1px solid rgba(255,255,255,.13)!important;border-radius:28px!important;background:rgba(7,17,27,.78)!important;box-shadow:0 36px 90px rgba(0,0,0,.48)!important;backdrop-filter:blur(18px)!important; }
  #loadingScreen > * { transform:scale(1.05); }

  /* ---------- Admin Center: desktop application ---------- */
  #adminGate .admin-gate-card { width:min(520px,calc(100vw - 80px))!important;max-width:520px!important;padding:38px!important;border-radius:28px!important; }
  #adminCenter.show { display:grid!important;grid-template-columns:260px minmax(0,1fr)!important;grid-template-rows:84px minmax(0,1fr)!important; }
  #adminCenter .admin-topbar { grid-column:1/-1!important;grid-row:1!important;height:84px!important;padding:0 24px!important;display:flex!important;flex-direction:row!important;align-items:center!important;border-right:0!important;border-bottom:1px solid var(--d-line)!important;background:rgba(5,12,20,.94)!important; }
  #adminCenter .admin-brand img { width:52px!important;height:52px!important; }
  #adminCenter .admin-brand strong { font-size:17px!important; }
  #adminCenter .admin-active-users { flex:1!important;margin:0 20px!important; }
  #adminCenter .admin-top-actions { margin:0 0 0 auto!important; }
  #adminCenter .admin-icon-btn { width:43px!important;height:43px!important;flex:none!important; }
  #adminCenter .admin-nav { grid-column:1!important;grid-row:2!important;width:260px!important;height:calc(100vh - 84px)!important;padding:20px 14px!important;display:flex!important;flex-direction:column!important;gap:7px!important;overflow-y:auto!important;border-right:1px solid var(--d-line)!important;border-bottom:0!important;background:rgba(7,16,26,.96)!important; }
  #adminCenter .admin-nav-btn { width:100%!important;min-height:49px!important;padding:10px 14px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;border-radius:12px!important;font-size:13px!important;text-align:left!important; }
  #adminCenter .admin-nav-btn span { display:inline-grid!important;place-items:center!important;width:24px!important;margin:0!important;font-size:17px!important; }
  #adminCenter .admin-body { grid-column:2!important;grid-row:2!important;width:100%!important;max-width:none!important;height:calc(100vh - 84px)!important;margin:0!important;padding:30px 34px 70px!important;overflow-y:auto!important; }
  #adminCenter .admin-view { width:min(100%,1500px)!important;max-width:1500px!important;margin:0 auto!important; }
  #adminCenter .admin-view-head h2 { font-size:26px!important; }
  #adminCenter .admin-view-head p { font-size:12px!important; }
  #adminCenter .admin-stats { grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:15px!important; }
  #adminCenter .admin-stat { min-height:126px!important;padding:20px!important;border-radius:18px!important; }
  #adminCenter .admin-stat strong { font-size:34px!important; }
  #adminCenter .admin-panel { padding:20px!important;border-radius:20px!important; }
  #adminCenter .admin-filterbar { grid-template-columns:2fr 1fr 1fr!important;gap:11px!important; }
  #adminCenter .admin-filterbar .wide { grid-column:auto!important; }
  #adminCenter .admin-field { height:48px!important;font-size:13px!important; }
  #adminCenter .admin-list { grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important; }
  #adminCenter .admin-row-card { padding:17px!important;border-radius:16px!important; }
  #adminCenter .admin-trip-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:15px!important; }
  #adminCenter .admin-trip-card,#adminCenter .admin-trip-copy { min-height:200px!important; }
  #adminCenter .admin-passenger-info-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #adminSlipViewer .admin-slip-box { width:min(900px,calc(100vw - 100px))!important;max-width:900px!important;max-height:calc(100vh - 80px)!important; }

  /* Desktop interaction polish */
  :is(#appShell,#bookingPage2,#equipPage,#reviewPage,#adminCenter) :is(button,a,[role="button"]):focus-visible { outline:3px solid rgba(125,211,252,.75)!important;outline-offset:3px!important; }
  @media (prefers-reduced-motion:reduce) {
    *,*::before,*::after { scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important; }
  }
}

@media (min-width:1024px) and (max-width:1279px) {
  :root { --d-rail:236px; }
  #appShell .pc-layout { grid-template-columns:1fr!important; }
  #appShell .pc-support { grid-column:1!important;position:static!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #appShell #tripListFull { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #appShell #notifContent { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #bookingPage2 .bk-body { grid-template-columns:minmax(0,1fr) 440px!important; }
  #bookingPage2 .van-blocks-row { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #reviewPage .bk-body { grid-template-columns:300px minmax(0,1fr)!important; }
  #reviewPage #reviewList { grid-template-columns:1fr!important; }
  #adminCenter .admin-list { grid-template-columns:1fr!important; }
}

@media (min-width:1600px) {
  #appShell #tripListFull { grid-template-columns:repeat(4,minmax(0,1fr))!important; }
  #appShell #upcomingList { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #appShell #bookingUpcomingList,#appShell #bookingHistoryList { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #appShell .past-grid { grid-template-columns:repeat(5,minmax(0,1fr))!important; }
  #adminCenter .admin-list { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #adminCenter .admin-trip-grid { grid-template-columns:repeat(4,minmax(0,1fr))!important; }
}

/* ======================================================================
   DESKTOP V3 — native desktop workspace
   This deliberately changes proportions and information density instead
   of scaling the mobile cards. It is still completely isolated from phone.
   ====================================================================== */
@media (min-width:1024px) {
  :root { --d-rail:244px; --d-top:68px; --d-content:1540px; }

  /* True desktop entrance: editorial image left, navigation console right. */
  #appShell.pc-entry-active { padding-left:0!important; }
  #pcEntry {
    min-height:100vh!important;padding:28px!important;display:grid!important;
    grid-template-columns:minmax(0,1.5fr) minmax(390px,.68fr)!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;gap:22px 26px!important;
    background:#050b12!important;overflow:hidden!important;
  }
  #pcEntry .pc-entry-art {
    position:relative!important;inset:auto!important;z-index:0!important;grid-column:1!important;grid-row:1/4!important;
    width:100%!important;height:calc(100vh - 56px)!important;min-height:620px!important;object-fit:cover!important;object-position:center!important;
    border:1px solid rgba(195,219,239,.16)!important;border-radius:26px!important;filter:none!important;opacity:.88!important;
    box-shadow:0 28px 80px rgba(0,0,0,.42)!important;
  }
  #pcEntry::before {
    content:"";position:absolute;left:28px;top:28px;bottom:28px;width:calc((100% - 82px)*.676);z-index:1;pointer-events:none;
    border-radius:26px;background:linear-gradient(90deg,rgba(3,8,14,.08),transparent 54%),linear-gradient(0deg,rgba(3,8,14,.72),transparent 48%);
  }
  #pcEntry .pc-entry-top { grid-column:2!important;grid-row:1!important;position:relative!important;z-index:2!important;padding:10px 4px 20px!important;border-bottom:1px solid var(--d-line)!important; }
  #pcEntry .pc-entry-brand { font-size:22px!important; }
  #pcEntry .pc-entry-brand img { width:46px!important;height:46px!important; }
  #pcEntry .pc-entry-tag { max-width:170px!important;font-size:12px!important;line-height:1.5!important;text-align:right!important;color:#7890a5!important; }
  #pcEntry .pc-entry-space { display:none!important; }
  #pcEntry .pc-entry-menu {
    grid-column:2!important;grid-row:2!important;align-self:center!important;width:100%!important;max-width:none!important;margin:0!important;
    display:flex!important;flex-direction:column!important;gap:10px!important;
  }
  #pcEntry .pc-entry-menu::before { content:"เลือกพื้นที่ใช้งาน";display:block;margin:0 0 7px;color:#607b91;font-size:11px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase; }
  #pcEntry .pc-entry-button {
    min-height:78px!important;padding:14px 48px 14px 16px!important;display:grid!important;grid-template-columns:44px 1fr!important;grid-template-rows:auto auto!important;
    column-gap:14px!important;align-items:center!important;text-align:left!important;border:1px solid var(--d-line)!important;border-radius:15px!important;
    background:rgba(13,27,42,.72)!important;box-shadow:none!important;
  }
  #pcEntry .pc-entry-button:hover { transform:translateX(-4px)!important;border-color:rgba(125,211,252,.38)!important;background:rgba(17,38,58,.9)!important; }
  #pcEntry .pc-entry-button.primary { background:linear-gradient(110deg,rgba(4,105,150,.8),rgba(11,43,68,.86))!important;border-color:rgba(84,202,245,.48)!important; }
  #pcEntry .pc-entry-button svg { grid-column:1!important;grid-row:1/3!important;width:24px!important;height:24px!important;margin:0!important;padding:9px!important;box-sizing:content-box!important;border-radius:12px!important;background:rgba(125,211,252,.1)!important; }
  #pcEntry .pc-entry-button strong { grid-column:2!important;margin:0!important;font-size:17px!important;line-height:1.25!important; }
  #pcEntry .pc-entry-button small { grid-column:2!important;display:block!important;margin-top:3px!important;font-size:11px!important;color:#8299ad!important; }
  #pcEntry .pc-entry-button::after { top:50%!important;right:18px!important;transform:translateY(-50%)!important;font-size:18px!important; }
  #pcEntry .pc-entry-footer { grid-column:2!important;grid-row:3!important;display:block!important;padding:18px 4px 4px!important;border-top:1px solid var(--d-line)!important;font-size:10px!important;line-height:1.7!important;color:#587187!important; }
  #pcEntry .pc-entry-footer span { display:block!important; }

  /* Application chrome is intentionally compact; desktop space belongs to data. */
  #appShell .bnav { padding:18px 15px!important; }
  #appShell .pc-brand { grid-template-columns:44px 1fr!important;padding:0 4px 17px!important; }
  #appShell .pc-brand img { width:44px!important;height:44px!important; }
  #appShell .pc-brand strong { font-size:17px!important; }
  #appShell .bnav-item { min-height:47px!important;padding:9px 12px!important;border-radius:11px!important; }
  #appShell .bnav-item .lbl { font-size:13px!important; }
  #appShell .pc-top { padding:0 34px!important; }
  #appShell .pc-top strong { font-size:15px!important; }

  /* Compact desktop header, not a stretched mobile cover. */
  #appShell > .hdr { padding:calc(var(--d-top) + 20px) 34px 0!important; }
  #appShell .home-banner {
    width:min(100%,var(--d-content))!important;height:286px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 430px!important;
    border-radius:20px!important;
  }
  #appShell .home-banner > img { position:absolute!important;inset:0!important; }
  #appShell .home-banner::after { background:linear-gradient(90deg,rgba(3,9,16,.88),rgba(3,9,16,.48) 45%,rgba(3,9,16,.78))!important; }
  #appShell .hdr-greet { left:30px!important;bottom:30px!important;right:auto!important;top:auto!important;width:min(560px,46%)!important;max-width:560px!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important; }
  #appShell .hdr-greet :is(h1,h2,.greet-title) { font-size:clamp(25px,2.1vw,34px)!important;line-height:1.25!important; }
  #appShell .home-booking-steps { right:26px!important;bottom:26px!important;width:390px!important;max-width:39%!important; }

  /* Every inner page gets a real desktop title bar outside mobile content. */
  #appShell .pc-page-heading {
    width:min(calc(100% - 68px),var(--d-content))!important;margin:0 auto!important;padding:calc(var(--d-top) + 32px) 0 22px!important;
    display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:30px!important;border-bottom:1px solid var(--d-line)!important;
  }
  #appShell .pc-page-heading small { display:block;margin-bottom:6px;color:#5dbde4;font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase; }
  #appShell .pc-page-heading h1 { margin:0;color:#f7fafc;font-size:30px;line-height:1.2;letter-spacing:-.5px; }
  #appShell .pc-page-heading p { margin:8px 0 0;color:#7f96aa;font-size:12px;line-height:1.55; }
  #appShell .pc-page-status { flex:none;padding:8px 12px;border:1px solid var(--d-line);border-radius:999px;background:rgba(255,255,255,.025);color:#8ea4b7;font-size:10px; }
  #appShell .pc-page-status i { display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#34d399;box-shadow:0 0 12px rgba(52,211,153,.75); }
  #appShell .view-page > .main,
  #appShell #tab-home > .main { width:min(calc(100% - 68px),var(--d-content))!important;max-width:var(--d-content)!important;padding:26px 0 72px!important; }
  #appShell #tab-home > .main { padding-top:22px!important; }
  #appShell .pc-layout { grid-template-columns:minmax(0,1fr) 286px!important;gap:22px!important; }

  /* Dashboard quick actions: restrained toolbar rather than giant phone buttons. */
  #appShell .home-quick-actions { grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important; }
  #appShell .qa-mini { min-height:74px!important;padding:13px 16px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;border-radius:14px!important;background:rgba(12,26,40,.9)!important; }
  #appShell .qa-mini-ico { width:38px!important;height:38px!important;font-size:20px!important; }
  #appShell .qa-mini-label { font-size:13px!important;text-align:left!important; }
  #appShell .sec-hdr { margin:24px 0 13px!important; }
  #appShell .sec-hdr h2,#appShell .sec-hdr > div:first-child { font-size:18px!important; }

  /* Home cards are horizontal editorial cards. */
  #appShell #upcomingList,
  #appShell #bookingUpcomingList { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;overflow:visible!important;scroll-snap-type:none!important; }
  #appShell #upcomingList .trip-hcard2,
  #appShell #bookingUpcomingList .trip-hcard2 {
    min-width:0!important;height:218px!important;display:block!important;border-radius:16px!important;overflow:hidden!important;
  }
  #appShell #upcomingList .trip-hcard2 .thc-photo,
  #appShell #bookingUpcomingList .trip-hcard2 .thc-photo { height:100%!important;aspect-ratio:auto!important; }
  #appShell #upcomingList .trip-hcard2 .thc-overlay,
  #appShell #bookingUpcomingList .trip-hcard2 .thc-overlay { position:absolute!important;inset:0!important;justify-content:flex-end!important;padding:18px!important;background:linear-gradient(0deg,rgba(3,9,16,.94),rgba(3,9,16,.08) 72%)!important; }
  #appShell #upcomingList .trip-hcard2 .thc-title,
  #appShell #bookingUpcomingList .trip-hcard2 .thc-title { font-size:17px!important;margin:0 0 5px!important; }
  #appShell #upcomingList .trip-hcard2 .thc-meta-row,
  #appShell #bookingUpcomingList .trip-hcard2 .thc-meta-row { margin:0 0 8px!important;font-size:10px!important; }
  #appShell #upcomingList .trip-hcard2 .thc-bottom-row,
  #appShell #bookingUpcomingList .trip-hcard2 .thc-bottom-row { padding-top:8px!important; }
  #appShell #upcomingList .trip-hcard2 .thc-price strong,
  #appShell #bookingUpcomingList .trip-hcard2 .thc-price strong { font-size:20px!important; }

  /* All trips becomes a booking catalogue list, not a phone-card wall. */
  #appShell #tab-trips > .main { display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:18px!important; }
  #appShell #tab-trips .search-wrap { width:min(520px,100%)!important;height:46px!important;margin:0!important;border-radius:12px!important; }
  #appShell #tripListFull { display:flex!important;flex-direction:column!important;gap:12px!important; }
  #appShell #tripListFull .trip-hcard2 {
    width:100%!important;height:176px!important;min-height:176px!important;display:grid!important;grid-template-columns:276px minmax(0,1fr)!important;
    border-radius:16px!important;overflow:hidden!important;background:linear-gradient(120deg,rgba(14,29,44,.96),rgba(8,18,29,.94))!important;
  }
  #appShell #tripListFull .trip-hcard2:hover { transform:translateX(4px)!important; }
  #appShell #tripListFull .thc-photo { grid-column:1!important;height:100%!important;aspect-ratio:auto!important; }
  #appShell #tripListFull .thc-photo > img { height:100%!important; }
  #appShell #tripListFull .thc-overlay { grid-column:2!important;position:relative!important;padding:20px 24px!important;justify-content:center!important;background:transparent!important; }
  #appShell #tripListFull .pc-card-caption { position:absolute!important;right:22px!important;top:18px!important;width:auto!important;display:flex!important;gap:15px!important; }
  #appShell #tripListFull .thc-title { max-width:65%!important;font-size:20px!important;margin:0 0 8px!important; }
  #appShell #tripListFull .thc-meta-row { font-size:11px!important;margin-bottom:13px!important; }
  #appShell #tripListFull .thc-bottom-row { margin-top:0!important;padding-top:12px!important; }
  #appShell #tripListFull .thc-price strong { font-size:22px!important; }

  /* Profile becomes a dashboard with a wide account header and dense records. */
  #appShell #myContent { display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:18px!important; }
  #appShell #myContent .my-profile { min-height:190px!important;padding:24px 28px!important;display:grid!important;grid-template-columns:120px minmax(240px,1fr) minmax(420px,1.3fr)!important;align-items:center!important;gap:24px!important;border-radius:18px!important; }
  #appShell #myContent .my-ava-col { width:120px!important; }
  #appShell #myContent .my-ava { width:92px!important;height:92px!important; }
  #appShell #myContent .my-info { text-align:left!important; }
  #appShell #myContent .my-stats { margin:0!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important; }
  #appShell #myContent .my-stat { min-height:88px!important;padding:14px!important;border:1px solid var(--d-line)!important;border-radius:13px!important;background:rgba(255,255,255,.025)!important; }
  #appShell #myContent .my-payment-filter { width:max-content!important;max-width:100%!important;margin:0!important;padding:5px!important;border-radius:12px!important; }
  #appShell #myContent .hist-card { min-height:230px!important;border-radius:17px!important; }
  #appShell #myContent .hist-group-title { margin:20px 0 10px!important;font-size:18px!important; }
  #appShell #myContent :is(#bookingHistoryList,.my-past-fade-list) { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important; }
  #appShell #myContent .my-past-fade-list > * { position:relative!important;opacity:1!important;transform:none!important; }

  /* Learning center uses a desktop course catalogue. */
  #appShell #notifContent { display:grid!important;grid-template-columns:320px minmax(0,1fr)!important;gap:18px 24px!important;align-items:start!important; }
  #appShell #notifContent .learning-page-intro,
  #appShell #notifContent .learning-summary-card { grid-column:1!important;position:sticky!important;top:calc(var(--d-top) + 22px)!important;margin:0!important; }
  #appShell #notifContent .learning-summary-card { top:calc(var(--d-top) + 170px)!important; }
  #appShell #notifContent .prep-item-card { grid-column:2!important;min-height:112px!important;margin:0!important;padding:18px 20px!important;display:grid!important;grid-template-columns:56px 1fr 38px!important;border-radius:16px!important; }
  #appShell #notifContent .prep-item-title { font-size:16px!important; }
  #appShell #notifContent .prep-item-icon { width:48px!important;height:48px!important; }
  #appShell #notifContent .learning-topic-heading { grid-column:2!important;margin:18px 0 0!important; }

  /* Detail/payment dialogs are work panels, never oversized phone sheets. */
  #modalBg .modal-sheet { width:min(1040px,calc(100vw - 90px))!important;max-height:min(720px,calc(100vh - 70px))!important;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)!important;border-radius:20px!important; }
  #modalBg .modal-img { min-height:0!important;height:100%!important; }
  .pay-modal .pay-box { border-radius:20px!important; }
  #bookingPage2 .bk-body { grid-template-columns:minmax(0,1fr) 520px!important; }
  #bookingPage2 .bk-body > .seat-map-img { max-height:330px!important; }

  /* Admin stays a dense back-office, not a stack of mobile cards. */
  #adminCenter.show { grid-template-columns:226px minmax(0,1fr)!important;grid-template-rows:70px minmax(0,1fr)!important; }
  #adminCenter .admin-topbar { height:70px!important; }
  #adminCenter .admin-nav { width:226px!important;height:calc(100vh - 70px)!important; }
  #adminCenter .admin-body { height:calc(100vh - 70px)!important;padding:25px 30px 60px!important; }
  #adminCenter .admin-stat { min-height:104px!important; }
  #adminCenter .admin-stat strong { font-size:28px!important; }
}

@media (min-width:1280px) and (max-width:1439px) {
  #appShell #upcomingList,#appShell #bookingUpcomingList { grid-template-columns:1fr!important; }
  #appShell #notifContent { grid-template-columns:280px minmax(0,1fr)!important; }
  #appShell #myContent .my-profile { grid-template-columns:100px minmax(220px,.8fr) minmax(360px,1.2fr)!important; }
}

@media (min-width:1024px) and (max-width:1279px) {
  :root { --d-rail:220px; }
  #pcEntry { grid-template-columns:minmax(0,1.25fr) 370px!important;padding:20px!important; }
  #pcEntry .pc-entry-art { height:calc(100vh - 40px)!important; }
  #pcEntry::before { left:20px;top:20px;bottom:20px;width:calc((100% - 66px)*.64); }
  #appShell .home-banner { grid-template-columns:1fr 340px!important;height:260px!important; }
  #appShell .home-booking-steps { width:330px!important; }
  #appShell .pc-layout { grid-template-columns:1fr!important; }
  #appShell .pc-support { position:static!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #appShell #upcomingList,#appShell #bookingUpcomingList { grid-template-columns:1fr!important; }
  #appShell #myContent .my-profile { grid-template-columns:100px minmax(0,1fr)!important; }
  #appShell #myContent .my-stats { grid-column:1/-1!important; }
  #appShell #notifContent { grid-template-columns:1fr!important; }
  #appShell #notifContent :is(.learning-page-intro,.learning-summary-card,.prep-item-card,.learning-topic-heading) { grid-column:1!important;position:static!important; }
}
/* ==== css/99-desktop-app.css ==== */
/*! © 2569 เที่ยวนี่เหอะ (tiaewneehur.com) สงวนลิขสิทธิ์ · ห้ามคัดลอก ดัดแปลง หรือนำไปใช้โดยไม่ได้รับอนุญาต · TNH-ECAEB7B82022 */
/* ======================================================================
   TIAEW NEE HUR — INDEPENDENT DESKTOP APPLICATION
   No rule in this file applies below 1024px.
   ====================================================================== */
@media (min-width:1024px) {
  :root {
    --desk-side:260px;--desk-top:94px;--desk-bg:#050a10;--desk-panel:#0a1520;
    --desk-panel-2:#0e1c2a;--desk-line:rgba(181,211,235,.13);
    --desk-text:#f4f8fb;--desk-sub:#8298aa;--desk-blue:#38bdf8;
    --desk-green:#34d399;--desk-gold:#e8c47b;--desk-radius:17px;
  }

  body.desktop-app-mounted { min-width:1024px;background:var(--desk-bg)!important;overflow-x:hidden; }
  body.desktop-app-mounted #appShell.desktop-source-hidden { display:none!important; }
  #desktopApp[hidden] { display:none!important; }
  #desktopApp {
    min-height:100vh;display:grid;grid-template-columns:var(--desk-side) minmax(0,1fr);
    color:var(--desk-text);font-family:var(--font,'Prompt','Sarabun',sans-serif);
    background:
      radial-gradient(900px 520px at 80% -10%,rgba(13,148,202,.11),transparent 65%),
      radial-gradient(700px 460px at 12% 110%,rgba(16,185,129,.07),transparent 68%),
      var(--desk-bg);
  }
  #desktopApp *,#desktopApp *::before,#desktopApp *::after { box-sizing:border-box; }
  #desktopApp button,#desktopApp input,#desktopApp select,#desktopApp textarea { font:inherit; }

  /* Desktop-only sidebar */
  #desktopApp .desk-side {
    position:fixed;inset:0 auto 0 0;z-index:50;width:var(--desk-side);height:100vh;
    padding:18px 14px;display:flex;flex-direction:column;overflow-y:auto;
    border-right:1px solid var(--desk-line);background:linear-gradient(180deg,rgba(10,22,34,.99),rgba(4,10,16,.995));
    box-shadow:16px 0 55px rgba(0,0,0,.28);
  }
  #desktopApp .desk-brand {
    width:100%;padding:0 4px 17px;display:flex;align-items:center;gap:11px;border:0;border-bottom:1px solid var(--desk-line);
    background:none;color:#fff;text-align:left;cursor:pointer;
  }
  #desktopApp .desk-brand img { width:43px;height:43px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px rgba(56,189,248,.08); }
  #desktopApp .desk-brand span { min-width:0;display:flex;flex-direction:column; }
  #desktopApp .desk-brand strong { font-size:16px;line-height:1.3; }
  #desktopApp .desk-brand small { margin-top:2px;color:#587287;font-size:8px;font-weight:700;letter-spacing:1.2px; }
  #desktopApp .desk-nav-label { margin:22px 10px 8px;color:#526a7e;font-size:9px;font-weight:800;letter-spacing:1.25px;text-transform:uppercase; }
  #desktopApp .desk-service-label { margin-top:18px; }
  #desktopApp .desk-nav { display:flex;flex-direction:column;gap:5px; }
  #desktopApp .desk-nav-button {
    width:100%;min-height:60px;padding:10px 11px;display:grid;grid-template-columns:34px 1fr;align-items:center;gap:11px;
    border:1px solid transparent;border-radius:11px;background:transparent;color:#7890a4;text-align:left;cursor:pointer;transition:.2s ease;
  }
  #desktopApp .desk-nav-button:hover { color:#dceaf4;background:rgba(255,255,255,.035);transform:translateX(2px); }
  #desktopApp .desk-nav-button.active { color:#f3fbff;border-color:rgba(56,189,248,.23);background:linear-gradient(100deg,rgba(14,165,233,.17),rgba(16,185,129,.04));box-shadow:inset 3px 0 0 var(--desk-blue); }
  #desktopApp .desk-nav-button svg { width:23px;height:23px;margin:auto;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
  #desktopApp .desk-nav-button span { display:flex;min-width:0;flex-direction:column; }
  #desktopApp .desk-nav-button strong { font-size:14px;line-height:1.35; }
  #desktopApp .desk-nav-button small { margin-top:3px;color:#60798d;font-size:9px;letter-spacing:.55px; }
  #desktopApp .desk-nav-button.active small { color:#6da7be; }
  #desktopApp .desk-services { display:flex;flex-direction:column;gap:3px; }
  #desktopApp .desk-services button { width:100%;padding:11px;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:9px;background:none;color:#849bad;font-size:12px;text-align:left;cursor:pointer; }
  #desktopApp .desk-services button:hover { color:#d6e8f4;background:rgba(56,189,248,.06); }
  #desktopApp .desk-services b { color:#4e7189;font-size:12px; }
  #desktopApp .desk-side-foot { margin-top:auto;padding:14px 9px 2px;display:flex;align-items:center;gap:9px;border-top:1px solid var(--desk-line); }
  #desktopApp .desk-online-dot { width:8px;height:8px;flex:none;border-radius:50%;background:var(--desk-green);box-shadow:0 0 11px rgba(52,211,153,.78); }
  #desktopApp .desk-side-foot div { display:flex;flex-direction:column; }
  #desktopApp .desk-side-foot strong { color:#8fa5b6;font-size:9px;font-weight:650; }
  #desktopApp .desk-side-foot small { margin-top:2px;color:#465e72;font-size:7px; }

  /* Desktop stage and top bar */
  #desktopApp .desk-stage { grid-column:2;min-width:0;min-height:100vh; }
  #desktopApp .desk-top {
    position:sticky;top:0;z-index:40;height:var(--desk-top);padding:0 31px;display:flex;align-items:center;justify-content:space-between;gap:28px;
    border-bottom:1px solid var(--desk-line);background:rgba(5,11,18,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  }
  #desktopApp .desk-page-copy { min-width:0; }
  #desktopApp .desk-page-copy > small { display:block;margin-bottom:3px;color:#55afd2;font-size:9px;font-weight:800;letter-spacing:1.1px; }
  #desktopApp .desk-page-copy h1 { display:inline;margin:0;color:#f4f8fb;font-size:24px;line-height:1.2;letter-spacing:-.2px; }
  #desktopApp .desk-page-copy p { display:inline;margin-left:14px;color:#738b9e;font-size:11px; }
  #desktopApp .desk-top-actions { flex:none;display:flex;align-items:center;gap:7px; }
  #desktopApp .desk-top-actions button { height:40px;padding:0 15px;border:1px solid var(--desk-line);border-radius:10px;background:rgba(255,255,255,.025);color:#9eb2c1;font-size:11px;cursor:pointer; }
  #desktopApp .desk-top-actions button:hover { color:#fff;border-color:rgba(125,211,252,.3); }
  #desktopApp .desk-top-actions .desk-contact { color:#c9edfb;border-color:rgba(56,189,248,.25);background:rgba(14,165,233,.09); }
  #desktopApp .desk-workspace { width:100%;min-height:calc(100vh - var(--desk-top));padding:28px 32px 72px; }
  #desktopApp .desk-view-slot,#desktopApp .desk-home-hero { width:min(100%,1540px);margin-left:auto;margin-right:auto; }

  /* Desktop home hero */
  #desktopApp .desk-home-hero {
    position:relative;height:334px;margin-bottom:25px;overflow:hidden;border:1px solid rgba(196,220,239,.14);border-radius:21px;background:#091521;box-shadow:0 22px 55px rgba(0,0,0,.29);
  }
  #desktopApp .desk-home-hero[hidden] { display:none!important; }
  #desktopApp .desk-home-hero > img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%; }
  #desktopApp .desk-hero-shade { position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,9,15,.9),rgba(3,9,15,.18) 58%,rgba(3,9,15,.42)),linear-gradient(0deg,rgba(3,9,15,.79),transparent 55%); }
  #desktopApp .desk-hero-copy { position:absolute;left:32px;bottom:32px;z-index:2;width:min(590px,52%); }
  #desktopApp .desk-hero-copy > small { display:block;margin-bottom:8px;color:#78d6f8;font-size:9px;font-weight:800;letter-spacing:1.35px;text-transform:uppercase; }
  #desktopApp #deskGreeting { display:flex!important;align-items:center!important;gap:15px!important;color:#fff; }
  #desktopApp #deskGreeting > img { width:58px!important;height:58px!important;max-width:58px!important;min-width:58px!important;object-fit:cover!important;border:2px solid rgba(125,211,252,.64)!important;border-radius:50%!important;box-shadow:0 8px 22px rgba(0,0,0,.35)!important; }
  #desktopApp #deskGreeting .home-greet-copy { min-width:0!important; }
  #desktopApp #deskGreeting :is(h1,h2,.greet-title) { margin:0!important;color:#fff!important;font-size:clamp(23px,2vw,31px)!important;line-height:1.3!important;text-align:left!important; }
  #desktopApp #deskGreeting :is(p,.greet-sub) { margin:7px 0 0!important;color:#b6c8d5!important;font-size:13px!important;text-align:left!important; }
  #desktopApp #deskGreeting > button { min-height:42px!important;padding:0 15px!important;border-radius:11px!important;font-size:12px!important; }
  #desktopApp .desk-hero-flow { position:absolute;right:25px;bottom:25px;z-index:2;width:min(500px,43%);padding:12px 14px;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(183,216,239,.17);border-radius:13px;background:rgba(5,14,23,.7);backdrop-filter:blur(13px); }
  #desktopApp .desk-hero-flow span { display:flex;flex-direction:column;gap:3px;color:#c1d1dd;font-size:10px;white-space:nowrap; }
  #desktopApp .desk-hero-flow b { color:#67d5fa;font-size:10px; }
  #desktopApp .desk-hero-flow i { width:28px;height:1px;background:rgba(148,181,205,.28); }

  /* Only live data views are mounted here. Mobile header/nav never enter. */
  #desktopApp .view-page { display:none!important;width:100%!important;min-height:0!important;background:transparent!important; }
  #desktopApp .view-page.active-page { display:block!important;animation:deskFade .2s ease!important; }
  #desktopApp .view-page > .main { width:100%!important;max-width:none!important;margin:0!important;padding:0!important;background:transparent!important; }
  @keyframes deskFade { from{opacity:.45;transform:translateY(5px)}to{opacity:1;transform:none} }

  /* Home dashboard */
  #desktopApp #homeContent .pc-layout { display:grid!important;grid-template-columns:minmax(0,1fr) 278px!important;gap:20px!important;align-items:start!important; }
  #desktopApp #homeContent .pc-intro { display:none!important; }
  #desktopApp #homeContent .pc-toolbar { grid-column:1/-1!important;margin:0!important;padding:0!important;border:0!important; }
  #desktopApp #homeContent .pc-main { grid-column:1!important;min-width:0!important; }
  #desktopApp #homeContent .pc-support { grid-column:2!important;position:sticky!important;top:calc(var(--desk-top) + 20px)!important;display:flex!important;flex-direction:column!important;gap:12px!important;margin:0!important;padding:0!important;border:0!important; }
  #desktopApp .home-quick-actions { display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;margin:0!important; }
  #desktopApp .qa-mini { min-height:86px!important;padding:15px 17px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:13px!important;border:1px solid var(--desk-line)!important;border-radius:14px!important;background:linear-gradient(140deg,rgba(14,29,44,.96),rgba(8,18,28,.95))!important;box-shadow:none!important; }
  #desktopApp .qa-mini-ico { width:44px!important;height:44px!important;display:grid!important;place-items:center!important;flex:none!important;border-radius:12px!important;font-size:22px!important; }
  #desktopApp .qa-mini-label { color:#eef7fc!important;font-size:14px!important;text-align:left!important; }
  #desktopApp .sec-hdr { margin:23px 0 12px!important;display:flex!important;align-items:center!important;justify-content:space-between!important; }
  #desktopApp .sec-hdr :is(h2,div:first-child) { color:#f2f7fb!important;font-size:21px!important; }
  #desktopApp .divider { display:none!important; }
  #desktopApp #upcomingList,#desktopApp #bookingUpcomingList { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important;overflow:visible!important; }
  #desktopApp #upcomingList .trip-hcard2,#desktopApp #bookingUpcomingList .trip-hcard2 { height:246px!important;min-width:0!important;margin:0!important;border-radius:16px!important; }
  #desktopApp .pc-support :is(.stat-bar,a) { width:100%!important;margin:0!important;padding:16px!important;border:1px solid var(--desk-line)!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(14,28,42,.96),rgba(7,17,27,.94))!important;box-shadow:none!important;color:#dcebf5!important; }
  #desktopApp .calendar-entry-card { min-height:105px!important;margin:0!important;border-radius:14px!important; }
  #desktopApp .past-grid { display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important; }
  #desktopApp .past-card { min-height:155px!important;border-radius:13px!important; }

  /* Shared trip card language */
  #desktopApp .trip-hcard2 { overflow:hidden!important;border:1px solid var(--desk-line)!important;background:var(--desk-panel)!important;box-shadow:0 12px 29px rgba(0,0,0,.18)!important;transition:.2s ease!important; }
  #desktopApp .trip-hcard2:hover { border-color:rgba(125,211,252,.34)!important;box-shadow:0 20px 42px rgba(0,0,0,.3)!important; }
  #desktopApp .trip-hcard2 .thc-photo { position:relative!important;height:100%!important;overflow:hidden!important; }
  #desktopApp .trip-hcard2 .thc-photo > img { width:100%!important;height:100%!important;object-fit:cover!important; }
  #desktopApp #upcomingList .thc-overlay,#desktopApp #bookingUpcomingList .thc-overlay { position:absolute!important;inset:0!important;padding:17px!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;background:linear-gradient(0deg,rgba(3,9,15,.96),rgba(3,9,15,.04) 73%)!important; }
  #desktopApp .trip-hcard2 .thc-title { color:#fff!important;font-size:19px!important;line-height:1.4!important;text-shadow:none!important; }
  #desktopApp .trip-hcard2 .thc-meta-row { color:#b8c8d4!important;font-size:11px!important; }
  #desktopApp .trip-hcard2 .thc-bottom-row { padding-top:8px!important;border-top:1px solid rgba(255,255,255,.11)!important; }
  #desktopApp .trip-hcard2 .thc-price strong { color:#f5dfb1!important;font-size:23px!important; }
  #desktopApp .trip-hcard2 .thc-price > span { color:#9aafbf!important;font-size:10px!important; }
  #desktopApp .pc-card-caption { display:none!important; }

  /* Trip catalogue is a desktop result list. */
  #desktopApp #tab-trips .search-wrap { width:min(520px,100%)!important;height:44px!important;margin:0 0 17px!important;border:1px solid var(--desk-line)!important;border-radius:11px!important;background:rgba(10,22,34,.9)!important; }
  #desktopApp #tab-trips .search-wrap input { font-size:11px!important; }
  #desktopApp #tripListFull { display:flex!important;flex-direction:column!important;gap:11px!important; }
  #desktopApp #tripListFull .trip-hcard2 { width:100%!important;height:168px!important;display:grid!important;grid-template-columns:270px minmax(0,1fr)!important;border-radius:14px!important; }
  #desktopApp #tripListFull .trip-hcard2:hover { transform:translateX(3px)!important; }
  #desktopApp #tripListFull .thc-photo { grid-column:1!important; }
  #desktopApp #tripListFull .thc-overlay { grid-column:2!important;position:relative!important;padding:18px 22px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;background:linear-gradient(115deg,rgba(14,29,44,.98),rgba(7,17,27,.97))!important; }
  #desktopApp #tripListFull .thc-title { max-width:72%!important;margin-bottom:7px!important;font-size:18px!important; }
  #desktopApp #tripListFull .thc-meta-row { margin-bottom:10px!important;font-size:10px!important; }
  #desktopApp #tripListFull .thc-bottom-row { margin-top:0!important;padding-top:10px!important; }
  #desktopApp #tripListFull .thc-price strong { font-size:21px!important; }
  #desktopApp #tripListFull .thc-status-pill { top:14px!important;left:14px!important;font-size:9px!important; }

  /* Profile dashboard */
  #desktopApp #myContent { display:grid!important;grid-template-columns:1fr!important;gap:15px!important; }
  #desktopApp #myContent .my-profile { min-height:178px!important;margin:0!important;padding:22px 25px!important;display:grid!important;grid-template-columns:105px minmax(230px,.7fr) minmax(390px,1.3fr)!important;align-items:center!important;gap:22px!important;border:1px solid var(--desk-line)!important;border-radius:16px!important;background:linear-gradient(115deg,rgba(14,30,44,.97),rgba(7,17,27,.96))!important;box-shadow:none!important; }
  #desktopApp #myContent .my-ava-col { width:105px!important; }
  #desktopApp #myContent .my-ava { width:83px!important;height:83px!important; }
  #desktopApp #myContent .my-info { text-align:left!important; }
  #desktopApp #myContent .my-info h2 { font-size:20px!important; }
  #desktopApp #myContent .my-stats { margin:0!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important; }
  #desktopApp #myContent .my-stat { min-height:80px!important;padding:12px!important;border:1px solid var(--desk-line)!important;border-radius:12px!important;background:rgba(255,255,255,.025)!important; }
  #desktopApp #myContent .my-payment-filter { width:max-content!important;max-width:100%!important;margin:0!important;padding:4px!important;border-radius:11px!important; }
  #desktopApp #myContent .hist-card { min-height:220px!important;margin:0!important;border-radius:15px!important; }
  #desktopApp #myContent .hist-group-title { margin:19px 0 9px!important;color:#f0f6fa!important;font-size:16px!important; }
  #desktopApp #myContent :is(#bookingHistoryList,.my-past-fade-list) { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important; }
  #desktopApp #myContent .my-past-fade-list > * { position:relative!important;opacity:1!important;transform:none!important; }
  #desktopApp #myContent .btn-logout { max-width:310px!important;margin:25px auto 0!important; }

  /* Learning centre */
  #desktopApp #notifContent { display:grid!important;grid-template-columns:290px minmax(0,1fr)!important;gap:14px 20px!important;align-items:start!important; }
  #desktopApp #notifContent .learning-page-intro { grid-column:1!important;margin:0!important; }
  #desktopApp #notifContent .learning-summary-card { grid-column:1!important;position:sticky!important;top:calc(var(--desk-top) + 20px)!important;margin:0!important;border-radius:15px!important; }
  #desktopApp #notifContent .prep-item-card { grid-column:2!important;min-height:104px!important;margin:0!important;padding:16px 18px!important;display:grid!important;grid-template-columns:52px 1fr 34px!important;align-items:center!important;border:1px solid var(--desk-line)!important;border-radius:14px!important;background:linear-gradient(120deg,rgba(14,29,43,.96),rgba(8,18,28,.95))!important; }
  #desktopApp #notifContent .prep-item-icon { width:45px!important;height:45px!important; }
  #desktopApp #notifContent .prep-item-title { font-size:14px!important; }
  #desktopApp #notifContent .learning-topic-heading { grid-column:2!important;margin:15px 0 0!important; }

  /* Independent desktop landing */
  #desktopApp .desk-landing { position:fixed;inset:0;z-index:3000;padding:25px;display:none;grid-template-columns:minmax(0,1.55fr) minmax(390px,.7fr);gap:24px;background:#04090f; }
  #desktopApp .desk-landing.show { display:grid; }
  body.desktop-landing-open { overflow:hidden!important; }
  #desktopApp .desk-landing-art { position:relative;min-width:0;overflow:hidden;border:1px solid var(--desk-line);border-radius:22px;background:#08121d; }
  #desktopApp .desk-landing-art > img { width:100%;height:100%;padding:24px;object-fit:contain;background:radial-gradient(circle at 55% 45%,#10283a,#040a11 72%); }
  #desktopApp .desk-landing-art::after { content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,8,14,.86),transparent 62%); }
  #desktopApp .desk-landing-caption { display:none;position:absolute;left:34px;bottom:34px;z-index:2; }
  #desktopApp .desk-landing-caption small { color:#69d3f8;font-size:9px;font-weight:800;letter-spacing:1.5px; }
  #desktopApp .desk-landing-caption h2 { margin:10px 0 7px;color:#fff;font-size:clamp(31px,3.2vw,52px);line-height:1.15;letter-spacing:-1px; }
  #desktopApp .desk-landing-caption p { margin:0;color:#a9bdcb;font-size:12px; }
  #desktopApp .desk-landing-panel { padding:7px 5px;display:flex;min-width:0;flex-direction:column; }
  #desktopApp .desk-landing-head { padding:5px 0 18px;display:flex;align-items:center;gap:11px;border-bottom:1px solid var(--desk-line); }
  #desktopApp .desk-landing-head img { width:46px;height:46px;border-radius:50%; }
  #desktopApp .desk-landing-head div { display:flex;flex-direction:column; }
  #desktopApp .desk-landing-head strong { color:#fff;font-size:17px; }
  #desktopApp .desk-landing-head small { margin-top:2px;color:#536d81;font-size:8px;font-weight:800;letter-spacing:1.1px; }
  #desktopApp .desk-landing-intro { margin:auto 0 20px; }
  #desktopApp .desk-landing-intro > small { color:#58c8ef;font-size:9px;font-weight:800;letter-spacing:1.2px; }
  #desktopApp .desk-landing-intro h1 { margin:8px 0;color:#fff;font-size:26px;line-height:1.25; }
  #desktopApp .desk-landing-intro p { max-width:350px;margin:0;color:#71899c;font-size:11px;line-height:1.6; }
  #desktopApp .desk-landing-menu { display:flex;flex-direction:column;gap:8px; }
  #desktopApp .desk-landing-menu button { min-height:72px;padding:12px 15px;display:grid;grid-template-columns:42px 1fr 18px;align-items:center;gap:12px;border:1px solid var(--desk-line);border-radius:13px;background:rgba(12,25,38,.82);color:#fff;text-align:left;cursor:pointer;transition:.2s ease; }
  #desktopApp .desk-landing-menu button:hover { transform:translateX(-4px);border-color:rgba(125,211,252,.36);background:rgba(16,35,52,.95); }
  #desktopApp .desk-landing-menu svg { width:22px;height:22px;margin:auto;fill:none;stroke:#80d8f8;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round; }
  #desktopApp .desk-landing-chat { width:37px;height:37px;display:grid;place-items:center;border-radius:10px;background:rgba(56,189,248,.1);color:#80d8f8;font-size:18px;letter-spacing:2px; }
  #desktopApp .desk-landing-menu button > span:nth-child(2) { display:flex;flex-direction:column; }
  #desktopApp .desk-landing-menu strong { font-size:13px; }
  #desktopApp .desk-landing-menu small { margin-top:3px;color:#71899c;font-size:9px; }
  #desktopApp .desk-landing-menu b { color:#5a788d;font-size:14px; }
  #desktopApp .desk-landing-foot { margin-top:auto;padding:19px 0 3px;display:flex;justify-content:space-between;border-top:1px solid var(--desk-line);color:#4c6579;font-size:8px; }
  #desktopApp .desk-landing-foot i { display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:var(--desk-green);box-shadow:0 0 9px rgba(52,211,153,.7); }

  /* Full-screen workflows remain shared, but use desktop workbench proportions. */
  #bookingPage2 .bk-body { width:min(calc(100% - 60px),1480px)!important;max-width:1480px!important;grid-template-columns:minmax(0,1fr) 520px!important; }
  #bookingPage2 .van-blocks-row { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #bookingPage2 #seatFormsContainer { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #modalBg .modal-sheet { width:min(1040px,calc(100vw - 80px))!important;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)!important; }
  #adminCenter.show { grid-template-columns:226px minmax(0,1fr)!important;grid-template-rows:70px minmax(0,1fr)!important; }

  #desktopApp :is(button,a,[role="button"]):focus-visible { outline:3px solid rgba(125,211,252,.72);outline-offset:3px; }
}

@media (min-width:1024px) and (max-width:1279px) {
  :root { --desk-side:210px; }
  #desktopApp .desk-workspace { padding-left:22px;padding-right:22px; }
  #desktopApp .desk-page-copy p { display:none; }
  #desktopApp #homeContent .pc-layout { grid-template-columns:1fr!important; }
  #desktopApp #homeContent .pc-support { position:static!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #desktopApp #upcomingList,#desktopApp #bookingUpcomingList { grid-template-columns:1fr!important; }
  #desktopApp #myContent .my-profile { grid-template-columns:92px 1fr!important; }
  #desktopApp #myContent .my-stats { grid-column:1/-1!important; }
  #desktopApp #notifContent { grid-template-columns:250px minmax(0,1fr)!important; }
  #desktopApp .desk-landing { grid-template-columns:minmax(0,1.2fr) 380px;padding:18px;gap:18px; }
}

@media (min-width:1600px) {
  #desktopApp #upcomingList,#desktopApp #bookingUpcomingList { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #desktopApp .past-grid { grid-template-columns:repeat(5,minmax(0,1fr))!important; }
  #desktopApp #myContent :is(#bookingHistoryList,.my-past-fade-list) { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
}