/* Thailand Together Console · Light Theme Foundation
   Batch: CONSOLE-WHITE-01
   Purpose: shared white-theme, fit-to-page, 18px baseline, and Thai-first font normalization
*/
:root{
  --tt-bg:#F8FAFC;
  --tt-bg-2:#EFF6FF;
  --tt-surface:#FFFFFF;
  --tt-surface-soft:#F1F5F9;
  --tt-text-1:#0F172A;
  --tt-text-2:#334155;
  --tt-text-3:#64748B;
  --tt-text-4:#94A3B8;
  --tt-border:rgba(15,23,42,.08);
  --tt-border-strong:rgba(15,23,42,.14);
  --tt-teal:#0F766E;
  --tt-teal-soft:#14B8A6;
  --tt-blue:#0284C7;
  --tt-purple:#7C3AED;
  --tt-amber:#B45309;
  --tt-danger:#BE123C;
  --tt-shadow-sm:0 1px 2px rgba(15,23,42,.04);
  --tt-shadow-md:0 10px 24px rgba(15,23,42,.06),0 4px 10px rgba(15,23,42,.04);
  --tt-shadow-lg:0 18px 42px rgba(15,23,42,.08),0 8px 18px rgba(15,23,42,.05);
  --tt-radius-sm:10px;
  --tt-radius-md:16px;
  --tt-radius-lg:24px;
  --tt-font-sans:'Noto Sans Thai', 'Proxima Nova', 'Proxima Nova Thai', -apple-system, BlinkMacSystemFont, sans-serif;
  --tt-font-display:'Noto Sans Thai', 'Proxima Nova', 'Proxima Nova Thai', sans-serif;
  --tt-content-max:1800px;
  --tt-page-pad-x:24px;
  --tt-page-pad-y:28px;
  --tt-base-font:18px;
}
html{font-size:18px}
body.tt-light,
body[data-theme='tt-light']{
  background:linear-gradient(180deg,var(--tt-bg) 0%,var(--tt-bg-2) 100%);
  color:var(--tt-text-1);
  font-family:var(--tt-font-sans);
  font-size:18px;
  line-height:1.6;
}
body.tt-light *,
body[data-theme='tt-light'] *{
  font-family:inherit;
}
body.tt-light code,
body.tt-light pre,
body.tt-light kbd,
body.tt-light samp,
body[data-theme='tt-light'] code,
body[data-theme='tt-light'] pre,
body[data-theme='tt-light'] kbd,
body[data-theme='tt-light'] samp{
  font-family:var(--tt-font-sans);
}
.tt-page,
.tt-wrap,
.tt-shell,
.tt-container,
body.tt-light .wrap,
body.tt-light .container,
body.tt-light .app{
  width:100%;
  max-width:var(--tt-content-max);
  margin:0 auto;
  padding-left:var(--tt-page-pad-x);
  padding-right:var(--tt-page-pad-x);
}
.tt-surface{
  background:var(--tt-surface);
  border:1px solid var(--tt-border);
  border-radius:var(--tt-radius-md);
  box-shadow:var(--tt-shadow-sm);
}
.tt-card{
  background:rgba(255,255,255,.94);
  border:1px solid var(--tt-border);
  border-radius:20px;
  box-shadow:var(--tt-shadow-sm);
}
.tt-card:hover{box-shadow:var(--tt-shadow-md)}
.tt-title-xl{font-size:clamp(40px,6vw,68px);line-height:1.02;font-weight:700}
.tt-title-lg{font-size:32px;line-height:1.15;font-weight:700}
.tt-title-md{font-size:24px;line-height:1.25;font-weight:700}
.tt-title-sm{font-size:20px;line-height:1.3;font-weight:700}
.tt-body,
.tt-body p,
.tt-body li,
.tt-body td,
.tt-body th,
body.tt-light p,
body.tt-light li,
body.tt-light td,
body.tt-light th,
body.tt-light input,
body.tt-light select,
body.tt-light textarea,
body.tt-light button{
  font-size:18px !important;
}
.tt-small,
.tt-caption,
.tt-meta,
body.tt-light .sub,
body.tt-light .card-desc,
body.tt-light .btn-desc-en,
body.tt-light .path-line,
body.tt-light .crumb-line,
body.tt-light .helper,
body.tt-light .label,
body.tt-light .card-url,
body.tt-light .card-tag,
body.tt-light .btn-meta,
body.tt-light .foot{
  font-size:16px !important;
}
.tt-fit-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tt-fit-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tt-fit-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1200px){.tt-fit-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:960px){.tt-fit-grid-3,.tt-fit-grid-2{grid-template-columns:1fr}}
@media (max-width:720px){
  :root{--tt-page-pad-x:14px;--tt-page-pad-y:20px}
  .tt-title-xl{font-size:38px}
  .tt-title-lg{font-size:28px}
  .tt-title-md{font-size:22px}
  .tt-title-sm{font-size:20px}
}