:root{--bg: #f0f2f7;--surface: #ffffff;--surface2: #e8eaf2;--border: #d0d5e2;--accent: #1B5BA4;--accent2: #2e7d32;--danger: #C41230;--warn: #e65100;--text: #111827;--muted: #6b7280;--radius: 10px;--card: #ffffff;--shadow: 0 1px 4px rgba(0,0,0,.1);--shadow-md: 0 4px 12px rgba(0,0,0,.12)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--surface2)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--muted)}h1,h2,h3{color:var(--text);font-weight:600}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}input,select,textarea{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:8px 12px;font-size:13px;outline:none;transition:border-color .15s}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px #1b5ba41f}input::placeholder{color:var(--muted)}button{cursor:pointer;font-size:13px;font-weight:500;border:none;border-radius:6px;transition:all .15s}button:disabled{opacity:.5;cursor:not-allowed}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}table{width:100%;border-collapse:collapse}th{background:var(--surface2);color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:10px 14px;text-align:left;border-bottom:1px solid var(--border)}td{padding:10px 14px;border-bottom:1px solid var(--border);color:var(--text)}tr:last-child td{border-bottom:none}tr:hover td{background:var(--surface2)}.badge-shopify{background:#e8f5e9;color:#2e7d32}.badge-lazada{background:#fff3e0;color:#e65100}.badge-shopee{background:#fce4ec;color:#c62828}.badge-tiktok{background:#f3e5f5;color:#6a1b9a}.demo-banner{background:linear-gradient(135deg,#1b5ba4,#0d3d72);color:#fff;text-align:center;padding:6px 16px;font-size:12px;font-weight:500;letter-spacing:.02em}.demo-banner strong{color:#ffd54f}.recharts-cartesian-grid-horizontal line,.recharts-cartesian-grid-vertical line{stroke:var(--border)}.recharts-text{fill:var(--muted)}.recharts-tooltip-wrapper .recharts-default-tooltip{background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:var(--shadow-md)!important}
