*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #f5f6fa;--surface: #fff;--primary: #1a237e;--text: #212121;--muted: #68707d;--ok: #2e7d32;--error: #c62828;--border: #e0e3eb;--radius: 10px}body{min-height:100vh;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}.header{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;padding:1.25rem 1.5rem;color:#fff;background:var(--primary)}.header__title{font-size:1.4rem}.header__env{opacity:.8;font-size:.85rem}.main{max-width:1120px;margin:2rem auto;padding:0 1rem 3rem}.status-section,.dashboard-section{margin-bottom:1.5rem}h2,.status-section__heading{color:var(--primary);font-size:1.1rem;margin-bottom:.75rem}.status-box{padding:1rem 1.25rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.status-box--loading{color:#a85b00;border-color:#e5a94f}.status-box--ok{color:var(--ok);border-color:#76b77a}.status-box--error,.inline-error{color:var(--error);border-color:#df8585}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}#funnel-period{color:var(--muted);font-size:.9rem}.metric-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.75rem}.metric-card{padding:1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.metric-card__label{display:block;color:var(--muted);font-size:.85rem}.metric-card strong{display:block;margin-top:.35rem;color:var(--primary);font-size:1.8rem}.filters{display:flex;align-items:end;gap:.75rem;flex-wrap:wrap;padding:1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}label{display:grid;gap:.25rem;color:var(--muted);font-size:.85rem}input,select,button{min-height:2.3rem;padding:.4rem .65rem;border:1px solid #b7bdc9;border-radius:6px;background:#fff;color:var(--text);font:inherit}button{cursor:pointer;color:#fff;background:var(--primary);border-color:var(--primary)}button:disabled{cursor:not-allowed;opacity:.5}.inline-error{min-height:1.5rem}.empty-state{padding:1rem;color:var(--muted);background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius)}.table-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}table{width:100%;border-collapse:collapse;font-size:.9rem}th,td{padding:.7rem .75rem;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap}th{color:var(--muted);font-weight:600;background:#fafbfe}.pagination{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;margin-top:.75rem}.pagination span{margin-right:auto;color:var(--muted);font-size:.9rem}@media(max-width:720px){.metric-grid{grid-template-columns:repeat(2,1fr)}.pagination{flex-wrap:wrap}}.approval-cell{white-space:normal;min-width:180px}.approval-status{font-weight:600}.approval-status--approved{color:var(--ok)}.approval-status--rejected{color:var(--error)}.approval-status--pending{color:#a85b00}.approval-recommendation{display:block;font-size:.8rem;color:var(--muted)}.approval-actions{margin-top:.35rem}.approval-form{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center}.approval-form input{min-width:80px;max-width:120px;font-size:.8rem;padding:.2rem .4rem;min-height:auto}.approval-btn{font-size:.75rem;padding:.2rem .5rem;min-height:auto;border-radius:4px}.approval-btn--approve{background:var(--ok);border-color:var(--ok)}.approval-btn--reject{background:var(--error);border-color:var(--error)}.approval-form-error{font-size:.75rem;color:var(--error)}.filters{align-items:stretch}.filters label{flex:1 1 180px;min-width:0}#apply-filters{display:none}.table-wrap{-webkit-overflow-scrolling:touch}@media(max-width:720px){.header{padding:1rem}.header__title{font-size:1.15rem}.main{margin:1rem auto;padding:0 .75rem 2rem}.section-heading{align-items:flex-start;flex-direction:column;gap:.25rem}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.metric-card{padding:.75rem}.metric-card strong{font-size:1.45rem}.filters{display:grid;grid-template-columns:1fr;gap:.65rem;padding:.75rem}.filters label{width:100%}input,select,button{width:100%;min-height:2.7rem}.table-wrap{margin-inline:-.75rem;border-radius:0}table{min-width:680px;font-size:.8rem}th,td{padding:.6rem .5rem;white-space:normal}.pagination{justify-content:space-between}.pagination span{width:100%;margin:0 0 .25rem}.pagination button{width:calc(50% - .25rem)}}:root{--bg: #f6f7fb;--surface: #ffffff;--surface-soft: #f9fafc;--primary: #172554;--primary-2: #243b7a;--accent: #f97316;--accent-soft: #fff1e8;--text: #172033;--muted: #718096;--border: #e6eaf0;--shadow: 0 16px 42px rgba(23, 37, 84, .07);--radius: 16px}body{background:radial-gradient(circle at 80% -10%,#fff4eb 0,transparent 30%),var(--bg);color:var(--text)}.header{position:sticky;top:0;z-index:10;min-height:74px;padding:1rem clamp(1rem,3vw,2.5rem);background:#ffffffeb;color:var(--text);border-bottom:1px solid rgba(230,234,240,.85);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.brand-lockup,.header__meta,.sidebar__brand,.sidebar__footer{display:flex;align-items:center;gap:.7rem}.brand-mark{display:grid;place-items:center;width:2rem;height:2rem;flex:0 0 2rem;border-radius:10px;color:#fff;background:linear-gradient(135deg,var(--accent),#fb923c);font-weight:800;box-shadow:0 8px 16px #f9731640}.header__title{color:var(--primary);font-size:1.2rem;letter-spacing:-.02em}.header__subtitle{display:block;color:var(--muted);font-size:.7rem;letter-spacing:.04em;text-transform:uppercase}.header__meta{margin-left:auto;color:var(--muted);font-size:.8rem}.status-dot{width:.5rem;height:.5rem;border-radius:999px;background:#22c55e;box-shadow:0 0 0 4px #dcfce7}.app-shell{display:flex;min-height:calc(100vh - 74px)}.sidebar{position:sticky;top:74px;display:flex;flex:0 0 232px;flex-direction:column;min-height:calc(100vh - 74px);padding:1.4rem 1rem;background:#111a38;color:#cbd5e1}.sidebar__brand{padding:.25rem .6rem 1.8rem;color:#fff;font-size:1.05rem}.sidebar__nav{display:grid;gap:.35rem}.nav-item{display:flex;align-items:center;gap:.7rem;padding:.75rem .8rem;border-radius:10px;color:#b8c2da;text-decoration:none;font-size:.86rem;transition:background .18s ease,color .18s ease,transform .18s ease}.nav-item span{width:1.2rem;color:#94a3b8;text-align:center;font-size:1.05rem}.nav-item:hover,.nav-item--active{color:#fff;background:linear-gradient(90deg,#f97316fa,#f97316b8)}.nav-item:hover{transform:translate(2px)}.nav-item--active span{color:#fff}.sidebar__footer{margin-top:auto;padding:.85rem .55rem;color:#9eabc4;font-size:.7rem;line-height:1.3}.main{flex:1;min-width:0;max-width:1280px;margin:0 auto;padding:clamp(1.25rem,3vw,2.75rem) clamp(1rem,4vw,3.5rem) 4rem}.status-section,.dashboard-section{margin-bottom:1.25rem}.status-section,.dashboard-section,.status-box,.filters,.table-wrap,.metric-card{border-color:var(--border);box-shadow:var(--shadow)}.status-section,.dashboard-section{border-radius:var(--radius)}.status-section>h2,.dashboard-section>h2,.dashboard-section>.section-heading{padding-inline:.25rem}.filters{gap:.9rem;padding:1.1rem;border-radius:var(--radius)}.filters label{color:var(--muted);font-weight:600}.filters input,.filters select{border-color:#d7deea;border-radius:10px}.filters input:focus,.filters select:focus{outline:3px solid rgba(249,115,22,.16);border-color:var(--accent)}.metric-card{border-radius:14px}.table-wrap{border-radius:var(--radius)}.mobile-nav{display:none}@media(max-width:720px){.header{min-height:64px;padding:.8rem 1rem}.header__meta{font-size:0}.header__meta .status-dot{margin-right:.25rem}.app-shell{min-height:calc(100vh - 64px)}.sidebar{display:none}.main{padding:1rem .75rem 5.5rem}.status-section,.dashboard-section{margin-bottom:1rem}.mobile-nav{position:fixed;right:.75rem;bottom:.75rem;left:.75rem;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);padding:.4rem;border:1px solid rgba(230,234,240,.9);border-radius:16px;background:#fffffff0;box-shadow:0 14px 32px #0f172a2e;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.mobile-nav__item{display:grid;justify-items:center;gap:.1rem;padding:.45rem .2rem;border-radius:11px;color:var(--muted);text-decoration:none;font-size:1.05rem}.mobile-nav__item small{font-size:.64rem;font-weight:600}.mobile-nav__item--active{color:var(--accent);background:var(--accent-soft)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}.header{position:sticky}.header__actions{display:flex;align-items:center;gap:.7rem;margin-left:auto}.header__status-cluster{display:flex;align-items:center;gap:.5rem}.header-status-pill{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .65rem;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--muted);font-size:.72rem;white-space:nowrap}.header-status-pill--ok{color:var(--ok);border-color:#b9e5c0}.status-dot--muted{background:#a7b0bd;box-shadow:none}.icon-button{width:2.25rem;min-height:2.25rem;padding:0;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--primary);font-size:1.1rem}.logout-button{min-height:2.25rem;padding-inline:.8rem;border-radius:10px}.session-status{color:var(--muted);font-size:.75rem;white-space:nowrap}.eyebrow{display:block;margin-bottom:.2rem;color:var(--accent);font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.section-caption{color:var(--muted);font-size:.78rem}.integration-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.integration-card{position:relative;display:flex;align-items:center;gap:.75rem;min-height:76px;padding:.85rem;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text);text-align:left;box-shadow:0 8px 22px #1725540d;transition:transform .18s cubic-bezier(.23,1,.32,1),box-shadow .18s ease,border-color .18s ease}.integration-card:hover,.metric-card:hover{transform:translateY(-3px);box-shadow:0 16px 30px #1725541f}.integration-card:active,.icon-button:active,button:active{transform:scale(.97)}.integration-brand{display:grid;place-items:center;width:2.45rem;height:2.45rem;flex:0 0 2.45rem;border-radius:11px;filter:grayscale(1);opacity:.55;color:#fff;font-size:1.25rem;font-weight:900}.integration-brand--ml{background:#ffe600;color:#172033}.integration-brand--shopee{background:#ee4d2d}.integration-brand--amazon{background:#111827}.integration-card--connected .integration-brand{filter:grayscale(0);opacity:1}.integration-card__body{display:grid;gap:.12rem;min-width:0}.integration-card__body strong{font-size:.84rem}.integration-card__body small{color:var(--muted);font-size:.7rem}.integration-card__indicator{width:.5rem;height:.5rem;margin-left:auto;flex:0 0 .5rem;border-radius:999px;background:#cbd5e1}.integration-card--connected .integration-card__indicator{background:#22c55e;box-shadow:0 0 0 4px #dcfce7}.integration-live-status{margin:.75rem 0 0;color:var(--muted);font-size:.78rem}.integration-actions{display:flex;gap:.5rem;margin-top:.5rem}.offer-thumbnail{cursor:zoom-in;border-radius:8px;object-fit:cover;transition:transform .18s ease,box-shadow .18s ease}.offer-thumbnail:hover{transform:scale(1.07);box-shadow:0 6px 14px #0f172a2e}.image-preview-dialog{width:min(92vw,720px);max-width:720px;padding:1.2rem;border:1px solid var(--border);border-radius:18px;background:var(--surface);color:var(--text);box-shadow:0 24px 80px #0f172a4d}.image-preview-dialog::backdrop{background:#0f172aad;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.image-preview-dialog h2{margin-bottom:.8rem;color:var(--text);font-size:1rem}.image-preview-dialog img{display:block;width:100%;max-height:70vh;object-fit:contain;border-radius:12px;background:var(--surface-soft)}.image-preview-close{position:absolute;top:.65rem;right:.65rem;width:2rem;min-height:2rem;padding:0;border:0;border-radius:999px;background:var(--surface-soft);color:var(--text);font-size:1.4rem;line-height:1}body.theme-dark{--bg: #07090e;--surface: #0f172a;--surface-soft: #1e293b;--primary: #38bdf8;--text: #f8fafc;--muted: #94a3b8;--border: #334155;--accent-soft: #431407;--shadow: 0 20px 50px rgba(0,0,0,.4);background:radial-gradient(circle at 80% -10%,#2d160d 0,transparent 40%),var(--bg)}body.theme-dark .header{background:#111a2feb;color:var(--text)}body.theme-dark .sidebar{background:#070d1d}body.theme-dark input,body.theme-dark select{background:#0f172a;color:#f8fafc;border-color:#334155}body.theme-dark button{background:#1e293b;color:#38bdf8;border-color:#334155;font-weight:600}body.theme-dark button:hover{background:#334155}body.theme-dark th{background:#1e293b;color:#f8fafc}body.theme-dark .integration-brand--amazon{background:#f3f4f6;color:#111827}@media(min-width:721px){.sidebar{position:fixed;left:0;top:74px;bottom:0;height:auto;overflow-y:auto}.main{margin-left:232px}}@media(max-width:720px){.header__actions{gap:.35rem}.header__status-cluster{gap:.25rem}.header-status-pill{padding:.32rem;font-size:0}.header-status-pill .status-dot{margin:0}.header__env,.session-status{display:none}.integration-grid{grid-template-columns:1fr}.integration-card{min-height:68px}.section-heading{gap:.6rem}.section-caption{font-size:.68rem}.table-wrap{overflow-x:auto}table{min-width:760px}.image-preview-dialog{padding:.85rem}}.app-shell[hidden],.mobile-nav[hidden]{display:none!important}.login-section{max-width:520px;margin:clamp(2rem,10vh,6rem) auto;padding:1.5rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.login-section input,.login-section button{width:100%;margin-top:.4rem}.login-section button{margin-top:.9rem}@media(max-width:720px){.login-section{margin:1.25rem .75rem;padding:1.15rem}}.header-status-pill--button{cursor:pointer;font:inherit}.system-status-summary{margin-bottom:.85rem;color:var(--ok);font-weight:700}.system-status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem}.system-status-row{display:grid;grid-template-columns:auto 1fr;gap:.35rem .5rem;align-items:center;padding:.65rem .7rem;border:1px solid var(--border);border-radius:11px;background:var(--surface-soft);font-size:.74rem}.system-status-row strong{grid-column:2;color:var(--muted);font-size:.7rem;font-weight:700}.status-check{display:grid;place-items:center;width:1.15rem;height:1.15rem;border-radius:999px;font-weight:900}.status-check--ok{color:#166534;background:#dcfce7}.status-check--loading{color:#92400e;background:#fef3c7}.status-check--muted{color:#64748b;background:#e2e8f0}.status-check--error{color:#991b1b;background:#fee2e2}.extension-pair-dialog{width:min(92vw,420px);padding:1.35rem;border:1px solid var(--border);border-radius:18px;background:var(--surface);color:var(--text);box-shadow:0 24px 80px #0f172a4d}.extension-pair-dialog::backdrop{background:#0f172aad;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.extension-pair-dialog h2{color:var(--text)}.extension-pair-dialog p{margin:.5rem 0 1rem;color:var(--muted);font-size:.85rem}.pair-code{display:block;margin:.85rem 0;padding:.8rem;border:1px dashed var(--accent);border-radius:11px;color:var(--primary);background:var(--accent-soft);font-size:1.5rem;font-weight:800;letter-spacing:.12em;text-align:center}.secondary-button{margin-top:.3rem;background:var(--surface-soft);color:var(--primary);border-color:var(--border)}@media(max-width:720px){.system-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.header-status-pill--button{display:inline-flex}}.system-status-row--action{width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:transform .18s cubic-bezier(.23,1,.32,1),box-shadow .18s ease,border-color .18s ease}.system-status-row--action:hover{transform:translateY(-3px);box-shadow:0 12px 24px #1725541a;border-color:var(--accent)}.system-status-row{transition:transform .18s cubic-bezier(.23,1,.32,1),box-shadow .18s ease,border-color .18s ease}.system-status-row:hover{transform:translateY(-3px);box-shadow:0 12px 24px #1725541a;border-color:var(--accent)}dialog{position:fixed;inset:50% auto auto 50%;margin:0;transform:translate(-50%,-50%)}dialog[open]{transform:translate(-50%,-50%)}.cell-stack{vertical-align:middle}.cell-stack>span{display:block;line-height:1.35}.cell-stack>span+span{color:var(--muted);font-size:.78em;overflow-wrap:anywhere}.cell-stack--product{min-width:260px}body.theme-dark .status-check--ok{color:#4ade80;background:#064e3b}body.theme-dark .status-check--loading{color:#fbbf24;background:#451a03}body.theme-dark .status-check--muted{color:#94a3b8;background:#1e293b}body.theme-dark .status-check--error{color:#f87171;background:#450a0a}body.theme-dark .metric-card strong{color:#f8fafc}body.theme-dark .secondary-button{background:#1e293b;color:#38bdf8;border-color:#334155}body.theme-dark .secondary-button:hover{background:#334155}body.theme-dark .integration-card--connected{border-color:#38bdf8;background:#1e293b}body.theme-dark .integration-card--connected .integration-card__indicator{box-shadow:0 0 0 4px #082f49}body.theme-dark .system-status-row--action:hover{border-color:#38bdf8;background:#1e293b}body.theme-dark .integration-card{background:#0f172a;border-color:#334155}body.theme-dark .integration-card:hover{border-color:#475569;background:#1e293b}body.theme-dark .integration-card--connected .integration-card__body strong{color:#38bdf8}body.theme-dark .system-status-row{background:#0f172a;border-color:#334155}body.theme-dark .system-status-row:hover{background:#1e293b;border-color:#475569}body.theme-dark .system-status-row strong{color:#f8fafc}.system-status-row>span:nth-child(2){color:var(--text);font-weight:500}.system-status-row strong{color:var(--muted)}.system-status-summary{color:var(--text);font-weight:500}