:root {
    --notify-ink: #111820;
    --notify-muted: #5c6878;
    --notify-line: #d8dee8;
    --notify-soft: #f5f7fa;
    --notify-blue: #175fe7;
    --notify-blue-dark: #0d4fc9;
    --notify-teal: #0c9a91;
    --notify-red: #e31316;
    --notify-shadow: 0 18px 50px rgba(17, 24, 32, .12);
}

.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.notify-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; padding: 12px 22px; border: 1px solid transparent; border-radius: 7px; color: var(--notify-ink); background: #fff; font-family: inherit; font-size: 15px; font-weight: 700; line-height: 1.2; text-decoration: none; cursor: pointer; transition: transform .16s ease, background .16s ease, border-color .16s ease; }
.notify-button:hover { transform: translateY(-1px); }
.notify-button:focus-visible { outline: 3px solid rgba(23, 95, 231, .28); outline-offset: 2px; }
.notify-button--red { color: #fff; background: var(--notify-red); border-color: var(--notify-red); }
.notify-button--red:hover { background: #c90c10; border-color: #c90c10; }
.notify-button--blue { color: #fff; background: var(--notify-blue); border-color: var(--notify-blue); }
.notify-button--blue:hover { background: var(--notify-blue-dark); border-color: var(--notify-blue-dark); }
.notify-button--outline { color: var(--notify-ink); border-color: #9da8b6; background: #fff; }
.notify-button--outline:hover { border-color: var(--notify-ink); }
.notify-button[disabled] { opacity: .52; cursor: not-allowed; transform: none; }
.promo-strip--notify { background: #0f54c8; }

.notify-feature { padding: 82px 0; border-top: 1px solid var(--notify-line); border-bottom: 1px solid var(--notify-line); background: #fff; }
.notify-feature__grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(45px,7vw,100px); align-items: center; }
.notify-feature__name { margin: 0 0 16px; color: var(--notify-blue); font-size: 18px; font-weight: 850; letter-spacing: .01em; }.notify-feature__copy h2 { max-width: 590px; margin: 0 0 17px; color: var(--notify-ink); font-size: clamp(36px,3.7vw,55px); line-height: 1.03; letter-spacing: -.045em; }.notify-feature__copy > p:not(.notify-feature__name) { max-width: 600px; margin: 0; color: var(--notify-muted); font-size: 18px; line-height: 1.6; }.notify-feature__copy > div { display: flex; align-items: center; gap: 20px; margin: 27px 0 23px; }.notify-feature__copy > div > span { color: #6b7684; font-size: 13px; }.notify-feature__copy ul { display: flex; gap: 20px; flex-wrap: wrap; margin: 0; padding: 0; color: #4e5a68; list-style: none; font-size: 13px; }.notify-feature__copy li i { margin-right: 6px; color: var(--notify-teal); }
.notify-feature__demo { position: relative; min-height: 310px; padding: 42px; border-radius: 14px; background: #eef2f7; }.notify-feature__demo > div { display: grid; grid-template-columns: 55px 1fr auto; gap: 14px; align-items: start; margin-left: 80px; padding: 22px; border: 1px solid #c4ccd7; border-radius: 11px; background: #fff; box-shadow: var(--notify-shadow); }.notify-feature__demo > div section strong { display: block; margin: 2px 0 4px; font-size: 16px; }.notify-feature__demo > div section p { margin: 0 0 4px; color: #4d5867; font-size: 13px; }.notify-feature__demo > div section small { color: #727d8b; }.notify-feature__demo > div > i { color: #66717f; }.notify-feature__demo aside { position: absolute; left: 0; right: 90px; bottom: 28px; display: grid; grid-template-columns: 43px 1fr auto auto; gap: 14px; align-items: center; padding: 20px; border: 1px solid #c4ccd7; border-radius: 11px; background: #fff; box-shadow: 0 14px 35px rgba(17,24,32,.13); }.notify-feature__demo aside > i { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 50%; color: #fff; background: var(--notify-blue); }.notify-feature__demo aside strong { display: block; }.notify-feature__demo aside p { margin: 3px 0 0; color: var(--notify-muted); font-size: 12px; }.notify-feature__demo aside > span { color: var(--notify-blue); font-size: 13px; }.notify-feature__demo aside > b { padding: 10px 13px; border-radius: 5px; color: #fff; background: var(--notify-blue); font-size: 13px; }

/* Public product */
.notify-product { color: var(--notify-ink); background: #fff; }
.notify-hero { min-height: 645px; display: grid; align-items: center; border-bottom: 1px solid var(--notify-line); overflow: hidden; }
.notify-hero__grid { display: grid; grid-template-columns: .86fr 1.14fr; gap: clamp(45px, 6vw, 90px); align-items: center; padding-top: 75px; padding-bottom: 78px; }
.notify-hero__copy h1 { max-width: 590px; margin: 0 0 22px; color: #080b0f; font-size: clamp(52px, 5.2vw, 78px); line-height: .98; letter-spacing: -.055em; }
.notify-hero__copy > p { max-width: 590px; margin: 0; color: #485467; font-size: clamp(19px, 1.7vw, 25px); line-height: 1.48; }
.notify-actions { display: flex; gap: 16px; flex-wrap: wrap; margin: 34px 0 25px; }
.notify-actions .notify-button { min-width: 180px; min-height: 56px; font-size: 17px; }
.notify-hero__copy > small { display: block; color: #687384; font-size: 16px; }
.notify-hero-demo { position: relative; min-height: 470px; }
.notify-browser { position: absolute; inset: 35px 62px 15px 0; overflow: hidden; border: 1px solid #bfc7d1; border-radius: 11px; background: #fff; box-shadow: 0 20px 44px rgba(17, 24, 32, .16); }
.notify-browser__bar { display: flex; align-items: center; gap: 7px; height: 58px; padding: 0 18px; color: #d6dde6; background: #151a20; }
.notify-browser__bar i { width: 10px; height: 10px; border-radius: 50%; background: #f2524a; }
.notify-browser__bar i:nth-child(2) { background: #f3c137; }.notify-browser__bar i:nth-child(3) { background: #31bc5b; }
.notify-browser__bar span { display: block; flex: 1; margin-left: 16px; padding: 8px 13px; border-radius: 5px; color: #e8edf3; background: #292f37; font-size: 12px; }
.notify-browser__page { padding: 34px; }
.notify-browser__page span { display: block; width: 46px; height: 46px; margin-bottom: 18px; border-radius: 50%; background: #d9dde2; }
.notify-browser__page b { display: block; width: 82%; height: 14px; margin: 14px 0; border-radius: 4px; background: #dfe3e8; }
.notify-browser__page b:nth-child(3) { width: 62%; }.notify-browser__page b:nth-child(5) { width: 72%; }
.notify-permission-card { position: absolute; left: -28px; top: 178px; z-index: 2; width: 330px; padding: 27px 26px 20px; border: 1px solid #cbd2dc; border-radius: 12px; background: #fff; box-shadow: var(--notify-shadow); }
.notify-permission-card > i { float: left; margin: 2px 17px 28px 0; color: var(--notify-blue); font-size: 29px; }
.notify-permission-card > strong { display: block; min-height: 55px; font-size: 17px; line-height: 1.35; }
.notify-permission-card > div { display: flex; justify-content: flex-end; align-items: center; gap: 16px; clear: both; margin-top: 18px; color: var(--notify-blue); font-size: 14px; }
.notify-permission-card b { padding: 10px 18px; border-radius: 5px; color: #fff; background: var(--notify-blue); }
.notify-toast-preview { position: absolute; right: 0; top: 72px; z-index: 3; display: grid; grid-template-columns: 54px 1fr auto; gap: 13px; width: 345px; padding: 21px; border: 1px solid #c7ced8; border-radius: 12px; background: rgba(255,255,255,.98); box-shadow: var(--notify-shadow); }
.notify-toast-preview strong,.notify-phone-preview strong { display: block; font-size: 15px; }.notify-toast-preview p,.notify-phone-preview p { margin: 4px 0; color: #3f4957; font-size: 13px; line-height: 1.35; }.notify-toast-preview small,.notify-phone-preview small { color: #697485; font-size: 11px; }
.notify-preview-mark { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 7px; color: #fff; background: #080a0d; font-size: 29px; font-weight: 800; }.notify-preview-mark span { color: var(--notify-red); }
.notify-toast-preview > i { color: #5d6774; font-size: 13px; }
.notify-phone-preview { position: absolute; right: 2px; bottom: 0; z-index: 4; width: 330px; padding: 15px 16px 19px; border: 5px solid #b8bec8; border-radius: 26px; background: #fff; box-shadow: 0 18px 35px rgba(17,24,32,.13); }
.notify-phone-preview > small { display: block; padding-bottom: 12px; border-bottom: 1px solid #e1e5ea; }.notify-phone-preview > div { display: grid; grid-template-columns: 43px 1fr; gap: 12px; padding-top: 13px; }.notify-phone-preview .notify-preview-mark { width: 43px; height: 43px; font-size: 23px; }

.notify-workflow { padding: 70px 0 78px; }
.notify-workflow h2 { margin: 0 0 42px; text-align: center; font-size: clamp(34px, 3vw, 46px); letter-spacing: -.035em; }
.notify-workflow ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 54px; margin: 0; padding: 0; list-style: none; }
.notify-workflow li { position: relative; display: grid; grid-template-columns: 70px 1fr; gap: 20px; align-items: start; }
.notify-workflow li:not(:last-child)::after { content: ''; position: absolute; top: 35px; right: -37px; width: 26px; border-top: 2px dotted #9ba8b8; }
.notify-workflow li > span { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 50%; color: var(--notify-blue); background: #f2f5fa; font-size: 28px; }
.notify-workflow li div { position: relative; padding-top: 3px; }.notify-workflow li b { position: absolute; left: -30px; top: -5px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: #10151c; font-size: 13px; }
.notify-workflow h3 { margin: 4px 0 7px; font-size: 21px; }.notify-workflow p { margin: 0; color: var(--notify-muted); font-size: 15px; line-height: 1.55; }

.notify-integration { padding: 78px 0; border-top: 1px solid var(--notify-line); }
.notify-section-heading h2 { margin: 0 0 9px; font-size: clamp(34px, 3vw, 48px); line-height: 1.05; letter-spacing: -.04em; }.notify-section-heading p { max-width: 810px; margin: 0; color: var(--notify-muted); font-size: 18px; line-height: 1.55; }
.notify-integration__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 30px; align-items: stretch; margin-top: 34px; }
.notify-code,.notify-dashboard-code { overflow: hidden; border: 1px solid var(--notify-line); border-radius: 8px; background: #fff; }
.notify-code__tabs { display: flex; align-items: stretch; min-height: 58px; border-bottom: 1px solid var(--notify-line); background: #fff; }
.notify-code__tabs button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-width: 150px; padding: 14px 20px; border: 0; color: #303b49; background: transparent; font-family: inherit; font-size: 15px; font-weight: 650; line-height: 1.2; cursor: pointer; }
.notify-code__tabs button.is-active { color: var(--notify-blue); }.notify-code__tabs button.is-active::after { content: ''; position: absolute; left: 16px; right: 16px; bottom: 0; height: 3px; background: var(--notify-blue); }
.notify-code__tabs .notify-code__copy,.notify-code__tabs button:last-child[data-copy-current] { min-width: auto; margin-left: auto; color: #4e5968; }
.notify-code pre,.notify-dashboard-code pre { min-height: 280px; margin: 0; padding: 30px; overflow: auto; color: #143d93; background: #fbfcfe; font: 500 14px/1.75 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; }
.notify-checklist { margin: 0; padding: 0 24px; border: 1px solid var(--notify-line); border-radius: 8px; list-style: none; }
.notify-checklist li { display: flex; align-items: center; gap: 17px; min-height: 75px; border-bottom: 1px solid var(--notify-line); font-size: 17px; }.notify-checklist li:last-child { border-bottom: 0; }.notify-checklist span { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; color: #fff; background: var(--notify-blue); font-weight: 800; font-size: 13px; }
.notify-wordpress-callout { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 28px; padding: 24px 28px; border: 1px solid #cad2df; border-radius: 8px; background: #f8fafc; }.notify-wordpress-callout > div { display: flex; align-items: center; gap: 17px; }.notify-wordpress-callout > div > i { font-size: 36px; }.notify-wordpress-callout strong,.notify-wordpress-callout small { display: block; }.notify-wordpress-callout strong { margin-bottom: 4px; font-size: 18px; }.notify-wordpress-callout small { max-width: 720px; color: var(--notify-muted); font-size: 14px; }

.notify-metrics-story { padding: 66px 0 56px; border-top: 1px solid var(--notify-line); }.notify-metrics-story h2 { margin: 0 0 32px; font-size: clamp(32px, 3vw, 44px); letter-spacing: -.035em; }.notify-metrics-rail { display: grid; grid-template-columns: auto 1fr auto 1fr auto 1fr auto 1fr auto; align-items: center; gap: 24px; }.notify-metrics-rail div { min-width: 132px; }.notify-metrics-rail span,.notify-metrics-rail strong { display: block; }.notify-metrics-rail span { margin-bottom: 7px; color: #495464; font-size: 14px; }.notify-metrics-rail strong { font-size: 38px; line-height: 1; }.notify-metrics-rail > i { height: 1px; background: var(--notify-blue); }.notify-metrics-rail > i::after { content: ''; display: block; float: right; width: 7px; height: 7px; margin-top: -3px; border-radius: 50%; background: var(--notify-blue); }.notify-metrics-story > .container > p { margin: 27px 0 0; color: #5e6876; font-size: 14px; }.notify-metrics-story p i { margin-right: 7px; }
.notify-apple-note { padding: 42px 0; color: #f4f7fb; background: var(--notify-ink); }.notify-apple-note .container { display: flex; gap: 22px; align-items: center; max-width: 1000px; }.notify-apple-note i { font-size: 44px; }.notify-apple-note h2 { margin: 0 0 5px; color: #fff; font-size: 24px; }.notify-apple-note p { margin: 0; color: #bdc7d4; line-height: 1.55; }
.notify-final-cta { padding: 56px 0 68px; }.notify-final-cta .container { display: flex; align-items: center; justify-content: space-between; gap: 30px; }.notify-final-cta h2 { margin: 0; font-size: clamp(31px, 3vw, 44px); letter-spacing: -.035em; }.notify-final-cta .container > div { display: flex; gap: 14px; }

/* Authenticated console */
.notify-console-body { margin: 0; color: var(--notify-ink); background: #fff; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.notify-console-body * { box-sizing: border-box; }
.notify-skip { position: fixed; left: 15px; top: -60px; z-index: 50; padding: 10px 15px; color: #fff; background: var(--notify-blue); }.notify-skip:focus { top: 10px; }
.notify-console-topbar { position: sticky; top: 0; z-index: 30; display: grid; grid-template-columns: auto 1px auto 1fr; align-items: center; gap: 22px; min-height: 74px; padding: 0 24px; color: #fff; background: #111820; }
.notify-console-topbar > button { display: none; border: 0; color: #fff; background: transparent; font-size: 29px; }.notify-console-topbar > a img { display: block; width: 164px; max-height: 42px; object-fit: contain; }.notify-console-topbar > span { width: 1px; height: 36px; background: #3c4652; }.notify-console-topbar > strong { font-size: 20px; }.notify-console-topbar > div { display: flex; justify-self: end; align-items: center; gap: 12px; }.notify-console-topbar > div b,.notify-console-topbar > div small { display: block; }.notify-console-topbar > div small { color: #adb8c5; font-size: 11px; }.notify-console-topbar form { margin: 0; }.notify-console-topbar form button { padding: 7px 10px; border: 1px solid #495563; border-radius: 6px; color: #dbe2ea; background: transparent; cursor: pointer; }
.notify-console-shell { display: grid; grid-template-columns: 255px minmax(0,1fr); min-height: calc(100vh - 74px); }
.notify-console-nav { position: sticky; top: 74px; display: flex; flex-direction: column; justify-content: space-between; height: calc(100vh - 74px); padding: 18px 13px 24px; color: #eaf0f6; background: #15212b; }
.notify-console-nav nav,.notify-console-nav > div { display: grid; gap: 5px; }.notify-console-nav a { display: flex; align-items: center; gap: 14px; min-height: 49px; padding: 0 15px; border-radius: 6px; color: #e8eef5; text-decoration: none; font-size: 15px; }.notify-console-nav a i { width: 22px; text-align: center; font-size: 19px; }.notify-console-nav a:hover { background: rgba(255,255,255,.07); }.notify-console-nav a.is-active { color: #fff; background: #146ee5; }
.notify-console { min-width: 0; padding: 28px clamp(24px,4vw,58px) 70px; background: #fff; }
.notify-console__heading { display: flex; justify-content: space-between; gap: 25px; align-items: center; margin-bottom: 20px; }.notify-console__heading h1 { margin: 0 0 5px; font-size: 31px; letter-spacing: -.03em; }.notify-console__heading p { margin: 0; color: var(--notify-muted); }
.notify-flash { display: flex; gap: 11px; align-items: flex-start; margin: 0 0 20px; padding: 13px 16px; border: 1px solid #8fd5b2; border-radius: 7px; color: #11633c; background: #effbf5; }.notify-flash.is-error { color: #8c2025; border-color: #efb8ba; background: #fff3f3; }
.notify-empty { max-width: 690px; margin: 90px auto; text-align: center; }.notify-empty > span { display: grid; place-items: center; width: 78px; height: 78px; margin: 0 auto 24px; border-radius: 50%; color: var(--notify-blue); background: #edf3ff; font-size: 33px; }.notify-empty h2 { margin: 0 0 9px; font-size: 31px; }.notify-empty p { margin: 0 auto 25px; color: var(--notify-muted); font-size: 17px; line-height: 1.55; }
.notify-site-bar { display: grid; grid-template-columns: 390px 1fr; gap: 28px; align-items: center; margin-bottom: 26px; }.notify-site-bar > form { display: flex; align-items: center; min-height: 72px; padding: 13px 15px; border: 1px solid var(--notify-line); border-radius: 8px; }.notify-site-bar label { color: var(--notify-ink); font-size: 22px; }.notify-site-bar select { min-width: 0; flex: 1; margin: 0 9px; padding: 10px 5px; border: 0; color: var(--notify-ink); background: #fff; font-family: inherit; font-size: 15px; font-weight: 700; line-height: 1.2; }.notify-site-bar form button { padding: 8px 10px; border: 0; border-radius: 5px; color: var(--notify-blue); background: #edf3ff; font-weight: 700; cursor: pointer; }.notify-connected { display: flex; align-items: center; gap: 7px; padding-left: 12px; color: #08796f; white-space: nowrap; font-size: 12px; }.notify-connected i { width: 10px; height: 10px; border-radius: 50%; background: var(--notify-teal); }
.notify-progress { display: grid; grid-template-columns: repeat(4,1fr); margin: 0; padding: 18px 20px; border: 1px solid var(--notify-line); border-radius: 8px; list-style: none; }.notify-progress li { position: relative; display: grid; justify-items: center; gap: 7px; text-align: center; }.notify-progress li:not(:last-child)::after { content: ''; position: absolute; left: calc(50% + 16px); right: calc(-50% + 16px); top: 15px; height: 2px; background: #cbd3df; }.notify-progress li.is-complete:not(:last-child)::after { background: var(--notify-teal); }.notify-progress li > span { position: relative; z-index: 1; display: grid; place-items: center; width: 31px; height: 31px; border: 2px solid #aab5c4; border-radius: 50%; color: #596575; background: #fff; font-weight: 800; font-size: 12px; }.notify-progress li.is-complete > span { color: #fff; border-color: var(--notify-teal); background: var(--notify-teal); }.notify-progress li.is-current > span { color: var(--notify-blue); border-color: var(--notify-blue); }.notify-progress li small { font-size: 11px; }
.notify-dashboard-metrics { display: grid; grid-template-columns: repeat(5,1fr); margin-bottom: 24px; padding: 19px 15px 13px; border: 1px solid var(--notify-line); border-radius: 8px; }.notify-dashboard-metrics > div { padding: 0 23px; border-right: 1px solid var(--notify-line); text-align: center; }.notify-dashboard-metrics > div:nth-child(5) { border: 0; }.notify-dashboard-metrics span,.notify-dashboard-metrics strong { display: block; }.notify-dashboard-metrics span { margin-bottom: 8px; color: #35404e; font-size: 12px; }.notify-dashboard-metrics strong { font-size: 30px; font-weight: 500; }.notify-dashboard-metrics p { grid-column: 1/-1; margin: 17px 0 0; padding: 11px 10px 0; border-top: 1px solid #edf0f3; color: #667181; font-size: 12px; }.notify-dashboard-metrics p i { margin-right: 7px; }
.notify-dashboard-grid { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(330px,.75fr); gap: 24px; margin-bottom: 24px; }.notify-funnel,.notify-quick-send,.notify-campaigns,.notify-dashboard-integration,.notify-settings { border: 1px solid var(--notify-line); border-radius: 8px; background: #fff; }.notify-funnel { padding: 20px 20px 30px; }.notify-funnel > div h2,.notify-quick-send h2,.notify-campaigns h2,.notify-settings h2 { margin: 0 0 4px; font-size: 20px; }.notify-funnel > div p,.notify-campaigns > div p,.notify-settings > div p { margin: 0; color: var(--notify-muted); font-size: 12px; }.notify-funnel ol { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; gap: 10px; margin: 42px 0 0; padding: 0; list-style: none; }.notify-funnel li { display: grid; justify-items: center; text-align: center; }.notify-funnel li:nth-child(even) { color: var(--notify-blue); font-size: 20px; }.notify-funnel li span { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 12px; border: 2px solid var(--notify-blue); border-radius: 50%; color: var(--notify-blue); font-size: 24px; }.notify-funnel li b { font-size: 12px; }.notify-funnel li strong { margin-top: 5px; color: #596575; font-size: 13px; font-weight: 500; }
.notify-quick-send { padding: 20px; }.notify-quick-send form { display: grid; gap: 12px; margin-top: 14px; }.notify-quick-send label,.notify-settings label,.notify-dialog label,.notify-connect label { display: grid; gap: 6px; }.notify-quick-send label span,.notify-settings label > span,.notify-dialog label > span,.notify-connect label > span { font-size: 12px; font-weight: 700; }.notify-quick-send input,.notify-quick-send textarea,.notify-settings input,.notify-settings textarea,.notify-dialog input,.notify-connect input { width: 100%; padding: 11px 12px; border: 1px solid #c8d0dc; border-radius: 6px; color: var(--notify-ink); background: #fff; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1.35; }.notify-quick-send textarea,.notify-settings textarea { min-height: 75px; resize: vertical; }.notify-quick-send .notify-button { width: 100%; min-height: 42px; }.notify-quick-send form > small { color: var(--notify-muted); text-align: center; }
.notify-campaigns { margin-bottom: 24px; overflow: hidden; }.notify-campaigns > div:first-child { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding: 18px 20px; }.notify-table-scroll { overflow-x: auto; }.notify-campaigns table { width: 100%; border-collapse: collapse; font-size: 13px; }.notify-campaigns th { padding: 11px 15px; border-top: 1px solid var(--notify-line); border-bottom: 1px solid var(--notify-line); color: #27313f; text-align: left; white-space: nowrap; }.notify-campaigns td { padding: 13px 15px; border-bottom: 1px solid #e8ebef; color: #303a47; }.notify-campaigns tr:last-child td { border: 0; }.notify-campaigns td strong,.notify-campaigns td small { display: block; }.notify-campaigns td small { margin-top: 3px; color: var(--notify-muted); }.notify-campaigns [class^="is-status-"] { color: #5a6675; }.notify-campaigns .is-status-sent { color: #08796f; font-weight: 700; }.notify-campaigns .is-status-failed { color: #b4232c; font-weight: 700; }.notify-campaigns .is-status-cancelled { color: #8a4b08; font-weight: 700; }.notify-campaign-cancel { margin: 0; }.notify-campaign-cancel button { padding: 6px 9px; border: 1px solid #d69b9e; border-radius: 5px; color: #9d252b; background: #fff; font: inherit; font-weight: 700; white-space: nowrap; cursor: pointer; }.notify-campaign-cancel button:hover,.notify-campaign-cancel button:focus-visible { border-color: #b4232c; background: #fff3f3; }.notify-campaigns__empty { margin: 0; padding: 35px 20px; border-top: 1px solid var(--notify-line); color: var(--notify-muted); text-align: center; }
.notify-dashboard-integration { margin-bottom: 24px; padding: 22px; }.notify-dashboard-integration .notify-section-heading h2 { font-size: 25px; }.notify-dashboard-integration .notify-section-heading p { font-size: 14px; }.notify-secret-warning { display: flex; align-items: center; gap: 13px; margin: 18px 0; padding: 13px 15px; border: 1px solid #f2cd7b; border-radius: 7px; color: #6d4d0c; background: #fff8e7; }.notify-secret-warning i { font-size: 23px; }.notify-secret-warning strong,.notify-secret-warning span { display: block; }.notify-secret-warning span { margin-top: 2px; font-size: 12px; }.notify-key-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 20px 0; }.notify-key-grid > label { display: grid; gap: 7px; }.notify-key-grid > label > span { font-size: 12px; font-weight: 700; }.notify-key-grid label > div { display: grid; grid-template-columns: 1fr auto; }.notify-key-grid input { min-width: 0; padding: 11px 12px; border: 1px solid #cbd3df; border-right: 0; border-radius: 6px 0 0 6px; color: #27313f; background: #fbfcfd; font: 500 12px/1.3 ui-monospace, Consolas, monospace; }.notify-key-grid button { padding: 0 15px; border: 1px solid #cbd3df; border-radius: 0 6px 6px 0; color: #25303d; background: #fff; font-weight: 700; cursor: pointer; }.notify-key-grid button i { margin-right: 7px; }.notify-key-grid small { color: var(--notify-muted); }.notify-dashboard-code pre { min-height: 175px; }.notify-wordpress-panel { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; min-height: 175px; padding: 28px; background: #fbfcfe; }.notify-wordpress-panel > i { font-size: 46px; }.notify-wordpress-panel strong { font-size: 17px; }.notify-wordpress-panel p { margin: 5px 0 0; color: var(--notify-muted); font-size: 13px; line-height: 1.5; }.notify-rotate-key { margin-top: 14px; text-align: right; }.notify-rotate-key button { padding: 9px 11px; border: 0; color: #b22930; background: transparent; font-weight: 700; cursor: pointer; }.notify-rotate-key i { margin-right: 7px; }
.notify-settings { display: grid; grid-template-columns: .65fr 1.35fr; gap: 40px; padding: 22px; }.notify-settings > form { display: grid; gap: 13px; }.notify-settings textarea { min-height: 68px; }.notify-settings .notify-button { justify-self: start; min-height: 42px; }
.notify-check { grid-template-columns: auto 1fr !important; align-items: start; gap: 10px !important; color: #4c5867; font-size: 12px; line-height: 1.45; }.notify-check input { width: 17px !important; height: 17px; margin: 2px 0 0; padding: 0; accent-color: var(--notify-blue); }
.notify-dialog { width: min(520px,calc(100vw - 28px)); padding: 0; border: 0; border-radius: 10px; box-shadow: var(--notify-shadow); }.notify-dialog::backdrop { background: rgba(8,13,18,.6); }.notify-dialog form { display: grid; gap: 17px; padding: 24px; }.notify-dialog__head { display: flex; align-items: center; justify-content: space-between; }.notify-dialog__head h2 { margin: 0; font-size: 23px; }.notify-dialog__head button { border: 0; background: transparent; font-size: 20px; cursor: pointer; }.notify-dialog label small { color: var(--notify-muted); }.notify-dialog form > p { display: flex; gap: 8px; margin: 0; color: var(--notify-muted); font-size: 12px; }.notify-dialog__actions { display: flex; justify-content: flex-end; gap: 10px; }

/* WordPress connection approval */
.notify-connect { min-height: calc(100vh - 74px); display: grid; place-items: center; padding: 44px 24px; background: #f5f7fa; }.notify-connect > section { width: min(680px,100%); padding: 38px; border: 1px solid var(--notify-line); border-radius: 12px; background: #fff; box-shadow: 0 18px 48px rgba(17,24,32,.1); }.notify-connect__icon { display: grid; place-items: center; width: 62px; height: 62px; margin-bottom: 18px; border-radius: 50%; color: #fff; background: var(--notify-ink); font-size: 31px; }.notify-connect section > p:first-of-type { margin: 0 0 8px; color: var(--notify-blue); font-weight: 800; }.notify-connect h1 { margin: 0 0 14px; font-size: 32px; line-height: 1.12; letter-spacing: -.035em; }.notify-connect h1 + p { margin: 0; color: var(--notify-muted); font-size: 15px; line-height: 1.6; }.notify-connect dl { margin: 25px 0; border-top: 1px solid var(--notify-line); border-bottom: 1px solid var(--notify-line); }.notify-connect dl div { display: grid; grid-template-columns: 120px 1fr; gap: 20px; padding: 13px 0; border-bottom: 1px solid #edf0f3; }.notify-connect dl div:last-child { border: 0; }.notify-connect dt { color: var(--notify-muted); }.notify-connect dd { margin: 0; font-weight: 650; overflow-wrap: anywhere; }.notify-connect form { display: grid; gap: 16px; }.notify-connect form > div:last-child { display: flex; justify-content: flex-end; gap: 12px; }.notify-connect__existing { display: flex; gap: 9px; color: #08796f; font-weight: 650; }

@media (max-width: 1100px) {
    .notify-feature__grid { grid-template-columns: 1fr; }.notify-feature__demo { max-width: 780px; width: 100%; }
    .notify-hero__grid { grid-template-columns: 1fr; }.notify-hero__copy { max-width: 720px; }.notify-hero-demo { max-width: 760px; width: 100%; margin: 0 auto; }
    .notify-integration__grid { grid-template-columns: 1fr 300px; }.notify-metrics-rail { gap: 13px; }.notify-metrics-rail div { min-width: 105px; }.notify-metrics-rail strong { font-size: 31px; }
    .notify-site-bar { grid-template-columns: 1fr; }.notify-dashboard-grid { grid-template-columns: 1fr; }.notify-console-shell { grid-template-columns: 215px minmax(0,1fr); }
    .notify-dashboard-metrics > div { padding: 0 10px; }
}

@media (max-width: 820px) {
    .notify-workflow ol { grid-template-columns: 1fr; gap: 26px; }.notify-workflow li:not(:last-child)::after { display: none; }
    .notify-integration__grid { grid-template-columns: 1fr; }.notify-checklist { display: grid; grid-template-columns: 1fr 1fr; }.notify-checklist li:nth-child(2) { border-bottom: 1px solid var(--notify-line); }.notify-checklist li:nth-child(3) { border-bottom: 0; }
    .notify-metrics-rail { grid-template-columns: repeat(5,minmax(125px,1fr)); overflow-x: auto; padding-bottom: 14px; }.notify-metrics-rail > i { display: none; }.notify-final-cta .container { align-items: flex-start; flex-direction: column; }
    .notify-console-topbar { grid-template-columns: auto auto 1px auto 1fr; gap: 13px; padding: 0 15px; }.notify-console-topbar > button { display: block; }.notify-console-topbar > a img { width: 135px; }.notify-console-topbar > div small { display: none; }
    .notify-console-shell { display: block; }.notify-console-nav { position: fixed; left: -270px; top: 74px; z-index: 25; width: 255px; transition: left .18s ease; box-shadow: 15px 0 30px rgba(0,0,0,.2); }.notify-console-nav.is-open { left: 0; }.notify-console { padding: 24px 18px 60px; }
    .notify-dashboard-metrics { grid-template-columns: repeat(5,minmax(135px,1fr)); overflow-x: auto; }.notify-dashboard-metrics > div { min-width: 135px; }.notify-dashboard-metrics p { min-width: 675px; }
    .notify-key-grid,.notify-settings { grid-template-columns: 1fr; }.notify-wordpress-panel { grid-template-columns: auto 1fr; }.notify-wordpress-panel .notify-button { grid-column: 1/-1; justify-self: start; }
}

@media (max-width: 600px) {
    .notify-feature { padding: 58px 0; }.notify-feature__copy > div { align-items: flex-start; flex-direction: column; }.notify-feature__copy ul { display: grid; gap: 9px; }.notify-feature__demo { min-height: 360px; padding: 20px; }.notify-feature__demo > div { margin-left: 0; }.notify-feature__demo aside { left: 12px; right: 12px; bottom: 20px; grid-template-columns: 43px 1fr; }.notify-feature__demo aside > span,.notify-feature__demo aside > b { text-align: center; }
    .notify-hero { min-height: 0; }.notify-hero__grid { padding-top: 50px; padding-bottom: 55px; }.notify-hero__copy h1 { font-size: 48px; }.notify-hero__copy > p { font-size: 18px; }.notify-actions .notify-button { width: 100%; }.notify-hero-demo { min-height: 420px; }.notify-browser { inset: 15px 0 45px; }.notify-toast-preview { right: -5px; top: 40px; width: 295px; }.notify-permission-card { left: 0; top: 175px; width: 290px; }.notify-phone-preview { width: 286px; right: 0; }
    .notify-workflow,.notify-integration { padding: 55px 0; }.notify-workflow h2 { text-align: left; }.notify-workflow li { grid-template-columns: 60px 1fr; }.notify-workflow li > span { width: 60px; height: 60px; }.notify-workflow li b { left: -26px; }
    .notify-code__tabs { overflow-x: auto; }.notify-code__tabs button { min-width: 126px; padding: 13px 12px; }.notify-code__tabs .notify-code__copy { position: sticky; right: 0; min-width: 70px; background: #fff; }.notify-code pre,.notify-dashboard-code pre { min-height: 240px; padding: 20px; font-size: 12px; }.notify-checklist { display: block; }.notify-checklist li { border-bottom: 1px solid var(--notify-line) !important; }.notify-checklist li:last-child { border-bottom: 0 !important; }.notify-wordpress-callout { align-items: flex-start; flex-direction: column; }.notify-wordpress-callout .notify-button { width: 100%; }
    .notify-final-cta .container > div { width: 100%; flex-direction: column; }.notify-final-cta .notify-button { width: 100%; }
    .notify-console-topbar > span,.notify-console-topbar > strong,.notify-console-topbar > div b { display: none; }.notify-console-topbar { grid-template-columns: auto 1fr auto; }.notify-console-topbar > div { grid-column: 3; }.notify-console__heading { align-items: flex-start; }.notify-console__heading p { display: none; }.notify-console__heading .notify-button { min-height: 42px; padding: 10px 14px; }
    .notify-site-bar > form { flex-wrap: wrap; }.notify-connected { width: 100%; padding: 9px 0 0 30px; }.notify-progress { min-width: 610px; }.notify-site-bar { overflow-x: auto; }.notify-progress li small { font-size: 10px; }
    .notify-funnel ol { min-width: 600px; }.notify-funnel { overflow-x: auto; }.notify-campaigns > div:first-child { align-items: flex-start; flex-direction: column; }.notify-key-grid label > div { grid-template-columns: minmax(0,1fr) auto; }.notify-dashboard-code .notify-code__tabs { overflow-x: auto; }.notify-rotate-key { text-align: left; }
    .notify-dialog__actions,.notify-connect form > div:last-child { flex-direction: column-reverse; }.notify-dialog__actions .notify-button,.notify-connect form > div:last-child .notify-button { width: 100%; }.notify-connect > section { padding: 25px 20px; }.notify-connect h1 { font-size: 27px; }.notify-connect dl div { grid-template-columns: 1fr; gap: 4px; }
}

@media (prefers-reduced-motion: reduce) { .notify-button,.notify-console-nav { transition: none; } }
