/* Trophy Racing Design System — tokens */
@import url("https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600;700;800;900&family=Sarabun:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");

:root{
/* brand */
--tr-black:#0B0B0C;--tr-carbon:#161618;--tr-graphite:#232326;--tr-steel:#3A3A3F;
--tr-gold:#FFBE00;--tr-gold-600:#D99E00;--tr-gold-300:#FFD54F;--tr-gold-100:#FFF3C4;
--tr-red:#E3232B;--tr-red-600:#B8151C;--tr-red-100:#FDE3E4;
--tr-silver:#C9CBD1;--tr-silver-300:#E4E5E9;--tr-white:#FFFFFF;--tr-paper:#F6F5F2;
/* neutrals */
--tr-n-50:#F7F7F8;--tr-n-100:#EEEEF0;--tr-n-200:#DCDDE1;--tr-n-300:#C2C3C9;--tr-n-400:#9A9BA3;--tr-n-500:#71727A;--tr-n-600:#52535A;--tr-n-700:#3A3A3F;--tr-n-800:#232326;--tr-n-900:#161618;
/* semantic */
--tr-success:#1FA463;--tr-success-100:#9CF6C2;--tr-warning:#F5B700;--tr-danger:#E3232B;--tr-danger-100:#FDE3E4;--tr-info:#2F6FED;--tr-info-100:#E1EAFD;
/* marketplace */
--tr-shopee:#FF5A1B;--tr-lazada:#353FE7;--tr-tiktok:#000000;--tr-thaimart:#E41919;--tr-facebook:#2E87FA;--tr-line:#11D300;
/* aliases (light surface) */
--bg-page:var(--tr-paper);--bg-surface:var(--tr-white);--bg-surface-2:var(--tr-n-50);--bg-inverse:var(--tr-black);--bg-inverse-2:var(--tr-carbon);
--text-primary:var(--tr-black);--text-secondary:var(--tr-n-600);--text-muted:var(--tr-n-400);--text-on-inverse:var(--tr-white);--text-on-inverse-muted:var(--tr-n-300);--text-on-accent:var(--tr-black);--text-accent:var(--tr-gold-600);
--border-default:var(--tr-n-200);--border-strong:var(--tr-n-300);--border-inverse:var(--tr-steel);--border-focus:var(--tr-gold);
--accent:var(--tr-gold);--accent-hover:var(--tr-gold-600);--accent-2:var(--tr-red);--accent-2-hover:var(--tr-red-600);
--link:var(--tr-gold-600);--link-hover:var(--tr-red);
--chart-1:var(--tr-gold);--chart-2:var(--tr-red);--chart-3:var(--tr-info);--chart-4:var(--tr-success);--chart-5:var(--tr-n-400);
/* shadows & effects */
--shadow-sm:0 1px 2px rgba(11,11,12,.08);
--shadow-md:0 4px 12px rgba(11,11,12,.10);
--shadow-lg:0 12px 32px rgba(11,11,12,.16);
--shadow-gold:0 6px 20px rgba(245,183,0,.35);
--focus-ring:0 0 0 3px rgba(245,183,0,.45);
--overlay-scrim:rgba(11,11,12,.6);
--protect-bottom:linear-gradient(180deg,rgba(11,11,12,0) 0%,rgba(11,11,12,.85) 100%);
--bg-carbon:radial-gradient(120% 80% at 50% 0%,#2A2A2E 0%,#0B0B0C 70%);
--bg-gold-band:linear-gradient(90deg,#D99E00,#F5B700 50%,#FFD54F);
--ease-out:cubic-bezier(.2,.8,.2,1);--ease-in-out:cubic-bezier(.65,0,.35,1);
--dur-fast:120ms;--dur-base:200ms;--dur-slow:320ms;
--blur-glass:12px;
/* spacing / radius / layout */
--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;--sp-12:48px;--sp-16:64px;
--radius-xs:2px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-pill:999px;
--container-sale:640px;--container-store:1200px;--container-admin:1440px;--sidebar-w:240px;
--control-h-sm:32px;--control-h-md:40px;--control-h-lg:48px;--control-h-xl:56px;
/* type */
--font-display:"Kanit","Noto Sans Thai",system-ui,sans-serif;
--font-body:"Sarabun","Noto Sans Thai",system-ui,sans-serif;
--font-mono:"JetBrains Mono",ui-monospace,monospace;
--fs-12:12px;--fs-13:13px;--fs-14:14px;--fs-16:16px;--fs-18:18px;--fs-20:20px;--fs-24:24px;--fs-28:28px;--fs-32:32px;--fs-40:40px;--fs-48:48px;--fs-64:64px;--fs-88:88px;
--lh-tight:1.05;--lh-snug:1.2;--lh-normal:1.5;--lh-relaxed:1.65;
--text-hero:900 var(--fs-88)/var(--lh-tight) var(--font-display);
--text-display:800 var(--fs-64)/var(--lh-tight) var(--font-display);
--text-h1:700 var(--fs-40)/var(--lh-snug) var(--font-display);
--text-h2:700 var(--fs-28)/var(--lh-snug) var(--font-display);
--text-h3:600 var(--fs-20)/var(--lh-snug) var(--font-display);
--text-label:500 var(--fs-14)/var(--lh-snug) var(--font-display);
--text-body-lg:400 var(--fs-18)/var(--lh-relaxed) var(--font-body);
--text-body:400 var(--fs-16)/var(--lh-normal) var(--font-body);
--text-body-sm:400 var(--fs-14)/var(--lh-normal) var(--font-body);
--text-caption:400 var(--fs-12)/var(--lh-normal) var(--font-body);
--text-price:700 var(--fs-24)/var(--lh-snug) var(--font-display);
--text-mono:400 var(--fs-13)/var(--lh-normal) var(--font-mono);
--tracking-caps:0.08em;
}

*,*::before,*::after{box-sizing:border-box}
h1,h2,h3,h4{margin:0;font-family:var(--font-display)}
button,input,select,textarea{font:inherit}
img{display:block;max-width:100%}
