#mobile-home { display:none; }
@font-face{ font-family: "Inter"; font-weight: 800; font-display: block; src: url("fonts/inter/inter-800-latin-ext.woff2") format("woff2"); unicode-range: U+0100-024F, U+1E00-1EFF; }
@font-face{ font-family: "Inter"; font-weight: 800; font-display: block; src: url("fonts/inter/inter-800-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+2000-206F; }
@font-face{ font-family: "IBM Plex Sans"; font-weight: 400; font-display: block; src: url("fonts/ibm-plex/plex-sans-regular.woff2") format("woff2"); }
@font-face{ font-family: "IBM Plex Sans"; font-weight: 500; font-display: block; src: url("fonts/ibm-plex/plex-sans-medium.woff2") format("woff2"); }
@font-face{ font-family: "IBM Plex Sans"; font-weight: 600; font-display: block; src: url("fonts/ibm-plex/plex-sans-semibold.woff2") format("woff2"); }
@font-face{ font-family: "IBM Plex Sans"; font-weight: 700; font-display: block; src: url("fonts/ibm-plex/plex-sans-bold.woff2") format("woff2"); }
@font-face{ font-family: "IBM Plex Mono"; font-weight: 500; font-display: block; src: url("fonts/ibm-plex/plex-mono-medium.woff2") format("woff2"); }
/* Inter as a variable face for the phone home texts at 600 (the site's static Inter has only 500 and 800); the same files as the account page. */
@font-face{ font-family: "Inter Text"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("fonts/inter/inter-variable-latin-ext-20261014.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family: "Inter Text"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("fonts/inter/inter-variable-latin-20261014.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
#mobile-home{

  --navy: #132d58;
  --navy-deep: #0d1f3d;
  --navy-raised: #163567;
  --blue: #338cff;
  --blue-text: #8dbbff;
  --text: #e6edf5;
  --copy: #a9b8c8;
  --muted: #7f93a8;
  --line: rgb(145 184 216 / .18);
  --line-strong: rgb(151 196 230 / .34);
  /* copy in Inter 500 (D-123); headings in IBM Plex Sans Bold, as on the desktop (owner, 13 Oct 2026, D-124) */
  --sans: "Inter", "IBM Plex Sans", Arial, sans-serif; --psv-font-hero: "IBM Plex Sans", Arial, sans-serif; --psv-hero-weight: 700; --mono: "IBM Plex Mono", Consolas, monospace;
  --pad: calc(20 * var(--psv-u)); --gap: calc(52 * var(--psv-u)); --radius: calc(12 * var(--psv-u));
  --ground: var(--navy); --surface: var(--navy-raised);
}
#mobile-home *{ box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
#mobile-home{ background: var(--ground); }
#mobile-home{ margin: 0 auto; max-width: calc(480 * var(--psv-u)); min-height: 100svh; color: var(--text); font: 400 calc(16 * var(--psv-u))/1.5 var(--sans); background: var(--ground);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-variant-numeric: tabular-nums; }
#mobile-home .top{ position: sticky; top: 0; z-index: 20; height: calc(58 * var(--psv-u)); padding: 0 var(--pad); display: flex; align-items: center; justify-content: space-between;
  background: rgb(19 45 88 / .84); -webkit-backdrop-filter: saturate(140%) blur(calc(14 * var(--psv-u))); backdrop-filter: saturate(140%) blur(calc(14 * var(--psv-u))); }
#mobile-home .brand{ display: flex; align-items: center; gap: calc(10 * var(--psv-u)); font: 500 calc(20 * var(--psv-u))/1 var(--sans); color: #fff; }
#mobile-home .brand svg{ width: calc(28 * var(--psv-u)); height: calc(28 * var(--psv-u)); display: block; }
#mobile-home .tools{ display: flex; align-items: center; gap: calc(6 * var(--psv-u)); }
#mobile-home .lang{ height: calc(36 * var(--psv-u)); padding: 0 calc(10 * var(--psv-u)); display: grid; place-items: center; font: 600 calc(12 * var(--psv-u))/1 var(--sans); letter-spacing: calc(1.2 * var(--psv-u)); color: var(--copy); }
#mobile-home .menu{ width: calc(40 * var(--psv-u)); height: calc(40 * var(--psv-u)); margin-right: calc(-8 * var(--psv-u)); display: grid; place-items: center; }
#mobile-home .menu i{ display: block; width: calc(18 * var(--psv-u)); height: calc(7 * var(--psv-u)); border-top: 1.5px solid #fff; border-bottom: 1.5px solid #fff; }
#mobile-home .hero{ position:relative; isolation:isolate; min-height:calc(100svh - (58 * var(--psv-u))); overflow:hidden; }
#mobile-home .hero-identity{ position:absolute; left:var(--pad); right:var(--pad); bottom:clamp(150px, 19svh, 195px); text-align:center; }
/* desktop-scale:generated */
@media (min-width: 1051px) {
  #mobile-home .hero-identity {
    bottom: clamp((150 * var(--psv-u)), (138.7 * var(--psv-u)), (195 * var(--psv-u)));
  }
}
/* desktop-scale:end */
#mobile-home h1{ margin:0; color:#fff; font:700 clamp(46px, 13vw, 66px)/1.1 "Space Grotesk", var(--sans); letter-spacing:-0.03em; font-kerning:normal; text-transform:none; }
/* desktop-scale:generated */
@media (min-width: 1051px) {
  #mobile-home h1 {
    font: 700 clamp((46 * var(--psv-u)), (199.68 * var(--psv-u)), (66 * var(--psv-u)))/1.1 "Space Grotesk", var(--sans);
  }
}
/* desktop-scale:end */
@media(max-width:760px) and (max-height:700px){
  #mobile-home .hero-identity{ bottom:calc(134 * var(--psv-u)); }
  #mobile-home h1{ font-size:clamp(42px, 12vw, 56px); }
}
#mobile-home .reading{ padding: var(--gap) var(--pad) 0; }
#mobile-home .k{ font: 600 calc(11 * var(--psv-u))/1 var(--sans); letter-spacing: calc(1.4 * var(--psv-u)); text-transform: uppercase; color: var(--copy); }
#mobile-home .eyebrow{ display: flex; align-items: center; gap: calc(9 * var(--psv-u)); margin: 0 0 calc(16 * var(--psv-u)); }
#mobile-home .eyebrow::before{ content: ''; width: calc(6 * var(--psv-u)); height: calc(6 * var(--psv-u)); background: var(--blue); border-radius: calc(1 * var(--psv-u)); }
#mobile-home h2{ margin: 0; color: #fff; font: 700 clamp(29px, 8.4vw, 36px)/1.08 var(--sans); letter-spacing: -0.035em; text-wrap: balance; }
/* desktop-scale:generated */
@media (min-width: 1051px) {
  #mobile-home h2 {
    font: 700 clamp((29 * var(--psv-u)), (129.024 * var(--psv-u)), (36 * var(--psv-u)))/1.08 var(--sans);
  }
}
/* desktop-scale:end */
#mobile-home h2 mark{ background: none; color: var(--blue); }
#mobile-home .lead{ margin: calc(16 * var(--psv-u)) 0 0; font-size: calc(15 * var(--psv-u)); line-height: 1.5; color: #fff; text-wrap: pretty; }
#mobile-home .lead mark{ background: none; color: var(--blue-text); font-weight: 600; }
#mobile-home .explain{ margin: calc(22 * var(--psv-u)) 0 0; }
#mobile-home .explain .k{ color: var(--blue); }
#mobile-home .explain + .explain{ margin-top: calc(18 * var(--psv-u)); padding-top: calc(18 * var(--psv-u)); border-top: 1px solid var(--line); }
#mobile-home .explain p{ margin: calc(10 * var(--psv-u)) 0 0; font-size: max(var(--psv-text-floor), calc(15 * var(--psv-u))); line-height: 1.55; color: #fff; text-wrap: pretty; }
#mobile-home .instrument{ contain: layout paint; margin-top: calc(20 * var(--psv-u)); overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
#mobile-home .i-head{ height: calc(40 * var(--psv-u)); padding: 0 calc(16 * var(--psv-u)); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
#mobile-home .i-price{ display: flex; align-items: baseline; gap: calc(8 * var(--psv-u)); font: 500 calc(15 * var(--psv-u))/1 var(--mono); color: #fff; }
#mobile-home .i-price small{ display: inline-block; text-align: left;  font: 600 calc(11 * var(--psv-u))/1 var(--sans); letter-spacing: calc(1.2 * var(--psv-u)); color: var(--blue-text); }
#mobile-home .i-body, #mobile-home .read{ transition: opacity 320ms ease; }
#mobile-home .instrument.is-reset .i-body, #mobile-home .instrument.is-reset .read{ opacity: 0; }
#mobile-home .i-body{ position: relative; height: calc(216 * var(--psv-u)); }
#mobile-home .i-body canvas{ position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
#mobile-home .lane-label{ position: absolute; left: calc(16 * var(--psv-u)); right: calc(16 * var(--psv-u)); display: flex; align-items: baseline; justify-content: space-between; font: 600 calc(11 * var(--psv-u))/1 var(--sans); color: var(--text); pointer-events: none; }
#mobile-home .lane-label div{ flex: 1; }
#mobile-home .lane-label span{ color: var(--copy); font-weight: 400; margin-left: calc(6 * var(--psv-u)); }
#mobile-home .lane-label em{ font: 500 calc(11 * var(--psv-u))/1 var(--sans); font-style: normal; color: var(--blue-text); margin-right: calc(10 * var(--psv-u)); }
#mobile-home .lane-label b{ flex: none; min-width: 5ch; text-align: right; font: 500 calc(11.5 * var(--psv-u))/1 var(--mono); color: var(--text); }
#mobile-home .axis{ position: absolute; left: calc(16 * var(--psv-u)); right: calc(16 * var(--psv-u)); display: flex; justify-content: space-between; font: 400 calc(11 * var(--psv-u))/1 var(--sans); color: var(--copy); }
#mobile-home .read{ padding: 0 calc(16 * var(--psv-u)) calc(6 * var(--psv-u)); border-top: 1px solid var(--line); }
#mobile-home .read-main{ display: flex; align-items: flex-end; justify-content: space-between; padding: calc(12 * var(--psv-u)) 0 calc(10 * var(--psv-u)); }
#mobile-home .read-name{ font: 700 calc(17 * var(--psv-u))/1 var(--sans); letter-spacing: -0.02em; color: #fff; }
#mobile-home .read-main p{ margin: calc(6 * var(--psv-u)) 0 0; font-size: max(var(--psv-text-floor), calc(12.5 * var(--psv-u))); line-height: 1; color: var(--copy); }
#mobile-home .read-main strong{ font: 600 calc(32 * var(--psv-u))/0.9 var(--sans); letter-spacing: -0.035em; color: var(--blue); }
#mobile-home .mrow{ display: grid; grid-template-columns: 1fr calc(76 * var(--psv-u)) calc(44 * var(--psv-u)); align-items: center; gap: calc(12 * var(--psv-u)); padding: calc(7 * var(--psv-u)) 0; border-top: 1px solid var(--line); }
#mobile-home .mrow span{ display: block; font: 600 calc(13.5 * var(--psv-u))/1.15 var(--sans); color: var(--text); }
#mobile-home .mrow em{ display: block; margin-top: calc(3 * var(--psv-u)); font: 500 calc(11 * var(--psv-u))/1 var(--mono); font-style: normal; color: var(--blue-text); min-height: calc(11 * var(--psv-u)); }
#mobile-home .mrow i{ height: calc(3 * var(--psv-u)); border-radius: calc(2 * var(--psv-u)); background: var(--line); overflow: hidden; }
#mobile-home .mrow u{ display: block; height: 100%; width: 0; border-radius: calc(2 * var(--psv-u)); background: var(--blue); }
#mobile-home .mrow b{ font: 500 calc(13.5 * var(--psv-u))/1 var(--mono); text-align: right; color: var(--text); }
#mobile-home .mrow.signed i{ position: relative; overflow: visible; }
#mobile-home .mrow.signed i::before{ content: ''; position: absolute; left: 50%; top: calc(-3 * var(--psv-u)); bottom: calc(-3 * var(--psv-u)); width: 1px; margin-left: calc(-0.5 * var(--psv-u)); background: var(--line-strong); }
#mobile-home .mrow.signed u{ position: absolute; top: 0; bottom: 0; }
#mobile-home .mrow.signed u.neg{ background: var(--text); }
#mobile-home .mnote{ margin: calc(-2 * var(--psv-u)) 0 calc(7 * var(--psv-u)); font-size: max(var(--psv-text-floor), calc(12 * max(var(--psv-u), var(--psv-label-floor)))); line-height: 1.35; color: var(--copy); }
#mobile-home .rv{ opacity: 0; transform: translateY(calc(18 * var(--psv-u))); transition: opacity 700ms cubic-bezier(.2,.7,.2,1), transform 700ms cubic-bezier(.2,.7,.2,1); }
#mobile-home .rv.in{ opacity: 1; transform: none; }
#mobile-home .end{ height: calc(52 * var(--psv-u)); }
@media (prefers-reduced-motion: reduce){
#mobile-home .rv{ opacity: 1; transform: none; transition: none; }
}
@media (max-width:760px) {
  body[data-page="home"] { --psv-bg-deep-rgb:13 31 61; background:#132d58; }
  /* a window wider than the phone column (481–760 px, a narrow desktop window or a tablet): the navy runs to both edges, the scrollbar gutter included */
  /* this sheet is loaded by this page alone, so the root can be painted directly (no :has(), which made every
     DOM change re-check the whole page while scrolling) */
  html { background-color: #132d58; }
  /* the site footer's social icons stand once on phones, in the page foot (D-107) */
  .footer-social { display: none; }
  body[data-page="home"] > #main-content { background: transparent; }
  body[data-page="home"] .home-main { width:100%; max-width:none; margin:0; padding:0; display:block; }
  body[data-page="home"] .home-main > :not(#mobile-home), body[data-page="home"] > .site-footer { display:none; }
  #mobile-home { display:block; width:100%; padding:0; }
  /* the opening is the site shell's (app.js); the page's copy of its stage is only the page heading in the source */
  #mobile-home > .hero { display:none; }
}

#mobile-home .mobile-chart-compact { height:calc(192 * var(--psv-u)); }

/* Desktop positioning, expressed as a mobile brand introduction and product bridge.
   The three analytical planes are conceptual SVG artwork, not market readings.
   Static rendering preserves the approved mobile scrolling performance. */
@media (max-width:760px) {
  #mobile-home {
    --pad:26px;
    --mobile-heading:#f3f7fe;
    --mobile-accent:#8bbcff;
    --mobile-copy:#c0cfe3;
    --mobile-action:#174c91;
  }
  #mobile-home .home-product {
    position:relative; isolation:isolate; padding:34px 0 40px;
    background:#132d58;
  }
  #mobile-home .hp-introduction { padding:0 var(--pad); }
  #mobile-home #mobile-product-title,
  #mobile-home .measurement-intro h2 { margin:0; font:800 clamp(33px,11.1vw,49px)/1.06 var(--psv-font-hero); letter-spacing:-.045em; text-wrap:balance; }
  #mobile-home #mobile-product-title { color:var(--mobile-heading); }
  #mobile-home #mobile-product-title > span { display:block; }
  #mobile-home #mobile-product-title .hp-title-emphasis { color:var(--blue); }
  #mobile-home .hp-description { max-width:42ch; margin:22px 0 0; color:var(--mobile-copy); font:400 15px/1.55 var(--sans); text-wrap:pretty; }
  #mobile-home .hp-intelligence { margin:17px 0 0; }
  #mobile-home .hp-intelligence > svg { display:block; width:100%; height:auto; overflow:visible; }
  #mobile-home .hp-art-shadow { fill:#030a1650; }
  #mobile-home .hp-art-guide { fill:none; stroke:#619ce85c; stroke-width:.8; stroke-dasharray:2 4; }
  #mobile-home .hp-plane-surface { fill:#0d203b; stroke:#5c8fc7; stroke-width:1.5; }
  #mobile-home .hp-plane-1 .hp-plane-surface { fill:#0d2240; stroke:#4676b0; }
  #mobile-home .hp-plane-2 .hp-plane-surface { fill:#0b1b32; stroke:#325b91; }
  #mobile-home .hp-plane-grid { fill:none; stroke:#527ba537; stroke-width:.75; }
  #mobile-home .hp-plane-area { fill:#277ec338; }
  #mobile-home .hp-plane-trace { fill:none; stroke:#92c9ff; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
  #mobile-home .hp-plane-1 .hp-plane-trace { stroke:#69a6df; }
  #mobile-home .hp-plane-2 .hp-plane-trace { stroke:#578fd2; }
  #mobile-home .hp-art-edge { fill:none; stroke:#a6d2ff; stroke-width:1; }
  #mobile-home .hp-art-point { fill:#c9e4ff; }
  #mobile-home .hp-intelligence figcaption { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:-9px var(--pad) 0; color:var(--mobile-copy); text-align:center; font:400 13px/1.4 var(--sans); }
  #mobile-home .hp-intelligence figcaption > span { min-width:0; padding:0 4px; hyphens:auto; overflow-wrap:anywhere; }
  #mobile-home .hp-intelligence figcaption > span + span { border-left:1px solid #49698f66; }
  #mobile-home .hp-terminal { margin:28px var(--pad) 0; color:var(--mobile-heading); }
  #mobile-home .hp-terminal-heading { display:flex; align-items:center; gap:12px; }
  #mobile-home .hp-terminal-icon { flex:none; width:26px; height:26px; fill:none; stroke:var(--mobile-accent); stroke-width:1.4; stroke-linecap:round; }
  #mobile-home .hp-terminal h2 { margin:0; color:var(--mobile-heading); font:600 24px/1.2 var(--sans); letter-spacing:-.03em; text-wrap:wrap; hyphens:none; overflow-wrap:normal; }
  #mobile-home .hp-terminal > p { margin:16px 0 0; color:var(--mobile-copy); font:400 15px/1.55 var(--sans); text-wrap:pretty; }
  /* The Terminal window: the Terminal page's own Monitor, sized for the phone. */
  #mobile-home .terminal-window {
    margin:24px var(--pad) 0; overflow:hidden;
    background:#132d58; border:1px solid rgba(151,196,230,.34); border-radius:12px;
    box-shadow:0 22px 48px -28px rgba(3,10,22,.85);
    color:#e6edf5;
  }
  #mobile-home .tw-markets { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border-bottom:1px solid rgba(145,184,216,.18); }
  #mobile-home .tw-markets button {
    min-height:42px; padding:0; margin-bottom:-1px;
    color:#7f93a8; background:none; border:0; border-bottom:2px solid transparent;
    font:500 11px/1 var(--psv-font-mono, "IBM Plex Mono", monospace); letter-spacing:.06em;
  }
  #mobile-home .tw-markets .is-sel { color:#e6edf5; border-bottom-color:#e6edf5; }
  #mobile-home .tw-horizons { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; padding:8px 13px; border-bottom:1px solid rgba(145,184,216,.12); }
  #mobile-home .tw-horizons button {
    min-height:34px; padding:0; border-radius:6px;
    color:#7f93a8; background:none; border:0; border-bottom:2px solid transparent;
    font:500 11px/1 var(--psv-font-mono, "IBM Plex Mono", monospace); white-space:nowrap;
  }
  #mobile-home .tw-horizons .is-sel { color:#e6edf5; background:rgba(104,194,238,.12); border-bottom-color:transparent; }
  #mobile-home .tw-rows { margin:0; padding:3px 13px 4px; list-style:none; }
  #mobile-home .tw-rows li {
    display:grid; grid-template-columns:minmax(0,1fr) 46px 46px 28px; align-items:center; column-gap:7px;
    min-height:26px; padding:4px 0; box-sizing:border-box; border-bottom:1px solid rgba(145,184,216,.09);
  }
  #mobile-home .tw-rows li:last-child { border-bottom:0; }
  #mobile-home .tw-name { color:#e6edf5; font:500 12.5px/1.15 var(--sans); overflow-wrap:normal; hyphens:manual; }
  #mobile-home .tw-trace { width:46px; height:14px; overflow:visible; }
  #mobile-home .tw-trace polyline { fill:none; stroke:#68c2ee; stroke-width:1.2; vector-effect:non-scaling-stroke; }
  #mobile-home .tw-trace circle { fill:#68c2ee; }
  #mobile-home .tw-value { color:#e6edf5; font:500 12.5px/1 var(--psv-font-mono, "IBM Plex Mono", monospace); font-variant-numeric:tabular-nums; text-align:right; }
  #mobile-home .tw-change { color:#a9b8c8; font:400 10px/1 var(--psv-font-mono, "IBM Plex Mono", monospace); font-variant-numeric:tabular-nums; }
  #mobile-home .tw-note { margin:0; padding:9px 13px 11px; border-top:1px solid rgba(145,184,216,.12); color:#7f93a8; font:400 10px/1.3 var(--psv-font-mono, "IBM Plex Mono", monospace); }
  #mobile-home .terminal-window.is-fresh .tw-value,
  #mobile-home .terminal-window.is-fresh .tw-change,
  #mobile-home .terminal-window.is-fresh .tw-trace { animation:tw-in .32s ease-out; }
  @keyframes tw-in { from { opacity:.25; } to { opacity:1; } }
  /* the narrowest phones: names wrap between words only, so the longest word gets the room */
  @media (max-width:340px) {
    #mobile-home .tw-rows { padding:3px 10px 4px; }
    #mobile-home .tw-rows li { grid-template-columns:minmax(0,1fr) 34px 42px 26px; column-gap:5px; }
    #mobile-home .tw-name { font-size:11.5px; }
  }
  #mobile-home .measurement-intro { margin:36px var(--pad) 0; padding:28px 0 0; border-top:1px solid #8bbcff40; }
  #mobile-home .measurement-intro h2 { max-width:18ch; color:var(--mobile-heading); }
  /* the narrow instrument labels (the three-plane caption, the derivative cards, the Terminal window) keep the
     narrower IBM Plex Sans: in Inter, German and Spanish compound words no longer fit their columns (D-123) */
  #mobile-home .hp-intelligence figcaption, #mobile-home .dv-card .instrument, #mobile-home .terminal-window { --sans: "IBM Plex Sans", Arial, sans-serif; }
  /* the blue words of headings are the logo blue (owner, 13 Oct 2026, D-123) */
  #mobile-home .measurement-intro h2 mark,
  #mobile-home .reading h2 mark { color:var(--blue); }
  #mobile-home .lead mark,
  #mobile-home .explain .k { color:var(--mobile-accent); }
  #mobile-home .reading h2 { color:var(--mobile-heading); }
  #mobile-home .lead,
  #mobile-home .explain p { color:var(--mobile-copy); font-size:15px; line-height:1.55; }
  #mobile-home #mobile-product-title,
  #mobile-home .measurement-intro h2,
  #mobile-home .reading h2 { font-family:var(--psv-font-hero); font-weight:var(--psv-hero-weight); }
}
/* Phone home page closing (owner approval, 10 Oct 2026), after modern corporate mobile sites:
   one closing line with one action, then a compact footer with the brand, the pages and the
   legal links. The line is the opening's own; the action and page names are existing site copy. */
