.canvas { position: relative; isolation: isolate; overflow-x: clip; max-width: 100%; background: var(--paper-gradient); }
.atmosphere { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.wave-start { stop-color: var(--link); stop-opacity: .1; }
.wave-end { stop-color: var(--link); stop-opacity: 0; }
.wave-primary { fill: url(#lz-paper-wave); }
.wave-secondary { fill: var(--wave-ink); }
.hero { min-height: 728px; display: flex; align-items: center; padding-top: var(--s5); padding-bottom: var(--s6); }
.hero-grid { display: grid; grid-template-columns: 42% 58%; align-items: center; width: 100%; }
.copy { position: relative; z-index: 2; padding-right: var(--s6); }
.eyebrow { display: inline-flex; align-items: center; gap: var(--s1); font-size: var(--fs-ui); font-weight: var(--weight-medium); color: var(--link); margin-bottom: var(--s3); }
.eyebrow .icon { width: 16px; height: 16px; }
.eyebrow-divider { width: 24px; height: 1px; background: var(--link); opacity: .5; flex-shrink: 0; }
.headline-row { display: block; }
.keyword-underline { background: var(--underline-gradient); }
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s4); }
.description { font-size: var(--fs-body); line-height: 1.85; color: var(--muted); margin-top: var(--s3); max-width: 440px; }
.description strong { font-weight: var(--weight-semibold); color: var(--text); }
.trust-line { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3); margin-top: var(--s2); font-size: var(--fs-ui); color: var(--muted); }
.trust-line span { display: flex; align-items: center; gap: 6px; }
.trust-line .icon { color: var(--success); width: 16px; height: 16px; }
.trust-line .trust-separator { height: 12px; width: 1px; background: var(--border); }
.compatibility { margin-top: var(--s4); }
.platforms { display: flex; align-items: center; justify-content: space-between; gap: 12px; max-width: 464px; list-style: none; padding: 0; }
.platforms li { display: flex; align-items: center; gap: 7px; font-size: var(--fs-ui); font-weight: var(--weight-medium); white-space: nowrap; color: var(--accent); }
.platforms svg { width: 21px; height: 21px; fill: currentColor; overflow: hidden; }
.regions { display: flex; align-items: center; justify-content: space-between; max-width: 464px; gap: 12px; margin-top: var(--s3); }
.regions a { display: flex; align-items: center; min-height: 24px; gap: 7px; font-size: var(--fs-ui); color: var(--muted); white-space: nowrap; text-decoration: none; }
.regions a:hover { color: var(--link); }
.flag { width: 23px; height: 16px; border-radius: var(--r-flag); overflow: hidden; box-shadow: var(--shadow-flag); }
.flag-white { fill: var(--flag-white); }
.flag-red { fill: var(--flag-red); }
.flag-blue { fill: var(--flag-blue); }
.flag-white-stroke { stroke: var(--flag-white); }
.flag-red-stroke { stroke: var(--flag-red); }
.device-scene { position: relative; height: 584px; min-width: 0; }
.paper-slip { position: absolute; display: flex; align-items: center; gap: 12px; padding: var(--s2) 20px; background: var(--paper-glass); border: 1px solid var(--shine); border-radius: var(--r-panel); box-shadow: var(--shadow-slip); font-size: var(--fs-small); z-index: 3; line-height: 1.5; }
.email-slip { left: 52px; top: 32px; transform: rotate(-3deg); }
.paper-slip .icon { color: var(--link); width: 21px; height: 21px; }
.paper-slip small { display: block; margin-top: 3px; color: var(--muted); font-size: var(--fs-fine); }
.refund-slip { left: 200px; bottom: 3px; transform: rotate(2deg); padding: 14px 18px; }
.refund-slip .icon { color: var(--success); }
.laptop { position: absolute; left: 0; top: 128px; width: calc(100% - 64px); height: 364px; padding: 13px 9px 19px; border: 1px solid var(--rim); border-radius: var(--r-device); background: var(--shell-gradient); box-shadow: var(--shadow-device), var(--shadow-inset); }
.camera { position: absolute; width: 4px; height: 4px; border-radius: var(--r-button); background: var(--metal-dark); top: 5px; left: 50%; }
.laptop-screen { height: 100%; border-radius: var(--r-screen); background: var(--panel); overflow: hidden; }
.window-chrome { height: 39px; display: flex; align-items: center; gap: var(--s2); padding: 0 14px; background: var(--panel-2); border-bottom: 1px solid var(--line-soft); font-size: var(--fs-fine); color: var(--muted); }
.window-dots { display: flex; gap: 5px; }
.window-dots i { width: 7px; height: 7px; border: 1px solid var(--border); border-radius: var(--r-button); background: var(--panel); }
.window-dots i:first-child { background: var(--muted); border-color: var(--muted); opacity: .5; }
.window-name { font-weight: var(--weight-semibold); color: var(--accent); }
.window-domain { margin-left: auto; font-family: var(--mono); font-size: var(--fs-micro); }
.app-layout { display: grid; grid-template-columns: 174px 1fr; height: calc(100% - 39px); }
.region-sidebar { background: var(--paper-gradient); padding: 19px 12px 12px; border-right: 1px solid var(--line-soft); }
.ui-caption { font-size: var(--fs-micro); letter-spacing: var(--tracking-ui); color: var(--muted); font-weight: var(--weight-medium); }
.region-sidebar .ui-caption { padding-left: 10px; margin-bottom: 12px; }
.index-list { display: grid; gap: 3px; list-style: none; padding: 0; }
.index-list li { display: flex; align-items: center; gap: 9px; height: 34px; padding: 0 10px; font-size: var(--fs-fine); border-radius: var(--r-screen); }
.index-list .flag { width: 21px; height: 14px; }
.index-list .selected { background: var(--highlight); color: var(--accent); font-weight: var(--weight-semibold); }
.region-code { margin-left: auto; font-family: var(--mono); font-size: var(--fs-micro); color: var(--muted); }
.sidebar-foot { margin: 15px 10px 0; font-size: var(--fs-micro); color: var(--link); display: flex; gap: var(--s1); align-items: center; }
.sidebar-foot .icon { width: 12px; height: 12px; }
.service-view { padding: 22px 22px 0; min-width: 0; }
.service-inner { max-width: 284px; }
.service-heading { display: flex; align-items: center; justify-content: space-between; }
.service-heading h2 { font-size: var(--fs-md); font-weight: var(--weight-bold); }
.service-heading .icon { color: var(--link); width: 17px; height: 17px; }
.service-kicker { margin-top: 6px; font-size: var(--fs-micro); color: var(--muted); }
.coverage-facts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s3); padding: 21px 0 18px; border-bottom: 1px solid var(--line-soft); }
.coverage-facts strong { display: block; font-family: var(--mono); font-size: var(--fs-stat); font-weight: var(--weight-medium); letter-spacing: var(--tracking-display); line-height: 1.25; }
.coverage-facts span { display: block; margin-top: 3px; font-size: var(--fs-fine); color: var(--muted); }
.device-fact { display: flex; justify-content: space-between; gap: var(--s1); padding: 16px 0; font-size: var(--fs-fine); color: var(--muted); }
.device-fact strong { font-weight: var(--weight-semibold); color: var(--text); }
.import-note { display: flex; align-items: center; gap: var(--s1); padding: 11px 12px; background: var(--panel-2); border-radius: var(--r-screen); font-size: var(--fs-micro); color: var(--muted); }
.import-note .icon { width: 15px; height: 15px; color: var(--link); }
.laptop-base { position: absolute; top: 487px; left: -15px; width: calc(100% - 34px); height: 18px; background: var(--metal-gradient); border-radius: 0 0 var(--r-device) var(--r-device); box-shadow: var(--shadow-base); border-top: 1px solid var(--shine); }
.laptop-base::before { content: ''; display: block; margin: 0 auto; width: 92px; height: 6px; background: var(--metal-mid); border-radius: 0 0 var(--r-panel) var(--r-panel); box-shadow: var(--shadow-notch); }
.mobile-device { position: absolute; right: 0; top: 226px; width: 190px; height: 348px; padding: 6px; border: 1px solid var(--rim); border-radius: var(--r-mobile); background: var(--shell-gradient); box-shadow: var(--shadow-mobile), var(--shadow-inset); z-index: 4; }
.mobile-device::before { content: ''; position: absolute; right: -3px; top: 92px; width: 3px; height: 35px; background: var(--rim); border-radius: var(--r-screen); }
.mobile-screen { height: 100%; overflow: hidden; background: var(--panel); border-radius: var(--r-mobile-inner); padding: 12px 14px; position: relative; }
.earpiece { height: 7px; width: 46px; background: var(--accent-dark); border-radius: var(--r-button); margin: 0 auto 18px; }
.mobile-topline { display: flex; align-items: center; justify-content: space-between; font-size: var(--fs-micro); color: var(--muted); }
.mobile-topline .icon { width: 14px; height: 14px; }
.mobile-title { font-size: var(--fs-md); font-weight: var(--weight-bold); margin-top: 12px; }
.mobile-subtitle { font-size: var(--fs-micro); color: var(--muted); margin-top: 5px; }
.subscription-row { border-bottom: 1px solid var(--line-soft); padding: 15px 0 12px; }
.subscription-label { font-size: var(--fs-fine); font-weight: var(--weight-semibold); display: flex; align-items: center; gap: 7px; }
.subscription-label .icon { width: 14px; height: 14px; color: var(--link); }
.subscription-row p { font-size: var(--fs-micro); margin-top: 7px; color: var(--muted); }
.subscription-row strong { font-family: var(--mono); font-size: var(--fs-md); font-weight: var(--weight-semibold); color: var(--text); }
.mobile-note { font-size: var(--fs-micro); color: var(--muted); margin-top: 13px; text-align: center; }
.mobile-link { display: flex; justify-content: center; align-items: center; gap: var(--s1); min-height: 30px; margin-top: 12px; background: var(--highlight); color: var(--accent); border-radius: var(--r-screen); font-size: var(--fs-fine); font-weight: var(--weight-semibold); text-decoration: none; }
.mobile-link .icon { width: 12px; height: 12px; }
.home-indicator { position: absolute; bottom: 7px; left: calc(50% - 23px); width: 46px; height: 3px; border-radius: var(--r-button); background: var(--accent); }
.next-section { border-top: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; gap: var(--s3); padding-top: var(--s4); padding-bottom: var(--s5); }
.next-title { display: flex; align-items: baseline; gap: var(--s3); }
.next-title h2 { font-size: var(--fs-section); font-weight: var(--weight-bold); letter-spacing: var(--tracking-display); }
.next-title p { font-size: var(--fs-small); color: var(--muted); }
.next-section a { display: flex; align-items: center; gap: var(--s1); min-height: 24px; font-size: var(--fs-small); color: var(--link); text-decoration: none; }
.tabs { min-width: 0; }
.tabs [role="tablist"] { display: flex; gap: var(--s1); padding: 6px; width: fit-content; max-width: 100%; overflow-x: auto; border: 1px solid var(--border); border-radius: var(--r-button); background: var(--panel-2); }
.tabs [role="tab"] { flex-shrink: 0; min-height: 44px; padding: var(--s1) var(--s3); border: 0; border-radius: var(--r-button); background: var(--clear); color: var(--text); font-weight: var(--weight-semibold); }
.tabs [role="tab"][aria-selected="true"] { background: var(--accent); color: var(--on-accent); box-shadow: var(--shadow-button); }
.tab-panel { margin-top: var(--s4); }
.toc-tabs { position: sticky; top: var(--toc-top); z-index: 20; display: flex; align-items: center; gap: var(--s1); max-width: 100%; padding: var(--s1); overflow-x: auto; overscroll-behavior-x: contain; background: var(--panel); border: 1px solid var(--border); border-radius: var(--r-panel); box-shadow: var(--shadow-slip); }
.toc-tabs a { flex-shrink: 0; display: inline-flex; align-items: center; min-height: 44px; padding: var(--s1) var(--s2); border-radius: var(--r-screen); color: var(--text); font-size: var(--fs-small); text-decoration: none; }
.toc-tabs a.is-current, .toc-tabs a[aria-current="location"] { background: var(--highlight); color: var(--accent); box-shadow: var(--shadow-inset); }
.toc-tabs.toc-static { position: static; }
body:has(.toc-tabs) section[id] { scroll-margin-top: var(--toc-offset); }
.faq-list { border-top: 1px solid var(--border); }
.faq-item { border-bottom: 1px solid var(--border); }
.faq-item summary { position: relative; padding: var(--s3) var(--s5) var(--s3) 0; cursor: pointer; font-weight: var(--weight-semibold); list-style: none; min-height: 44px; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; position: absolute; right: var(--s1); top: var(--s3); color: var(--link); font-family: var(--mono); }
.faq-item[open] summary::after { content: '−'; }
.faq-answer { padding-bottom: var(--s3); color: var(--muted); max-width: 800px; }
.faq-answer > * + * { margin-top: var(--s2); }
.plan-grid, .article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); }
.plan-card { position: relative; display: flex; flex-direction: column; align-items: flex-start; padding: var(--s4); border: 1px solid var(--border); border-radius: var(--r-panel); background: var(--panel); box-shadow: var(--shadow-inset); }
.plan-card.is-current { border-color: var(--link); box-shadow: var(--shadow-selected); }
.plan-card h3 { margin-top: var(--s2); font-size: var(--fs-section); }
.plan-price { margin-top: var(--s3); font-size: var(--fs-stat); font-family: var(--mono); color: var(--accent); font-variant-numeric: tabular-nums; }
.plan-price small { font-family: var(--body); font-size: var(--fs-small); color: var(--muted); }
.plan-facts { list-style: none; padding: 0; margin-top: var(--s3); margin-bottom: var(--s4); font-size: var(--fs-small); color: var(--muted); }
.plan-facts li + li { margin-top: var(--s1); }
.plan-card .button { margin-top: auto; width: 100%; }
.badge, .tag { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 4px 12px; border-radius: var(--r-button); background: var(--highlight); color: var(--accent); font-size: var(--fs-ui); font-weight: var(--weight-medium); overflow-wrap: anywhere; }
.badge-best { background: var(--accent); color: var(--on-accent); }
.badge-success { color: var(--success); background: var(--panel); border: 1px solid var(--success); }
.status-dot { width: 6px; height: 6px; flex-shrink: 0; border-radius: var(--r-button); background: currentColor; }
.table-scroll { max-width: 100%; min-width: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--border); border-radius: var(--r-panel); background: var(--panel); }
.data-table { width: 100%; min-width: 680px; border-collapse: collapse; font-size: var(--fs-small); text-align: left; }
.data-table caption { padding: var(--s2) var(--s3); color: var(--text); font-weight: var(--weight-semibold); text-align: left; }
.data-table th, .data-table td { padding: var(--s2) var(--s3); border-bottom: 1px solid var(--line-soft); vertical-align: top; }
.data-table thead th { color: var(--text); background: var(--panel-2); font-weight: var(--weight-semibold); }
.data-table tbody th { color: var(--text); font-weight: var(--weight-semibold); }
.data-table tbody tr:last-child > * { border-bottom: 0; }
.data-table .region-group th { color: var(--accent); background: var(--highlight); }
.table-country { display: inline-flex; align-items: center; gap: var(--s1); }
.prose > .data-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; min-width: 0; }
.platform-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s3); }
.platform-card { padding-top: var(--s3); padding-bottom: var(--s3); border-top: 1px solid var(--border); }
.platform-card > svg { width: 32px; height: 32px; fill: currentColor; color: var(--accent); overflow: hidden; margin-bottom: var(--s2); }
.platform-card h3 { font-size: var(--fs-body); }
.platform-card .button { margin-top: var(--s3); padding-inline: var(--s2); }
.platform-card p { margin-top: var(--s2); color: var(--muted); font-size: var(--fs-small); }
.feature-index { display: grid; grid-template-columns: minmax(180px, .65fr) minmax(0, 1.65fr); gap: var(--s8); }
.feature-topics { align-self: start; position: sticky; top: var(--s3); }
.feature-topics a { display: flex; min-height: 44px; align-items: center; color: var(--muted); text-decoration: none; }
.feature-chapter + .feature-chapter { margin-top: var(--s8); }
.feature-chapter h3::after { content: ''; display: block; width: 48px; height: 4px; margin-top: var(--s2); background: var(--highlight); }
.feature-chapter p { margin-top: var(--s3); }
.fact-note { padding-left: var(--s2); margin-top: var(--s3); border-left: 2px solid var(--link); color: var(--muted); font-size: var(--fs-small); }
.article-card { padding-top: var(--s3); padding-bottom: var(--s3); border-top: 1px solid var(--border); }
.article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); font-size: var(--fs-ui); color: var(--muted); }
.article-card h3 { margin-top: var(--s3); font-size: var(--fs-section); }
.article-card h3 a { color: var(--text); text-decoration: none; }
.article-card h3 a:hover { color: var(--link); }
.article-card p { margin-top: var(--s2); color: var(--muted); font-size: var(--fs-md); }
.article-card .text-link { margin-top: var(--s3); }
.article-mast { max-width: 900px; margin-inline: auto; text-align: center; padding-top: var(--s8); padding-bottom: var(--s8); }
.article-mast h1 { font-size: var(--fs-heading); line-height: 1.45; }
.article-mast h1::after { content: ''; display: block; width: 4em; height: 3px; margin: var(--s4) auto; background: var(--link); }
.article-mast .article-meta { justify-content: center; }
.article-body { overflow-wrap: break-word; }
.callout { margin-inline: 0; padding: var(--s3) var(--s4); border-left: 3px solid var(--link); border-radius: 0 var(--r-panel) var(--r-panel) 0; background: var(--highlight); color: var(--accent); }
.callout p + p { margin-top: var(--s2); }
.callout-warn { border-left-color: var(--warn); background: var(--panel-2); }
.article-promo, .cta-band { padding: var(--s5); border-radius: var(--r-panel); background: var(--accent); color: var(--on-accent); }
.article-promo { margin-top: var(--s8); }
.article-promo h2, .cta-band h2 { font-size: var(--fs-section); }
.article-promo p, .cta-band p { margin-top: var(--s2); }
.article-promo .button, .cta-band .button { margin-top: var(--s3); background: var(--on-accent); color: var(--accent); border-color: var(--on-accent); }
.preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s4); }
.preview-colors { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s2); list-style: none; padding: 0; }
.preview-colors li { padding: var(--s2); border: 1px solid var(--border); border-radius: var(--r-panel); background: var(--panel); }
.preview-colors code { display: block; margin-top: var(--s1); font-size: var(--fs-ui); }
.swatch { display: block; height: 56px; border-radius: var(--r-screen); border: 1px solid var(--line-soft); }
.swatch-bg { background: var(--bg); }
.swatch-panel { background: var(--panel); }
.swatch-panel-2 { background: var(--panel-2); }
.swatch-border { background: var(--border); }
.swatch-accent { background: var(--accent); }
.swatch-accent-dark { background: var(--accent-dark); }
.swatch-text { background: var(--text); }
.swatch-muted { background: var(--muted); }
.swatch-link { background: var(--link); }
.swatch-highlight { background: var(--highlight); }
.swatch-on-accent { background: var(--on-accent); }
.swatch-success { background: var(--success); }
.swatch-warn { background: var(--warn); }
.swatch-error { background: var(--error); }
.swatch-clear { background: var(--clear); }
.swatch-flag-white { background: var(--flag-white); }
.swatch-flag-red { background: var(--flag-red); }
.swatch-flag-blue { background: var(--flag-blue); }
.swatch-metal-light { background: var(--metal-light); }
.swatch-metal-mid { background: var(--metal-mid); }
.swatch-metal-dark { background: var(--metal-dark); }
.swatch-rim { background: var(--rim); }
.swatch-wave-ink { background: var(--wave-ink); }
.swatch-wave-fade { background: var(--wave-fade); }
.swatch-line-soft { background: var(--line-soft); }
.swatch-paper-glass { background: var(--paper-glass); }
.swatch-shine { background: var(--shine); }
.swatch-veil { background: var(--veil); }
.preview-buttons { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: center; }
.preview-type { border-bottom: 1px solid var(--border); padding-bottom: var(--s3); }
.preview-type > * + * { margin-top: var(--s2); }
.preview-static { position: relative; z-index: 30; }
.preview-language { position: relative; }
.preview-language summary { cursor: pointer; }
.preview-language .language-options { right: 0; }
@media (min-width: 1500px) { .hero { min-height: calc(100svh - 176px); } }
@media (max-width: 1279px) {
  .hero-grid { grid-template-columns: 43% 57%; }
  .copy { padding-right: var(--s4); }
  .platforms, .regions { gap: 8px; }
  .platforms li, .regions a { font-size: var(--fs-fine); gap: 5px; }
  .platforms svg { width: 18px; height: 18px; }
  .app-layout { grid-template-columns: 142px 1fr; }
  .service-view { padding: 22px 16px 0; }
  .service-inner { max-width: 240px; }
  .laptop { width: calc(100% - 40px); }
  .laptop-base { width: calc(100% - 10px); }
  .mobile-device { width: 170px; right: -8px; top: 302px; }
  .device-scene { height: 660px; }
  .refund-slip { left: 48px; bottom: 28px; }
  .service-heading h2 { font-size: var(--fs-small); }
  .coverage-facts { gap: var(--s2); }
  .email-slip { top: 40px; }
  .hero { min-height: 740px; }
  .description { font-size: var(--fs-md); }
}
@media (max-width: 1050px) {
  .hero { padding-top: var(--s6); }
  .hero-grid { grid-template-columns: 1fr; gap: var(--s4); }
  .copy { padding-right: 0; max-width: 640px; margin: auto; width: 100%; }
  .description { max-width: 480px; }
  .device-scene { width: 100%; max-width: 720px; height: 584px; margin: auto; }
  .laptop { width: calc(100% - 64px); }
  .laptop-base { width: calc(100% - 34px); }
  .app-layout { grid-template-columns: 174px 1fr; }
  .service-inner { max-width: 284px; }
  .service-view { padding: 22px 22px 0; }
  .mobile-device { top: 226px; right: 0; width: 190px; }
  .refund-slip { left: 200px; bottom: 3px; }
  .platforms, .regions { max-width: 480px; }
  .platforms li, .regions a { font-size: var(--fs-ui); }
  .next-title { display: block; }
  .next-title p { margin-top: var(--s1); }
  .platform-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .plan-card { padding: var(--s3); }
  .preview-static .masthead { height: auto; min-height: var(--header-height); flex-wrap: wrap; padding-top: var(--s2); padding-bottom: var(--s2); }
  .preview-static .navigation { display: flex; order: 3; width: 100%; overflow-x: auto; justify-content: flex-start; }
}
@media (max-width: 768px) {
  .plan-grid, .article-grid { grid-template-columns: 1fr; }
  .feature-index { grid-template-columns: 1fr; gap: var(--s4); }
  .feature-topics { position: static; display: flex; flex-wrap: wrap; gap: var(--s2); }
  .preview-grid { grid-template-columns: 1fr; }
  .preview-colors { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .hero { min-height: 0; padding-top: var(--s4); padding-bottom: var(--s5); }
  .hero-grid { gap: var(--s5); }
  .eyebrow { font-size: var(--fs-fine); margin-bottom: var(--s2); }
  .hero-actions { margin-top: var(--s3); gap: 12px; }
  .description { font-size: var(--fs-md); line-height: 1.85; margin-top: var(--s3); }
  .trust-line { gap: var(--s2); font-size: var(--fs-fine); margin-top: 12px; }
  .compatibility { margin-top: var(--s3); }
  .platforms { gap: 5px; }
  .platforms li { gap: 4px; font-size: var(--fs-micro); }
  .platforms svg { width: 17px; height: 17px; }
  .regions { justify-content: flex-start; flex-wrap: wrap; gap: 6px 12px; margin-top: 20px; }
  .regions a { gap: 5px; font-size: var(--fs-fine); }
  .flag { width: 20px; height: 14px; }
  .device-scene { height: auto; display: flex; flex-direction: column; align-items: center; gap: var(--s3); }
  .paper-slip { position: static; transform: none; }
  .email-slip { align-self: flex-start; margin-left: var(--s1); padding: 12px 16px; }
  .laptop { position: relative; top: auto; left: auto; width: 100%; height: 342px; padding: 11px 6px 15px; }
  .window-chrome { padding: 0 9px; gap: 10px; height: 32px; }
  .window-name { font-size: var(--fs-micro); }
  .window-domain { display: none; }
  .app-layout { grid-template-columns: 112px 1fr; height: calc(100% - 32px); }
  .region-sidebar { padding: 18px 5px; }
  .region-sidebar .ui-caption { padding-left: 7px; }
  .index-list li { padding: 4px 7px; gap: 7px; font-size: var(--fs-micro); height: auto; min-height: 35px; line-height: 1.25; overflow-wrap: anywhere; }
  .region-code { display: none; }
  .index-list .flag { width: 18px; height: 12px; }
  .sidebar-foot { margin: 16px 7px 0; font-size: var(--fs-micro); gap: 4px; }
  .service-view { padding: 20px 12px 0; }
  .service-heading h2 { font-size: var(--fs-ui); }
  .service-heading .icon { display: none; }
  .service-kicker { font-size: var(--fs-micro); line-height: 1.6; }
  .coverage-facts { gap: 8px; padding: 18px 0; }
  .coverage-facts strong { font-size: var(--fs-section); }
  .coverage-facts span { font-size: var(--fs-micro); }
  .device-fact { display: block; padding: 14px 0; font-size: var(--fs-micro); }
  .device-fact strong { display: block; margin-top: 5px; }
  .import-note { font-size: var(--fs-micro); padding: 8px; line-height: 1.6; gap: 6px; }
  .import-note .icon { display: none; }
  .laptop-base { position: relative; left: auto; top: auto; width: 100%; height: 12px; margin-top: -29px; }
  .mobile-device { position: relative; right: auto; top: auto; width: 190px; height: 348px; align-self: flex-end; margin-top: -4px; margin-right: var(--s2); }
  .refund-slip { align-self: flex-start; margin: 0 0 0 var(--s1); padding: 12px 16px; }
  .next-section { padding-top: var(--s3); padding-bottom: var(--s3); align-items: flex-start; }
  .next-title h2 { font-size: var(--fs-md); }
  .next-title p { font-size: var(--fs-fine); max-width: 190px; line-height: 1.8; }
  .next-section a { font-size: var(--fs-fine); white-space: nowrap; }
  .platform-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s2); }
  .callout, .article-promo, .cta-band { padding: var(--s3); }
  .preview-colors { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .preview-static .navigation { gap: 20px; }
  .preview-static .navigation a { min-height: 32px; font-size: var(--fs-fine); }
}
@media (max-width: 359px) {
  .platforms li { gap: 2px; }
  .platforms svg { width: 15px; height: 15px; }
  .regions { gap: 4px; }
  .regions a { gap: 3px; font-size: var(--fs-micro); }
  .regions .flag { width: 18px; height: 12px; }
  .hero-actions .button { padding-inline: var(--s2); }
  .app-layout { grid-template-columns: 98px 1fr; }
  .service-view { padding-inline: var(--s1); }
  .coverage-facts strong { font-size: var(--fs-body); }
}