:root{
  --bg:#07111f; --panel:#0d1a2b; --panel2:#101f33; --text:#f7f2e8; --muted:#a9b5c7;
  --gold:#d9b86c; --gold2:#f3d998; --pink:#e58ab5; --red:#b92b42; --blue:#24558d;
  --line:rgba(255,255,255,.10); --ok:#64d39b; --warn:#f2c96b; --danger:#ff6b7d;
  --shadow:0 20px 60px rgba(0,0,0,.28); --radius:18px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 15% -10%,rgba(217,184,108,.12),transparent 32%),linear-gradient(180deg,#07111f,#081522 45%,#06101c);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}.container{width:min(1180px,92%);margin:auto}
.site-header{position:sticky;top:0;z-index:30;background:rgba(5,13,24,.86);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.2px}.brand img{width:46px;height:46px;object-fit:contain}.brand span{font-size:20px}.brand b{color:var(--pink)}
.navlinks{display:flex;gap:6px;align-items:center}.navlinks a{padding:9px 12px;border-radius:10px;color:#dce5f0;font-size:14px}.navlinks a:hover,.navlinks a.active{background:rgba(217,184,108,.10);color:var(--gold2)}
.actions{display:flex;gap:8px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:11px 15px;background:#12233a;color:#fff;cursor:pointer;font-weight:750;transition:.18s;min-height:42px}
.btn:hover{transform:translateY(-1px);border-color:rgba(217,184,108,.45)}.btn.gold{background:linear-gradient(135deg,#b99442,#f0d78d);color:#101521;border:0}.btn.ghost{background:transparent}.btn.pink{background:linear-gradient(135deg,#b94979,#e58ab5);border:0}.btn.danger{background:#3a1720;border-color:#6b2736}.btn.small{padding:8px 11px;font-size:13px;min-height:36px}
.mobile-menu{display:none}
.hero{padding:70px 0 36px}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center}
.kicker{color:var(--gold2);font-weight:800;text-transform:uppercase;letter-spacing:.13em;font-size:12px}
h1{font-size:clamp(38px,5vw,68px);line-height:1.02;margin:14px 0 18px;letter-spacing:-.04em}
h2{font-size:30px;line-height:1.15;margin:0 0 10px}h3{margin:0 0 7px}p{color:var(--muted);margin:8px 0}
.hero-card{border:1px solid var(--line);background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border-radius:28px;box-shadow:var(--shadow);padding:12px;overflow:hidden}
.hero-card img{width:100%;height:470px;object-fit:cover;border-radius:20px;display:block}
.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:5px 9px;font-size:12px;color:#d9e1eb;background:rgba(255,255,255,.035)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);display:inline-block}.dot.off{background:#6f7c8d}
.section{padding:48px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:20px}
.grid{display:grid;gap:16px}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}
.card{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.025));border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:0 12px 40px rgba(0,0,0,.14)}
.member-card{overflow:hidden;padding:0}.member-photo{height:280px;position:relative}.member-photo img{width:100%;height:100%;object-fit:cover}.member-body{padding:15px}.member-meta{display:flex;justify-content:space-between;gap:10px;align-items:center}.member-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.heart{border:1px solid var(--line);background:rgba(0,0,0,.38);color:#fff;width:38px;height:38px;border-radius:50%;cursor:pointer}
.overlay{position:absolute;inset:auto 10px 10px 10px;display:flex;justify-content:space-between;align-items:end}
.overlay .badge{background:rgba(5,12,20,.7);backdrop-filter:blur(8px)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat strong{font-size:28px;color:var(--gold2);display:block}.stat span{color:var(--muted);font-size:13px}
.notice{border-left:3px solid var(--gold);background:rgba(217,184,108,.07);padding:12px 14px;border-radius:10px;color:#dce4ee}
.success{border-left-color:var(--ok);background:rgba(100,211,155,.06)}.warning{border-left-color:var(--warn);background:rgba(242,201,107,.06)}.danger-note{border-left-color:var(--danger);background:rgba(255,107,125,.06)}
.form{display:grid;gap:13px}.form label{font-size:13px;color:#dce5ef;font-weight:700}.form input,.form select,.form textarea{width:100%;border:1px solid var(--line);background:#091626;color:#fff;border-radius:11px;padding:12px 13px;outline:none}.form input:focus,.form select:focus,.form textarea:focus{border-color:rgba(217,184,108,.65);box-shadow:0 0 0 3px rgba(217,184,108,.08)}.form textarea{min-height:110px;resize:vertical}
.filters{display:grid;grid-template-columns:1.4fr repeat(4,1fr) auto;gap:10px;margin-bottom:18px}
.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.price-card{position:relative}.price{font-size:38px;font-weight:900;color:var(--gold2);margin:12px 0}.ribbon{position:absolute;top:13px;right:13px;font-size:10px;font-weight:900;background:var(--pink);padding:5px 7px;border-radius:999px}
.list{display:grid;gap:10px}.list-row{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}
.check{color:var(--ok);font-weight:900}.lock{color:var(--muted)}
.chat{display:grid;grid-template-columns:310px 1fr;min-height:650px}.chat-list{border-right:1px solid var(--line);padding:12px}.chat-window{display:flex;flex-direction:column}.chat-head{padding:16px;border-bottom:1px solid var(--line)}.chat-body{flex:1;padding:18px;display:flex;flex-direction:column;gap:10px}.bubble{max-width:72%;padding:10px 13px;border-radius:15px;background:#13253a}.bubble.me{align-self:flex-end;background:#6b3c57}.chat-input{border-top:1px solid var(--line);padding:12px;display:flex;gap:8px}
.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;font-size:13px;white-space:nowrap}.table th{color:#dfe7f0}
.tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}.tab{padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:transparent;color:#d8e0eb;cursor:pointer}.tab.active{background:rgba(217,184,108,.12);border-color:rgba(217,184,108,.35);color:var(--gold2)}
.footer{border-top:1px solid var(--line);margin-top:60px;padding:35px 0 50px;color:var(--muted)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:25px}.footer a{display:block;margin:7px 0;color:#c6d0dd;font-size:14px}
.bottom-nav{display:none}
.profile-head{display:grid;grid-template-columns:270px 1fr;gap:24px;align-items:center}.avatar{width:270px;height:270px;border-radius:24px;object-fit:cover;border:1px solid var(--line)}.profile-actions{display:flex;gap:8px;flex-wrap:wrap}
.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px}.gallery img{width:100%;height:220px;object-fit:cover;border-radius:14px}.gallery img:first-child{grid-row:span 2;height:450px}
.progress{height:9px;border-radius:99px;background:#16263a;overflow:hidden}.progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--pink))}
.kpi-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.empty{padding:35px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:16px}
.cookie{position:fixed;left:18px;right:18px;bottom:18px;z-index:60;display:none}.cookie.show{display:block}.cookie-inner{max-width:900px;margin:auto;background:#0b1727;border:1px solid var(--line);border-radius:15px;padding:15px;box-shadow:var(--shadow);display:flex;gap:15px;align-items:center;justify-content:space-between}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);display:none;align-items:center;justify-content:center;z-index:80;padding:20px}.modal.show{display:flex}.modal-card{max-width:520px;width:100%;background:#0c192a;border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:var(--shadow)}
.logo-small{width:48px;height:48px;object-fit:contain}
.hero-pills{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.callout{display:flex;gap:13px;align-items:flex-start}.iconbox{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(217,184,108,.12);color:var(--gold2);font-weight:900;flex:none}
.small{font-size:12px;color:var(--muted)}.muted{color:var(--muted)}.right{text-align:right}.center{text-align:center}
.hide{display:none!important}
@media(max-width:1000px){.navlinks{display:none}.mobile-menu{display:block}.hero-grid,.profile-head{grid-template-columns:1fr}.hero-card img{height:360px}.grid-4,.price-grid{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.filters{grid-template-columns:1fr 1fr 1fr}.chat{grid-template-columns:240px 1fr}.kpi-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.nav{height:66px}.brand span{font-size:17px}.actions .hide-mobile{display:none}.hero{padding-top:40px}.section{padding:34px 0}.grid-4,.grid-3,.grid-2,.price-grid,.stats,.kpi-grid{grid-template-columns:1fr}.filters{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}.gallery img:first-child{grid-row:auto;height:220px}.chat{grid-template-columns:1fr}.chat-list{display:none}.footer-grid{grid-template-columns:1fr 1fr}.bottom-nav{position:fixed;display:flex;bottom:0;left:0;right:0;background:rgba(6,14,24,.96);border-top:1px solid var(--line);z-index:50;justify-content:space-around;padding:7px}.bottom-nav a{font-size:11px;color:#b8c2cf;text-align:center}.bottom-nav a.active{color:var(--gold2)}body{padding-bottom:65px}.cookie-inner{flex-direction:column;align-items:stretch}.avatar{width:190px;height:190px}.profile-head{justify-items:start}}

/* --- Date a Thai visual refresh --- */
:root{
  --bg:#090a12; --panel:#12131d; --panel2:#1a1720; --text:#fffaf0; --muted:#c5bfca;
  --gold:#f5c542; --gold2:#ffe27a; --pink:#ff4f9a; --red:#e33d55; --blue:#42b8e8;
  --line:rgba(255,255,255,.11); --ok:#6ee7a8; --warn:#ffd166; --danger:#ff7188;
  --shadow:0 24px 70px rgba(0,0,0,.42); --radius:20px;
}
body{background:
 radial-gradient(circle at 5% 0%,rgba(255,79,154,.16),transparent 28%),
 radial-gradient(circle at 96% 12%,rgba(245,197,66,.17),transparent 28%),
 linear-gradient(180deg,#090a12 0%,#100d19 46%,#090a12 100%);}
.site-header{background:rgba(8,8,15,.9);border-bottom:1px solid rgba(245,197,66,.20)}
.nav{height:82px}.brand{gap:0}.site-logo{display:block;width:172px;height:64px;object-fit:contain;object-position:left center}.footer-logo{width:190px;height:72px}.footer-brand{margin-bottom:4px}
.navlinks a{font-weight:750;color:#eee7ee}.navlinks a:hover,.navlinks a.active{background:rgba(245,197,66,.12);color:var(--gold2)}
.btn{border-radius:14px;background:#1c1a25}.btn.gold{background:linear-gradient(135deg,#e7ad22,#ffe27a);box-shadow:0 10px 25px rgba(245,197,66,.18)}.btn.pink{background:linear-gradient(135deg,#d52f78,#ff63aa)}
.hero{padding:44px 0 30px}.hero-grid{grid-template-columns:1fr 1.12fr;gap:28px}.hero-card{padding:8px;border-radius:30px;background:linear-gradient(145deg,rgba(255,79,154,.18),rgba(245,197,66,.13));border:1px solid rgba(255,255,255,.12)}.hero-card img{height:610px;border-radius:24px}
h1{font-size:clamp(44px,6vw,82px);letter-spacing:-.055em}.hero p{font-size:20px!important}.kicker{color:var(--gold2)}
.badge{background:rgba(255,255,255,.05)}
.card{background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border-color:rgba(255,255,255,.10)}
.section{padding:54px 0}.section-head{margin-bottom:24px}
.member-card{border-radius:20px;transition:.22s;box-shadow:0 12px 35px rgba(0,0,0,.22)}.member-card:hover{transform:translateY(-5px);border-color:rgba(245,197,66,.35);box-shadow:0 22px 55px rgba(0,0,0,.34)}.member-photo{height:330px}.member-body{padding:17px}
.stats .stat strong{color:var(--gold2)}
.notice{border-left-color:var(--gold);background:rgba(245,197,66,.08)}
/* Homepage campaign sections */
.home-offer{position:relative;overflow:hidden;background:linear-gradient(120deg,#2a0f2a,#14101d 48%,#281c0b);border:1px solid rgba(245,197,66,.35);box-shadow:var(--shadow)}
.home-offer:after{content:"";position:absolute;width:330px;height:330px;border-radius:50%;right:-100px;top:-130px;background:rgba(255,79,154,.20);filter:blur(8px)}
.offer-number{font-size:clamp(42px,6vw,76px);font-weight:950;line-height:.95;color:var(--gold2);letter-spacing:-.05em}.offer-badge{display:inline-flex;padding:8px 13px;border-radius:999px;background:var(--pink);color:#fff;font-weight:900;font-size:12px;letter-spacing:.12em}
.photo-wall{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:220px;gap:12px}.photo-wall img{width:100%;height:100%;object-fit:cover;border-radius:18px;display:block}.photo-wall img:first-child{grid-row:span 2}.photo-wall img:nth-child(4){grid-column:2 / span 2}
.home-stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.home-stat-strip .card{padding:22px}.home-stat-strip strong{font-size:32px;color:var(--gold2);display:block}.home-stat-strip span{color:var(--muted);font-size:13px}
.datea-gradient{background:linear-gradient(90deg,var(--gold2),#fff,#ff79b6);-webkit-background-clip:text;background-clip:text;color:transparent}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr}.hero-card img{height:500px}.photo-wall{grid-template-columns:1fr 1fr;grid-auto-rows:220px}.photo-wall img:first-child{grid-row:auto}.photo-wall img:nth-child(4){grid-column:auto}.home-stat-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.site-logo{width:145px;height:56px}.nav{height:70px}.hero{padding-top:28px}.hero-card img{height:430px}.photo-wall{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.photo-wall img:first-child{grid-column:span 2}.home-stat-strip{grid-template-columns:1fr 1fr}}