#mobile-home .home-next{ padding: calc(76 * var(--psv-u)) var(--pad) 0; text-align: center; }
#mobile-home .hn-close{ margin: 0; text-align: center; }
/* The phone page's own button (the approved Terminal link before 192). */
#mobile-home .hn-action{ display: flex; align-items: center; justify-content: space-between; gap: calc(16 * var(--psv-u)); min-height: calc(50 * var(--psv-u)); margin-top: calc(28 * var(--psv-u)); padding: 0 calc(16 * var(--psv-u));
  border: 1px solid #5686bf; border-radius: calc(8 * var(--psv-u)); color: #fff; background: var(--mobile-action); font: 500 calc(16 * var(--psv-u))/1.3 var(--sans); letter-spacing: normal; text-align: left; text-decoration: none; }
#mobile-home .hn-action svg{ flex: none; width: calc(20 * var(--psv-u)); height: calc(20 * var(--psv-u)); fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#mobile-home .hn-action:focus-visible{ outline: 2px solid var(--mobile-accent); outline-offset: 4px; }

/* Footer: the brand, the pages in two columns, then the site's legal links and copyright. */
#mobile-home .hn-foot{ padding: calc(28 * var(--psv-u)) var(--pad) 0; border-top: 1px solid var(--line); }
#mobile-home .hn-pages{ display: grid; grid-template-columns: 1fr 1fr; gap: calc(14 * var(--psv-u)) calc(16 * var(--psv-u)); margin: 0; padding: 0; list-style: none; }
#mobile-home .hn-pages a{ display: inline-block; padding: calc(4 * var(--psv-u)) 0; font: 500 calc(15 * var(--psv-u))/1.3 var(--sans); color: #c0cfe3; text-decoration: none; }
@media (max-width: 760px){
  body[data-page="home"] > .site-footer{ display: block; padding-block: 22px 32px; background: #132d58; border-top: 0; color: #7f93a8; }
  body[data-page="home"] > .site-footer .footer-inner{ flex-direction: column-reverse; align-items: flex-start; gap: 14px; width: 100%; max-width: 480px; margin-inline: auto; padding-inline: 26px; box-sizing: border-box; } /* the phone home page side margin (--pad) */
  body[data-page="home"] > .site-footer .footer-links{ flex-wrap: wrap; gap: 10px 20px; padding-top: 18px; border-top: 1px solid rgb(145 184 216 / .18); width: 100%; }
  body[data-page="home"] > .site-footer .footer-links a{ color: #a9b8c8; text-decoration: none; }
  body[data-page="home"] > .site-footer .footer-company { color: #a9b8c8; } /* the company lines in the legal links' colour (owner, 18 Oct 2026, D-208) */
}

/* The System story at the top of the phone home page (owner, 11 Oct 2026; candidate
   design/candidates/mobil/ana/): the opening question, price read four ways and the curtain,
   moved from the phone System page; the question at the phone readings' heading size and the
   curtain in the desktop page's green and red. */
@media (max-width: 760px) {
  #mobile-home .ms-home {
    --navy: #132d58; --surface: #163567; --blue: #338cff; --blue-text: #8dbbff;
    --text: #e6edf5; --copy: #a9b8c8; --muted: #7f93a8;
    --heading: #f3f7fe; --accent: #8bbcff; --body: #c0cfe3; --action: #174c91;
    --line: rgb(145 184 216 / .18); --line-strong: rgb(151 196 230 / .34);
    --sans: "Inter", "IBM Plex Sans", Arial, sans-serif; --mono: "IBM Plex Mono", Consolas, monospace;
    --pad: 26px; --gap: 64px; --radius: 12px;
    display: block; width: 100%; margin: 0; padding: 0;
    color: var(--text); background: var(--navy);
    font: 400 16px/1.5 var(--sans); font-variant-numeric: tabular-nums;
    -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  }
  #mobile-home .ms-home * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
  #mobile-home .ms-home .ms-open { padding: 52px var(--pad) 0; }
  /* the page heading (direction A, D-110) in two parts (owner, 13 Oct 2026): the statement, then the question
     apart and in blue, at the System heading's size so the two pages match (40 px on a 390 px phone); the
     mission sentence under it in the page's statement type (.ms-say, owner). The width is tied to the size
     (8.45 em), so the lines break at the same words on every phone and in a narrow desktop window (D-113) */
  /* no card (owner, 13 Oct 2026: the card went); the sentence under the heading in the pages' under-heading
     type (grey, Inter, line height 1.55), a little larger than theirs: 17 px against 15 px */
  /* Poster heading (owner, 15 Oct 2026): one size in every language, set so the longest word of any
     language (ES "INSTITUCIONALES,", 8.9 em) and the French opening "CE QUE VOIENT LES" fit the column;
     words wrap freely into balanced lines and the blue sentence starts its own line. */
  #mobile-home .ms-home .ms-open .ms-question { margin: 0; color: var(--heading); font: 800 clamp(24px, calc((100vw - 2 * var(--pad)) / 9.1), 44px)/1.04 var(--psv-font-hero); font-weight: var(--psv-hero-weight, 800); }
  #mobile-home .ms-home .ms-open .ms-question span { display: block; text-wrap: balance; }
  #mobile-home .ms-home .ms-open .ms-question mark { display: block; }
  #mobile-home .ms-home .ms-open .ms-open-lead { margin: 20px 0 0; color: var(--body); font: 400 15px/1.55 var(--sans); text-wrap: pretty; } /* the Technology page text standard (owner, 15 Oct 2026) */
  #mobile-home .ms-home .ms-sec { padding: var(--gap) var(--pad) 0; }
  /* The first section follows the opening paragraph at the phone section rhythm, 52 px (owner, 15 Oct 2026). */
  #mobile-home .ms-home .ms-open + .ms-sec { padding-top: 52px; }
  #mobile-home .ms-home .ms-say { margin: 0; color: var(--heading); font: 500 21px/1.42 var(--sans); letter-spacing: -.012em; text-wrap: pretty; }
  /* the story's scene label, in the readings' own label style */
  #mobile-home .ms-home .ms-eye { margin-bottom: 14px; }
  #mobile-home .ms-home .iq-price-word { color: var(--blue); }
  #mobile-home .ms-home .ms-say .iq-price-word { font-weight: 600; }
  #mobile-home .ms-home .ms-copy { margin: 24px 0 0; color: var(--body); font: 400 15px/1.55 var(--sans); text-wrap: pretty; }
  #mobile-home .ms-home .ms-card { position: relative; contain: layout paint; margin-top: 24px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
  #mobile-home .ms-home .ms-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
  #mobile-home .ms-home .ms-ind-chart { height: 172px; }
  #mobile-home .ms-home .ms-readings { position: relative; display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; }
  #mobile-home .ms-home .ms-reading { min-width: 0; padding: 14px 12px 14px 14px; border-top: 1px solid var(--line); }
  #mobile-home .ms-home .ms-reading:nth-child(even) { border-left: 1px solid var(--line); }
  #mobile-home .ms-home .ms-reading dt { min-height: 2.6em; color: var(--text); font: 600 10px/1.3 var(--sans); letter-spacing: 1px; text-transform: uppercase; overflow-wrap: anywhere; }
  #mobile-home .ms-home .ms-reading dd { margin: 0; }
  #mobile-home .ms-home .ms-formula { display: block; min-height: 40px; margin-top: 8px; padding: 4px 7px; border: 1px solid var(--line); border-radius: 4px; background: rgb(255 255 255 / .03); color: var(--copy); font: 500 10.5px/1.35 var(--mono); overflow-wrap: anywhere; }
  #mobile-home .ms-home .ms-formula .iq-price-word { color: var(--blue-text); }
  #mobile-home .ms-home .ms-spark { display: block; height: 34px; margin-top: 12px; }
  #mobile-home .ms-home .ms-reading strong { display: block; margin-top: 8px; color: var(--blue); font: 600 24px/1 var(--sans); letter-spacing: -.03em; }
  #mobile-home .ms-home .ms-curtain { padding: 14px 14px 12px; }
  #mobile-home .ms-home .ms-cap { position: relative; z-index: 2; color: var(--text); font: 600 10px/1 var(--sans); letter-spacing: .1em; }
  #mobile-home .ms-home .ms-plot { height: 150px; }
  #mobile-home .ms-home .ms-cap--layers { margin-top: 14px; opacity: var(--reveal, 0); }
  #mobile-home .ms-home .ms-readout { position: absolute; left: 0; top: 0; z-index: 3; padding: 2px 4px; background: var(--surface); color: #fff; font: 600 11px/1.2 var(--sans); white-space: nowrap; pointer-events: none; will-change: transform; }
  #mobile-home .ms-home .ms-bands { position: relative; z-index: 2; margin: 10px 0 0; padding: 0; list-style: none; opacity: var(--reveal, 0); }
  #mobile-home .ms-home .ms-bands li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; height: 32px; color: var(--muted); font: 600 11px/14px var(--sans); transition: color .28s ease; }
  #mobile-home .ms-home .ms-bands li > span { white-space: nowrap; }
  #mobile-home .ms-home .ms-bands em { min-width: 0; overflow: hidden; color: var(--muted); font: 400 10px/14px var(--sans); font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
  #mobile-home .ms-home .ms-bands li.is-active { color: #0d9488; }
  #mobile-home .ms-home .ms-bands li.is-negative { color: #dd4b45; }
}

/* Headings in capitals (owner, 13 Oct 2026, D-125); capitals take a little less negative tracking.
   The card heading is 28 px on a 390 px phone (11.29 em measure): the largest size at which no German,
   French or Spanish word in capitals breaks across lines. */
@media (max-width: 760px) {
  #mobile-home :is(.ms-home .ms-open .ms-question, .measurement-intro h2, .reading h2, .dv-card h3, #mobile-product-title, .hn-close) { text-transform: uppercase; letter-spacing: -.015em; }
  #mobile-home .ms-home #ms-home-title { letter-spacing: -.025em; }
  /* One heading standard on every phone page (owner, 13 Oct 2026, D-126): the page and section headings are
     28 px on a 390 px phone, and the first
     line of text sits 52 px under the header: the label where there is one, the heading below it at the same gap. */
  #mobile-home :is(.measurement-intro h2, .reading h2, #mobile-product-title, .hn-close) { font-size: clamp(22px, calc((100vw - 52px) / 12.07), 29px); line-height: 1.08; }
}

/* Analytical dimensions of market behavior, moved from the phone Technology page (owner, 15 Oct 2026): the same rules. */
@media (max-width: 760px) {
  /* The sections' rhythm. */
  #mobile-home .mt-sec { padding: var(--gap) var(--pad) 0; }
  /* the section label sits 2 px higher in its line than the home page's text: 54 px gives the home page's 52 px to the eye (D-109) */
  #mobile-home .mt-sec { padding-top: 54px; }
  #mobile-home .mt-eyebrow { margin: 0 0 12px; color: var(--copy); font: 600 11px/1 var(--sans); letter-spacing: 1.4px; text-transform: uppercase; }
  #mobile-home .mt-h2 { margin: 0; color: var(--heading); font: 800 clamp(26px, 7.4vw, 32px)/1.14 var(--psv-font-hero); letter-spacing: -.03em; text-wrap: balance; }
  #mobile-home .mt-h2 mark { display: block; background: none; color: var(--blue); }
  #mobile-home .mt-lead { margin: 14px 0 0; color: var(--body); font: 400 15px/1.55 var(--sans); text-wrap: pretty; }
  #mobile-home .mt-lead strong { color: var(--text); font-weight: 600; }

  /* 3 · The seven dimensions, down the page as the System stages run. */
  #mobile-home .mt-dimlist { margin-top: 28px; }
  #mobile-home .mt-dim + .mt-dim { margin-top: 56px; }
  #mobile-home .mt-dim-head { display: flex; align-items: baseline; gap: 10px; }
  #mobile-home .mt-no { color: var(--blue); font: 600 12px/1 var(--mono); }
  #mobile-home .mt-name { flex: 1; margin: 0; color: var(--heading); font: 800 19px/1.2 var(--psv-font-hero); letter-spacing: -.02em; }
  /* the measurement lists keep the narrower IBM Plex Sans: German compound names do not fit in Inter (D-123) */
  #mobile-home .mt-rows { --sans: "IBM Plex Sans", Arial, sans-serif; }
  #mobile-home .mt-val { color: var(--accent); font: 500 16px/1 var(--mono); }
  #mobile-home .mt-desc { margin: 10px 0 0; color: var(--body); font: 400 14px/1.55 var(--sans); text-wrap: pretty; }
  #mobile-home .mt-chart { margin: 14px 0 0; padding: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
  /* the animated drawings are their own layers (no clipping: their labels may run outside the box) (owner, 13 Oct 2026) */
  #mobile-home :is(.mt-chart, .ti-mini, .mt-openvis, .ti-chart) { contain: layout; will-change: transform; }
  #mobile-home .mt-chart svg { display: block; width: 100%; height: 54px; overflow: visible; }
  #mobile-home .mt-chart text { font-family: var(--sans); font-size: 10px; font-variant-numeric: tabular-nums; fill: var(--copy); }
  #mobile-home .mt-chart text.ti-k { font-size: 9.5px; font-weight: 600; letter-spacing: 1px; fill: var(--text); }
  #mobile-home .mt-chart text.ti-note-t { font-weight: 500; fill: var(--text); paint-order: stroke; stroke: var(--surface); stroke-width: 3px; stroke-linejoin: round; }
  #mobile-home .mt-rows { margin: 12px 0 0; padding: 0 0 2px; list-style: none; }
  #mobile-home .mt-rows li, #mobile-home .mt-rowsbox .ti-row { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(64px, 1fr) 44px; align-items: center; gap: 10px; padding: 6.5px 0; border-top: 1px solid var(--line); }
  #mobile-home .mt-rows li:first-child { border-top: 0; }
  #mobile-home .mt-rows li > span, #mobile-home .mt-rowsbox .ti-row > span { color: var(--body); font: 400 12.5px/1.3 var(--sans); }
  #mobile-home .ti-track { position: relative; display: block; height: 4px; background: rgb(19 45 88 / .8); border-radius: 2px; overflow: hidden; }
  #mobile-home .ti-track b { position: absolute; top: 0; bottom: 0; left: 0; background: var(--blue); border-radius: 2px; }
  #mobile-home .ti-track.is-signed::before { content: ""; position: absolute; left: 50%; top: -2px; bottom: -2px; width: 1px; background: var(--line-strong); }
  #mobile-home .ti-track > i { position: absolute; top: -2px; bottom: -2px; width: 1px; background: var(--line-strong); }
  #mobile-home .mt-rows li > em, #mobile-home .mt-rowsbox .ti-row > em { color: var(--accent); font: 500 11.5px/1 var(--mono); font-style: normal; text-align: right; }
  #mobile-home .mt-explain { margin: 44px 0 0; padding-top: 16px; border-top: 1px solid var(--line); }
  #mobile-home .mt-explain h4 { margin: 0; color: var(--blue); font: 600 11px/1.3 var(--sans); letter-spacing: 1.4px; text-transform: uppercase; }
  #mobile-home .mt-explain p { margin: 10px 0 0; color: var(--body); font: 400 15px/1.55 var(--sans); text-wrap: pretty; } /* the Technology page text standard (owner, 15 Oct 2026) */

  #mobile-home :is(.mt-h2, .mt-name) { text-transform: uppercase; letter-spacing: -.015em; }
  #mobile-home .mt-h2 { font-size: clamp(22px, calc((100vw - 52px) / 12.07), 29px); line-height: 1.08; }
  html[lang="de"] #mobile-home .mt-name { font-size: 14.5px; }
}
@media (max-width: 360px) {
  #mobile-home .mt-dim-head { gap: 6px; }
}

/* The analytical-dimensions paragraph reads as one plain text: its emphasis takes the paragraph's own type (owner, 15 Oct 2026). */
@media (max-width: 760px) {
  #mobile-home .mt-dims .mt-lead strong { color: inherit; font-weight: inherit; }
}
/* The word Quantsion inside the phone home paragraphs: the opening wordmark's light blue, a little heavier than the text
   and lighter than the ExtraBold emphasis (owner, 15 Oct 2026). */
@media (max-width: 760px) {
  #mobile-home .q-brand { color: #67a4ff; font-family: "Inter Text", "Inter", Arial, sans-serif; font-weight: 600; }
}

/* The Technology page's opening drawing under the home heading (owner, 15 Oct 2026): the same rules. */
@media (max-width: 760px) {
  #mobile-home .mt-openvis { margin: 24px 0 0; padding: 14px 6px 10px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
  /* crisp cells; the dimension names larger and lighter to read (owner, 15 Oct 2026) */
  #mobile-home .mt-openvis svg { display: block; width: 100%; height: 208px; overflow: visible; }
  #mobile-home .mt-openvis rect { shape-rendering: crispEdges; }
  #mobile-home .mt-openvis text { font-family: var(--sans); font-size: 10px; font-variant-numeric: tabular-nums; fill: var(--copy); }
  #mobile-home .mt-openvis text.ti-k { font-size: 9.5px; font-weight: 600; letter-spacing: 1px; fill: var(--text); }
  #mobile-home .mt-openvis text.mt-rowname { font-size: 13px; fill: var(--body); }
}