:root{
  --bg:#0b0c10; --panel:#14161d; --line:#262a35; --text:#e9ebf0; --muted:#8b93a5;
  --accent:#ff2e3a; --accent2:#ffb703;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{background:var(--bg);color:var(--text);font-family:"Noto Sans Thai",system-ui,sans-serif;line-height:1.65}
a{color:inherit;text-decoration:none}

.sponsors{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-auto-flow:dense;gap:16px}
.sponsor{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:.25s}
.sponsor img{display:block;width:100%;height:100%;object-fit:cover}
a.sponsor:hover{transform:translateY(-3px);border-color:var(--accent)}
.sponsor.wide{grid-column:span 2;grid-row:span 2}
@media(max-width:700px){.sponsor.wide{grid-column:auto;grid-row:auto}}

.next.has-bg{min-height:500px;padding:34px 36px;background-size:cover;background-position:center;border-color:rgba(255,255,255,.12);border-left-color:var(--accent2);text-shadow:0 2px 6px rgba(0,0,0,.95),0 0 18px rgba(0,0,0,.75)}
.next.has-bg strong{font-size:1.5rem}
.next.has-bg small,.next.has-bg .countdown span{color:#e6e9f0}
@media(max-width:760px){.next.has-bg{min-height:200px;padding:24px 20px}}
.next-info{flex:1;min-width:200px}
.click-row{cursor:pointer}
.click-row:hover td{background:rgba(255,255,255,.05)}
td{vertical-align:middle}
.badge.next{display:inline-block;margin:0;padding:2px 12px;border:0;border-radius:99px;background:rgba(255,183,3,.18);color:var(--accent2);font-size:.8rem;font-weight:700}
/* MULTI PAGE */
#siteHeader{position:sticky;top:0;z-index:20}
nav a.active{color:var(--text);background:var(--panel)}
h2 a{color:inherit}
h2 .go{font-size:.9rem;color:var(--accent);margin-left:12px;font-weight:500}
.driver{transition:.25s}
a.driver{display:block}
a.driver:hover{transform:translateY(-4px);border-color:var(--accent)}
a.next{color:inherit;transition:.25s}
a.next:hover{border-color:var(--accent);transform:translateY(-2px)}
.page{padding-top:40px;padding-bottom:20px}
.page-title{font-family:"Chakra Petch","Noto Sans Thai",sans-serif;font-size:2.2rem;margin-bottom:8px}
.page h2{margin-top:44px}
.back{display:inline-block;margin-bottom:18px;color:var(--muted);font-weight:500}
.back:hover{color:var(--text)}
.race-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.race-card{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:.25s}
.race-card:hover{transform:translateY(-4px);border-color:var(--accent)}
.race-card.st-next{border-color:var(--accent2)}
.race-card.st-done{opacity:.85}
.race-img{display:block;width:100%;height:150px;object-fit:cover}
.race-body{padding:18px 20px 20px}
.race-body h3{font-size:1.15rem;margin:10px 0 4px}
.race-sub{color:var(--muted);font-size:.9rem}
.race-cd{margin-top:12px;font-family:"Chakra Petch",sans-serif;font-weight:700;color:var(--accent2);font-size:1.1rem}
.race-card.st-done .race-cd{color:var(--muted)}
.race-result{margin-top:8px;font-size:.9rem;color:#6fdc8c}
.detail-page{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.detail-hero{display:block;width:100%;height:auto}
.detail-main{padding:26px 28px 32px}
.detail-title{font-family:"Chakra Petch","Noto Sans Thai",sans-serif;font-size:clamp(1.6rem,4vw,2.4rem);line-height:1.25;margin:8px 0}
.detail-sub{color:var(--muted);margin-bottom:18px}
.countdown.big{margin:18px 0 22px}
.countdown.big div{min-width:78px}
.countdown.big b{font-size:2.6rem}
.result-box{background:rgba(111,220,140,.08);border:1px solid #1f2a22;color:#6fdc8c;padding:12px 16px;border-radius:8px;margin-bottom:18px;font-weight:700}
.info-table{width:auto;margin-bottom:18px}
.info-table th{color:var(--muted);font-size:.85rem;padding:8px 24px 8px 0}
.info-table td{padding:8px 0}
.detail-text{color:#c9cedb;white-space:pre-line;margin-bottom:16px}
.profile{display:grid;grid-template-columns:minmax(220px,360px) 1fr;gap:30px;align-items:start}
.profile-photo img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:14px;border:1px solid var(--line)}
.no-photo{aspect-ratio:1/1;border-radius:14px;background:var(--panel);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:"Chakra Petch",sans-serif;font-size:5rem;font-style:italic;color:rgba(255,255,255,.12)}
.profile .role{color:var(--accent);font-weight:700;margin-bottom:4px}
.profile .rig{color:var(--muted);margin-bottom:18px}
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin:18px 0}
.stats div{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.stats b{display:block;font-family:"Chakra Petch",sans-serif;font-size:1.5rem}
.stats span{color:var(--muted);font-size:.8rem}
.chip{display:inline-block;background:var(--panel);color:var(--muted);border:1px solid var(--line);padding:6px 16px;border-radius:99px;font-size:.9rem;transition:.2s}
.chip.on,.chip:hover{color:#fff;border-color:var(--accent);background:rgba(255,46,58,.15)}
tr.ours td{background:rgba(255,46,58,.1);font-weight:700}
.cat-title{margin-bottom:12px;color:var(--muted);font-size:1rem}
@media(max-width:760px){.profile{grid-template-columns:1fr}}
/* NEWS DETAIL */
.card{cursor:pointer}
.card .more{display:inline-block;margin-top:12px;color:var(--accent);font-weight:700;font-size:.9rem}
.modal{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.78);backdrop-filter:blur(4px);display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:40px 16px}
.modal[hidden]{display:none}
.modal-box{position:relative;width:100%;max-width:760px;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.modal-close{position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:1.1rem;cursor:pointer}
.modal-close:hover{background:var(--accent)}
.detail-cover{display:block;width:100%;height:auto;object-fit:contain}
.detail-body{padding:26px 28px 32px}
.detail-body h2{border:0;padding:0;font-size:1.6rem;margin:10px 0 16px;line-height:1.35}
.detail-body p{color:#c9cedb;margin-bottom:14px;white-space:pre-line}
.detail-gallery{display:grid;grid-template-columns:1fr;gap:14px;margin:18px 0}
.detail-gallery img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:8px}
.detail-link{display:inline-block;margin-top:8px;background:var(--accent);color:#fff;padding:10px 20px;border-radius:8px;font-weight:700}
body.lock{overflow:hidden}
/* IMAGES */
.brand.has-logo{display:flex;align-items:center;gap:10px}
.brand.has-logo::before{display:none}
.brand img{height:52px;width:auto;max-width:160px;object-fit:contain;display:block}
.thumb{display:block;width:calc(100% + 44px);height:180px;object-fit:cover;margin:-22px -22px 16px;border-radius:12px 12px 0 0}
.avatar{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;margin-bottom:14px;position:relative}
.driver:has(.avatar) .num{top:auto;bottom:-14px;right:10px;color:rgba(255,255,255,.18)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
section.wrap{padding:64px 20px 0}
h1,h2,.brand,.num,.countdown b{font-family:"Chakra Petch","Noto Sans Thai",sans-serif}
h2{font-size:1.9rem;margin-bottom:24px;padding-left:14px;border-left:5px solid var(--accent);letter-spacing:.5px}

/* NAV */
.nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;
  padding:14px 24px;background:rgba(11,12,16,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{font-weight:700;font-size:1.25rem;letter-spacing:2px}
.brand::before{content:"";display:inline-block;width:10px;height:22px;background:var(--accent);margin-right:10px;
  transform:skewX(-18deg);vertical-align:-4px}
nav{display:flex;gap:6px;align-items:center}
nav a{padding:8px 14px;border-radius:6px;color:var(--muted);font-weight:500;transition:.2s}
nav a:hover{color:var(--text);background:var(--panel)}
nav a.cta{background:var(--accent);color:#fff}
nav a.cta:hover{filter:brightness(1.15)}
.burger{display:none;background:none;border:0;color:var(--text);font-size:1.6rem;cursor:pointer}

/* HERO */
.hero{position:relative;overflow:hidden;padding:110px 0 80px;
  background:radial-gradient(900px 400px at 80% -10%,rgba(255,46,58,.28),transparent 60%),var(--bg)}
.stripes{position:absolute;inset:0;opacity:.07;
  background:repeating-linear-gradient(-60deg,#fff 0 2px,transparent 2px 28px)}
.hero .wrap{position:relative}
.eyebrow{color:var(--accent);letter-spacing:5px;font-weight:700;font-size:.85rem}
.hero h1{font-size:clamp(2.6rem,8vw,5.6rem);line-height:1.05;margin:8px 0 14px;font-style:italic}
.tagline{color:var(--muted);font-size:1.1rem;max-width:560px}
.next{margin-top:40px;display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;
  background:var(--panel);border:1px solid var(--line);border-left:5px solid var(--accent2);border-radius:10px;padding:22px 26px}
.next .label{display:block;color:var(--accent2);font-size:.8rem;letter-spacing:2px;font-weight:700}
.next strong{display:block;font-size:1.35rem}
.next small{color:var(--muted)}
.countdown{display:flex;gap:12px}
.countdown div{text-align:center;min-width:64px}
.countdown b{display:block;font-size:2rem;line-height:1.1}
.countdown span{font-size:.72rem;color:var(--muted);letter-spacing:1px}

/* NEWS */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.filters button{background:var(--panel);color:var(--muted);border:1px solid var(--line);padding:6px 16px;border-radius:99px;
  cursor:pointer;font:inherit;font-size:.9rem;transition:.2s}
.filters button.on,.filters button:hover{color:#fff;border-color:var(--accent);background:rgba(255,46,58,.15)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:18px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;transition:.25s}
.card:hover{transform:translateY(-4px);border-color:var(--accent)}
.meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:.82rem;color:var(--muted)}
.tag{background:rgba(0, 93, 155, 0.616);color:#b0edff;padding:2px 10px;border-radius:99px;font-weight:700}
.card h3{font-size:1.15rem;margin-bottom:8px;line-height:1.4}
.card p{color:var(--muted);font-size:.95rem}
.empty{color:var(--muted)}

/* TABLES */
.table-wrap{overflow-x:auto;background:var(--panel);border:1px solid var(--line);border-radius:12px}
.table-wrap.narrow{max-width:520px}
table{width:100%;border-collapse:collapse}
th,td{padding:14px 18px;text-align:left;white-space:nowrap}
th{color:var(--muted);font-size:.8rem;letter-spacing:1px;border-bottom:1px solid var(--line)}
tr+tr td{border-top:1px solid var(--line)}
tr.is-next td{background:rgba(255,183,3,.08)}
.badge{padding:2px 12px;border-radius:99px;font-size:.8rem;font-weight:700}
.badge.done{background:#1f2a22;color:#6fdc8c}
.badge.next{background:rgba(255,183,3,.18);color:var(--accent2)}
.badge.upcoming{background:#1d2130;color:var(--muted)}

/* DRIVERS */
.drivers{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.driver{position:relative;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:26px 22px}
.driver .num{position:absolute;right:12px;top:-6px;font-size:5.5rem;font-weight:700;font-style:italic;color:rgba(255,255,255,.06)}
.driver h3{font-size:1.2rem;position:relative}
.driver .role{color:var(--accent);font-size:.88rem;font-weight:700;position:relative}
.driver .rig{color:var(--muted);font-size:.88rem;margin-top:10px;position:relative}

/* MEMBERS */
.members{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.member{position:relative;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:26px 22px}
.member .num{position:absolute;right:12px;top:-6px;font-size:5.5rem;font-weight:700;font-style:italic;color:rgba(255,255,255,.06)}
.member h3{font-size:1.2rem;position:relative}
.member .role{color:var(--accent);font-size:.88rem;font-weight:700;position:relative}
.member .rig{color:var(--muted);font-size:.88rem;margin-top:10px;position:relative}


/* JOIN */
.join p{color:var(--muted);margin-bottom:18px}
.links{display:flex;flex-wrap:wrap;gap:12px}
.links a{background:var(--panel);border:1px solid var(--line);padding:12px 22px;border-radius:8px;font-weight:700;transition:.2s}
.links a:hover{border-color:var(--accent);background:rgba(255,46,58,.12)}

footer{margin-top:80px;padding:28px;text-align:center;color:var(--muted);border-top:1px solid var(--line);font-size:.9rem}

@media(max-width:760px){
  .burger{display:block}
  nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;
    background:var(--bg);padding:12px;border-bottom:1px solid var(--line)}
  nav.open{display:flex}
  .hero{padding:80px 0 56px}
  .countdown b{font-size:1.6rem}
  }