:root { color-scheme: light; --ink:#102426; --muted:#637477; --line:#dfe7e5; --paper:#f4f7f5; --white:#fff; --teal:#167d89; --teal-dark:#0d5962; --mint:#daf3ea; --lime:#d8f45f; --amber:#fff3cf; --red:#a63b3b; }
* { box-sizing: border-box; }
[hidden] { display:none !important; }
body { margin:0; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--paper); -webkit-font-smoothing:antialiased; }
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.merchant-app { min-height:100vh; }
.merchant-sidebar { position:fixed; inset:0 auto 0 0; z-index:30; width:248px; display:flex; flex-direction:column; padding:22px 16px 16px; color:#eaf4f2; background:#071b1d; }
.merchant-brand { display:flex; align-items:center; gap:9px; padding:0 8px 22px; color:#fff; text-decoration:none; }
.merchant-brand > span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#071b1d; background:var(--lime); font-weight:900; }
.merchant-brand strong { font-size:19px; letter-spacing:.08em; }
.merchant-brand small { margin-left:auto; color:#729194; font-size:9px; letter-spacing:.15em; }
.business-switcher { display:flex; align-items:center; gap:10px; margin-bottom:18px; padding:12px; border:1px solid #244144; border-radius:14px; background:#0d292c; }
.business-avatar { width:36px; height:36px; display:grid; place-items:center; flex:0 0 36px; border-radius:10px; color:#083438; background:#bde8de; font-size:12px; font-weight:800; }
.business-switcher div { min-width:0; }
.business-switcher strong,.business-switcher small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.business-switcher strong { font-size:13px; }
.business-switcher small { margin-top:2px; color:#82a0a2; font-size:10px; }
.merchant-nav { display:grid; gap:4px; }
.merchant-nav button { position:relative; width:100%; display:flex; align-items:center; gap:11px; padding:10px 11px; border:0; border-radius:10px; color:#9eb4b5; background:transparent; text-align:left; font-size:13px; cursor:pointer; }
.merchant-nav button > span { width:20px; color:#6f9294; text-align:center; font-size:16px; }
.merchant-nav button:hover,.merchant-nav button.active { color:#fff; background:#173538; }
.merchant-nav button.active > span { color:var(--lime); }
.merchant-nav em { min-width:20px; margin-left:auto; padding:2px 6px; border-radius:99px; color:#071b1d; background:var(--lime); text-align:center; font-size:10px; font-style:normal; font-weight:800; }
.sidebar-tools { display:grid; gap:7px; margin-top:auto; padding:14px 10px; border-top:1px solid #1b3639; }
.sidebar-tools a { color:#79999b; text-decoration:none; font-size:11px; }
.sidebar-tools a:hover { color:#fff; }
.merchant-signout { margin-top:4px; padding:10px; border:1px solid #294548; border-radius:10px; color:#9eb4b5; background:transparent; cursor:pointer; }
.merchant-main { min-height:100vh; margin-left:248px; padding:0 32px 42px; }
.merchant-header { height:92px; display:flex; align-items:center; gap:18px; }
.merchant-header > div { flex:1; }
.merchant-header p,.console-panel > p,.panel-head p,.campaign-builder header p,.campaign-preview > p { margin:0 0 5px; color:#789093; font-size:9px; font-weight:800; letter-spacing:.16em; }
.merchant-header h1 { margin:0; font-size:25px; letter-spacing:-.03em; }
.primary-action,.secondary-action,.light-action,.text-action { border:0; cursor:pointer; }
.primary-action { padding:11px 16px; border-radius:10px; color:#fff; background:var(--teal); font-size:12px; font-weight:750; box-shadow:0 6px 18px rgba(22,125,137,.18); }
.primary-action:hover { background:var(--teal-dark); }
.secondary-action { padding:10px 14px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:#fff; font-size:12px; font-weight:700; }
.light-action { padding:10px 13px; border-radius:9px; color:#09272a; background:var(--lime); font-size:12px; font-weight:800; }
.text-action { padding:5px 0; color:var(--teal); background:transparent; font-size:11px; font-weight:700; }
.mobile-menu { display:none; border:0; background:transparent; font-size:20px; }
.console-banner { margin:0 0 18px; padding:11px 14px; border:1px solid #efdc9f; border-radius:11px; color:#6f5614; background:#fff8df; font-size:12px; }
.toast { position:fixed; top:18px; right:22px; z-index:100; max-width:340px; padding:12px 16px; border-radius:11px; color:#fff; background:#102426; box-shadow:0 16px 50px rgba(0,0,0,.22); font-size:12px; }
.toast.error { background:#802f2f; }
.console-view { animation:view-in .22s ease; }
@keyframes view-in { from { opacity:.3; transform:translateY(5px); } }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:15px; }
.metric-card { min-height:120px; padding:17px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.metric-card .metric-label { display:flex; align-items:center; justify-content:space-between; color:#6e8082; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }
.metric-card .metric-label i { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; color:#0e6871; background:#e5f4f1; font-style:normal; }
.metric-card strong { display:block; margin-top:18px; font-size:27px; letter-spacing:-.04em; }
.metric-card small { display:block; margin-top:3px; color:#829093; font-size:10px; }
.console-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; margin-bottom:15px; }
.console-grid.wide-left { grid-template-columns:minmax(0,1.55fr) minmax(260px,.75fr); }
.console-panel { min-width:0; padding:20px; border:1px solid var(--line); border-radius:17px; background:#fff; }
.console-panel h2 { margin:0; font-size:17px; letter-spacing:-.02em; }
.panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; margin-bottom:17px; }
.panel-copy { color:var(--muted); font-size:12px; line-height:1.6; }
.accent-panel { color:#e7f4f2; border-color:#14383b; background:#0b2b2e; }
.accent-panel > p { color:#7fabaa; }
.accent-panel h2 { max-width:360px; margin:7px 0 13px; font-size:24px; line-height:1.12; }
.accent-panel .panel-copy { color:#9ab4b4; }
.campaign-snapshot,.campaign-list,.approval-list,.activity-list,.ledger-list { display:grid; gap:9px; }
.snapshot-row,.campaign-row,.approval-card,.activity-row,.ledger-row { border:1px solid var(--line); border-radius:13px; background:#fff; }
.snapshot-row { display:grid; grid-template-columns:minmax(140px,1.5fr) minmax(100px,1fr) minmax(90px,.7fr); align-items:center; gap:12px; padding:12px 13px; }
.snapshot-row strong,.snapshot-row small { display:block; }
.snapshot-row strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.snapshot-row small { margin-top:3px; color:#809093; font-size:10px; }
.progress { height:6px; overflow:hidden; border-radius:99px; background:#e7edeb; }
.progress span { display:block; height:100%; border-radius:inherit; background:var(--teal); }
.state-pill { display:inline-flex; align-items:center; gap:5px; width:max-content; padding:4px 8px; border-radius:99px; color:#42595c; background:#edf1f0; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.state-pill.active { color:#0f6e56; background:#def4ea; }
.state-pill.pending_approval,.state-pill.pending_review,.state-pill.pending_partner_approval { color:#76580e; background:#fff2c9; }
.state-pill.rejected { color:#8d3333; background:#f9e3e3; }
.state-pill.archived,.state-pill.replaced { color:#687779; background:#e8edec; }
.activity-row { display:flex; align-items:center; gap:10px; padding:11px 12px; }
.activity-icon { width:31px; height:31px; display:grid; place-items:center; flex:0 0 31px; border-radius:9px; color:#0f6e56; background:#e1f5ee; }
.activity-row div { min-width:0; flex:1; }
.activity-row strong,.activity-row small { display:block; }
.activity-row strong { font-size:11px; }
.activity-row small { margin-top:2px; color:#829093; font-size:9px; }
.trust-list { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.trust-list li { display:flex; align-items:center; gap:9px; color:#526568; font-size:11px; }
.trust-list span { width:22px; height:22px; display:grid; place-items:center; border-radius:7px; color:#0f6e56; background:#e1f5ee; font-weight:800; }
.action-overview-panel { margin-bottom:15px; padding:17px 20px; background:linear-gradient(135deg,#fff,#f6fbf9); }
.action-overview-panel .panel-head { margin-bottom:11px; }
.action-overview-list,.action-center-list { display:grid; gap:9px; }
.action-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; padding:13px; border:1px solid #dde7e4; border-radius:13px; background:#fff; }
.action-item.attention { border-color:#efcaca; background:#fffafa; }
.action-item.todo { border-color:#e9ddb8; background:#fffdf7; }
.action-item.waiting { border-color:#d9e5e2; background:#f8fbfa; }
.action-item-icon { width:36px; height:36px; display:grid; place-items:center; flex:0 0 36px; border-radius:11px; color:#0d685f; background:#def3ec; font-size:14px; font-weight:900; }
.action-item.attention .action-item-icon { color:#963939; background:#f9e2e2; }
.action-item.todo .action-item-icon { color:#795d16; background:#fff0c7; }
.action-item.waiting .action-item-icon { color:#526d70; background:#e5eeec; }
.action-item-copy { min-width:0; }
.action-item-copy > div { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-bottom:4px; }
.action-item-copy small { color:#718386; font-size:8px; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.action-item-copy em { padding:3px 6px; border-radius:99px; color:#53696c; background:#edf2f0; font-size:8px; font-style:normal; font-weight:750; }
.action-item.attention .action-item-copy em { color:#8d3333; background:#f8e5e5; }
.action-item.todo .action-item-copy em { color:#73570d; background:#fff1cc; }
.action-item-copy strong { display:block; overflow:hidden; color:#183236; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.action-item-copy p { margin:3px 0 0; color:#718184; font-size:9px; line-height:1.45; }
.action-item-control a,.action-item-control button { display:inline-flex; align-items:center; justify-content:center; min-width:104px; padding:8px 10px; border:1px solid #cbdad6; border-radius:9px; color:#164f4c; background:#fff; font-size:9px; font-weight:800; text-decoration:none; white-space:nowrap; cursor:pointer; }
.action-item.attention .action-item-control button { color:#fff; border-color:#a94646; background:#a94646; }
.action-item.todo .action-item-control a,.action-item.todo .action-item-control button { color:#fff; border-color:#167d70; background:#167d70; }
.action-item.compact { padding:10px 11px; }
.action-item.compact .action-item-icon { width:31px; height:31px; flex-basis:31px; border-radius:9px; }
.action-item.compact .action-item-copy p { max-width:720px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.action-item.compact .action-item-control a,.action-item.compact .action-item-control button { min-width:94px; padding:7px 9px; }
.action-caught-up { display:flex; align-items:center; gap:11px; padding:12px; border:1px solid #cfe5dc; border-radius:12px; background:#f4fbf8; }
.action-caught-up > span { width:32px; height:32px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#16816b; font-weight:900; }
.action-caught-up strong,.action-caught-up small { display:block; }
.action-caught-up strong { font-size:12px; }
.action-caught-up small { margin-top:2px; color:#748588; font-size:9px; }
.action-caught-up.large { padding:24px; }
.action-live-note { color:#789093; font-size:9px; }
.action-group { display:grid; gap:8px; }
.action-group + .action-group { margin-top:18px; padding-top:17px; border-top:1px solid #e4ebe9; }
.action-group > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 2px; }
.action-group > header h3 { margin:0; font-size:13px; }
.action-group > header p { margin:2px 0 0; color:#829194; font-size:9px; }
.action-group > header > span { min-width:24px; height:24px; display:grid; place-items:center; border-radius:99px; color:#53676a; background:#edf2f0; font-size:9px; font-weight:850; }
.action-group.attention > header > span { color:#8d3333; background:#f9e3e3; }
.action-group.todo > header > span { color:#76580e; background:#fff2c9; }
.action-guide-panel { color:#e8f4f2; border-color:#153c3f; background:linear-gradient(150deg,#09282b,#123f42); }
.action-guide-panel > p:first-child { color:#7ea9a7; }
.action-guide-panel h2 { max-width:340px; margin:7px 0 18px; font-size:22px; line-height:1.15; }
.action-guide-steps { display:grid; gap:10px; }
.action-guide-steps > div { display:grid; grid-template-columns:27px 1fr; gap:2px 9px; padding:11px; border:1px solid #285154; border-radius:12px; background:rgba(255,255,255,.035); }
.action-guide-steps span { grid-row:1/3; width:27px; height:27px; display:grid; place-items:center; border-radius:9px; color:#09282b; background:var(--lime); font-size:10px; font-weight:900; }
.action-guide-steps strong { font-size:10px; }
.action-guide-steps small { color:#8faaaa; font-size:8px; line-height:1.45; }
.action-privacy-note { margin:14px 0 0; padding-top:13px; border-top:1px solid #24484b; color:#83a19f !important; font-size:8px !important; line-height:1.5; }
.merchant-customer-cases-panel { margin-bottom:15px; }
.merchant-customer-cases-panel .panel-head small { display:block; max-width:680px; margin-top:5px; color:#7b8b8d; font-size:9px; line-height:1.5; }
.case-filter-pills { display:flex; flex-wrap:wrap; gap:5px; padding:3px; border:1px solid var(--line); border-radius:10px; background:#f5f8f7; }
.case-filter-pills button { padding:6px 9px; border:0; border-radius:7px; color:#607174; background:transparent; font-size:9px; font-weight:800; cursor:pointer; }
.case-filter-pills button.active { color:#fff; background:#175e5c; }
.merchant-case-list { display:grid; gap:8px; }
.merchant-case-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; padding:13px; border:1px solid #dde7e4; border-radius:13px; background:#fff; }
.merchant-case-row.unread { border-color:#efcaca; background:#fffafa; box-shadow:inset 3px 0 #a94646; }
.merchant-case-row.closed { background:#f8faf9; }
.merchant-case-mark { width:37px; height:37px; display:grid; place-items:center; border-radius:11px; color:#0f665f; background:#e0f3ed; font-size:14px; font-weight:900; }
.merchant-case-row.unread .merchant-case-mark { color:#913737; background:#f9e2e2; }
.merchant-case-copy { min-width:0; }
.merchant-case-copy > div { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.merchant-case-copy > div span { padding:3px 6px; border-radius:99px; color:#53696c; background:#edf2f0; font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.merchant-case-copy > div em { color:#a13d3d; font-size:8px; font-style:normal; font-weight:850; text-transform:uppercase; }
.merchant-case-copy strong,.merchant-case-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.merchant-case-copy strong { margin-top:5px; color:#193336; font-size:12px; }
.merchant-case-copy small { margin-top:3px; color:#748588; font-size:9px; }
.merchant-case-side { display:grid; justify-items:end; gap:7px; }
.merchant-case-side time { color:#849295; font-size:8px; }
.merchant-case-side button { padding:8px 10px; border:1px solid #cbdad6; border-radius:9px; color:#fff; background:#167d70; font-size:9px; font-weight:800; cursor:pointer; }
.merchant-case-row.unread .merchant-case-side button { border-color:#a94646; background:#a94646; }
.merchant-case-empty { padding:22px; border:1px dashed #cbdad6; border-radius:13px; color:#78898b; background:#fafcfb; text-align:center; font-size:10px; }
.merchant-case-builder { width:min(940px,100%); }
.merchant-case-scroll { display:grid; gap:20px; }
.merchant-case-summary-card { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(230px,.75fr); gap:14px; padding:16px; border:1px solid #d9e7e3; border-radius:15px; background:linear-gradient(135deg,#f8fcfb,#fff); }
.merchant-case-summary-card h3 { margin:5px 0 7px; font-size:17px; }
.merchant-case-summary-card p { margin:0; color:#566a6d; font-size:10px; line-height:1.55; }
.merchant-case-summary-card small { color:#7d8d8f; font-size:8px; }
.merchant-case-summary-card .state-pill { margin-bottom:3px; }
.merchant-case-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.merchant-case-facts div { padding:9px; border:1px solid #e2eae8; border-radius:9px; background:#fff; }
.merchant-case-facts span,.merchant-case-facts strong { display:block; }
.merchant-case-facts span { color:#829194; font-size:7px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.merchant-case-facts strong { margin-top:4px; font-size:9px; line-height:1.4; }
.merchant-case-facts .merchant-case-policy { grid-column:1/-1; }
.merchant-case-policy small { display:block; margin-top:4px; color:#718386; font-size:8px; line-height:1.45; }
.merchant-case-items { grid-column:1/-1; margin-top:2px; padding-top:10px; border-top:1px solid #e3ebe9; color:#5f7174; font-size:9px; }
.merchant-case-section-title { margin-bottom:9px; }
.merchant-case-section-title strong,.merchant-case-section-title small { display:block; }
.merchant-case-section-title strong { font-size:12px; }
.merchant-case-section-title small { margin-top:3px; color:#7c8c8e; font-size:8px; }
.merchant-case-timeline { display:grid; gap:8px; }
.merchant-case-event { position:relative; display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:10px; padding:11px; border:1px solid #e1e9e7; border-radius:11px; }
.merchant-case-event > span { width:32px; height:32px; display:grid; place-items:center; border-radius:10px; color:#0f665f; background:#e0f3ed; font-size:10px; font-weight:900; }
.merchant-case-event.customer > span { color:#775b18; background:#fff0c7; }
.merchant-case-event strong,.merchant-case-event small,.merchant-case-event p { display:block; }
.merchant-case-event strong { font-size:9px; }
.merchant-case-event small { margin-top:2px; color:#879497; font-size:7px; text-transform:uppercase; }
.merchant-case-event p { margin:5px 0 0; color:#4f6265; font-size:9px; line-height:1.45; }
.merchant-case-event time { color:#899698; font-size:7px; white-space:nowrap; }
.merchant-case-response { padding-top:18px; border-top:1px solid var(--line); }
.merchant-case-trust { margin:10px 0 0; padding:10px 12px; border:1px solid #ecdda9; border-radius:10px; color:#695a2d; background:#fff9e9; font-size:8px; line-height:1.5; }
.merchant-case-closed-note { padding:13px; border:1px solid #cce3da; border-radius:11px; color:#255f52; background:#f2faf7; font-size:10px; line-height:1.5; }
.section-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:16px; }
.section-toolbar h2 { margin:0; font-size:22px; }
.section-toolbar p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.filter-pills { display:flex; gap:5px; padding:4px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.filter-pills button { padding:6px 9px; border:0; border-radius:7px; color:#728285; background:transparent; font-size:10px; cursor:pointer; }
.filter-pills button.active { color:#fff; background:#123c40; }
.filter-pills button span { display:inline-grid; min-width:16px; height:16px; margin-left:3px; padding:0 4px; place-items:center; border-radius:99px; color:inherit; background:rgba(18,60,64,.08); font-size:8px; }
.filter-pills button.active span { background:rgba(255,255,255,.16); }
.review-gate-note { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:13px; margin:0 0 14px; padding:14px 16px; border:1px solid #d9e7e4; border-radius:14px; background:linear-gradient(135deg,#f5faf8,#fff); }
.review-gate-note > div { display:grid; grid-template-columns:24px 1fr; column-gap:8px; align-items:center; }
.review-gate-note > div > span { grid-row:1/3; display:grid; width:24px; height:24px; place-items:center; border-radius:50%; color:#fff; background:#167d70; font-size:9px; font-weight:800; }
.review-gate-note strong { color:#173f42; font-size:11px; }
.review-gate-note small { margin-top:2px; color:#758789; font-size:9px; }
.review-gate-note > i { color:#9fb0ad; font-size:13px; font-style:normal; }
.review-gate-note > p { grid-column:1/-1; margin:0; padding-top:9px; border-top:1px solid #e5eeec; color:#657779; font-size:9px; }
.campaign-row { padding:16px; }
.campaign-row-head { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; }
.campaign-title-wrap { min-width:0; display:flex; align-items:center; gap:11px; }
.campaign-title-wrap > div { min-width:0; }
.campaign-row-visual { width:64px; height:42px; flex:0 0 64px; object-fit:cover; border:1px solid #dce6e3; border-radius:10px; background:#edf2f0; }
.campaign-row h3 { margin:0; font-size:14px; }
.campaign-row h3 small { margin-left:5px; color:#768789; font-size:9px; font-weight:800; }
.campaign-row p { margin:4px 0 0; color:#748487; font-size:10px; }
.campaign-review-status { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; padding:10px 11px; border-radius:10px; background:#f5f8f7; }
.campaign-review-status > div { display:flex; flex-wrap:wrap; gap:5px; }
.campaign-review-status > p { margin:0; color:#566b6d; font-size:9px; line-height:1.4; text-align:right; }
.review-badge { display:inline-flex; align-items:center; padding:4px 7px; border-radius:99px; color:#5f7173; background:#e8eeed; font-size:8px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; }
.review-badge.approved { color:#0f6e56; background:#def4ea; }
.review-badge.pending { color:#76580e; background:#fff2c9; }
.review-badge.rejected { color:#8d3333; background:#f9e3e3; }
.campaign-row-metrics { display:grid; grid-template-columns:repeat(5,minmax(70px,1fr)); gap:10px; margin-top:14px; padding-top:13px; border-top:1px solid #edf1f0; }
.campaign-row-metrics span small,.campaign-row-metrics span strong { display:block; }
.campaign-row-metrics small { color:#849295; font-size:8px; text-transform:uppercase; letter-spacing:.06em; }
.campaign-row-metrics strong { margin-top:4px; font-size:12px; }
.campaign-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:13px; }
.campaign-actions button { padding:7px 10px; border:1px solid var(--line); border-radius:8px; color:#405356; background:#fff; font-size:10px; font-weight:700; cursor:pointer; }
.campaign-actions button.primary { color:#fff; border-color:#167d70; background:#167d70; }
.campaign-actions button.danger { margin-left:auto; color:#8d3333; border-color:#f0d7d7; background:#fff8f8; }
.campaign-actions button.danger.confirm { color:#fff; border-color:#a83f3f; background:#a83f3f; }
.approval-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:15px; padding:17px; }
.approval-creative { min-width:0; display:flex; align-items:center; gap:13px; }
.approval-creative > div { min-width:0; flex:1; }
.approval-visual { width:92px; height:58px; flex:0 0 92px; object-fit:cover; border:1px solid #dce6e3; border-radius:11px; background:#edf2f0; }
.approval-card h3 { margin:0; font-size:14px; }
.approval-card p { margin:5px 0 0; color:#697a7d; font-size:11px; line-height:1.45; }
.approval-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:11px; }
.approval-meta span { padding:4px 7px; border-radius:7px; color:#506164; background:#eff3f2; font-size:9px; }
.approval-actions { display:flex; align-items:center; gap:7px; }
.approval-actions button { padding:8px 11px; border:0; border-radius:8px; font-size:10px; font-weight:750; cursor:pointer; }
.approval-actions .approve { color:#fff; background:var(--teal); }
.approval-actions .reject { color:#793737; background:#fae9e9; }
.empty-state { padding:34px 20px; border:1px dashed #cbd7d4; border-radius:14px; color:#718184; text-align:center; font-size:12px; }
.funnel-chart { display:grid; gap:15px; }
.funnel-row { display:grid; grid-template-columns:95px minmax(0,1fr) 55px; align-items:center; gap:10px; font-size:10px; }
.funnel-bar { height:26px; overflow:hidden; border-radius:7px; background:#edf2f0; }
.funnel-bar span { height:100%; display:block; min-width:3px; border-radius:inherit; background:linear-gradient(90deg,#167d89,#62c7b2); }
.targeting-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.targeting-grid span,.targeting-grid del { padding:11px; border-radius:10px; font-size:10px; text-decoration:none; }
.targeting-grid span { color:#24584f; background:#e3f4ec; }
.targeting-grid del { color:#936565; background:#f7eaea; }
.settlement-note { color:#889598; font-size:9px; }
.ledger-row { display:grid; grid-template-columns:1.2fr .8fr .7fr .7fr; align-items:center; gap:10px; padding:12px; font-size:10px; }
.ledger-row strong,.ledger-row small { display:block; }
.ledger-row small { margin-top:3px; color:#839194; }
.integration-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.integration-card { display:grid; grid-template-columns:auto 1fr; gap:12px; min-height:160px; padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.integration-logo { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:#fff; background:#4b8d43; font-weight:900; }
.integration-logo.square-logo { color:#111; background:#e9edec; }
.integration-logo.air-logo { color:#071b1d; background:var(--lime); }
.integration-card h3 { margin:3px 0 4px; font-size:14px; }
.integration-card p { margin:0; color:#728285; font-size:10px; line-height:1.5; }
.integration-card > span { grid-column:1/-1; align-self:end; width:max-content; padding:4px 8px; border-radius:99px; color:#657477; background:#edf1f0; font-size:9px; font-weight:800; }
.integration-card.connected > span { color:#0f6e56; background:#def4ea; }
.toggle-row { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:18px; padding:13px; border:1px solid var(--line); border-radius:12px; cursor:pointer; }
.toggle-row strong,.toggle-row small { display:block; }
.toggle-row strong { font-size:12px; }
.toggle-row small { margin-top:3px; color:#829093; font-size:9px; }
.toggle-row input { position:absolute; opacity:0; pointer-events:none; }
.toggle-row i { position:relative; width:42px; height:24px; flex:0 0 42px; border-radius:99px; background:#cbd4d2; transition:.2s; }
.toggle-row i::after { content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:.2s; box-shadow:0 1px 4px rgba(0,0,0,.2); }
.toggle-row input:checked + i { background:var(--teal); }
.toggle-row input:checked + i::after { transform:translateX(18px); }
.owner-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:15px; }
.owner-actions a,.owner-actions button { padding:9px 11px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:#fff; text-decoration:none; font-size:10px; font-weight:750; cursor:pointer; }
.pickup-policy-settings { margin-bottom:15px; }
.pickup-policy-settings .panel-head small { display:block; max-width:720px; margin-top:5px; color:#76878a; font-size:9px; line-height:1.5; }
.pickup-policy-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.pickup-policy-card { min-width:0; cursor:pointer; }
.pickup-policy-card > input { position:absolute; opacity:0; pointer-events:none; }
.pickup-policy-card > span { position:relative; min-height:142px; display:grid; align-content:start; padding:14px; border:1px solid var(--line); border-radius:14px; background:#fbfcfb; transition:.18s; }
.pickup-policy-card > input:checked + span { border-color:var(--teal); background:#f0faf8; box-shadow:inset 0 0 0 1px var(--teal); }
.pickup-policy-card i { width:31px; height:31px; display:grid; place-items:center; margin-bottom:10px; border-radius:10px; color:#0d6871; background:#e2f3ef; font-style:normal; font-weight:900; }
.pickup-policy-card strong,.pickup-policy-card small,.pickup-policy-card em { display:block; }
.pickup-policy-card strong { font-size:12px; }
.pickup-policy-card small { margin-top:5px; color:#748588; font-size:9px; line-height:1.45; }
.pickup-policy-card em { align-self:end; width:max-content; margin-top:10px; padding:4px 7px; border-radius:99px; color:#52696c; background:#e9efed; font-size:8px; font-style:normal; font-weight:800; }
.pickup-policy-card > input:checked + span em { color:#0f6e56; background:#d9f0e7; }
.pickup-fallback-toggle { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:10px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:#fbfcfb; cursor:pointer; }
.pickup-fallback-toggle strong,.pickup-fallback-toggle small { display:block; }
.pickup-fallback-toggle strong { font-size:10px; }
.pickup-fallback-toggle small { margin-top:3px; color:#829093; font-size:8px; }
.pickup-fallback-toggle input { position:absolute; opacity:0; pointer-events:none; }
.pickup-fallback-toggle > i { position:relative; width:42px; height:24px; flex:0 0 42px; border-radius:99px; background:#cbd4d2; transition:.2s; }
.pickup-fallback-toggle > i::after { content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:.2s; box-shadow:0 1px 4px rgba(0,0,0,.2); }
.pickup-fallback-toggle input:checked + i { background:var(--teal); }
.pickup-fallback-toggle input:checked + i::after { transform:translateX(18px); }
.pickup-fallback-toggle.disabled { opacity:.5; cursor:not-allowed; }
.service-policy-settings { margin-bottom:15px; }
.service-policy-settings .panel-head small { display:block; max-width:700px; margin-top:5px; color:#76878a; font-size:9px; line-height:1.5; }
.service-policy-core { margin-bottom:13px; padding:12px 14px; border:1px solid #cce4db; border-radius:12px; background:#f2faf7; }
.service-policy-core strong { display:block; color:#205c50; font-size:10px; }
.service-policy-core p { margin:4px 0 0; color:#607673; font-size:8px; line-height:1.55; }
.service-policy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.service-policy-card { min-width:0; padding:13px; border:1px solid var(--line); border-radius:13px; background:#fbfcfb; }
.policy-switch { display:flex; align-items:center; gap:8px; color:#243d40; font-size:11px; font-weight:800; cursor:pointer; }
.policy-switch input { position:absolute; opacity:0; pointer-events:none; }
.policy-switch i { position:relative; width:34px; height:20px; flex:0 0 34px; border-radius:99px; background:#cbd5d2; transition:.2s; }
.policy-switch i::after { content:""; position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:#fff; transition:.2s; box-shadow:0 1px 4px rgba(0,0,0,.18); }
.policy-switch input:checked + i { background:var(--teal); }
.policy-switch input:checked + i::after { transform:translateX(14px); }
.service-policy-card > div { margin:8px 0 0 42px; }
.service-policy-card small { display:block; min-height:28px; color:#748588; font-size:8px; line-height:1.45; }
.service-policy-card > div label { display:flex; align-items:center; gap:6px; margin-top:8px; color:#617477; font-size:8px; font-weight:750; }
.service-policy-card > div input { min-width:0; width:86px; padding:7px 8px; border:1px solid #d5dfdd; border-radius:8px; color:var(--ink); background:#fff; font-size:9px; }
.service-policy-card > div input[name="loyaltyProgramName"] { width:min(180px,100%); }
.service-policy-card:has(.policy-switch input:not(:checked)) > div { opacity:.5; }
.service-policy-card:has(.policy-switch input:not(:checked)) > div input { pointer-events:none; }
.service-policy-note { margin-top:11px; }
.service-policy-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:11px; padding-top:12px; border-top:1px solid var(--line); }
.service-policy-footer p { margin:0; color:#748588; font-size:8px; }
.danger-lite { border-color:#eadede; background:#fffbfb; }
.campaign-modal[hidden] { display:none; }
.campaign-modal { position:fixed; inset:0; z-index:80; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(4,20,22,.72); backdrop-filter:blur(6px); }
.campaign-builder { width:min(900px,100%); max-height:92vh; overflow:hidden; border-radius:20px; background:#fff; box-shadow:0 30px 100px rgba(0,0,0,.35); }
.campaign-builder > header { display:flex; align-items:flex-start; justify-content:space-between; padding:18px 22px 15px; border-bottom:1px solid var(--line); }
.campaign-builder header h2 { margin:0; font-size:19px; }
.campaign-builder header button { width:34px; height:34px; border:0; border-radius:50%; background:#edf1f0; font-size:23px; cursor:pointer; }
.builder-scroll { max-height:calc(92vh - 132px); overflow-y:auto; padding:20px 22px; }
.campaign-builder fieldset { margin:0 0 20px; padding:0; border:0; }
.campaign-builder legend { margin-bottom:10px; font-size:12px; font-weight:800; }
.choice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.choice-grid label { cursor:pointer; }
.choice-grid input { position:absolute; opacity:0; }
.choice-grid label > span { min-height:78px; display:block; padding:13px; border:1px solid var(--line); border-radius:12px; }
.choice-grid input:checked + span { border-color:var(--teal); background:#f0faf8; box-shadow:inset 0 0 0 1px var(--teal); }
.choice-grid strong,.choice-grid small { display:block; }
.choice-grid strong { font-size:11px; }
.choice-grid small { margin-top:4px; color:#7b8b8d; font-size:9px; line-height:1.4; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.form-field { display:grid; gap:5px; color:#536669; font-size:9px; font-weight:750; }
.form-field.full { grid-column:1/-1; }
.form-field input,.form-field select,.form-field textarea { width:100%; border:1px solid #d7e0de; border-radius:9px; padding:10px 11px; outline:0; color:var(--ink); background:#fff; font-size:11px; font-weight:500; }
.form-field textarea { min-height:72px; resize:vertical; }
.form-field input:focus,.form-field select:focus,.form-field textarea:focus { border-color:var(--teal); box-shadow:0 0 0 3px rgba(22,125,137,.1); }
.privacy-note { margin:9px 0 0; padding:9px 11px; border-radius:9px; color:#607678; background:#edf5f3; font-size:9px; }
.visual-creative { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.72fr); gap:11px 16px; align-items:center; margin:14px 0 18px; padding:14px; border:1px solid #dbe7e4; border-radius:14px; background:#f8fbfa; }
.visual-creative > div:first-child strong,.visual-creative > div:first-child small { display:block; }
.visual-creative > div:first-child strong { color:#203b3e; font-size:12px; }
.visual-creative > div:first-child strong span { color:#859497; font-size:9px; font-weight:650; }
.visual-creative > div:first-child small { max-width:480px; margin-top:4px; color:#708285; font-size:9px; line-height:1.5; }
.visual-upload { grid-column:2; grid-row:1; display:grid; grid-template-columns:30px 1fr; gap:1px 9px; align-items:center; min-height:62px; padding:10px 12px; border:1px dashed #9fc3bb; border-radius:11px; color:#285451; background:#fff; cursor:pointer; }
.visual-upload > span { grid-row:1/3; display:grid; width:30px; height:30px; place-items:center; border-radius:9px; color:#fff; background:#167d70; font-size:16px; }
.visual-upload strong { font-size:10px; }
.visual-upload small { color:#829193; font-size:8px; }
.visual-upload[aria-busy="true"] { opacity:.55; pointer-events:none; }
.visual-selection { grid-column:1/-1; display:grid; grid-template-columns:92px minmax(0,1fr); gap:12px; align-items:center; padding:9px; border:1px solid #cde0dc; border-radius:11px; background:#fff; }
.visual-selection img { width:92px; height:56px; object-fit:cover; border-radius:9px; background:#edf2f0; }
.visual-selection strong,.visual-selection small { display:block; }
.visual-selection strong { font-size:10px; }
.visual-selection small { margin-top:3px; color:#76878a; font-size:8px; line-height:1.45; }
.visual-selection button { margin-top:7px; padding:0; border:0; color:#8d3333; background:transparent; font-size:9px; font-weight:750; cursor:pointer; }
#visual-alt-field { grid-column:1/-1; }
.visual-error { grid-column:1/-1; margin:0; color:#9a3737; font-size:9px; font-weight:700; }
.campaign-preview { padding:15px; border-radius:14px; background:#f2f5f3; }
.mini-offer { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid #d8e5e1; border-radius:12px; background:#fff; }
.mini-offer > span { width:30px; height:30px; display:grid; place-items:center; border-radius:9px; color:#0f6e56; background:#e1f5ee; }
.mini-offer > img { width:54px; height:36px; flex:0 0 54px; object-fit:cover; border-radius:9px; background:#edf2f0; }
.mini-offer div { min-width:0; flex:1; }
.mini-offer strong,.mini-offer small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mini-offer strong { font-size:11px; }
.mini-offer small { margin-top:3px; color:#7a898c; font-size:9px; }
.mini-offer em { color:var(--teal); font-size:9px; font-style:normal; font-weight:800; }
.campaign-builder footer { display:flex; align-items:center; justify-content:flex-end; gap:9px; padding:13px 22px; border-top:1px solid var(--line); background:#fbfcfb; }
.campaign-builder footer p { margin-right:auto; color:var(--red); font-size:10px; }
.login-shell { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; background:#071b1d; }
.login-story { display:flex; flex-direction:column; justify-content:space-between; padding:42px; color:#e9f3f2; }
.login-story h1 { max-width:560px; margin:0; font-size:52px; line-height:1; letter-spacing:-.055em; }
.login-story p { max-width:520px; color:#91adae; line-height:1.6; }
.login-points { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.login-points div { padding:14px; border:1px solid #234245; border-radius:13px; color:#aac0c1; font-size:10px; }
.login-card-wrap { display:grid; place-items:center; padding:28px; border-radius:28px 0 0 28px; background:#f3f6f4; }
.login-card { width:min(410px,100%); padding:28px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 18px 60px rgba(0,0,0,.1); }
.login-card h2 { margin:0; font-size:24px; }
.login-card > p { color:#6d7e80; font-size:11px; line-height:1.55; }
.provider-button { width:100%; display:flex; align-items:center; justify-content:center; gap:10px; margin-top:9px; padding:12px; border:1px solid #d6dedc; border-radius:10px; color:#122628; background:#fff; text-decoration:none; font-size:12px; font-weight:750; }
.provider-button.disabled { opacity:.5; pointer-events:none; }
.provider-button span { width:20px; font-size:15px; }
.login-divider { display:flex; align-items:center; gap:9px; margin:17px 0; color:#9aa6a7; font-size:9px; }
.login-divider::before,.login-divider::after { content:""; flex:1; height:1px; background:var(--line); }
.demo-entry { padding:12px; border-radius:11px; color:#6e5a20; background:#fff6d9; font-size:10px; line-height:1.45; }
.demo-entry a { display:inline-block; margin-top:7px; color:#4b3d14; font-weight:800; }
@media (max-width:1050px) { .metric-grid { grid-template-columns:repeat(2,1fr); } .integration-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:780px) {
  .merchant-sidebar { transform:translateX(-100%); transition:.2s; }
  .merchant-sidebar.open { transform:translateX(0); box-shadow:18px 0 60px rgba(0,0,0,.25); }
  .merchant-main { margin-left:0; padding:0 16px 34px; }
  .merchant-header { height:78px; }
  .mobile-menu { display:block; }
  .merchant-header h1 { font-size:20px; }
  .console-grid,.console-grid.wide-left { grid-template-columns:1fr; }
  .integration-grid { grid-template-columns:1fr; }
  .campaign-row-metrics { grid-template-columns:repeat(3,1fr); }
  .login-shell { grid-template-columns:1fr; }
  .login-story { min-height:42vh; padding:28px 22px; }
  .login-story h1 { font-size:38px; }
  .login-points { display:none; }
  .login-card-wrap { border-radius:24px 24px 0 0; }
}
@media (max-width:520px) {
  .merchant-main { padding-inline:12px; }
  .merchant-header .primary-action { padding:10px 11px; }
  .metric-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .metric-card { min-height:104px; padding:13px; }
  .metric-card strong { margin-top:14px; font-size:22px; }
  .section-toolbar { align-items:flex-start; flex-direction:column; }
  .filter-pills { max-width:100%; overflow-x:auto; }
  .review-gate-note { grid-template-columns:1fr; }
  .review-gate-note > i { display:none; }
  .campaign-review-status { align-items:flex-start; flex-direction:column; }
  .campaign-review-status > p { text-align:left; }
  .campaign-row-metrics { grid-template-columns:repeat(2,1fr); }
  .action-item { grid-template-columns:auto minmax(0,1fr); align-items:start; }
  .action-item-control { grid-column:2; }
  .action-item-control a,.action-item-control button { min-width:0; }
  .action-item.compact .action-item-copy p { white-space:normal; }
  .visual-creative { grid-template-columns:1fr; }
  .visual-upload { grid-column:1; grid-row:auto; }
  .approval-card { grid-template-columns:1fr; }
  .ledger-row { grid-template-columns:1fr 1fr; }
  .choice-grid,.form-grid,.pickup-policy-grid { grid-template-columns:1fr; }
  .form-field.full { grid-column:auto; }
  .campaign-modal { padding:0; align-items:flex-end; }
  .campaign-builder { max-height:96vh; border-radius:20px 20px 0 0; }
  .builder-scroll { max-height:calc(96vh - 132px); padding:16px; }
  .merchant-customer-cases-panel .panel-head { align-items:flex-start; flex-direction:column; }
  .merchant-case-row { grid-template-columns:auto minmax(0,1fr); align-items:start; }
  .merchant-case-side { grid-column:2; justify-items:start; }
  .merchant-case-summary-card { grid-template-columns:1fr; }
  .merchant-case-facts { grid-template-columns:1fr 1fr; }
  .merchant-case-event { grid-template-columns:30px minmax(0,1fr); }
  .merchant-case-event time { grid-column:2; }
  .service-policy-grid { grid-template-columns:1fr; }
  .service-policy-settings .panel-head,.service-policy-footer { align-items:flex-start; flex-direction:column; }
}

/* Simplified "Create offer" builder */
.builder-lead { color: #55636a; font-size: 14px; line-height: 1.5; margin: 0 0 16px; }
.reach-choice { border: none; margin: 6px 0 0; padding: 0; }
.reach-choice legend { font-size: 13px; font-weight: 600; color: #0a0f14; padding: 0; margin-bottom: 8px; }
.reach-presets { display: flex; gap: 8px; }
.reach-presets button { flex: 1; padding: 12px; border: 1px solid rgba(10, 15, 20, 0.15); border-radius: 12px; background: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
.reach-presets button.active { background: #0a0f14; color: #fff; border-color: #0a0f14; }
.receipt-rule-builder { margin-top:16px; padding:16px; border:1px solid #dce7e4; border-radius:15px; background:#f8fbfa; }
.rule-heading { display:flex; align-items:center; gap:10px; margin-bottom:13px; }
.rule-heading > span { width:28px; height:28px; display:grid; place-items:center; flex:0 0 auto; border-radius:9px; color:#fff; background:#126f69; font-size:11px; font-weight:850; }
.rule-heading strong,.rule-heading small { display:block; }
.rule-heading strong { font-size:12px; }
.rule-heading small { margin-top:2px; color:#77898b; font-size:9px; line-height:1.4; }
.rule-summary { margin:12px 0 0; padding:10px 11px; border-radius:10px; color:#285451; background:#e8f5f1; font-size:10px; font-weight:750; line-height:1.5; }
.inline-check { display:flex; align-items:center; gap:8px; min-height:42px; color:#455b5d; font-size:10px; }
.inline-check input { width:auto; }
.advanced-options { margin-top: 18px; border-top: 1px solid rgba(10, 15, 20, 0.1); padding-top: 6px; }
.advanced-options > summary { cursor: pointer; font-size: 14px; font-weight: 600; color: #167d89; padding: 8px 0; list-style: none; }
.advanced-options > summary::-webkit-details-marker { display: none; }
.advanced-options > summary::before { content: "▸ "; }
.advanced-options[open] > summary::before { content: "▾ "; }
.advanced-options fieldset { border: none; padding: 8px 0 0; margin: 0; }
.advanced-options legend { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; color: #55636a; text-transform: uppercase; padding: 0; }
.inline-radio { display: block; padding: 6px 0; font-size: 14px; color: #0a0f14; }

/* Business category signup + competitor premium */
.category-modal { position: fixed; inset: 0; z-index: 80; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(10, 15, 20, 0.6); backdrop-filter: blur(6px); }
.category-card { background: #fff; border-radius: 24px; padding: 28px 24px; max-width: 440px; width: 100%; }
.category-card > p:first-child { font-size: 11px; font-weight: 700; letter-spacing: 0.1em; color: #167d89; margin: 0 0 4px; }
.category-card h2 { margin: 0 0 8px; font-size: 22px; }
.category-sub { color: #55636a; font-size: 14px; line-height: 1.5; margin: 0 0 18px; }
.category-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 18px; }
.category-grid button { padding: 12px; border: 1px solid rgba(10, 15, 20, 0.15); border-radius: 12px; background: #fff; font-size: 14px; font-weight: 600; cursor: pointer; text-align: left; }
.category-grid button.active { background: #0a0f14; color: #fff; border-color: #0a0f14; }
#category-save { width: 100%; }
.competitor-note { margin: 10px 0 0; padding: 9px 11px; border-radius: 10px; background: #fff1e6; border: 1px solid #f2c79a; color: #8a4b12; font-size: 12px; font-weight: 600; }

/* Coffee-shop vertical */
.secondary-action { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; cursor:pointer; }
.toolbar-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.operations-panel { overflow:hidden; }
.order-snapshot { display:grid; gap:8px; }
.order-snapshot-row { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; padding:11px 12px; border:1px solid var(--line); border-radius:12px; }
.order-snapshot-row .order-number { min-width:54px; padding:7px 9px; border-radius:9px; color:#0d5962; background:#e5f4f1; font-size:10px; font-weight:850; letter-spacing:.08em; text-align:center; }
.order-snapshot-row strong,.order-snapshot-row small { display:block; }
.order-snapshot-row strong { font-size:12px; }
.order-snapshot-row small { margin-top:2px; color:#839194; font-size:9px; }
.growth-panel { color:#e9f4f2; border-color:#173f42; background:linear-gradient(145deg,#0a292c,#123d40); }
.growth-panel > p { color:#81aaa8; }
.growth-panel h2 { max-width:360px; margin:7px 0 14px; font-size:22px; line-height:1.15; }
.growth-panel > small { display:block; margin-top:12px; color:#799b9a; font-size:9px; line-height:1.45; }
.growth-suggestions { display:grid; gap:7px; }
.growth-suggestions button { width:100%; display:grid; grid-template-columns:1fr auto; gap:2px 10px; padding:10px 11px; border:1px solid #285052; border-radius:11px; color:#fff; background:rgba(255,255,255,.04); text-align:left; cursor:pointer; }
.growth-suggestions button:hover { border-color:#5d8886; background:rgba(255,255,255,.08); }
.growth-suggestions strong { font-size:10px; }
.growth-suggestions span { grid-column:1; color:#94b1b0; font-size:9px; line-height:1.4; }
.growth-suggestions em { grid-column:2; grid-row:1/3; align-self:center; color:var(--lime); font-size:16px; font-style:normal; }
.empty-state.compact { padding:18px 14px; }
.order-list { display:grid; gap:10px; }
.order-card { display:grid; grid-template-columns:auto minmax(150px,1fr) auto auto; align-items:center; gap:16px; padding:16px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.order-card-number { min-width:78px; padding:10px; border-radius:11px; color:#0f5f67; background:#e4f4f1; text-align:center; }
.order-card-number small,.order-card-number strong { display:block; }
.order-card-number small { font-size:8px; letter-spacing:.13em; }
.order-card-number strong { margin-top:4px; font-size:14px; }
.order-card h3 { margin:0; font-size:14px; }
.order-card p { margin:4px 0 0; color:#7a898c; font-size:10px; }
.order-empty { display:grid; justify-items:center; gap:7px; }
.order-empty strong { color:var(--ink); font-size:15px; }
.order-empty span { margin-bottom:7px; }
.menu-layout { display:grid; grid-template-columns:190px minmax(0,1fr); gap:15px; align-items:start; }
.menu-category-nav { position:sticky; top:18px; display:grid; gap:4px; padding:15px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.menu-category-nav > p { margin:0 0 7px; color:#7c8d8f; font-size:9px; font-weight:800; letter-spacing:.13em; }
.menu-category-nav a { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 10px; border-radius:9px; color:#41585b; text-decoration:none; font-size:10px; font-weight:700; }
.menu-category-nav a:hover { color:#0d5962; background:#eaf5f2; }
.menu-category-nav small { min-width:20px; padding:2px 6px; border-radius:99px; color:#718386; background:#edf2f0; text-align:center; font-size:8px; }
.menu-manager { display:grid; gap:14px; }
.menu-category-section { scroll-margin-top:18px; padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.menu-category-head { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; margin-bottom:13px; }
.menu-category-head h3 { margin:0; font-size:16px; }
.menu-category-head p { margin:4px 0 0; color:#79898b; font-size:10px; }
.menu-category-head > span { padding:5px 8px; border-radius:99px; color:#54676a; background:#edf2f0; font-size:9px; font-weight:750; }
.menu-item-list { display:grid; gap:8px; }
.menu-admin-item { display:grid; grid-template-columns:auto minmax(180px,1fr) auto auto auto; align-items:center; gap:12px; padding:12px; border:1px solid #e4eae8; border-radius:13px; transition:.18s; }
.menu-admin-item:hover { border-color:#bfd3cf; box-shadow:0 7px 22px rgba(25,67,64,.06); }
.menu-admin-item.sold-out { background:#f7f8f7; opacity:.72; }
.menu-admin-visual { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:#0d5962; background:linear-gradient(145deg,#e9f6f2,#d5eee7); font-size:19px; }
.menu-admin-copy { min-width:0; }
.menu-admin-copy > div { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.menu-admin-copy h4 { margin:0; font-size:12px; }
.menu-admin-copy p { max-width:560px; margin:3px 0; overflow:hidden; color:#748487; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.menu-admin-copy small { color:#889598; font-size:8px; }
.featured-pill { padding:3px 6px; border-radius:99px; color:#76580e; background:#fff2c9; font-size:8px; font-weight:800; }
.menu-admin-item > strong { font-size:12px; }
.menu-admin-actions { display:flex; gap:5px; }
.menu-admin-actions button { padding:6px 8px; border:1px solid var(--line); border-radius:8px; color:#455a5d; background:#fff; font-size:9px; cursor:pointer; }
.menu-admin-actions button:hover { border-color:#9cbcb6; }
.menu-item-builder { width:min(760px,100%); }
.compact-builder { width:min(520px,100%); }
.form-field small { color:#899698; font-size:8px; font-weight:500; }
.menu-checks { display:flex; flex-wrap:wrap; gap:9px 16px; margin-top:18px !important; padding:14px !important; border:1px solid var(--line) !important; border-radius:12px; }
.menu-checks legend { padding:0 5px; }
.menu-checks label { display:flex; align-items:center; gap:6px; color:#526568; font-size:10px; }
.storefront-settings { margin-bottom:15px; }
.storefront-settings form { max-width:760px; }
.ad-breakdown { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.ad-breakdown > div { padding:13px; border:1px solid var(--line); border-radius:12px; background:#fbfcfb; }
.ad-breakdown span,.ad-breakdown strong,.ad-breakdown small { display:block; }
.ad-breakdown span { color:#6f8183; font-size:9px; font-weight:750; text-transform:uppercase; letter-spacing:.05em; }
.ad-breakdown strong { margin-top:8px; font-size:20px; }
.ad-breakdown small { margin-top:4px; color:#899698; font-size:8px; line-height:1.4; }
.future-panel { position:relative; overflow:hidden; background:linear-gradient(150deg,#fbfdfc,#edf6f3); }
.future-panel::after { content:"Tapyme"; position:absolute; right:-12px; bottom:-30px; color:rgba(22,125,137,.06); font-size:100px; font-weight:900; }
.future-badge { display:inline-flex; margin-bottom:12px; padding:4px 7px; border-radius:99px; color:#0f6e56; background:#def4ea; font-size:8px; font-weight:850; letter-spacing:.08em; }
.future-signals { position:relative; z-index:1; display:grid; grid-template-columns:repeat(2,1fr); gap:7px; margin-top:14px; }
.future-signals span { padding:9px; border:1px dashed #bcd5d0; border-radius:9px; color:#587174; background:rgba(255,255,255,.7); font-size:9px; }
.hardware-logo { color:#0d5962; background:#ddf0eb; }
.review-pill { padding:3px 6px; border-radius:99px; color:#8a5516; background:#fff0da; font-size:8px; font-weight:800; }
.pos-pill { padding:3px 6px; border-radius:99px; color:#0f625b; background:#dff4ed; font-size:8px; font-weight:800; }
.pos-sync-status { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 10px; padding:14px; border:1px solid #b9dbd3; border-radius:13px; background:linear-gradient(135deg,#eef9f5,#f9fcfb); }
.pos-sync-status > div { display:flex; align-items:center; gap:10px; }
.pos-sync-status i { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#fff; background:#126f69; font-size:15px; font-style:normal; }
.pos-sync-status strong,.pos-sync-status small { display:block; }
.pos-sync-status strong { font-size:11px; }
.pos-sync-status small { margin-top:3px; color:#708486; font-size:8px; }
.pos-sync-status a,.pos-sync-status button { padding:7px 10px; border:1px solid #afd2ca; border-radius:9px; color:#0c625d; background:#fff; font-size:9px; font-weight:800; text-decoration:none; cursor:pointer; }
.form-field input:disabled { color:#526568; background:#eef2f1; cursor:not-allowed; }
.menu-admin-actions button:disabled { opacity:.45; cursor:not-allowed; }
.import-action { color:#0d5962; border-color:#b9d6d0; background:#edf7f4; }
.import-status-bar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 15px; padding:12px 14px; border:1px solid #cde0dc; border-radius:13px; background:#f7fbfa; }
.import-status-bar > div { display:flex; align-items:center; gap:10px; min-width:0; }
.import-status-icon { width:32px; height:32px; display:grid; place-items:center; flex:0 0 32px; border-radius:9px; color:#0d5962; background:#dff1ec; font-weight:900; }
.import-status-bar strong,.import-status-bar small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.import-status-bar strong { font-size:11px; }
.import-status-bar small { margin-top:3px; color:#7d8d8f; font-size:8px; }
.import-builder { width:min(920px,100%); }
.import-intro { display:flex; align-items:flex-start; gap:11px; }
.import-intro > span { width:28px; height:28px; display:grid; place-items:center; flex:0 0 28px; border-radius:9px; color:#fff; background:var(--teal); font-size:10px; font-weight:850; }
.import-intro strong { display:block; font-size:12px; }
.import-intro p { margin:4px 0 0; color:#728285; font-size:10px; line-height:1.5; }
.import-url-form { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:9px; margin:16px 0; padding:14px; border:1px solid var(--line); border-radius:13px; background:#f8faf9; }
.import-url-form button { min-height:36px; }
.import-loading { display:flex; align-items:center; gap:9px; margin:10px 0; padding:12px; border-radius:10px; color:#53686a; background:#edf5f3; font-size:10px; }
.import-loading i { width:16px; height:16px; border:2px solid #bdd7d1; border-top-color:var(--teal); border-radius:50%; animation:import-spin .8s linear infinite; }
@keyframes import-spin { to { transform:rotate(360deg); } }
.import-error { margin:10px 0; padding:11px; border:1px solid #efc7c7; border-radius:10px; color:#8b3333; background:#fff1f1; font-size:10px; }
.import-review { display:grid; gap:13px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
.import-source { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:12px; border:1px solid var(--line); border-radius:12px; }
.import-source div { min-width:0; }
.import-source small,.import-source strong,.import-source a { display:block; }
.import-source small { color:#869497; font-size:8px; font-weight:800; letter-spacing:.08em; }
.import-source strong { margin-top:3px; font-size:12px; }
.import-source a { max-width:620px; margin-top:3px; overflow:hidden; color:var(--teal); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.import-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.import-metrics > div { padding:12px; border:1px solid var(--line); border-radius:11px; background:#fbfcfb; }
.import-metrics span,.import-metrics strong,.import-metrics small { display:block; }
.import-metrics span { color:#78898b; font-size:8px; font-weight:750; text-transform:uppercase; }
.import-metrics strong { margin-top:6px; font-size:19px; }
.import-metrics small { margin-top:3px; color:#8b9799; font-size:7px; line-height:1.35; }
.import-category-summary { display:flex; flex-wrap:wrap; gap:6px; }
.import-category-summary span { padding:6px 8px; border-radius:8px; color:#4f6567; background:#edf3f1; font-size:8px; }
.import-category-summary strong { margin-left:4px; }
.import-item-preview { max-height:300px; display:grid; gap:6px; overflow-y:auto; padding-right:5px; }
.import-item-preview > div { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:9px; padding:9px 10px; border:1px solid var(--line); border-radius:10px; }
.import-item-visual { width:29px; height:29px; display:grid; place-items:center; border-radius:8px; color:#0d5962; background:#e5f4f1; }
.import-item-preview strong,.import-item-preview small { display:block; }
.import-item-preview strong { font-size:9px; }
.import-item-preview small { margin-top:2px; color:#849294; font-size:7px; }
.import-item-preview em { color:#0f6e56; font-size:8px; font-style:normal; font-weight:800; }
.import-item-preview em.missing { color:#8a5516; }
.import-safety { padding:11px 12px; border:1px solid #ecdba6; border-radius:11px; color:#665623; background:#fff9e9; }
.import-safety strong { font-size:9px; }
.import-safety p { margin:3px 0 0; font-size:8px; line-height:1.5; }
.appointment-slot-preview { margin-top:18px; padding:16px; background:#f0fffe; border:1px solid #d4ebe9; border-radius:12px; }
.appointment-slot-preview .preview-section { margin-bottom:16px; }
.appointment-slot-preview .preview-section:last-child { margin-bottom:0; }
.appointment-slot-preview strong { display:block; font-size:11px; font-weight:800; letter-spacing:.08em; color:#789093; margin-bottom:9px; }
.slot-list { display:grid; gap:8px; }
.slot-item { padding:9px 11px; background:#fff; border:1px solid var(--line); border-radius:8px; font-size:12px; color:var(--ink); }
.slot-item strong { display:block; font-size:11px; font-weight:700; color:var(--teal); margin-bottom:2px; }
.slot-item small { display:block; color:#789093; font-size:10px; }
.slot-empty { padding:9px 11px; color:#999; font-size:12px; font-style:italic; }

@media (max-width:980px) {
  .menu-layout { grid-template-columns:1fr; }
  .menu-category-nav { position:static; display:flex; overflow-x:auto; }
  .menu-category-nav > p { display:none; }
  .menu-category-nav a { flex:0 0 auto; border:1px solid var(--line); }
  .menu-admin-item { grid-template-columns:auto minmax(150px,1fr) auto; }
  .menu-admin-item > .state-pill,.menu-admin-actions { grid-column:2/4; }
}
@media (max-width:620px) {
  .toolbar-actions { width:100%; justify-content:flex-start; }
  .order-card { grid-template-columns:auto 1fr; gap:10px; }
  .order-card > .state-pill,.order-card > .primary-action,.order-card > .secondary-action { grid-column:2; width:max-content; }
  .menu-admin-item { grid-template-columns:auto 1fr; align-items:start; }
  .menu-admin-item > strong,.menu-admin-item > .state-pill,.menu-admin-actions { grid-column:2; }
  .menu-admin-actions { flex-wrap:wrap; }
  .ad-breakdown { grid-template-columns:1fr; }
  .import-url-form { grid-template-columns:1fr; }
  .import-metrics { grid-template-columns:1fr 1fr; }
  .import-status-bar { align-items:flex-start; flex-direction:column; }
  .pos-sync-status { align-items:flex-start; flex-direction:column; }
}

/* Booked return/exchange visit banner (merchant) */
.merchant-case-appointment { width: 100%; box-sizing: border-box; display: flex; flex-direction: column; gap: 3px; background: #eef7f7; border: 1px solid #bfe0e2; border-left: 4px solid #167d89; border-radius: 12px; padding: 12px 14px; margin: 6px 0; }
.merchant-case-appointment span { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #12707a; }
.merchant-case-appointment strong { font-size: 16px; color: #0a0f14; }
.merchant-case-appointment small { font-size: 12px; color: #4d5a5f; line-height: 1.5; }

/* ===== Return/exchange availability scheduler (visual calendar) ===== */
.sched-card .sched-body { display: grid; gap: 14px; }
.sched-intro { color: #5b6770; font-size: 12.5px; line-height: 1.5; }
.sched-window { display: block; font-size: 13px; color: #26313a; }
.sched-window input { width: 60px; margin: 0 4px; padding: 6px 8px; border: 1px solid rgba(10, 15, 20, 0.18); border-radius: 8px; font-size: 13px; }
.sched-field { display: grid; gap: 8px; }
.sched-label { font-size: 12px; font-weight: 700; color: #33414a; }
.day-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.day-pill { position: relative; margin: 0; }
.day-pill input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.day-pill span { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; min-height: 40px; padding: 0 10px; border: 1px solid rgba(10, 15, 20, 0.18); border-radius: 10px; background: #fff; color: #33414a; font-size: 13px; font-weight: 600; cursor: pointer; transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease; }
.day-pill input:checked + span { background: #12808c; border-color: #12808c; color: #fff; }
.day-pill input:focus-visible + span { outline: 2px solid #12808c; outline-offset: 2px; }
.hour-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.hour-preset { min-height: 38px; padding: 0 14px; border: 1px solid rgba(10, 15, 20, 0.18); border-radius: 999px; background: #fff; color: #33414a; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.hour-preset:hover { border-color: #12808c; color: #0c5a63; }
.hour-preset.active { background: #e6f4f4; border-color: #12808c; color: #0c5a63; }
.hour-range { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hour-range select, .slot-select { min-height: 42px; padding: 0 12px; border: 1px solid rgba(10, 15, 20, 0.18); border-radius: 10px; background: #fff; font-size: 13px; color: #26313a; }
.hour-dash { color: #7a858c; font-size: 12px; }

/* Live booking-calendar preview (mirrors what customers see) */
.appointment-slot-preview { margin-top: 16px; padding: 16px; border: 1px solid rgba(18, 128, 140, 0.25); border-radius: 16px; background: #f4fbfb; }
.preview-lead { margin: 0 0 4px; font-size: 12.5px; font-weight: 600; color: #0c5a63; }
.preview-section { margin-top: 14px; }
.preview-section > strong { display: block; font-size: 12px; color: #33414a; margin-bottom: 8px; }
.prev-cal { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.prev-day { flex: 0 0 auto; width: 134px; border: 1px solid rgba(10, 15, 20, 0.1); border-radius: 12px; background: #fff; padding: 10px; }
.prev-date { display: flex; align-items: baseline; gap: 5px; margin-bottom: 8px; }
.prev-date small { font-size: 11px; text-transform: uppercase; color: #8b9498; }
.prev-date strong { font-size: 17px; color: #0a0f14; }
.prev-date span { font-size: 11px; color: #8b9498; }
.prev-times { display: flex; flex-wrap: wrap; gap: 4px; }
.prev-time { padding: 3px 7px; border-radius: 7px; background: #eef4f4; color: #26313a; font-size: 11px; font-weight: 600; }
.prev-more { padding: 3px 7px; font-size: 11px; color: #7a858c; }
.slot-empty { padding: 12px; border-radius: 10px; background: #fff; color: #7a858c; font-size: 12.5px; }

/* ===== Accessibility polish (from audit) ===== */
.merchant-nav button:focus-visible,
.text-action:focus-visible,
.light-action:focus-visible,
.case-filter-pills button:focus-visible,
.primary-action:focus-visible { outline: 2px solid #12808c; outline-offset: 2px; border-radius: 10px; }
.case-filter-pills button { min-height: 38px; padding: 8px 14px; }

/* Connect-any-POS key panel */
.air-tag-panel { margin-bottom:18px; overflow:hidden; background:linear-gradient(135deg,#ffffff,#f3fbf8); }
.air-tag-panel .panel-head small { display:block; max-width:740px; margin-top:5px; color:#76878a; font-size:9px; line-height:1.5; }
.air-tag-layout { display:grid; grid-template-columns:minmax(0,1fr) 210px; gap:18px; align-items:stretch; }
.air-tag-copy { display:grid; gap:14px; align-content:start; min-width:0; }
.air-tag-tier { padding:14px; border:1px solid #c9e1da; border-radius:14px; background:#fff; }
.air-tag-tier span { display:inline-flex; margin-bottom:7px; padding:4px 8px; border-radius:999px; color:#0f6e56; background:#def4ea; font-size:8px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.air-tag-tier strong,.air-tag-tier small { display:block; }
.air-tag-tier strong { font-size:14px; }
.air-tag-tier small { margin-top:4px; color:#728285; font-size:10px; line-height:1.45; }
.air-tag-field { display:block; color:#33414a; font-size:12px; font-weight:700; }
.air-tag-actions { display:flex; flex-wrap:wrap; gap:8px; }
.air-tag-qr-card { display:grid; justify-items:center; align-content:center; gap:10px; padding:14px; border:1px solid #d8e5e1; border-radius:16px; background:#fff; text-align:center; }
.air-tag-qr-card img { width:154px; height:154px; padding:8px; border:1px solid #e4ece9; border-radius:13px; background:#fff; object-fit:contain; }
.air-tag-qr-card small { color:#728285; font-size:9px; line-height:1.45; }
.air-tag-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-top:14px; }
.air-tag-steps > div { display:grid; grid-template-columns:28px minmax(0,1fr); gap:2px 9px; padding:12px; border:1px solid #dbe8e4; border-radius:13px; background:#fff; }
.air-tag-steps span { grid-row:1/3; width:28px; height:28px; display:grid; place-items:center; border-radius:9px; color:#09282b; background:var(--lime); font-size:10px; font-weight:900; }
.air-tag-steps strong { font-size:10px; }
.air-tag-steps small { color:#78888a; font-size:8px; line-height:1.45; }
.pos-key-panel { margin-bottom: 18px; }
.pos-key-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 4px; }
.pos-key-grid > label { display: block; font-size: 12px; font-weight: 600; color: #33414a; }
.pos-key-copy { display: flex; gap: 6px; margin-top: 6px; }
.pos-key-copy input { flex: 1; min-width: 0; font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12.5px; padding: 10px 11px; border: 1px solid rgba(10,15,20,.15); border-radius: 10px; background: #f7f9f9; color: #0a0f14; }
.pos-key-copy button { flex: 0 0 auto; padding: 0 14px; border: 1px solid rgba(10,15,20,.15); border-radius: 10px; background: #fff; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.pos-key-copy button:disabled { opacity: .5; cursor: not-allowed; }
.pos-key-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 14px; }
.pos-key-note { font-size: 12px; color: #5f6b6f; line-height: 1.5; flex: 1; min-width: 200px; }
.pos-key-note code { background: #eef4f4; border-radius: 5px; padding: 1px 5px; font-size: 11.5px; }
@media (max-width: 760px) {
  .air-tag-layout,.air-tag-steps,.pos-key-grid { grid-template-columns:1fr; }
  .air-tag-qr-card { justify-items:start; text-align:left; }
}