:root{--bg-0: #06070B;--bg-1: #0A0C12;--bg-2: #11141D;--bg-3: #171B27;--bg-4: #1E2331;--line: rgba(214, 178, 92, .16);--line-strong: rgba(214, 178, 92, .32);--line-soft: rgba(255, 255, 255, .06);--line-faint: rgba(255, 255, 255, .035);--ink: #F4EFE3;--ink-2: #BCB6A7;--ink-3: #837E72;--ink-4: #565248;--gold: #D9B45A;--gold-bright: #F6E2A0;--gold-deep: #9E7820;--gold-glow: rgba(217, 180, 90, .45);--emerald: #4BC591;--emerald-dim: rgba(75, 197, 145, .14);--ruby: #E5675A;--ruby-dim: rgba(229, 103, 90, .14);--amber: #EBA640;--amber-dim: rgba(235, 166, 64, .14);--sapphire: #6C97EE;--sapphire-dim: rgba(108, 151, 238, .14);--font-display: "Trirong", Georgia, serif;--font-body: "IBM Plex Sans Thai", system-ui, sans-serif;--font-mono: "IBM Plex Mono", "Courier New", monospace;--grad-gold: linear-gradient(120deg, #8A6A1C 0%, #E7C766 18%, #FCEFC0 34%, #D9B45A 50%, #9E7820 64%, #F6E2A0 82%, #C99A2B 100%);--grad-gold-soft: linear-gradient(120deg, #C9A24B 0%, #F6E2A0 50%, #B98F2A 100%);--grad-panel: linear-gradient(160deg, rgba(255,255,255,.035), rgba(255,255,255,0) 60%);--shadow-1: 0 1px 2px rgba(0,0,0,.4);--shadow-2: 0 12px 32px -12px rgba(0,0,0,.7);--shadow-gold: 0 8px 30px -10px rgba(217,180,90,.35);--r-sm: 8px;--r-md: 12px;--r-lg: 18px;--r-xl: 26px;--topbar-bg: rgba(10, 12, 18, .6);color-scheme:dark}:root[data-theme=light]{color-scheme:light;--bg-0: #ECE7DA;--bg-1: #F6F2E9;--bg-2: #FFFFFF;--bg-3: #F2ECDF;--bg-4: #E9E2D0;--line: rgba(176, 138, 42, .3);--line-strong: rgba(176, 138, 42, .52);--line-soft: rgba(40, 33, 16, .1);--line-faint: rgba(40, 33, 16, .05);--ink: #2A2417;--ink-2: #574F3C;--ink-3: #847B64;--ink-4: #A89E86;--gold: #A9821E;--gold-bright: #8A6A1C;--gold-deep: #6E5414;--gold-glow: rgba(176, 138, 42, .3);--emerald: #1F9E6B;--emerald-dim: rgba(31, 158, 107, .14);--ruby: #CC4536;--ruby-dim: rgba(204, 69, 54, .12);--amber: #C07C16;--amber-dim: rgba(192, 124, 22, .14);--sapphire: #3D6FD1;--sapphire-dim: rgba(61, 111, 209, .12);--grad-gold: linear-gradient(120deg, #6E5414 0%, #B8911F 22%, #D9B45A 42%, #9E7820 60%, #C99A2B 82%, #6E5414 100%);--grad-gold-soft: linear-gradient(120deg, #9E7820 0%, #C99A2B 50%, #7A5E18 100%);--grad-panel: linear-gradient(160deg, rgba(40, 33, 16, .022), rgba(40, 33, 16, 0) 60%);--shadow-1: 0 1px 2px rgba(40, 33, 16, .08);--shadow-2: 0 14px 34px -16px rgba(40, 33, 16, .22);--shadow-gold: 0 8px 30px -12px rgba(176, 138, 42, .3);--topbar-bg: rgba(246, 242, 233, .72)}:root[data-theme=light] ::selection{background:#b08a2a42;color:#2a2417}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-body);background:var(--bg-1);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"tnum" 1;transition:background .25s ease,color .25s ease}.app-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-2;background:radial-gradient(1100px 700px at 78% -10%,rgba(217,180,90,.1),transparent 60%),radial-gradient(900px 600px at 4% 108%,rgba(108,151,238,.06),transparent 55%),radial-gradient(700px 500px at 50% 50%,rgba(217,180,90,.025),transparent 70%),var(--bg-0)}.app-grain{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:.5;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E")}::selection{background:#d9b45a47;color:#fff}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#d6b25c2e;border-radius:99px;border:2px solid transparent;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:#d6b25c52;background-clip:padding-box}.font-display{font-family:var(--font-display)}.font-mono{font-family:var(--font-mono)}.gold-text{background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.gold-soft{background:var(--grad-gold-soft);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.gold-shimmer{background:linear-gradient(110deg,#9e7820 20%,#fcefc0 38%,#f6e2a0 46%,#9e7820 64%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:shimmer 6s linear infinite}.panel{position:relative;background:var(--grad-panel),var(--bg-2);border:1px solid var(--line-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-2)}.panel-gold{border-color:var(--line)}.panel-gold:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:1px;background:linear-gradient(160deg,rgba(217,180,90,.55),rgba(217,180,90,.04) 40%,transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.hr-gold{height:1px;border:0;background:linear-gradient(90deg,transparent,var(--line-strong),transparent)}.btn{font-family:var(--font-body);font-size:14px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:99px;border:1px solid transparent;cursor:pointer;transition:all .22s cubic-bezier(.2,.7,.3,1);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn-gold{color:#2a1f06;background:linear-gradient(120deg,#e7c766,#fcefc0 40%,#d9b45a 60%,#b98f2a);background-size:160% auto;box-shadow:var(--shadow-gold),inset 0 1px #ffffff80;font-weight:600}.btn-gold:hover{background-position:right center;transform:translateY(-1px);box-shadow:0 12px 36px -10px #d9b45a8c,inset 0 1px #ffffff80}.btn-gold:active{transform:translateY(0)}.btn-ghost{color:var(--ink-2);background:#ffffff06;border-color:var(--line-soft)}.btn-ghost:hover{color:var(--ink);border-color:var(--line-strong);background:#d9b45a0f}.btn-line{color:var(--gold-bright);background:transparent;border-color:var(--line-strong)}.btn-line:hover{background:#d9b45a14}.btn-sm{padding:7px 14px;font-size:13px}.btn-icon{padding:9px;border-radius:10px}.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;padding:3px 10px 3px 8px;border-radius:99px;border:1px solid transparent;letter-spacing:.1px}.badge .dot{width:6px;height:6px;border-radius:99px}.badge-emerald{color:var(--emerald);background:var(--emerald-dim);border-color:#4bc59140}.badge-emerald .dot{background:var(--emerald);box-shadow:0 0 8px var(--emerald)}.badge-ruby{color:var(--ruby);background:var(--ruby-dim);border-color:#e5675a40}.badge-ruby .dot{background:var(--ruby)}.badge-amber{color:var(--amber);background:var(--amber-dim);border-color:#eba64040}.badge-amber .dot{background:var(--amber)}.badge-sapphire{color:var(--sapphire);background:var(--sapphire-dim);border-color:#6c97ee40}.badge-sapphire .dot{background:var(--sapphire)}.badge-gold{color:var(--gold-bright);background:#d9b45a1f;border-color:var(--line-strong)}.badge-gold .dot{background:var(--gold);box-shadow:0 0 8px var(--gold-glow)}.badge-ghost{color:var(--ink-3);background:#ffffff0a;border-color:var(--line-soft)}.badge-ghost .dot{background:var(--ink-3)}@keyframes pulse-ring{0%{transform:scale(.8);opacity:.7}70%{transform:scale(2.2);opacity:0}to{opacity:0}}.live-dot{position:relative;width:8px;height:8px;border-radius:99px;background:var(--emerald);display:inline-block}.live-dot:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:99px;background:var(--emerald);animation:pulse-ring 2s ease-out infinite}@keyframes slideIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.field{width:100%;font-family:var(--font-body);font-size:14px;color:var(--ink);background:var(--bg-1);border:1px solid var(--line-soft);border-radius:10px;padding:11px 14px;transition:border-color .2s,box-shadow .2s;outline:none}.field::placeholder{color:var(--ink-4)}.field:focus{border-color:var(--line-strong);box-shadow:0 0 0 3px #d9b45a1a}.field-label{font-size:12px;color:var(--ink-3);margin-bottom:7px;display:block;letter-spacing:.2px}.toggle{width:40px;height:23px;border-radius:99px;background:var(--bg-4);border:1px solid var(--line-soft);position:relative;cursor:pointer;transition:all .25s;flex:none}.toggle .knob{position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:99px;background:var(--ink-3);transition:all .25s}.toggle.on{background:linear-gradient(120deg,#c9a24b,#f6e2a0);border-color:transparent}.toggle.on .knob{left:19px;background:#2a1f06}.tbl{width:100%;border-collapse:collapse;font-size:13.5px}.tbl thead th{text-align:left;font-weight:500;color:var(--ink-3);font-size:11.5px;letter-spacing:.6px;text-transform:uppercase;padding:12px 16px;border-bottom:1px solid var(--line-soft);white-space:nowrap}.tbl tbody td{padding:14px 16px;border-bottom:1px solid var(--line-faint);color:var(--ink-2)}.tbl tbody tr{transition:background .15s;cursor:pointer}.tbl tbody tr:hover{background:#d9b45a0a}.tbl tbody tr:last-child td{border-bottom:0}.num{font-variant-numeric:tabular-nums}.click{cursor:pointer}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes riseIn{0%{transform:translateY(12px)}to{transform:translateY(0)}}@media(prefers-reduced-motion:no-preference){.fade-in{animation:riseIn .5s cubic-bezier(.2,.7,.3,1) both}.stagger>*{animation:riseIn .5s cubic-bezier(.2,.7,.3,1) both}.stagger>*:nth-child(1){animation-delay:.02s}.stagger>*:nth-child(2){animation-delay:.06s}.stagger>*:nth-child(3){animation-delay:.1s}.stagger>*:nth-child(4){animation-delay:.14s}.stagger>*:nth-child(5){animation-delay:.18s}.stagger>*:nth-child(6){animation-delay:.22s}}@keyframes countPop{0%{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}.roll{display:inline-block;transition:opacity .3s}@keyframes slipScroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.slip-marquee .slip-track{animation:slipScroll 46s linear infinite}.slip-marquee:hover .slip-track{animation-play-state:paused}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:spin .7s linear infinite}button:focus-visible,a:focus-visible,.field:focus-visible{outline:2px solid var(--line-strong);outline-offset:2px}
