.dashboard {
  --ink: #17213a;
  --muted: #667085;
  --violet: #635bff;
  --violet-dark: #4338ca;
  --line: #e7e9f0;
  display: grid;
  gap: 20px;
  padding-bottom: 32px;
  color: var(--ink);
}

.hero {
  position: relative;
  min-height: 260px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding: 40px 48px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 74% 12%, rgba(132, 204, 255, .2), transparent 28%),
    linear-gradient(118deg, #13142d 0%, #242150 57%, #332872 100%);
  box-shadow: 0 18px 55px rgba(34, 31, 82, .18);
  color: white;
  isolation: isolate;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .12;
  background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(90deg, transparent, black);
}

.heroGlow {
  position: absolute;
  width: 260px;
  height: 260px;
  right: 4%;
  top: -50%;
  border-radius: 50%;
  background: #725cff;
  filter: blur(80px);
  opacity: .45;
}

.heroContent { max-width: 640px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin-bottom: 15px; color: #d9d6ff; font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.eyebrow span { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid rgba(255,255,255,.23); border-radius: 8px; background: rgba(255,255,255,.08); }
.eyebrow svg { width: 15px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.hero h1 { max-width: 600px; margin: 0 0 12px; font-size: clamp(30px, 4vw, 46px); line-height: 1.06; letter-spacing: -.045em; }
.hero p { max-width: 540px; margin: 0; color: #c6c7da; font-size: 16px; line-height: 1.65; }
.heroActions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 27px; }

.primaryButton, .secondaryButton, .primaryButtonSmall, .textButton, .learnLink, .viewAll {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  text-decoration: none;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.primaryButton { min-height: 44px; padding: 0 19px; border-radius: 11px; background: white; color: #28234d; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.secondaryButton { min-height: 42px; padding: 0 17px; border: 1px solid rgba(255,255,255,.22); border-radius: 11px; color: white; background: rgba(255,255,255,.07); }
.primaryButton svg, .textButton svg, .learnLink svg, .viewAll svg { width: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.primaryButton:hover { transform: translateY(-1px); box-shadow: 0 11px 28px rgba(0,0,0,.2); }
.secondaryButton:hover { background: rgba(255,255,255,.13); }

.heroSignal { position: relative; z-index: 1; display: grid; place-items: center; flex: 0 0 190px; color: #d8d8e8; font-size: 12px; font-weight: 650; letter-spacing: .04em; }
.signalRing { display: grid; place-items: center; width: 132px; height: 132px; margin-bottom: 14px; border: 1px solid rgba(160, 217, 255, .38); border-radius: 50%; box-shadow: 0 0 0 15px rgba(118, 104, 255, .09), 0 0 0 34px rgba(118, 104, 255, .05); }
.signalCore { display: grid; place-items: center; width: 86px; height: 86px; border-radius: 26px; background: linear-gradient(145deg, #7668ff, #4f46c9); box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 16px 35px rgba(35, 27, 112, .45); color: white; font-size: 25px; font-weight: 800; letter-spacing: -.05em; }
.heroSignal span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #51e1a7; box-shadow: 0 0 10px #51e1a7; }

.metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.metricCard { display: flex; align-items: center; gap: 16px; min-height: 116px; padding: 21px; border: 1px solid var(--line); border-radius: 17px; background: white; box-shadow: 0 7px 24px rgba(33, 42, 70, .055); }
.metricCard > div:last-child { display: grid; grid-template-columns: auto 1fr; align-items: baseline; flex: 1; }
.metricCard span { grid-column: 1; color: var(--muted); font-size: 12px; font-weight: 650; }
.metricCard strong { grid-column: 1; margin-top: 3px; color: var(--ink); font-size: 30px; line-height: 1.1; letter-spacing: -.04em; }
.metricCard small { grid-column: 1; margin-top: 4px; color: #98a0b2; font-size: 11px; }
.metricIcon { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 13px; font-size: 20px; font-weight: 700; }
.metricIconViolet { color: #5c50d7; background: #eeecff; }
.metricIconAmber { color: #b25e18; background: #fff1d9; }
.metricIconGreen { color: #07875f; background: #dcf8ed; }

.contentGrid { display: grid; grid-template-columns: minmax(0, 1.62fr) minmax(280px, .8fr); gap: 16px; align-items: stretch; }
.panel { border: 1px solid var(--line); border-radius: 18px; background: white; box-shadow: 0 7px 26px rgba(33, 42, 70, .055); padding: 25px; }
.panelHeader { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.sectionLabel { display: block; margin-bottom: 5px; color: #817a9d; font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.panel h2 { margin: 0; color: var(--ink); font-size: 20px; line-height: 1.25; letter-spacing: -.025em; }
.statusPill, .requestStatus { display: inline-flex; align-items: center; border-radius: 999px; font-size: 11px; font-weight: 750; white-space: nowrap; }
.statusPill { padding: 6px 10px; }
.statusSuccess { color: #087653; background: #dff8ef; }
.statusPending { color: #9c5a14; background: #fff1dc; }
.progressTrack { height: 7px; margin-top: 20px; overflow: hidden; border-radius: 99px; background: #eff0f5; }
.progressTrack span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #6f62ff, #8f82ff); box-shadow: 0 0 12px rgba(111,98,255,.4); }
.progressCopy { margin: 8px 0 18px; color: #8a91a1; font-size: 11px; }
.checkGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 22px; }
.checkItem { display: flex; align-items: center; gap: 9px; min-height: 29px; color: #828897; font-size: 12px; }
.checkDone { color: #354052; }
.checkIcon { display: grid; place-items: center; flex: 0 0 20px; width: 20px; height: 20px; border: 1px solid #d7dae2; border-radius: 7px; color: white; font-size: 11px; }
.checkDone .checkIcon { border-color: #7166e9; background: #7166e9; box-shadow: 0 4px 9px rgba(113,102,233,.2); }
.panelActions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 22px; padding-top: 19px; border-top: 1px solid #f0f1f5; }
.primaryButtonSmall { min-height: 36px; padding: 0 14px; border-radius: 9px; background: #24213e; color: white; font-size: 12px; }
.textButton { padding: 7px 3px; background: transparent; color: #5e57b8; font-size: 12px; }

.guidancePanel { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; background: linear-gradient(150deg, #f7f7ff, #f2f0ff); }
.guidancePanel::after { content: ""; position: absolute; width: 130px; height: 130px; right: -46px; bottom: -58px; border: 22px solid rgba(111,98,255,.08); border-radius: 50%; }
.guidanceIcon { display: grid; place-items: center; width: 36px; height: 36px; margin-bottom: 20px; border-radius: 11px; color: white; background: #6b5eea; box-shadow: 0 8px 18px rgba(107,94,234,.25); font-family: Georgia, serif; font-size: 20px; font-weight: 700; }
.guidancePanel h2 { max-width: 290px; font-size: 21px; line-height: 1.35; }
.guidancePanel p { max-width: 310px; margin: 12px 0 20px; color: #646b7d; font-size: 12px; line-height: 1.65; }
.learnLink { align-self: flex-start; color: #5d55be; font-size: 12px; }

.viewAll { color: #5d55be; font-size: 12px; }
.requestList { margin: 17px -25px -25px; }
.requestRow { display: grid; grid-template-columns: 38px minmax(160px, 1fr) minmax(100px, .55fr) minmax(110px, .4fr) 20px; align-items: center; gap: 13px; min-height: 66px; padding: 0 25px; border-top: 1px solid #eff0f4; color: inherit; text-decoration: none; transition: background .15s ease; }
.requestRow:hover { background: #fafaff; }
.requestMark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: #5b53c8; background: #efedff; font-size: 11px; font-weight: 800; }
.requestIdentity { display: flex; flex-direction: column; gap: 3px; }
.requestIdentity strong { color: #252c3e; font-size: 12px; }
.requestIdentity small { color: #8a91a0; font-size: 11px; }
.requestStatus { justify-self: start; padding: 5px 9px; color: #566174; background: #f0f2f5; }
.reviewStatus { color: #a05b14; background: #fff1dd; }
.requestRow time { color: #8991a2; font-size: 11px; }
.rowArrow { color: #a4a9b5; }
.rowArrow svg { width: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.emptyState { display: grid; place-items: center; padding: 36px 20px 18px; text-align: center; }
.emptyState > span { color: #756be0; font-size: 30px; }
.emptyState h3 { margin: 8px 0 2px; font-size: 15px; }
.emptyState p { margin: 0; color: var(--muted); font-size: 12px; }

@media (max-width: 900px) {
  .hero { padding: 34px; }
  .heroSignal { display: none; }
  .metrics { grid-template-columns: 1fr; }
  .contentGrid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .dashboard { gap: 14px; }
  .hero { min-height: 0; padding: 28px 22px; border-radius: 16px; }
  .hero h1 { font-size: 30px; }
  .heroActions { align-items: stretch; flex-direction: column; }
  .metrics { gap: 10px; }
  .metricCard { min-height: 96px; }
  .panel { padding: 20px; border-radius: 15px; }
  .checkGrid { grid-template-columns: 1fr; }
  .requestList { margin: 16px -20px -20px; }
  .requestRow { grid-template-columns: 36px 1fr 18px; padding: 10px 20px; }
  .requestStatus, .requestRow time { display: none; }
}

/* Shared merchant portal */
.ew-page {
  --ew-ink: #17213a;
  --ew-muted: #667085;
  --ew-violet: #665cf6;
  --ew-violet-dark: #4b43c6;
  --ew-line: #e7e9f0;
  display: grid;
  gap: 18px;
  padding-bottom: 34px;
  color: var(--ew-ink);
}

.ew-page *, .ew-page *::before, .ew-page *::after { box-sizing: border-box; }
.ew-page-intro { display: flex; align-items: center; justify-content: space-between; gap: 30px; min-height: 170px; padding: 30px 36px; overflow: hidden; border: 1px solid #e5e5f1; border-radius: 20px; background: linear-gradient(135deg, #fafaff 0%, #f3f1ff 100%); position: relative; }
.ew-page-intro::after { content: ""; position: absolute; width: 220px; height: 220px; right: -65px; top: -100px; border: 32px solid rgba(102,92,246,.06); border-radius: 50%; }
.ew-page-intro--compact { min-height: 145px; }
.ew-page-intro > div { position: relative; z-index: 1; max-width: 670px; }
.ew-page-intro h1 { margin: 4px 0 8px; color: var(--ew-ink); font-size: 31px; line-height: 1.15; letter-spacing: -.038em; }
.ew-page-intro p { max-width: 650px; margin: 0; color: var(--ew-muted); font-size: 13px; line-height: 1.65; }
.ew-kicker { display: block; margin-bottom: 5px; color: #776fa0; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.ew-count-orb, .ew-settings-symbol { position: relative; z-index: 1; display: grid; place-items: center; flex: 0 0 auto; }
.ew-count-orb { width: 105px; height: 105px; border: 1px solid #dcd8fb; border-radius: 50%; background: rgba(255,255,255,.65); box-shadow: 0 0 0 12px rgba(102,92,246,.035); }
.ew-count-orb strong { font-size: 29px; line-height: 1; letter-spacing: -.04em; }
.ew-count-orb span { max-width: 65px; color: var(--ew-muted); font-size: 10px; line-height: 1.2; text-align: center; }
.ew-settings-symbol { width: 72px; height: 72px; border-radius: 22px; color: white; background: linear-gradient(145deg, #766aff, #554bcf); box-shadow: 0 16px 32px rgba(76,66,193,.26); font-size: 25px; font-weight: 800; }

.ew-card, .ew-filter-card { border: 1px solid var(--ew-line); border-radius: 18px; background: white; box-shadow: 0 7px 26px rgba(33,42,70,.055); }
.ew-card { padding: 25px; }
.ew-filter-card { padding: 18px; }
.ew-card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.ew-card h2 { margin: 0; color: var(--ew-ink); font-size: 19px; line-height: 1.3; letter-spacing: -.025em; }
.ew-card-copy { margin: 9px 0 18px; color: var(--ew-muted); font-size: 12px; line-height: 1.6; }
.ew-card-count { display: grid; place-items: center; min-width: 28px; height: 28px; padding: 0 8px; border-radius: 9px; color: #5c53c6; background: #efedff; font-size: 11px; font-weight: 800; }
.ew-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.ew-filter-form { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.ew-field { display: flex; flex-direction: column; gap: 7px; min-width: 185px; color: #424b5e; font-size: 12px; font-weight: 650; }
.ew-field--grow { flex: 1; min-width: 240px; }
.ew-field--full { grid-column: 1 / -1; }
.ew-field small { color: #8a91a0; font-size: 10px; font-weight: 450; line-height: 1.5; }
.ew-field input, .ew-field select, .ew-field textarea, .ew-filter-form input, .ew-filter-form select, .ew-status-form select {
  width: 100%; min-height: 40px; border: 1px solid #d9dce5; border-radius: 10px; outline: none; background: #fff; color: #20283a; font: inherit; font-weight: 500; transition: border .15s, box-shadow .15s;
}
.ew-field input, .ew-field select, .ew-filter-form input, .ew-filter-form select, .ew-status-form select { padding: 0 12px; }
.ew-field textarea { min-height: 100px; padding: 11px 12px; line-height: 1.55; resize: vertical; }
.ew-field input:focus, .ew-field select:focus, .ew-field textarea:focus, .ew-filter-form input:focus, .ew-filter-form select:focus { border-color: #776df2; box-shadow: 0 0 0 3px rgba(102,92,246,.11); }
.ew-input-with-icon { position: relative; }
.ew-input-with-icon > span { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: #9298a7; font-size: 19px; }
.ew-input-with-icon input { padding-left: 38px; }
.ew-input-suffix { display: flex; align-items: center; overflow: hidden; border: 1px solid #d9dce5; border-radius: 10px; }
.ew-input-suffix:focus-within { border-color: #776df2; box-shadow: 0 0 0 3px rgba(102,92,246,.11); }
.ew-input-suffix input { border: 0; box-shadow: none !important; }
.ew-input-suffix span { padding: 0 12px; color: #7b8292; font-size: 11px; font-weight: 600; }

.ew-button { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 15px; border: 1px solid transparent; border-radius: 10px; text-decoration: none; font: inherit; font-size: 12px; font-weight: 750; cursor: pointer; transition: transform .15s, background .15s, box-shadow .15s; }
.ew-button:hover { transform: translateY(-1px); }
.ew-button--dark { color: white; background: #25223e; box-shadow: 0 6px 15px rgba(37,34,62,.16); }
.ew-button--accent { color: white; background: linear-gradient(135deg, #6c61f4, #554bcf); box-shadow: 0 8px 18px rgba(85,75,207,.23); }
.ew-button--ghost { border-color: #dfe1e8; color: #4c5568; background: white; }
.ew-button--light { color: #2d2850; background: white; box-shadow: 0 8px 20px rgba(21,18,57,.18); }
.ew-button--full { width: 100%; }

.ew-table-card { padding: 0; overflow: hidden; }
.ew-table-card > .ew-card-header { padding: 23px 25px 18px; }
.ew-live-indicator { display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px; border-radius: 99px; color: #4f5a6d; background: #f4f5f7; font-size: 10px; font-weight: 700; }
.ew-live-indicator i { width: 6px; height: 6px; border-radius: 50%; background: #22bd87; box-shadow: 0 0 8px rgba(34,189,135,.7); }
.ew-table-wrap { overflow-x: auto; }
.ew-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.ew-table th { padding: 12px 16px; border-top: 1px solid #edeef2; border-bottom: 1px solid #edeef2; color: #818897; background: #fafafb; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.ew-table td { padding: 14px 16px; border-bottom: 1px solid #eff0f3; color: #657083; vertical-align: middle; white-space: nowrap; }
.ew-table tbody tr:last-child td { border-bottom: 0; }
.ew-table tbody tr:hover { background: #fbfbff; }
.ew-reference { display: flex; align-items: center; gap: 10px; color: #2b3244; text-decoration: none; }
.ew-reference > span { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 9px; color: #5a51c7; background: #eeecff; font-size: 10px; font-weight: 800; }
.ew-reference strong, .ew-cell-primary { color: #2c3446; font-size: 11px; }
.ew-badge { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 99px; font-size: 10px; font-weight: 750; white-space: nowrap; }
.ew-badge--success { color: #087653; background: #dff8ef; }
.ew-badge--warning { color: #9a5b15; background: #fff0d9; }
.ew-badge--critical { color: #a52d36; background: #ffe5e7; }
.ew-badge--neutral { color: #566174; background: #f0f2f5; }
.ew-badge--info { color: #2463a7; background: #e5f1ff; }
.ew-badge--review { color: #5c4bc1; background: #eeeaff; }
.ew-badge--teal { color: #08706d; background: #dff7f5; }
.ew-badge--closed { color: #4d5360; background: #e5e7eb; }
.ew-status-badge::before { content: ""; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: currentColor; opacity: .85; }
.ew-eligibility { color: #5d6575; font-size: 10px; font-weight: 650; }
.ew-row-link { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: #6a61ce; text-decoration: none; background: #f2f0ff; font-size: 20px; }
.ew-empty { display: grid; justify-items: center; padding: 48px 20px; text-align: center; }
.ew-empty > span { color: #756be0; font-size: 32px; }
.ew-empty h3 { margin: 9px 0 3px; font-size: 15px; }
.ew-empty p { margin: 0 0 14px; color: var(--ew-muted); font-size: 12px; }

/* Request detail */
.ew-detail-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 12px 2px 5px; }
.ew-back-link { display: inline-block; margin-bottom: 19px; color: #6961c9; font-size: 11px; font-weight: 700; text-decoration: none; }
.ew-detail-title { display: flex; align-items: center; gap: 14px; }
.ew-reference-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; color: white; background: linear-gradient(145deg, #7569f8, #5047c4); box-shadow: 0 12px 25px rgba(80,71,196,.24); font-size: 15px; font-weight: 850; }
.ew-detail-title h1 { margin: 0; font-size: 30px; letter-spacing: -.04em; }
.ew-detail-hero-meta { display: flex; align-items: center; gap: 10px; padding-bottom: 6px; color: #858c9a; font-size: 10px; }
.ew-detail-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(260px, .72fr); gap: 16px; align-items: start; }
.ew-detail-main, .ew-detail-aside { display: grid; gap: 16px; }
.ew-security-chip { padding: 5px 8px; border: 1px solid #dcdaf5; border-radius: 8px; color: #635bbd; background: #f8f7ff; font-size: 9px; font-weight: 750; }
.ew-data-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 20px 0 0; border: 1px solid #ececf2; border-radius: 13px; overflow: hidden; }
.ew-data-grid > div { min-height: 68px; padding: 13px 15px; border-bottom: 1px solid #ececf2; }
.ew-data-grid > div:nth-child(odd) { border-right: 1px solid #ececf2; }
.ew-data-grid > div:nth-last-child(-n+2) { border-bottom: 0; }
.ew-data-grid dt { margin-bottom: 5px; color: #8a91a1; font-size: 9px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.ew-data-grid dd { margin: 0; color: #30384a; font-size: 11px; font-weight: 650; overflow-wrap: anywhere; }
.ew-assistance-box { margin-top: 16px; padding: 14px 16px; border-radius: 12px; color: #75521e; background: #fff8e9; font-size: 11px; }
.ew-assistance-box ul { margin: 7px 0 0; padding-left: 18px; }
.ew-declaration { margin-top: 18px; padding: 19px; border-left: 3px solid #7167e5; border-radius: 0 12px 12px 0; background: #f8f8fc; }
.ew-declaration > span { color: #756d93; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ew-declaration p { margin: 8px 0 0; color: #40495b; font-size: 12px; line-height: 1.7; }
.ew-declaration > div { margin-top: 14px; padding-top: 13px; border-top: 1px solid #e6e6ec; font-size: 10px; }
.ew-product-list { margin: 17px -25px -25px; }
.ew-product-row { display: flex; align-items: center; gap: 13px; min-height: 63px; padding: 12px 25px; border-top: 1px solid #efeff3; }
.ew-quantity { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px; color: #5c53c6; background: #efedff; font-size: 11px; font-weight: 800; }
.ew-product-row > div { display: flex; flex: 1; flex-direction: column; gap: 3px; }
.ew-product-row strong { color: #30384a; font-size: 11px; }
.ew-product-row small { color: #8b92a0; font-size: 9px; }
.ew-note-form { display: flex; align-items: flex-end; gap: 12px; margin-top: 18px; }
.ew-note-form .ew-field { flex: 1; }
.ew-notes-list { margin-top: 18px; border-top: 1px solid #efeff3; }
.ew-notes-list article { display: flex; gap: 12px; padding: 15px 0; border-bottom: 1px solid #efeff3; }
.ew-notes-list article > span { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 9px; color: #5d54c8; background: #efedff; font-size: 10px; font-weight: 800; }
.ew-notes-list time { color: #9299a7; font-size: 9px; }
.ew-notes-list p { margin: 5px 0 0; color: #4b5567; font-size: 11px; line-height: 1.55; }
.ew-timeline { margin: 20px 0 0; padding: 0; list-style: none; }
.ew-timeline li { position: relative; display: flex; gap: 13px; min-height: 51px; }
.ew-timeline li > span { position: relative; z-index: 1; width: 11px; height: 11px; flex: 0 0 11px; margin-top: 3px; border: 3px solid #6d62e9; border-radius: 50%; background: white; }
.ew-timeline li:not(:last-child)::before { content: ""; position: absolute; left: 5px; top: 14px; width: 1px; height: calc(100% - 4px); background: #dddeea; }
.ew-timeline li div { display: flex; flex-direction: column; gap: 3px; }
.ew-timeline strong { color: #3e4759; font-size: 10px; }
.ew-timeline time { color: #969caa; font-size: 9px; }
.ew-timeline-event small { color: #6d62e9; font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.ew-timeline-byline { color: #737b8d; font-weight: 550; }
.ew-timeline-event small .ew-timeline-byline { font-size: inherit; letter-spacing: normal; text-transform: none; }
.ew-sticky-card { position: sticky; top: 15px; }
.ew-status-form { display: grid; gap: 12px; }
.ew-status-form .ew-field { min-width: 0; }
.ew-email-list, .ew-subscription-list { display: grid; gap: 10px; margin-top: 17px; }
.ew-email-list > div, .ew-subscription-list > div { display: flex; align-items: center; gap: 10px; padding: 11px; border: 1px solid #ececf2; border-radius: 11px; }
.ew-email-list strong, .ew-subscription-list strong { display: block; color: #3c4557; font-size: 10px; }
.ew-email-list small, .ew-subscription-list small { display: block; margin-top: 2px; color: #9198a6; font-size: 9px; }
.ew-delivery-dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #e4ad4a; box-shadow: 0 0 0 4px #fff5df; }
.ew-delivery-dot--sent { background: #26b887; box-shadow: 0 0 0 4px #e2f8f0; }
.ew-mini-empty { margin-top: 15px; padding: 15px; border-radius: 11px; color: #8991a0; background: #f7f8fa; font-size: 10px; text-align: center; }

/* Settings */
.ew-settings-nav { display: flex; align-items: center; gap: 5px; overflow-x: auto; padding: 7px; border: 1px solid var(--ew-line); border-radius: 15px; background: white; box-shadow: 0 5px 18px rgba(33,42,70,.04); }
.ew-settings-nav a { display: flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 11px; border-radius: 9px; color: #697184; text-decoration: none; font-size: 10px; font-weight: 700; white-space: nowrap; }
.ew-settings-nav a span { color: #8b83bf; font-size: 13px; }
.ew-settings-nav a:hover { background: #f7f7fa; }
.ew-settings-nav a.is-active { color: #5047b9; background: #efedff; }
.ew-settings-form { display: grid; gap: 15px; }
.ew-form-card > .ew-card-header { padding-bottom: 20px; border-bottom: 1px solid #eff0f3; }
.ew-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 19px; margin-top: 21px; }
.ew-toggle-card { display: flex; align-items: center; gap: 11px; min-height: 68px; padding: 12px 14px; border: 1px solid #e4e5eb; border-radius: 12px; cursor: pointer; }
.ew-toggle-card > input { position: absolute; opacity: 0; pointer-events: none; }
.ew-toggle { position: relative; width: 34px; height: 20px; flex: 0 0 34px; border-radius: 99px; background: #d6d9e1; transition: background .18s; }
.ew-toggle::after { content: ""; position: absolute; width: 16px; height: 16px; left: 2px; top: 2px; border-radius: 50%; background: white; box-shadow: 0 2px 5px rgba(0,0,0,.18); transition: transform .18s; }
.ew-toggle-card input:checked + .ew-toggle { background: #695ee9; }
.ew-toggle-card input:checked + .ew-toggle::after { transform: translateX(14px); }
.ew-toggle-card strong { display: block; color: #3d4658; font-size: 11px; }
.ew-toggle-card small { display: block; margin-top: 3px; color: #8b92a1; font-size: 9px; font-weight: 450; }
.ew-color-field { display: flex; flex-direction: column; gap: 8px; color: #424b5e; font-size: 12px; font-weight: 650; }
.ew-color-field > div { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 7px 10px; border: 1px solid #e0e2e8; border-radius: 11px; }
.ew-color-field input { width: 36px; height: 32px; padding: 0; border: 0; background: transparent; }
.ew-color-field code { color: #697184; font-size: 11px; }
.ew-storefront-preview { display: flex; align-items: center; justify-content: space-between; min-height: 78px; padding: 18px 21px; border-radius: 13px; }
.ew-storefront-preview span { font-size: 10px; opacity: .7; }
.ew-storefront-preview strong { padding: 10px 14px; border: 1px solid currentColor; border-radius: 9px; font-size: 11px; }
.ew-language-fieldset { margin: 21px 0 0; padding: 0; border: 0; }
.ew-language-fieldset legend { color: #3b4557; font-size: 12px; font-weight: 750; }
.ew-language-fieldset > p { margin: 5px 0 16px; color: #89909f; font-size: 10px; }
.ew-language-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ew-language-card { position: relative; display: flex; align-items: center; gap: 10px; min-height: 55px; padding: 10px 12px; border: 1px solid #e1e3e9; border-radius: 12px; cursor: pointer; }
.ew-language-card input { position: absolute; opacity: 0; }
.ew-language-card > span { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 9px; color: #665dd3; background: #f0eeff; font-size: 9px; font-weight: 800; }
.ew-language-card strong { flex: 1; color: #485164; font-size: 10px; }
.ew-language-card i { display: none; color: #6359dc; font-style: normal; font-size: 11px; font-weight: 900; }
.ew-language-card:has(input:checked) { border-color: #8880ed; background: #faf9ff; box-shadow: 0 0 0 2px rgba(102,92,246,.08); }
.ew-language-card:has(input:checked) i { display: block; }
.ew-info-box { display: flex; align-items: flex-start; gap: 12px; padding: 15px; border: 1px solid #dedcf5; border-radius: 12px; color: #53517a; background: #f8f7ff; }
.ew-info-box > span { display: grid; place-items: center; width: 27px; height: 27px; flex: 0 0 27px; border-radius: 8px; color: white; background: #6c62db; font-family: Georgia, serif; font-size: 13px; font-weight: 700; }
.ew-info-box strong { color: #474366; font-size: 11px; }
.ew-info-box p { margin: 4px 0 0; font-size: 10px; line-height: 1.55; }
.ew-code-editor { color: #d8d9e6 !important; background: #1d2030 !important; border-color: #2c3043 !important; font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size: 10px !important; }
.ew-save-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 17px; border: 1px solid #e3e4ea; border-radius: 14px; background: white; box-shadow: 0 8px 24px rgba(33,42,70,.07); }
.ew-save-bar strong { display: block; color: #3c4557; font-size: 11px; }
.ew-save-bar span { display: block; margin-top: 3px; color: #9096a4; font-size: 9px; }

/* Billing */
.ew-billing-grid { display: grid; grid-template-columns: minmax(300px, .86fr) minmax(0, 1.14fr); gap: 16px; align-items: stretch; }
.ew-plan-card { position: relative; overflow: hidden; min-height: 450px; padding: 28px; border-radius: 20px; color: white; background: linear-gradient(150deg, #17182f 0%, #292456 62%, #42357d 100%); box-shadow: 0 18px 44px rgba(36,31,82,.2); }
.ew-plan-card::after { content: ""; position: absolute; inset: 0; opacity: .1; background-image: linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px); background-size: 30px 30px; mask-image: linear-gradient(135deg,transparent,black); pointer-events: none; }
.ew-plan-glow { position: absolute; width: 190px; height: 190px; right: -30px; top: -50px; border-radius: 50%; background: #725cff; filter: blur(65px); opacity: .45; }
.ew-plan-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; }
.ew-plan-name { color: #dcd9ff; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.ew-price { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; margin-top: 27px; }
.ew-price strong { font-size: 57px; line-height: 1; letter-spacing: -.065em; }
.ew-price span { color: #babbd0; font-size: 10px; line-height: 1.45; }
.ew-plan-card > p { position: relative; z-index: 1; max-width: 360px; margin: 16px 0 20px; color: #c8c9d9; font-size: 12px; line-height: 1.65; }
.ew-plan-features { position: relative; z-index: 1; display: grid; gap: 11px; margin: 0 0 26px; padding: 19px 0; border-top: 1px solid rgba(255,255,255,.13); border-bottom: 1px solid rgba(255,255,255,.13); list-style: none; }
.ew-plan-features li { display: flex; align-items: center; gap: 9px; color: #e5e5ef; font-size: 11px; }
.ew-plan-features span { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 6px; color: #15162e; background: #66e0b2; font-size: 9px; font-weight: 900; }
.ew-plan-card .ew-button { position: relative; z-index: 1; }
.ew-billing-side { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.ew-billing-side > .ew-info-box { grid-column: 1 / -1; }
.ew-billing-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: white; background: #111; font-size: 15px; font-weight: 800; }
.ew-billing-status { display: flex; align-items: center; gap: 11px; margin-top: 18px; padding: 13px; border: 1px solid #e8e9ee; border-radius: 12px; }
.ew-billing-status > span { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #e2a542; box-shadow: 0 0 0 5px #fff4de; }
.ew-billing-status > span.is-active { background: #27b889; box-shadow: 0 0 0 5px #e0f8ef; }
.ew-billing-status strong { display: block; color: #3e4658; font-size: 10px; }
.ew-billing-status small { display: block; margin-top: 2px; color: #9298a5; font-size: 9px; }
.ew-subscription-list > div > span { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 9px; color: #5e54c9; background: #efedff; font-size: 10px; font-weight: 800; }
.ew-plan-note { display: grid; grid-template-columns: .55fr 1fr; align-items: center; }
.ew-plan-note .ew-kicker { grid-column: 1; }
.ew-plan-note h2 { grid-column: 1; }
.ew-plan-note p { grid-column: 2; grid-row: 1 / 3; margin: 0; color: #72798a; font-size: 11px; line-height: 1.6; }

@media (max-width: 900px) {
  .ew-detail-grid, .ew-billing-grid { grid-template-columns: 1fr; }
  .ew-billing-side { grid-template-columns: 1fr 1fr; }
  .ew-sticky-card { position: static; }
  .ew-language-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 650px) {
  .ew-page { gap: 13px; }
  .ew-page-intro { min-height: 0; padding: 25px 21px; border-radius: 16px; }
  .ew-page-intro h1 { font-size: 25px; }
  .ew-count-orb, .ew-settings-symbol { display: none; }
  .ew-filter-form, .ew-note-form { align-items: stretch; flex-direction: column; }
  .ew-filter-form .ew-field, .ew-filter-form .ew-button { width: 100%; }
  .ew-card { padding: 20px; border-radius: 15px; }
  .ew-table-card { padding: 0; }
  .ew-table th:nth-child(4), .ew-table td:nth-child(4), .ew-table th:nth-child(5), .ew-table td:nth-child(5) { display: none; }
  .ew-detail-hero { align-items: flex-start; flex-direction: column; }
  .ew-detail-hero-meta { align-items: flex-start; flex-direction: column; }
  .ew-data-grid, .ew-form-grid, .ew-billing-side { grid-template-columns: 1fr; }
  .ew-data-grid > div, .ew-data-grid > div:nth-child(odd) { border-right: 0; border-bottom: 1px solid #ececf2; }
  .ew-data-grid > div:last-child { border-bottom: 0; }
  .ew-field--full, .ew-billing-side > .ew-info-box { grid-column: 1; }
  .ew-language-grid { grid-template-columns: 1fr; }
  .ew-save-bar { align-items: stretch; flex-direction: column; }
  .ew-plan-note { display: block; }
  .ew-plan-note p { margin-top: 9px; }
}
.ew-global-loader { position: fixed; z-index: 2147483000; inset: 0; display: grid; place-items: center; pointer-events: all; }
.ew-global-loader__backdrop { position: absolute; inset: 0; background: rgba(244, 245, 249, .68); backdrop-filter: blur(2px); animation: ew-loader-fade .16s ease-out; }
.ew-global-loader__panel { position: relative; display: flex; align-items: center; gap: 13px; min-width: 190px; padding: 15px 18px; color: #172033; background: rgba(255, 255, 255, .97); border: 1px solid #e2e3ea; border-radius: 14px; box-shadow: 0 18px 55px rgba(31, 35, 48, .18); animation: ew-loader-rise .18s ease-out; }
.ew-global-loader__panel > div { display: flex; flex-direction: column; gap: 2px; }
.ew-global-loader__panel strong { font-size: 13px; }
.ew-global-loader__panel small { color: #7b8292; font-size: 10px; }
.ew-global-loader__spinner { width: 22px; height: 22px; flex: 0 0 22px; border: 3px solid #e4e1ff; border-top-color: #635bdf; border-radius: 50%; animation: ew-loader-spin .72s linear infinite; }
.ew-form-section-title { padding: 3px 0 12px; border-bottom: 1px solid #ececf2; }
.ew-form-section-title span { color: #6d62e9; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.ew-form-section-title p { margin: 5px 0 0; color: #7b8292; font-size: 11px; }
.ew-email-template-editor { min-height: 360px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important; font-size: 12px !important; line-height: 1.55 !important; }
.ew-template-variables { padding: 15px; background: #f8f8fc; border: 1px solid #e4e4ed; border-radius: 12px; }
.ew-template-variables > strong { display: block; margin-bottom: 10px; color: #3e4759; font-size: 11px; }
.ew-template-variables > div { display: flex; flex-wrap: wrap; gap: 7px; }
.ew-template-variables code { padding: 5px 8px; color: #574fc4; font-size: 10px; background: #eeecff; border: 1px solid #ddd9ff; border-radius: 7px; }
@keyframes ew-loader-spin { to { transform: rotate(360deg); } }
@keyframes ew-loader-fade { from { opacity: 0; } }
@keyframes ew-loader-rise { from { opacity: 0; transform: translateY(5px) scale(.98); } }
@media (prefers-reduced-motion: reduce) { .ew-global-loader__spinner { animation-duration: 1.5s; } .ew-global-loader__backdrop, .ew-global-loader__panel { animation: none; } }

/* Owner-only website enquiry inbox */
.ew-owner-shell { min-height: 100vh; padding-bottom: 48px; color: var(--ew-ink); background: #f5f5f8; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.ew-owner-topbar { display: flex; align-items: center; justify-content: space-between; min-height: 68px; margin-bottom: 22px; padding: 0 max(24px, calc((100vw - 1180px) / 2)); border-bottom: 1px solid #e5e6ec; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); }
.ew-owner-brand { display: flex; align-items: center; gap: 10px; color: #222b3e; text-decoration: none; }
.ew-owner-brand > span { display: grid; place-items: center; min-width: 34px; height: 34px; padding: 0 8px; border-radius: 10px; color: white; background: linear-gradient(145deg,#7569ff,#5147dc); font-size: 11px; font-weight: 850; box-shadow: 0 8px 20px rgba(92,80,224,.22); }
.ew-owner-brand strong { font-size: 14px; }
.ew-owner-private { padding: 7px 10px; border: 1px solid #e1defc; border-radius: 99px; color: #5d54c8; background: #f2f0ff; font-size: 9px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.ew-owner-actions { display: flex; align-items: center; gap: 10px; }
.ew-owner-signout { padding: 7px 10px; border: 1px solid #dddfe7; border-radius: 9px; color: #525a6b; background: #fff; font: inherit; font-size: 10px; font-weight: 750; cursor: pointer; }
.ew-owner-login { min-height: 100vh; display: grid; place-items: center; padding: 24px; color: #17213a; background: radial-gradient(circle at 50% 0,#eeebff 0,transparent 34%),#f5f5f8; font-family: Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.ew-owner-login-card { width: min(100%,430px); padding: 38px; border: 1px solid #e2e3eb; border-radius: 22px; background: rgba(255,255,255,.96); box-shadow: 0 24px 70px rgba(32,28,74,.14); }
.ew-owner-login-mark { margin-bottom: 22px; }
.ew-owner-login-mark span { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; color: #fff; background: linear-gradient(145deg,#7569ff,#5147dc); font-size: 13px; font-weight: 850; box-shadow: 0 12px 28px rgba(92,80,224,.25); }
.ew-owner-login-card h1 { margin: 8px 0 8px; color: #17213a; font-size: 29px; letter-spacing: -.04em; }
.ew-owner-login-card > p { margin: 0 0 26px; color: #737b8d; font-size: 13px; line-height: 1.65; }
.ew-owner-login-form { display: grid; gap: 16px; }
.ew-owner-login-form .ew-field { min-width: 0; font-size: 12px; }
.ew-owner-login-form .ew-field input { height: 46px; font-size: 14px; }
.ew-owner-login-form .ew-button { margin-top: 2px; min-height: 46px; }
.ew-owner-login-error { padding: 11px 12px; border: 1px solid #ffc8cc; border-radius: 10px; color: #a52f39; background: #fff0f1; font-size: 11px; line-height: 1.5; }
.ew-owner-login-card > a { display: inline-block; margin-top: 22px; color: #665cf6; font-size: 11px; font-weight: 700; text-decoration: none; }
.ew-owner-intro { background: linear-gradient(138deg,#191a34,#2c275c 64%,#5546a5); }
.ew-owner-cell-secondary { display: block; margin-top: 3px; color: #858c9b; font-size: 9px; }
.ew-inquiry-badge { display: inline-flex; align-items: center; min-height: 24px; padding: 0 9px; border-radius: 99px; font-size: 9px; font-weight: 800; white-space: nowrap; }
.ew-inquiry-badge--new { color: #5a50cb; background: #efedff; }
.ew-inquiry-badge--in_progress { color: #956013; background: #fff3d9; }
.ew-inquiry-badge--replied { color: #08795a; background: #dff7ef; }
.ew-inquiry-badge--closed { color: #596172; background: #eceef2; }
.ew-owner-detail-hero { margin-top: 0; }
.ew-owner-contact-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; margin: 18px -25px -25px; border-top: 1px solid #ececf2; }
.ew-owner-contact-grid > div { display: grid; gap: 5px; padding: 17px 25px; border-right: 1px solid #ececf2; border-bottom: 1px solid #ececf2; }
.ew-owner-contact-grid > div:nth-child(even) { border-right: 0; }
.ew-owner-contact-grid span { color: #8c93a2; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ew-owner-contact-grid strong, .ew-owner-contact-grid a { color: #3d4659; font-size: 11px; font-weight: 700; overflow-wrap: anywhere; }
.ew-owner-message { margin: 16px 0 0; color: #3f485a; font-size: 12px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.ew-owner-notification { display: grid; gap: 4px; margin-top: 19px; padding: 13px; border: 1px solid #e8e9ee; border-radius: 11px; background: #f8f8fb; }
.ew-owner-notification strong { color: #434c5e; font-size: 10px; }
.ew-owner-notification span { color: #838a99; font-size: 9px; line-height: 1.5; }

@media (max-width: 650px) {
  .ew-owner-topbar { padding: 0 16px; }
  .ew-owner-private { display: none; }
  .ew-owner-table th:nth-child(3), .ew-owner-table td:nth-child(3), .ew-owner-table th:nth-child(5), .ew-owner-table td:nth-child(5) { display: none; }
  .ew-owner-contact-grid { grid-template-columns: 1fr; }
  .ew-owner-contact-grid > div { border-right: 0; }
}
.ew-inquiry-row {
  cursor: pointer;
}

.ew-inquiry-row td {
  transition: background-color 150ms ease;
}

.ew-inquiry-row:hover td {
  background: rgba(108, 92, 231, 0.045);
}

.ew-inquiry-row:focus-visible {
  outline: 3px solid #6c5ce7;
  outline-offset: -3px;
}