@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { color-scheme:light; --ink:#172033; --muted:#69758a; --paper:#f6f8fc; --panel:#ffffff; --line:#e4e9f2; --lime:#b9d8ff; --blue:#6366f1; --orange:#ec9b5c; --purple:#a78bfa; --green:#5bbda1; --shadow:0 4px 18px rgba(23,32,51,.035); --topbar-height:76px; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { background:var(--paper); }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
button,input,select { font:inherit; }

.topbar { height:var(--topbar-height); padding:0 max(28px,calc((100vw - 1440px)/2)); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(255,255,255,.94); backdrop-filter:blur(18px); position:relative; z-index:10; }
.brand { display:flex; gap:12px; align-items:center; color:inherit; text-decoration:none; }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; color:var(--lime); background:var(--ink); font-weight:800; font-size:1.2rem; }
.brand strong,.brand small { display:block; }
.brand strong { font-size:.98rem; text-transform:uppercase; letter-spacing:.17em; }
.brand small { color:var(--muted); font-size:.7rem; margin-top:2px; }
.topbar-actions { display:flex; align-items:center; gap:18px; }
.sync-state { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:.76rem; font-weight:600; }
.status-dot { width:8px; height:8px; border-radius:50%; background:#d5a826; box-shadow:0 0 0 4px rgba(213,168,38,.12); }
.sync-state.ready .status-dot { background:#70ad2d; box-shadow:0 0 0 4px rgba(112,173,45,.12); }
.refresh-button { display:flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:10px; padding:8px 10px; color:var(--ink); background:var(--panel); cursor:pointer; font-size:.7rem; font-weight:700; }
.refresh-button:hover { border-color:#b8b8af; }.refresh-button:disabled { cursor:wait; opacity:.7; }
.refresh-icon { display:inline-block; font-size:1rem; line-height:1; }.refreshing .refresh-icon { animation:spin .8s linear infinite; }
.logout { color:var(--muted); font-size:.72rem; font-weight:700; text-decoration:none; }

.login-page { min-height:100vh; min-height:100svh; display:flex; flex-direction:column; }
.login-main { width:100%; flex:1; display:grid; place-items:center; padding:56px 24px; }
.login-card { width:min(100%,440px); padding:34px; }
.login-card .eyebrow { margin-bottom:12px; color:var(--blue); }
.login-card h1 { margin:0; font-size:2rem; line-height:1.15; letter-spacing:-.05em; }
.login-description { margin:12px 0 0; color:var(--muted); font-size:.84rem; line-height:1.7; }
.login-form { margin-top:28px; }
.login-form label { display:block; margin-bottom:10px; color:var(--muted); font:500 .65rem 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }
.login-form input[type=password] { width:100%; min-height:50px; padding:13px 15px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:var(--paper); font-size:1rem; transition:border-color .15s ease,box-shadow .15s ease; }
.login-form input[type=password]:focus { border-color:var(--blue); outline:0; box-shadow:0 0 0 4px rgba(99,102,241,.1); }
.login-form input[aria-invalid=true] { border-color:#bb4d34; }
.login-submit { width:100%; min-height:50px; display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:16px; padding:13px 16px; border:0; border-radius:12px; color:white; background:#4f46e5; cursor:pointer; font-size:.82rem; font-weight:700; transition:background .15s ease; }
.login-submit:hover { background:#4338ca; }
.login-error { margin:12px 0 0; color:#bb4d34; font-size:.78rem; line-height:1.5; }
.login-footer { margin:26px 0 0; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:.68rem; text-align:center; }

main { max-width:1440px; margin:auto; padding:36px 28px 76px; }
.eyebrow { margin:0 0 10px; color:var(--muted); font:500 .67rem/1.2 'DM Mono',monospace; letter-spacing:.14em; text-transform:uppercase; }
.filters { position:sticky; top:12px; z-index:9; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; gap:12px; max-width:none; margin:0 0 24px; padding:16px; border:1px solid #cdd3f4; border-radius:16px; background:#eef0ff; box-shadow:0 6px 20px rgba(49,46,129,.1); }
.filters.has-platform,.filters.has-custom { grid-template-columns:repeat(4,minmax(0,1fr)); max-width:none; }
.filters.has-platform.has-custom { grid-template-columns:repeat(5,minmax(0,1fr)); max-width:none; }
.filters label { min-width:0; padding:5px 8px; color:var(--muted); font:500 .62rem 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }
.filters input,.filters select { width:100%; border:0; outline:0; margin-top:6px; padding:0; color:var(--ink); background:transparent; font-weight:700; font-size:.82rem; }
.filter-status { grid-column:1/-1; color:#596180; padding:0 8px; font-size:.67rem; line-height:1.4; }
.filters[data-state="invalid"] .filter-status,.filters[data-state="error"] .filter-status { color:#9f3727; }
.filters-updated { animation:filter-updated .45s ease-out 1; }
@keyframes filter-updated { 0%,100% { background:#eef0ff; border-color:#cdd3f4; } 45% { background:#dce2ff; border-color:#818cf8; box-shadow:0 0 0 3px rgba(99,102,241,.15); } }
body.filter-pending main > section { opacity:.45; pointer-events:none; }
body.filter-loading .filters { z-index:16; pointer-events:auto; }

.period-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:11px; margin-bottom:12px; }
.period-card { min-height:220px; padding:22px; border:1px solid var(--line); border-radius:16px; background:var(--panel); box-shadow:var(--shadow); }
.period-card.selected { color:white; border-color:#4338ca; background:linear-gradient(135deg,#3730a3,#4f46e5); }
.period-top { display:flex; justify-content:space-between; gap:10px; color:var(--muted); font:500 .63rem 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.06em; }
.period-card.selected .period-top,.period-card.selected .period-meta span,.period-card.selected .period-comparison { color:#c3cce1; }
.period-revenue { margin:29px 0 23px; font-size:clamp(1.8rem,2.7vw,2.5rem); font-weight:800; line-height:1; letter-spacing:-.055em; }
.period-meta { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.period-meta strong,.period-meta span { display:block; }
.period-meta strong { font-size:.92rem; }
.period-meta span { margin-top:3px; color:var(--muted); font-size:.61rem; }
.period-delivery { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:17px; padding-top:14px; border-top:1px solid rgba(128,128,120,.22); }
.period-delivery strong,.period-delivery span { display:block; }
.period-delivery strong { color:#376b41; font-size:.92rem; }
.period-delivery span { margin-top:3px; color:var(--muted); font-size:.61rem; }
.period-card.selected .period-delivery strong { color:var(--lime); }
.period-card.selected .period-delivery span { color:#c3cce1; }
.period-comparison { margin-top:19px; padding-top:13px; border-top:1px solid rgba(128,128,120,.22); color:var(--muted); font-size:.68rem; font-weight:700; }
.full-day-total { display:block; margin-top:7px; color:var(--ink); font-size:.64rem; font-weight:800; }
.period-card.selected .full-day-total { color:white; }

.panel { border:1px solid var(--line); border-radius:18px; background:var(--panel); box-shadow:var(--shadow); }
.panel-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; padding:24px 24px 0; }
.panel h2 { margin:0; font-size:1.14rem; letter-spacing:-.025em; }
.panel-note { color:var(--muted); font-size:.7rem; }
.content-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(360px,.55fr); gap:12px; margin-bottom:12px; }
/* Share row sizes so wrapped labels cannot lift individual bar baselines. */
.comparison-bars { height:310px; display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:auto 1fr auto auto; column-gap:22px; row-gap:8px; padding:30px 34px 25px; }
.comparison-bar-item { display:grid; grid-row:1 / -1; grid-template-rows:subgrid; gap:8px; text-align:center; }
.bar-value { min-height:18px; font:500 .68rem 'DM Mono',monospace; }
.vertical-track { min-height:170px; display:flex; align-items:flex-end; border-radius:11px; background:#f1f4fa; overflow:hidden; }
.vertical-fill { width:100%; min-height:0; border-radius:11px 11px 0 0; background:var(--blue); transition:height .3s ease; }
.color-1 { background:var(--orange); }.color-2 { background:var(--purple); }.color-3 { background:var(--green); }
.comparison-bar-item strong { font-size:.75rem; }.comparison-bar-item time { color:var(--muted); font-size:.65rem; }
.benchmark-panel { overflow:hidden; }
.benchmark-lead { margin:24px; padding:21px; border-radius:17px; color:white; background:var(--ink); }
.benchmark-lead span,.benchmark-lead small,.benchmark-lead strong { display:block; }
.benchmark-lead span { color:#c3cce1; font-size:.66rem; }.benchmark-lead strong { margin:12px 0 4px; font-size:2rem; letter-spacing:-.05em; }.benchmark-lead small { color:#c3cce1; font-size:.65rem; }
.benchmark-list { margin:0 24px 24px; }
.benchmark-row { display:flex; align-items:center; justify-content:space-between; padding:13px 0; border-top:1px solid var(--line); font-size:.78rem; }
.benchmark-row span small { display:block; margin-top:3px; color:var(--muted); }.benchmark-row strong { font-size:.75rem; }
.positive { color:#4e861b!important; }.negative { color:#bb4d34!important; }

.trend-panel { margin-bottom:12px; overflow:hidden; }
.trend-heading { align-items:center; }
.trend-legend { display:flex; flex-wrap:wrap; gap:8px 16px; padding:12px 24px 8px; }
.trend-period-key { flex-basis:100%; display:flex; align-items:center; gap:15px; color:var(--muted); font-size:.64rem; }
.trend-period-key span { display:flex; align-items:center; gap:6px; white-space:nowrap; }
.trend-period-key i { width:22px; height:0; border-top:3px solid var(--ink); }
.trend-period-key i.previous-month { border-top-style:dotted; opacity:.65; }
.trend-legend-item { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:.67rem; }
.trend-legend-item i { width:9px; height:9px; border-radius:50%; }
.trend-legend-item strong { color:var(--ink); font-size:.65rem; }
.trend-chart-scroll { width:100%; overflow-x:auto; }
.trend-chart { position:relative; min-width:760px; padding:2px 18px 13px; }
.trend-chart svg { display:block; width:100%; height:auto; }
.trend-grid-line line { stroke:#e8ecf4; stroke-width:1; }
.trend-grid-line text,.trend-x-label { fill:#85867e; font:500 11px 'DM Mono',monospace; }
.trend-line { fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.trend-line.previous-month { stroke-width:2.5; stroke-dasharray:1 8; opacity:.62; }
.trend-dot { stroke:var(--panel); stroke-width:1.5; pointer-events:none; }
.trend-dot.previous-month { opacity:.62; }
.trend-quantity { stroke:var(--panel); stroke-width:4px; paint-order:stroke fill; stroke-linejoin:round; font:700 10px 'DM Mono',monospace; pointer-events:none; }
.trend-quantity.previous-month { opacity:.68; }
.trend-hit { cursor:pointer; outline:none; }
.trend-hit:focus-visible { stroke:var(--ink); stroke-width:2; }
.trend-tooltip { position:absolute; z-index:3; min-width:128px; padding:10px 12px; border-radius:11px; color:white; background:var(--ink); box-shadow:0 12px 28px rgba(19,20,18,.24); pointer-events:none; transform:translate(-50%,-100%); }
.trend-tooltip span,.trend-tooltip strong,.trend-tooltip b,.trend-tooltip small { display:block; }
.trend-tooltip span { color:#c3cce1; font:500 .56rem 'DM Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.trend-tooltip strong { margin-top:5px; font-size:.72rem; }.trend-tooltip b { margin-top:4px; font-size:.94rem; }.trend-tooltip small { margin-top:2px; color:#d4d5ce; font-size:.62rem; }
.trend-empty { min-width:0; min-height:300px; display:grid; place-items:center; color:var(--muted); font-size:.76rem; }

.table-panel { overflow:hidden; }
.table-title { align-items:end; padding-bottom:19px; }
.table-title>p { max-width:500px; margin:0; color:var(--muted); font-size:.7rem; text-align:right; line-height:1.5; }
.breakdown-heading-actions { display:grid; justify-items:end; gap:9px; }
.breakdown-description { max-width:560px; margin:0; color:var(--muted); font-size:.7rem; text-align:right; line-height:1.5; }
.breakdown-controls { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.breakdown-toggle { display:flex; padding:3px; border:1px solid var(--line); border-radius:11px; background:#f2f5fa; }
.breakdown-toggle button { border:0; border-radius:8px; padding:7px 11px; color:var(--muted); background:transparent; cursor:pointer; font-size:.68rem; font-weight:700; }
.breakdown-toggle button.active { color:white; background:var(--ink); }
.coupon-channel-control,.coupon-search-control { display:flex; align-items:center; gap:8px; min-height:35px; padding:5px 8px 5px 11px; border:1px solid var(--line); border-radius:11px; color:var(--muted); background:#f8faff; font:500 .58rem 'DM Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.coupon-channel-control select { max-width:150px; border:0; outline:0; color:var(--ink); background:transparent; font:700 .68rem Manrope,system-ui,sans-serif; }
.coupon-search-control input { width:105px; border:0; outline:0; padding:0; color:var(--ink); background:transparent; font:700 .68rem Manrope,system-ui,sans-serif; text-transform:none; }
.table-wrap { width:100%; overflow-x:auto; border-top:1px solid var(--line); }
table { width:100%; border-collapse:collapse; font-size:.78rem; }
th { padding:12px 20px; color:var(--muted); background:#f8faff; font:500 .59rem 'DM Mono',monospace; letter-spacing:.07em; text-align:right; text-transform:uppercase; white-space:nowrap; }
th:first-child,td:first-child { text-align:left; }
.sort-button { width:100%; display:inline-flex; align-items:center; justify-content:flex-end; gap:7px; border:0; padding:0; color:inherit; background:transparent; cursor:pointer; font:inherit; letter-spacing:inherit; text-align:inherit; text-transform:inherit; white-space:nowrap; }
th:first-child .sort-button,.recent-panel th:nth-child(-n+5) .sort-button { justify-content:flex-start; }
.sort-copy { display:block; }.period-header-date { display:block; margin-top:4px; color:#95968e; font-size:.54rem; letter-spacing:0; text-transform:none; }
.sort-indicator { color:#a8a99f; font:700 .72rem Manrope,system-ui,sans-serif; }.sort-button.active .sort-indicator { color:var(--ink); }
td { padding:15px 20px; border-top:1px solid #edf0f6; text-align:right; white-space:nowrap; }
td small { display:block; margin-top:3px; color:var(--muted); font-size:.61rem; }
.full-day-metric { margin-top:7px; padding-top:6px; border-top:1px dashed #d9d7cf; color:#4e4f49; font-weight:700; }
.delivered-metric { margin-top:4px; color:#18764a; font-weight:700; }
.sessions-metric { margin-top:4px; color:#315c8b; font-weight:700; }
tbody tr:first-child td { border-top:0; } tbody tr:hover { background:#f8faff; }
.channel-name { display:flex; align-items:center; gap:10px; font-weight:700; }.channel-swatch { width:9px; height:9px; border-radius:3px; }
.delta-pill { display:inline-block; min-width:62px; padding:5px 7px; border-radius:8px; color:#686960; background:#edf1f8; font-size:.68rem; font-weight:800; text-align:center; }
.coupon-code { font:500 .69rem 'DM Mono',monospace; }.tag { display:inline-block; padding:4px 7px; border-radius:7px; color:#51524c; background:#edf1f8; font-size:.64rem; font-weight:700; }.tag.warning { color:#8a3b27; background:#ffe1d5; }
.table-empty { padding:30px!important; color:var(--muted); text-align:center!important; }
.compact-table { max-height:470px; overflow-y:auto; }

.quality-panel { padding-bottom:24px; }.quality-panel-wide { margin-top:12px; }.quality-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:24px; }.quality-stats>div { padding:15px 11px; border-radius:13px; background:#f4f6fb; }.quality-stats strong,.quality-stats span { display:block; }.quality-stats strong { font-size:1.3rem; }.quality-stats span { color:var(--muted); font-size:.59rem; }
.quality-alerts { margin:0 24px; border-top:1px solid var(--line); }.quality-alerts>div { display:flex; justify-content:space-between; gap:18px; padding:13px 0; border-bottom:1px solid var(--line); font-size:.7rem; }.quality-alerts>div:last-child { border-bottom:0; }.quality-alerts span { color:var(--muted); }.quality-alerts strong { max-width:60%; text-align:right; overflow-wrap:anywhere; }
.sync-list { margin:8px 24px 0; padding:13px 14px; border-radius:13px; color:white; background:var(--ink); }.sync-item { display:flex; justify-content:space-between; gap:10px; padding:5px 0; font-size:.65rem; }.sync-item span { color:#b6b7ae; }
.recent-panel { margin-top:12px; }.recent-panel td:nth-child(-n+5),.recent-panel th:nth-child(-n+5) { text-align:left; }
.error-toast { position:fixed; right:24px; bottom:24px; z-index:20; max-width:420px; padding:14px 17px; border-radius:12px; color:white; background:#9f3727; box-shadow:0 18px 45px rgba(90,22,14,.24); font-size:.78rem; opacity:0; visibility:hidden; transform:translateY(140%); transition:transform .2s ease,opacity .2s ease; }.error-toast.success { background:#436f22; box-shadow:0 18px 45px rgba(42,85,23,.22); }.error-toast.visible { opacity:1; visibility:visible; transform:translateY(0); }
.comparison-loading { display:none; position:fixed; inset:0; z-index:15; align-items:center; justify-content:center; flex-direction:column; gap:9px; padding:24px; color:var(--ink); background:rgba(246,248,252,.94); text-align:center; }
.comparison-loading strong { font-size:1rem; }.comparison-loading small { max-width:340px; color:var(--muted); font-size:.75rem; }
.comparison-loading-spinner { width:28px; height:28px; border:3px solid rgba(25,29,26,.16); border-top-color:var(--ink); border-radius:50%; animation:comparison-spin .8s linear infinite; }
body.loading { overflow:hidden; pointer-events:none; } body.loading .comparison-loading { display:flex; }
body.report-unavailable main > section { display:none; }
.report-error { margin:20px 0; padding:24px; border:1px solid #ab4038; color:#7b2822; }
@keyframes comparison-spin { to { transform:rotate(360deg); } }

@keyframes spin { to { transform:rotate(360deg); } }

@media(min-width:1101px) { .quality-panel-wide #qualityContent { display:grid; grid-template-columns:1fr 1fr .75fr; align-items:start; gap:24px; padding:24px; }.quality-panel-wide .quality-stats { padding:0; }.quality-panel-wide .quality-alerts { margin:0; border-top:0; }.quality-panel-wide .sync-list { margin:0; } }
@media(max-width:1100px) { .period-grid { grid-template-columns:repeat(2,1fr); }.content-grid { grid-template-columns:1fr; } }
@media(max-width:650px) {
  :root { --topbar-height:70px; }
  .period-delivery { grid-template-columns:1fr; gap:9px; margin-top:13px; padding-top:11px; }
  .topbar { padding:0 17px; }.brand small,.sync-state { display:none; }.topbar-actions { gap:8px; }.refresh-button { padding:7px 9px; }.logout { font-size:.68rem; }
  main { padding:35px 14px 54px; }.filters,.filters.has-platform,.filters.has-custom,.filters.has-platform.has-custom { grid-template-columns:1fr; }
  .login-main { padding:32px 16px; }.login-card { padding:28px 24px; }.login-page .brand small { display:block; }
  .period-grid { grid-template-columns:1fr 1fr; gap:8px; }.period-card { min-height:190px; padding:16px; border-radius:16px; }.period-top { display:block; }.period-top time { display:block; margin-top:5px; }.period-revenue { margin:22px 0 18px; font-size:1.48rem; }.period-meta { grid-template-columns:1fr; gap:7px; }.period-meta div:nth-child(2) { display:none; }.period-comparison { margin-top:13px; padding-top:10px; }
  .panel { border-radius:17px; }.panel-heading { padding:19px 17px 0; }.table-title { align-items:flex-start; padding-bottom:16px; }.table-title>p,.panel-note { display:none; }
  .breakdown-panel .table-title { flex-direction:column; }.breakdown-heading-actions { width:100%; justify-items:stretch; }.breakdown-controls { display:grid; justify-content:stretch; }.breakdown-toggle button { flex:1; padding-left:8px; padding-right:8px; }.coupon-channel-control,.coupon-search-control { justify-content:space-between; }.coupon-channel-control select { max-width:190px; }.coupon-search-control input { width:190px; }.breakdown-description { display:none; }
  .comparison-bars { height:265px; gap:8px; padding:25px 14px 20px; }.vertical-track { min-height:135px; }.bar-value { font-size:.55rem; }.comparison-bar-item strong { font-size:.63rem; }
  .trend-heading .panel-note { display:block; max-width:145px; text-align:right; line-height:1.4; }.trend-legend { flex-wrap:wrap; overflow-x:auto; padding-left:17px; padding-right:17px; }.trend-legend-item { flex:0 0 auto; }.trend-chart { padding-left:8px; padding-right:8px; }
  th,td { padding-left:15px; padding-right:15px; }.quality-stats { padding:19px 17px; }.quality-alerts,.sync-list { margin-left:17px; margin-right:17px; }
}

/* Shared chart controls and the quieter analytics workspace. */
.page-intro { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:24px; }
.page-intro .eyebrow { margin-bottom:8px; color:#6366f1; }
h1 { margin:0; font-size:clamp(1.65rem,3vw,2rem); font-weight:800; letter-spacing:-.045em; }
.page-intro p:last-child { margin:8px 0 0; color:var(--muted); font-size:.82rem; }
.workspace-badge { flex:none; padding:8px 11px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:var(--panel); font-size:.67rem; font-weight:700; }
.trend-heading { align-items:center; flex-wrap:wrap; }
.trend-heading .panel-note { flex-basis:100%; }
.trend-toolbar { padding:18px 24px 4px; }
.trend-toolbar .breakdown-controls { justify-content:flex-start; flex-wrap:wrap; }
.metric-toggle { display:flex; flex:none; gap:2px; margin:0; padding:4px; border:1px solid var(--line); border-radius:12px; background:#f2f5fa; }
.metric-toggle label { position:relative; cursor:pointer; }
.metric-toggle input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.metric-toggle span { display:block; padding:8px 12px; border-radius:8px; color:var(--muted); font-size:.72rem; font-weight:700; }
.metric-toggle input:checked + span { color:#4338ca; background:white; box-shadow:0 2px 5px rgba(23,32,51,.08); }
.metric-toggle input:focus-visible + span { outline:2px solid #6366f1; outline-offset:2px; }
.chart-description { margin:0; padding:0 24px 22px; max-width:1080px; color:var(--muted); font-size:.69rem; line-height:1.7; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
button:hover { filter:brightness(.97); }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible { outline:2px solid #6366f1; outline-offset:3px; }
.trend-panel { margin-bottom:16px; }
.period-grid,.content-grid { gap:16px; margin-bottom:16px; }
.quality-panel-wide,.recent-panel { margin-top:16px; }
@media(max-width:1100px) {
  .filters,.filters.has-platform,.filters.has-custom,.filters.has-platform.has-custom { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:650px) {
  main { padding-top:24px; }
  .page-intro { margin-bottom:20px; }.workspace-badge { display:none; }
  .page-intro p:last-child { font-size:.74rem; }
  .filters,.filters.has-platform,.filters.has-custom,.filters.has-platform.has-custom { grid-template-columns:repeat(2,minmax(0,1fr)); padding:12px; gap:12px 6px; }
  .filters { grid-template-areas:'anchor channel' 'range range' 'status status'; }
  .filters.has-platform { grid-template-areas:'anchor channel' 'range platform' 'status status'; }
  .filters.has-custom { grid-template-areas:'start channel' 'anchor range' 'status status'; }
  .filters.has-custom.has-platform { grid-template-areas:'start channel' 'anchor range' 'platform platform' 'status status'; }
  .filters label { padding:5px; letter-spacing:.04em; }
  #anchorDateControl { grid-area:anchor; } #comparisonPeriodControl { grid-area:range; }
  #customFromControl { grid-area:start; } #channelControl { grid-area:channel; } #platformControl { grid-area:platform; }
  .filter-status { grid-area:status; padding:0 5px; }
  .period-grid { gap:8px; }
  .trend-heading { gap:12px; }.trend-heading h2 { font-size:1.03rem; }
  .trend-heading .panel-note { max-width:none; text-align:left; }
  .metric-toggle { width:100%; }.metric-toggle label { flex:1; text-align:center; }
  .trend-toolbar { padding:16px 17px 4px; }
  .trend-toolbar .breakdown-controls { display:flex; gap:9px; }
  .trend-toolbar .breakdown-toggle { width:100%; }.breakdown-toggle button { white-space:nowrap; }
  .trend-toolbar .coupon-channel-control,.trend-toolbar .coupon-search-control { flex:1 1 100%; min-width:0; }
  .trend-toolbar select,.trend-toolbar input { max-width:60%; }
  .chart-description { padding:0 17px 18px; font-size:.66rem; }
  .trend-chart { min-width:1000px; }
  .trend-chart-scroll:has(svg)::after { content:'Swipe chart to explore all 30 days →'; position:sticky; left:0; display:block; width:calc(100vw - 48px); padding:4px 17px 14px; color:var(--muted); font-size:.63rem; }
  .trend-empty { min-width:0; max-width:calc(100vw - 62px); padding:20px; line-height:1.6; text-align:center; }
}
@media(max-height:600px) {
  .filters { max-height:calc(100dvh - 24px); overflow-y:auto; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* Shared workspace navigation; the Sales report and its filters keep their layout. */
.topbar:has(.workspace-tabs) { gap:20px; }
.workspace-tabs { display:flex; gap:4px; margin-right:auto; padding:4px; border:1px solid var(--line); border-radius:12px; background:#f1f4fa; }
.workspace-tabs a { padding:9px 17px; border-radius:8px; color:var(--muted); text-decoration:none; font-size:.75rem; font-weight:800; }
.workspace-tabs a[aria-current=page] { color:white; background:#4f46e5; }
.workspace-tabs a:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.analytics-message { margin:0 0 16px; color:#405473; font-size:.8rem; line-height:1.6; }
.analytics-filters { grid-template-columns:repeat(5,minmax(0,1fr)); grid-template-areas:"period start end channel platform" "status status status status status"; }
.analytics-period { grid-area:period; }.analytics-start { grid-area:start; }.analytics-end { grid-area:end; }.analytics-channel { grid-area:channel; }.analytics-platform { grid-area:platform; }
.analytics-filters .filter-status { grid-area:status; }
.analytics-message:empty { display:none; }.analytics-message.error { color:#9f3727; }
.analytics-message button,.analytics-pagination button,.analytics-export { border:1px solid var(--line); border-radius:9px; padding:8px 12px; background:white; color:var(--ink); cursor:pointer; font-size:.72rem; font-weight:700; }
.analytics-primary { border:0; border-radius:10px; padding:12px 18px; color:white; background:#4f46e5; cursor:pointer; font-size:.8rem; font-weight:800; }
.analytics-empty { padding:44px 28px; text-align:center; }.analytics-empty p { color:var(--muted); font-size:.84rem; line-height:1.7; }
.analytics-kpis { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.analytics-kpi { min-width:0; padding:23px 20px; border:1px solid var(--line); border-radius:16px; background:white; }
.analytics-kpi span,.analytics-kpi strong,.analytics-kpi small { display:block; }
.analytics-kpi span { color:var(--muted); font:500 .65rem 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.06em; }
.analytics-kpi strong { margin:17px 0 10px; font-size:clamp(1.05rem,1.7vw,1.8rem); letter-spacing:-.04em; overflow-wrap:anywhere; }
.analytics-kpi small { color:var(--muted); font-size:.65rem; line-height:1.5; }
.analytics-caption { margin:14px 2px 22px; color:var(--muted); font-size:.72rem; line-height:1.7; }
.analytics-breakdown { overflow:hidden; }
.analytics-explorer-controls { display:grid; gap:20px; padding:24px; }
.analytics-explorer-controls .breakdown-toggle { justify-self:start; }
.analytics-table-filters { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:12px; }
.analytics-table-filters label { color:var(--muted); font-size:.68rem; font-weight:700; }
.analytics-table-filters input,.analytics-table-filters select { display:block; width:100%; min-height:39px; margin-top:7px; padding:9px 11px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:var(--paper); font-size:.75rem; }
.analytics-search { min-width:0; }
.analytics-definition { margin:0; padding:15px 24px; border-top:1px solid var(--line); color:var(--muted); background:#fafbff; font-size:.7rem; line-height:1.7; }
.analytics-table { width:100%; min-width:1080px; }.analytics-table td,.analytics-table th { text-align:right; }.analytics-table td:first-child,.analytics-table th:first-child { text-align:left; }
.analytics-table th button { padding:0; border:0; background:transparent; color:inherit; cursor:pointer; font:inherit; text-align:inherit; }
.analytics-table th[aria-sort=ascending] button::after { content:' ↑'; color:var(--blue); }.analytics-table th[aria-sort=descending] button::after { content:' ↓'; color:var(--blue); }
.analytics-table td:first-child { min-width:240px; max-width:370px; white-space:normal; overflow-wrap:anywhere; }.analytics-table td:first-child small { display:block; color:var(--muted); margin-top:4px; font-size:.65rem; }
.analytics-no-rows { padding:25px!important; text-align:center!important; color:var(--muted); font-size:.76rem; }
.analytics-pagination { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; padding:18px 24px; color:var(--muted); font-size:.7rem; }.analytics-pagination > div { display:flex; align-items:center; gap:12px; }
.analytics-pagination button:disabled,.analytics-export:disabled { opacity:.4; cursor:default; }
.analytics-methods { margin-top:18px; padding:24px; }.analytics-methods h2 { font-size:.95rem; }.analytics-methods p { color:var(--muted); font-size:.74rem; line-height:1.8; }
@media(max-width:1100px) { .analytics-kpis { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:651px) and (max-width:1000px) { .analytics-filters { grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-areas:"period start end" "channel platform platform" "status status status"; } }
@media(max-width:650px) {
  .topbar:has(.workspace-tabs) { display:grid; grid-template-columns:minmax(0,1fr) auto; height:auto; min-height:70px; gap:12px 8px; padding-top:12px; padding-bottom:12px; }
  .workspace-tabs { grid-column:1/-1; grid-row:2; justify-content:center; margin:0; }.workspace-tabs a { flex:1; text-align:center; }
  .analytics-filters { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:"period period" "start channel" "end platform" "status status"; }.analytics-filters label:first-child { grid-column:1/-1; }
  .analytics-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }.analytics-kpi { padding:18px 15px; }
  .analytics-kpi strong { font-size:1.25rem; }.analytics-kpi span { font-size:.6rem; }.analytics-explorer-controls { padding:18px; gap:16px; }
  .analytics-explorer-controls .breakdown-toggle { justify-self:stretch; display:grid; grid-template-columns:1fr 1fr; }.analytics-explorer-controls .breakdown-toggle button { flex:1; padding:10px 6px; font-size:.65rem; }
  .analytics-table-filters { grid-template-columns:1fr 1fr; }.analytics-search { grid-column:1/-1; }
  .analytics-definition { padding:15px 18px; }
  .analytics-pagination { padding:16px 18px; }.analytics-methods { padding:20px; }
}
@media(max-width:360px) { .topbar:has(.workspace-tabs) .brand strong { display:none; }.analytics-kpi strong { font-size:1.05rem; }.analytics-kpi { padding:16px 12px; } }

.analytics-context { padding:22px 24px; margin:0 0 18px; border-color:#c7d2fe; background:#f5f6ff; overflow-wrap:anywhere; }
.analytics-context h2 { font-size:1.1rem; line-height:1.5; margin:8px 0; }.analytics-context p:not(.eyebrow) { color:var(--muted); font-size:.74rem; line-height:1.7; margin-bottom:0; }
.analytics-context-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }.analytics-context-actions button { border:1px solid #c7d2fe; border-radius:8px; padding:8px 12px; background:white; color:#4338ca; font-size:.73rem; font-weight:700; cursor:pointer; }
.analytics-row-link { border:0; padding:0; background:transparent; color:#4338ca; text-align:left; font:inherit; font-weight:700; line-height:1.5; cursor:pointer; white-space:normal; overflow-wrap:anywhere; }.analytics-row-link:hover { text-decoration:underline; }.analytics-row-link:focus-visible { outline:2px solid #6366f1; outline-offset:4px; border-radius:3px; }
.analytics-unavailable { display:block; color:var(--muted); font-size:.6rem; white-space:normal; }
@media(max-width:640px) { .analytics-context { padding:18px; } }
.analytics-breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.analytics-breadcrumbs button { max-width: 100%; overflow-wrap: anywhere; text-align: left; padding: 7px 10px; color: #4338ca; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 8px; cursor: pointer; }
.analytics-breadcrumbs button:disabled { color: #334155; background: #f8fafc; border-color: #e2e8f0; cursor: default; }