/* SMS capability compositions use solid areas, open charts and connected paths. */
.sms-art { position:relative; isolation:isolate; display:grid; align-content:center; min-height:330px; padding:24px 14px 28px; color:#172e51; }
.sms-art *, .sms-art *::before, .sms-art *::after { box-sizing:border-box; }
.sms-art svg { display:block; width:22px; height:22px; flex:none; }
.sms-art strong { font-weight:500; }
.sms-art__note { margin:20px 0 0; color:#526178; font-size:11px; line-height:1.6; text-align:center; }
.sms-art--sending { grid-template-columns:minmax(74px,.34fr) minmax(0,1fr); align-items:center; gap:0 22px; }
.sms-art__send-source { position:relative; display:grid; gap:15px; align-content:center; min-height:134px; padding:20px 14px; border-radius:12px; background:#2458be; color:#fff; }
.sms-art__send-source>span { font-size:11px; line-height:1.5; }
.sms-art__send-source>strong { font-size:14px; line-height:1.3; }
.sms-art__send-source>i { position:absolute; right:-24px; top:calc(50% - 11px); color:#2458be; }
.sms-art__send-source>i svg { width:20px; }
.sms-art__message { min-width:0; padding:20px; border-radius:14px 14px 14px 4px; background:#fff; box-shadow:0 14px 30px -15px #173c7540; }
.sms-art__message>header { display:flex; align-items:center; justify-content:space-between; gap:14px; padding-bottom:13px; border-bottom:1px solid #e5eaf2; color:#2458be; font-size:11px; }
.sms-art__recipient { display:block; margin-top:14px; font-size:11px; color:#526178; font-variant-numeric:tabular-nums; }
.sms-art__message>p { margin:18px 0 13px; font-size:15px; line-height:1.5; }
.sms-art__digits { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:5px; }
.sms-art__digits>span { display:grid; place-items:center; height:41px; border-radius:6px; background:#e5edfc; color:#214f9f; font-size:24px; font-weight:500; font-variant-numeric:tabular-nums; }
.sms-art__accepted { display:flex; align-items:center; gap:7px; margin-top:19px; font-size:10px; line-height:1.5; color:#205d47; }
.sms-art__accepted svg { width:16px; height:16px; }
.sms-art--sending>.sms-art__note { grid-column:1/-1; }
.sms-art__analysis-head { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:24px; }
.sms-art__analysis-head strong { font-size:15px; line-height:1.4; }
.sms-art__analysis-head>span { font-size:11px; line-height:1.5; color:#526178; }
.sms-art__columns { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; }
.sms-art__country { display:grid; grid-template-rows:auto 150px auto; gap:10px; text-align:center; font-variant-numeric:tabular-nums; }
.sms-art__country>span { color:#214f9f; font-size:11px; line-height:1.5; }
.sms-art__country>div { display:flex; align-items:end; justify-content:center; border-bottom:1px solid #c8d7ec; }
.sms-art__country i { display:block; width:85%; max-width:40px; border-radius:8px 8px 0 0; background:#2458be; transform-origin:bottom; }
.sms-art__country:nth-child(2n) i { background:#8eade5; }
.sms-art__country:nth-child(3n) i { background:#b1d9c5; }
.sms-art__country>strong { color:#526178; font-size:12px; line-height:1.5; }
.sms-art .sms-art__network { width:100%; height:auto; }
.sms-art__network text { font-family:inherit; font-size:16px; }
.sms-art__path-base { stroke:#c0d1eb; stroke-width:3px; }
.sms-art__packet { stroke:#2458be; stroke-width:4px; stroke-linecap:round; stroke-dasharray:.09 .91; }
.sms-art__packet.packet--2 { stroke:#28745b; }
.sms-art__route-status { display:flex; justify-content:center; align-items:center; gap:12px; margin-top:12px; color:#526178; font-size:11px; line-height:1.5; }
.sms-art__route-status>span:last-child { color:#205d47; }
.sms-art__route-status svg { width:17px; height:17px; color:#2458be; }
.sms-art__monitor { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:24px; align-items:center; }
.sms-art__signal { min-width:0; }
.sms-art__signal>strong { display:block; margin-bottom:14px; font-size:13px; line-height:1.5; }
.sms-art .sms-art__signal svg { width:100%; height:auto; overflow:hidden; }
.sms-art__health { display:grid; gap:15px; margin:0; padding:0; list-style:none; }
.sms-art__health>li { display:flex; align-items:center; gap:10px; font-size:11px; line-height:1.6; }
.sms-art__health>li>span:first-child { display:grid; place-items:center; flex:none; width:28px; height:28px; border-radius:8px; background:#dcefe6; color:#205d47; }
.sms-art__health .health-icon--1 { background:#f5e4d5!important; color:#7d4722!important; }
.sms-art__health svg { width:17px; height:17px; }
.sms-art__metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:27px 0 0; padding-top:19px; border-top:1px solid #dce3ed; }
.sms-art__metrics>div { display:grid; grid-template-rows:minmax(32px,auto) auto; gap:7px; }
.sms-art__metrics dt { color:#526178; font-size:11px; line-height:1.5; }
.sms-art__metrics dd { margin:0; font-size:26px; font-weight:500; line-height:1.1; font-variant-numeric:tabular-nums; }
@media(max-width:600px) {
 .sms-art { padding-inline:8px; }
 .sms-art--sending { gap:0 16px; grid-template-columns:74px minmax(0,1fr); }
 .sms-art__send-source { padding:17px 10px; }
 .sms-art__send-source>strong { font-size:12px; }
 .sms-art__send-source>span { font-size:10px; }
 .sms-art__send-source>i { right:-18px; }
 .sms-art__send-source>i svg { width:16px; }
 .sms-art__message { padding:16px 13px; }
 .sms-art__message>p { font-size:14px; }
 .sms-art__digits { gap:4px; }
 .sms-art__digits>span { height:35px; font-size:20px; }
 .sms-art__recipient { font-size:10px; }
 .sms-art__analysis-head { gap:12px; }
 .sms-art__analysis-head strong { font-size:13px; }
 .sms-art__analysis-head>span { font-size:10px; }
 .sms-art__columns { gap:9px; }
 .sms-art__country { grid-template-rows:auto 140px auto; }
 .sms-art__country>span { font-size:10px; }
 .sms-art__monitor { gap:15px; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); }
 .sms-art__health { gap:12px; }
 .sms-art__health>li { gap:7px; font-size:10px; }
 .sms-art__signal>strong { font-size:12px; }
 .sms-art__metrics { gap:12px; }
 .sms-art__metrics dd { font-size:24px; }
}
/* Sending: editable request -> transit -> one branded SMS and its acceptance receipt. */
.sms-art--sending { display:grid; grid-template-columns:minmax(0,1fr); gap:0; }
.sms-send { display:grid; grid-template-columns:minmax(0,1fr) 34px minmax(0,1.05fr); align-items:center; }
.sms-send__request { min-width:0; border-radius:13px; background:#fff; overflow:hidden; box-shadow:0 14px 30px -15px #173c7540; }
.sms-send__request>header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; background:#2458be; color:#fff; font-size:12px; }
.sms-send__request>header svg { width:20px; height:20px; }
.sms-send__request dl { display:grid; gap:14px; margin:0; padding:18px 16px; }
.sms-send__request dl>div { display:grid; gap:5px; }
.sms-send__request dt { font-size:10px; line-height:1.5; color:#526178; }
.sms-send__request dd { margin:0; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.sms-send__request .sms-send__content { padding-top:12px; border-top:1px solid #e5eaf2; }
.sms-send__content dd { font-size:11px; }
.sms-send__content b { color:#2458be; font-weight:500; font-variant-numeric:tabular-nums; }
.sms-send__submit { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 16px 16px; padding:10px 12px; border-radius:8px; background:#2458be; color:#fff; font-size:11px; line-height:1.5; }
.sms-send__submit svg { width:16px; height:16px; }
.sms-send .sms-send__transfer svg { display:block; width:100%; height:32px; }
.sms-send__preview { min-width:0; }
.sms-send__preview>header { display:flex; align-items:center; gap:10px; margin:0 4px 15px; }
.sms-send__avatar { display:grid; place-items:center; flex:none; width:35px; height:35px; border-radius:11px; background:#2458be; color:#fff; }
.sms-send__avatar svg { width:20px; height:20px; }
.sms-send__preview>header>div { display:grid; gap:5px; }
.sms-send__preview>header strong { font-size:14px; }
.sms-send__preview>header>div>span { color:#526178; font-size:10px; }
.sms-send__bubble { padding:20px 17px; border-radius:4px 14px 14px; background:#e5edfc; color:#214f9f; }
.sms-send__to { font-size:10px; color:#42618b; font-variant-numeric:tabular-nums; }
.sms-send__bubble p { margin:16px 0 12px; font-size:15px; line-height:1.5; }
.sms-send__code { display:flex; align-items:center; gap:3px; }
.sms-send__digit { display:block; width:19px; height:32px; overflow:hidden; font-size:28px; line-height:32px; font-weight:500; font-variant-numeric:tabular-nums; }
.sms-send__digit>span { display:block; transform:translateY(-33.333333%); }
.sms-send__digit i { display:block; height:32px; font-style:normal; }
.sms-send__receipt { display:flex; align-items:center; gap:7px; margin:15px 4px 0; color:#205d47; font-size:10px; line-height:1.5; }
.sms-send__receipt>span { display:grid; place-items:center; flex:none; width:23px; height:23px; border-radius:50%; background:#dcefe6; }
.sms-send__receipt svg { width:15px; height:15px; }
@media(max-width:600px) {
 .sms-send { grid-template-columns:minmax(0,1fr); }
 .sms-send__request dl { grid-template-columns:1fr 1fr; gap:12px; }
 .sms-send__request .sms-send__content { grid-column:1/-1; }
 .sms-send__request dd { font-size:11px; }
 .sms-send__request>header { padding-block:12px; }
 .sms-send__request dl { padding-block:14px; }
 .sms-send__submit { margin-bottom:14px; }
 .sms-send__transfer { height:40px; width:34px; justify-self:center; rotate:90deg; }
 .sms-send__preview { width:94%; justify-self:center; }
 .sms-send__bubble { padding:18px; }
 .sms-send__bubble p { margin-top:12px; }
}

/* SMS-specific demo compositions retained separately from the shared layout. */
.sms-platform__tags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.sms-platform__tags span { color: #345580; font-size: 12px; line-height: 1.5; padding: 4px 9px; border: 1px solid #ccd8ea; border-radius: 5px; }
.sms-platform__sending, .sms-platform__report, .sms-platform__monitor, .sms-platform__routes { background: #fff; border: 1px solid #e3e9f2; border-radius: 14px; padding: 20px 22px; font-size: 13px; color: #475569; box-shadow: 0 14px 34px -22px rgb(15 23 42 / .28); }
.sms-values__demo-surface > .sms-platform__sending,
.sms-values__demo-surface > .sms-platform__report,
.sms-values__demo-surface > .sms-platform__monitor,
.sms-values__demo-surface > .sms-platform__routes { padding: 0; border: 0; background: transparent; border-radius: 0; box-shadow: none; }
.sms-values__demo-surface .sms-platform__card { background: #fff; border: 1px solid #e3e9f2; border-radius: 12px; padding: 18px 20px; box-shadow: 0 14px 34px -24px rgb(15 23 42 / .32); }
.sms-values__demo-surface .sms-platform__card > .sms-platform__sending,
.sms-values__demo-surface .sms-platform__card > .sms-platform__report,
.sms-values__demo-surface .sms-platform__card > .sms-platform__routes,
.sms-values__demo-surface .sms-platform__card > .sms-platform__monitor { padding: 0; border: 0; background: transparent; border-radius: 0; box-shadow: none; }
.sms-platform__sending > div:not(.sms-platform__status) { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.sms-platform__sending > div:not(.sms-platform__status) span { color: #7a8aa3; font-size: 12px; }
.sms-platform__sending strong { color: #0f172a; font-weight: 500; }
.sms-platform__sending p { margin: 12px 0; border-block: 1px solid #e7edf5; padding-block: 12px; }
.sms-platform__sending b[data-sms-code] { display: inline-flex; gap: 5px; margin-left: 8px; vertical-align: -6px; }
.sms-platform__sending b i { display: inline-grid; place-items: center; width: 24px; height: 26px; border: 1px solid #cdd9ec; border-radius: 6px; background: #f6f9ff; color: #1c5bdd; font-size: 14px; font-style: normal; font-weight: 600; letter-spacing: 0; box-shadow: inset 0 -2px 0 #dfe8f7; font-variant-numeric: tabular-nums; }
.sms-platform__status { display: inline-flex; align-items: center; gap: 8px; color: #23735c; }
.sms-platform__status i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.sms-platform__sending .sms-platform__status { margin-top: 12px; padding: 6px 12px; background: #e9f6f0; border-radius: 999px; }
.sms-platform__report-head, .sms-platform__monitor > div { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.sms-platform__report-head strong { font-weight: 500; color: #0f172a; }
.sms-platform__report-head span, .sms-platform__monitor > div > span:last-child { color: #7a8aa3; font-size: 12px; }
.sms-platform__bar { display: grid; grid-template-columns: 30px 1fr 34px; align-items: center; gap: 16px; margin-top: 12px; }
.sms-platform__bar > span { color: #7a8aa3; font-size: 12px; font-variant-numeric: tabular-nums; }
.sms-platform__bar > div { height: 8px; background: #edf2fa; border-radius: 3px; overflow: hidden; }
.sms-platform__bar i { display: block; height: 100%; background: #2868ed; border-radius: 3px; transform-origin: left; }
.sms-platform__bar b { color: #1c5bdd; font-size: 12px; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.sms-platform__routes { display: grid; grid-template-columns: 52px 1fr 52px; align-items: center; gap: 20px; }
.sms-platform__endpoint { display: grid; place-items: center; height: 44px; background: #f6f9ff; border: 1px solid #ccd8ea; border-radius: 8px; color: #1c5bdd; font-size: 13px; }
.sms-platform__route { position: relative; display: flex; align-items: center; gap: 12px; padding-block: 10px; color: #345580; font-size: 12px; }
.sms-platform__line { position: relative; flex: 1; height: 2px; border-radius: 2px; background: #e3eaf6; }
.sms-platform__line b { display: block; height: 100%; border-radius: 2px; background: #2868ed; transform-origin: left; }
.sms-platform__line em { position: absolute; top: 50%; left: 0; width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px; border-radius: 50%; background: #2868ed; box-shadow: 0 0 0 3px rgb(40 104 237 / .16); opacity: 0; pointer-events: none; }
.sms-platform__route.is-standby { color: #526481; }
.sms-platform__route.is-standby .sms-platform__line b { background: #a9bedf; }
.sms-platform__route.is-standby .sms-platform__line em { background: #a9bedf; box-shadow: 0 0 0 3px rgb(169 190 223 / .18); }
.sms-platform__monitor ol { list-style: none; margin: 0; padding: 0; display: flex; gap: 20px; }
.sms-platform__monitor li { display: flex; flex: 1; flex-direction: column; gap: 8px; }
.sms-platform__monitor li > span { color: #1c5bdd; font-variant-numeric: tabular-nums; }
.sms-platform__foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 14px; }
.sms-platform__foot .sms-platform__tags { margin-top: 0; }
.sms-values__demo-surface .sms-platform__foot { margin-top: 10px; padding-top: 10px; border-top: 1px solid #dbe4f0; }
.sms-platform__foot .sms-values__caption { margin: 0; white-space: nowrap; }
@media (max-width: 640px) {
  .sms-platform__routes { gap: 10px; grid-template-columns: 40px 1fr 40px; }
  .sms-platform__sending, .sms-platform__report, .sms-platform__monitor, .sms-platform__routes { padding: 14px; }
  .sms-platform__monitor ol { flex-direction: column; gap: 12px; }
  .sms-platform__monitor li { flex-direction: row; }
  .sms-platform__foot { flex-direction: column; align-items: flex-start; gap: 10px; }
}
/* SMS: one message card, with open chart and network illustrations beside it. */
.sms-mini { display:grid; align-content:center; min-height:208px; padding:8px 0 24px; color:#172e51; }
.sms-mini__message { width:min(100%,360px); box-sizing:border-box; padding:24px; border:1px solid #e1e6ed; border-radius:12px; background:#fff; box-shadow:0 12px 28px -20px #183b7640; }
.sms-mini__message>div { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; }
.sms-mini__message strong { font-weight:600; }
.sms-mini__message>div>span { color:#526178; font-size:11px; }
.sms-mini__message p { margin:24px 0 8px; color:#526178; font-size:13px; }
.sms-mini__message>b { display:flex; gap:10px; color:#172e51; font-size:28px; font-weight:500; font-variant-numeric:tabular-nums; }
.sms-mini__message>b i { display:block; font-style:normal; }
.sms-mini__accepted { display:flex; align-items:center; gap:6px; margin-top:20px; color:#28745b; font-size:11px; }
.sms-mini__accepted::before { content:''; width:5px; height:5px; border-radius:50%; background:currentColor; }
.sms-mini__metric { display:flex; align-items:center; gap:20px; }
.sms-mini__metric>strong { font-size:44px; font-weight:500; line-height:1.2; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.sms-mini__metric>strong>span { font-size:24px; }
.sms-mini__metric>div { display:grid; gap:6px; color:#526178; font-size:12px; }
.sms-mini__metric small { font-size:11px; }
.sms-mini__chart { width:100%; max-height:124px; margin-top:20px; overflow:visible; }
.sms-mini__baseline { stroke:#dce3ed; stroke-width:1; }
.sms-mini__chart [data-mini-curve] { stroke:#3c79e9; stroke-width:2.5; stroke-linecap:round; stroke-dasharray:1; }
.sms-mini__chart circle { fill:#3c79e9; }
.sms-mini__network { display:block; width:100%; height:auto; max-height:208px; overflow:visible; }
.sms-mini__network [data-mini-route] { stroke:#3c79e9; stroke-width:2; stroke-dasharray:1; stroke-linecap:round; }
.sms-mini__network [data-mini-route="2"] { stroke:#28745b; }
.sms-mini__network circle { fill:#3c79e9; stroke:none; }
.sms-mini__network text { fill:#526178; stroke:none; font-size:12px; font-family:inherit; }
.sms-mini--routing { display:flex; align-items:center; gap:36px; }
.sms-mini__gauge { width:132px; flex-shrink:0; display:grid; justify-items:center; gap:8px; }
.sms-mini__gauge svg { width:120px; height:120px; }
.sms-mini__track { stroke:#e2e7ee; stroke-width:6; }
.sms-mini__gauge [data-mini-ring] { stroke:#3c79e9; stroke-width:6; stroke-dasharray:1; stroke-linecap:round; transform:rotate(-90deg); transform-origin:60px 60px; }
.sms-mini__gauge>span { color:#526178; font-size:11px; }
.sms-mini__health { display:grid; gap:20px; }
.sms-mini__health>span { display:flex; align-items:center; gap:10px; color:#526178; font-size:13px; line-height:1.5; }
.sms-mini__health i { width:6px; height:6px; border-radius:50%; background:currentColor; flex-shrink:0; }
@media(max-width:600px) {
 .sms-mini__message { padding:20px; }
 .sms-mini__message>div { gap:8px; }
 .sms-mini__message>div>span { font-size:10px; }
 .sms-mini--routing { gap:16px; }
 .sms-mini__gauge { width:96px; }
 .sms-mini__gauge svg { width:92px; height:92px; }
 .sms-mini__health>span { font-size:12px; gap:8px; }
}
/* Supplement the trend illustration with country snapshots, without another container. */
.sms-mini__country-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px 28px; margin-top:20px; }
.sms-mini__country-summary>span { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; }
.sms-mini__country-summary i { font-style:normal; color:#526178; }
.sms-mini__country-summary strong { font-weight:500; font-variant-numeric:tabular-nums; }
.sms-mini__country-summary>span:first-child { color:#3157a2; }
.sms-mini__dimensions { margin:20px 0 0; color:#526178; font-size:11px; line-height:1.7; }
.sms-mini__message .sms-mini__recipient { margin-top:10px; color:#526178; font-size:11px; }
.sms-mini__route-status { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; margin-top:16px; color:#526178; font-size:11px; line-height:1.6; }
.sms-mini__route-status>span:last-child { text-align:right; }
.sms-mini__monitor-label { font-size:13px; font-weight:500; color:#172e51; }
@media(max-width:600px) {
 .sms-mini__country-summary { gap:16px 20px; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .sms-mini__route-status { font-size:10px; }
}

/* Route monitoring: explicit path switching and useful example metrics. */
.sms-mini--routing { display:grid; gap:0; }
.sms-mini__routing-main { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); align-items:center; gap:28px; }
.sms-mini__routing-visual svg { display:block; width:100%; height:auto; overflow:visible; }
.sms-mini__routing-visual rect { fill:#fcfbf7; stroke:#3157a2; stroke-width:1.5; }
.sms-mini__routing-visual circle { fill:#fcfbf7; stroke:#3157a2; stroke-width:1.5; }
.sms-mini__routing-visual text { fill:#526178; font-size:11px; font-family:inherit; stroke:none; }
.sms-mini__routing-visual [data-monitor-path] { stroke:#3157a2; stroke-width:2.5; stroke-dasharray:.12 .88; stroke-linecap:round; }
.sms-mini__routing-visual [data-monitor-path="1"] { stroke:#28745b; }
.sms-mini__routing-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:28px 0 0; padding-top:20px; border-top:1px solid #dce3ed; }
.sms-mini__routing-metrics>div { display:grid; gap:8px; }
.sms-mini__routing-metrics dt { color:#526178; font-size:12px; line-height:1.5; }
.sms-mini__routing-metrics dd { margin:0; color:#172e51; font-size:26px; font-weight:500; font-variant-numeric:tabular-nums; line-height:1.2; }
@media(max-width:600px) {
 .sms-mini__routing-main { gap:16px; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); }
 .sms-mini__routing-metrics { gap:12px; }
 .sms-mini__routing-metrics dt { font-size:11px; }
 .sms-mini__routing-metrics dd { font-size:24px; }
}
@media(max-width:600px) {
 .sms-mini__routing-main { grid-template-columns:minmax(0,1fr); gap:24px; }
 .sms-mini__routing-visual { width:min(100%,320px); margin-inline:auto; }
 .sms-mini__health { gap:14px; }
}
/* Report composition: trend on the left, country snapshots on the right. */
.sms-mini__analysis-layout { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); align-items:start; gap:28px; }
.sms-mini__trend { min-width:0; }
.sms-mini__trend-caption { display:grid; gap:5px; color:#526178; font-size:11px; line-height:1.5; }
.sms-mini__trend-caption small { font-size:10px; }
.sms-mini__trend-value { display:block; margin-top:8px; color:#172e51; font-size:42px; line-height:1.15; font-weight:500; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.sms-mini__trend-label { display:block; margin-top:18px; color:#172e51; font-size:10px; font-weight:500; }
.sms-mini__trend .sms-mini__chart { display:block; max-height:none; margin-top:12px; }
.sms-mini__country-heading { display:block; color:#172e51; font-size:11px; font-weight:600; line-height:1.5; }
.sms-mini__country-panel .sms-mini__country-summary { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; margin-top:10px; }
.sms-mini__country-panel .sms-mini__country-summary>span { padding:7px 10px; border-radius:3px; font-size:11px; line-height:1.4; }
.sms-mini__country-summary>span.is-selected { background:#d5e3f6; color:#172e51; }
@media(max-width:600px) {
 .sms-mini__analysis-layout { grid-template-columns:minmax(0,1fr); gap:24px; }
 .sms-mini__trend .sms-mini__chart { max-height:150px; }
 .sms-mini__country-panel .sms-mini__country-summary { grid-template-columns:minmax(0,1fr); }
 .sms-mini__country-panel .sms-mini__country-summary>span { font-size:12px; }
}
/* Country snapshots use a zero-based bar scale, without a fabricated time series. */
.sms-mini__comparison-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; }
.sms-mini__comparison-heading strong { color:#172e51; font-size:14px; font-weight:500; }
.sms-mini__comparison-heading>span { font-size:11px; color:#526178; }
.sms-mini__comparison { display:grid; gap:20px; }
.sms-mini__comparison>div { display:grid; grid-template-columns:24px minmax(0,1fr) 48px; gap:20px; align-items:center; font-size:12px; line-height:1.5; }
.sms-mini__comparison strong { font-weight:500; color:#526178; }
.sms-mini__comparison>div>div { height:7px; background:#e8edf4; border-radius:4px; overflow:hidden; }
.sms-mini__comparison i { display:block; height:100%; background:#3c79e9; border-radius:4px; transform-origin:left; }
.sms-mini__comparison>div>span { text-align:right; color:#172e51; font-variant-numeric:tabular-nums; }
.sms-mini__network--labelled { max-height:250px; }
.sms-mini__network .sms-mini__route-base { stroke:#adc1df; stroke-width:1.5; }
.sms-mini__network .sms-mini__route-base.is-standby { stroke:#83b3a5; stroke-dasharray:4 3; }
.sms-mini__route-label rect { fill:#f4f6f8; stroke:#b6c7de; stroke-width:1.5; }
.sms-mini__route-label.route-label--0 rect { fill:#eef4ff; stroke:#3c79e9; }
.sms-mini__route-label.route-label--0 text { fill:#3157a2; }
.sms-mini__route-label.route-label--2 rect { fill:#fcfbf7; stroke:#83b3a5; stroke-dasharray:4 2; }
@media(max-width:600px) {
 .sms-mini__comparison>div { gap:12px; grid-template-columns:22px minmax(0,1fr) 44px; }
}
/* A compact SMS notification with one clear code area. */
.sms-mini__message { padding:24px; border-color:#dae3f0; box-shadow:0 12px 30px -20px #183b7640; }
.sms-mini__message .sms-mini__message-top { justify-content:flex-start; gap:12px; }
.sms-mini__message-icon { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; border-radius:10px; background:#e9f0ff; color:#3157a2; }
.sms-mini__message-icon svg { width:20px; height:20px; }
.sms-mini__sender { display:grid; gap:4px; flex:1; }
.sms-mini__sender strong { font-size:14px; }
.sms-mini__sender>span { font-size:10px; color:#526178; }
.sms-mini__message .sms-mini__message-top>.sms-mini__channel { font-size:10px; font-weight:500; color:#526178; letter-spacing:.08em; }
.sms-mini__message .sms-mini__recipient { margin-top:20px; padding-top:16px; border-top:1px solid #e7ecf3; }
.sms-mini__message p { margin-top:24px; margin-bottom:12px; }
.sms-mini__message>b { justify-content:space-between; gap:6px; padding:16px; background:#f0f4fb; border-radius:8px; color:#203e73; font-size:30px; line-height:1.2; }
.sms-mini__accepted { padding-top:16px; margin-top:16px; border-top:1px solid #e7ecf3; gap:8px; }
.sms-mini__accepted::before { display:none; }
.sms-mini__accepted svg { width:16px; height:16px; flex-shrink:0; }
@media(max-width:600px) {
 .sms-mini__message { padding:20px; }
 .sms-mini__message>b { padding:14px 12px; font-size:28px; }
}