/* ==========================================================================
   QARHAMI x ABI - partnership page - stylesheet for WordPress / Elementor
   v1.0.4 - built 2026-09-23
   Every rule is scoped to #qabi (the page) and #qabi-portal (its photo
   gallery), so nothing here can reach the rest of the site. Keyframes are
   prefixed qabi-, sizes are px, and section 1 shields the page from theme
   and Elementor Kit element styles.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1 · Hardening
   WordPress themes and the Elementor Kit style bare elements (headings, links,
   buttons, figcaption, lists, images, labels). Inside the page every element
   is first returned to the browser default the page was designed against;
   the page's own rules then take over. SVG internals are left alone.
   -------------------------------------------------------------------------- */
:is(#qabi,#qabi-portal){text-align:start;letter-spacing:normal;word-spacing:normal;text-transform:none;
  font-style:normal;font-variant:normal;font-feature-settings:normal;text-indent:0;text-shadow:none;
  overflow-wrap:normal;word-break:normal;hyphens:manual;box-sizing:border-box}
:is(#qabi,#qabi-portal) :not(svg,svg *){
  margin:revert;padding:revert;border:revert;border-radius:revert;background:revert;box-shadow:revert;
  outline:revert;font-family:revert;font-size:revert;font-weight:revert;font-style:revert;line-height:revert;
  letter-spacing:revert;word-spacing:revert;text-transform:revert;text-decoration:revert;text-align:revert;
  text-indent:revert;text-shadow:revert;color:revert;transition:revert;display:revert;vertical-align:revert;
  white-space:revert;list-style:revert;min-height:revert;min-width:revert;max-width:revert;
  -webkit-appearance:revert;appearance:revert;-webkit-user-select:revert;user-select:revert;
  border-collapse:revert;border-spacing:revert;float:revert;clear:revert}

/* --------------------------------------------------------------------------
   2 · The page
   -------------------------------------------------------------------------- */
/* ===== assets/css/site.css ===== */
/* ==========================================================================
   QARHAMI WEB 2.0 — Core design system
   Tokens, typography and layout are derived 1:1 from the Qarhami Fleet OS
   application (tailwind.config.js + src/index.css) and the 2023 brand guideline.
   Nothing here is invented: every colour, radius and type step exists in product.
   ========================================================================== *//* ---------- Fonts: see assets/css/fonts.css, linked before this file ---- */:is(#qabi,#qabi-portal){
  /* Electric Indigo — primary */
  --in-50:#eeebfc;  --in-100:#ccc0f7; --in-200:#b3a1f3; --in-300:#9076ee;
  --in-400:#7a5cea; --in-500:#5933e5; --in-600:#512ed0; --in-700:#3f24a3;
  --in-800:#311c7e; --in-900:#251560;
  /* Mint — ready / complete */
  --mt-50:#e7f8f4;  --mt-100:#b4eade; --mt-200:#90e0cd; --mt-300:#5dd2b7;
  --mt-400:#3dc9a9; --mt-500:#0dbc93; --mt-600:#0cab86; --mt-700:#098568;
  --mt-800:#076751; --mt-900:#054f3e;
  /* Bittersweet — exception / stop */
  --bs-50:#ffeeef;  --bs-100:#ffcbcc; --bs-200:#ffb2b3; --bs-300:#ff8e90;
  --bs-400:#ff797b; --bs-500:#ff575a; --bs-600:#e84f52; --bs-700:#b53e40;
  --bs-800:#8c3032; --bs-900:#6b2526;
  /* Princeton Orange — attention */
  --or-50:#fff5e6;  --or-100:#ffdeb0; --or-200:#ffcf8a; --or-300:#ffb954;
  --or-400:#ffab33; --or-500:#ff9600; --or-600:#e88900; --or-700:#b56b00;
  --or-800:#8c5300; --or-900:#6b3f00;
  /* Neutral */
  --gun:#243242;
  --ink:#101826;
  --ink-80:rgba(16,24,38,.80);
  --ink-64:rgba(16,24,38,.64);
  --ink-48:rgba(16,24,38,.60);   /* raised from .48 to clear WCAG AA on white */
  --ink-28:rgba(16,24,38,.34);
  --line:rgba(16,24,38,.10);
  --line-soft:rgba(16,24,38,.06);
  --paper:#ffffff;
  --paper-2:#fafafa;
  --paper-3:#f6f6f7;
  --lav:#f7f5ff;

  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:24px; --r-2xl:32px; --r-pill:999px;
  --shadow-1:0 1px 2px rgba(16,24,38,.04), 0 2px 8px rgba(16,24,38,.04);
  --shadow-2:0 2px 6px rgba(16,24,38,.05), 0 12px 32px rgba(16,24,38,.07);
  --shadow-3:0 8px 24px rgba(16,24,38,.08), 0 32px 80px rgba(37,21,96,.12);
  --shadow-in:0 10px 30px rgba(89,51,229,.18);

  --gutter:24px;
  --maxw:1240px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
}:is(#qabi,#qabi-portal) *,:is(#qabi,#qabi-portal) *::before,:is(#qabi,#qabi-portal) *::after{box-sizing:border-box}:is(#qabi,#qabi-portal){-webkit-text-size-adjust:100%;scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal){scroll-behavior:auto}}:is(#qabi,#qabi-portal){
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:16px;line-height:1.65;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}:is(#qabi,#qabi-portal) img,:is(#qabi,#qabi-portal) svg,:is(#qabi,#qabi-portal) video{max-width:100%;display:block}:is(#qabi,#qabi-portal) a{color:inherit;text-decoration:none}:is(#qabi,#qabi-portal) button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}:is(#qabi,#qabi-portal) ::selection{background:var(--in-100);color:var(--in-900)}/* ---------- Type scale ---------------------------------------------------- */:is(#qabi,#qabi-portal) .display,:is(#qabi,#qabi-portal) h1,:is(#qabi,#qabi-portal) h2,:is(#qabi,#qabi-portal) h3,:is(#qabi,#qabi-portal) h4{font-family:"Nexa","Poppins",sans-serif;font-weight:900;letter-spacing:-.02em;line-height:1.06;color:var(--gun);margin:0}:is(#qabi,#qabi-portal) .display{font-size:clamp(41.6px,6.2vw,81.6px)}:is(#qabi,#qabi-portal) h1{font-size:clamp(38.4px,5.4vw,70.4px)}:is(#qabi,#qabi-portal) h2{font-size:clamp(31.2px,3.9vw,51.2px);line-height:1.1}:is(#qabi,#qabi-portal) h3{font-size:clamp(21.6px,2.1vw,31.2px);line-height:1.18}:is(#qabi,#qabi-portal) h4{font-size:clamp(16.8px,1.4vw,20.48px);line-height:1.3;letter-spacing:-.01em}:is(#qabi,#qabi-portal) p{margin:0}:is(#qabi,#qabi-portal) .lede{font-size:clamp(16.8px,1.35vw,20.48px);line-height:1.6;color:var(--ink-64);font-weight:300}:is(#qabi,#qabi-portal) .body-lg{font-size:16.8px;line-height:1.7;color:var(--ink-64);font-weight:300}:is(#qabi,#qabi-portal) .small{font-size:14px;line-height:1.6;color:var(--ink-64)}:is(#qabi,#qabi-portal) .micro{font-size:12px;line-height:1.5;color:var(--ink-48)}:is(#qabi,#qabi-portal) strong,:is(#qabi,#qabi-portal) b{font-weight:600;color:var(--ink)}:is(#qabi,#qabi-portal) .u-mint{color:var(--mt-700)}:is(#qabi,#qabi-portal) .u-in{color:var(--in-500)}:is(#qabi,#qabi-portal) .u-or{color:var(--or-700)}:is(#qabi,#qabi-portal) .u-bs{color:var(--bs-700)}/* Eyebrow / kicker */:is(#qabi,#qabi-portal) .kicker{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11.52px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--in-600);
}:is(#qabi,#qabi-portal) .kicker::before{content:"";width:18px;height:2px;border-radius:2px;background:var(--in-500)}:is(#qabi,#qabi-portal) .kicker--plain::before{display:none}:is(#qabi,#qabi-portal) .kicker--chip{
  background:var(--in-50);border:1px solid var(--in-100);color:var(--in-700);
  padding:7px 14px;border-radius:var(--r-pill);letter-spacing:.1em;
}:is(#qabi,#qabi-portal) .kicker--chip::before{display:none}/* ---------- Layout -------------------------------------------------------- */:is(#qabi,#qabi-portal) .wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}:is(#qabi,#qabi-portal) .wrap--wide{max-width:1440px}:is(#qabi,#qabi-portal) .wrap--narrow{max-width:900px}:is(#qabi,#qabi-portal) section{position:relative}:is(#qabi,#qabi-portal) .sec{padding:clamp(72px,9vw,140px) 0}:is(#qabi,#qabi-portal) .sec--tight{padding:clamp(56px,6vw,92px) 0}:is(#qabi,#qabi-portal) .sec--paper2{background:var(--paper-2)}:is(#qabi,#qabi-portal) .sec--lav{background:linear-gradient(180deg,#fff 0%,var(--lav) 40%,var(--lav) 60%,#fff 100%)}:is(#qabi,#qabi-portal) .grid{display:grid;gap:24px}:is(#qabi,#qabi-portal) .g2{grid-template-columns:repeat(2,1fr)}:is(#qabi,#qabi-portal) .g3{grid-template-columns:repeat(3,1fr)}:is(#qabi,#qabi-portal) .g4{grid-template-columns:repeat(4,1fr)}@media(max-width:980px){:is(#qabi,#qabi-portal) .g3,:is(#qabi,#qabi-portal) .g4{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){:is(#qabi,#qabi-portal) .g2,:is(#qabi,#qabi-portal) .g3,:is(#qabi,#qabi-portal) .g4{grid-template-columns:1fr}}:is(#qabi,#qabi-portal) .stack-sm>*+*{margin-top:12px}:is(#qabi,#qabi-portal) .stack>*+*{margin-top:20px}:is(#qabi,#qabi-portal) .stack-lg>*+*{margin-top:32px}:is(#qabi,#qabi-portal) .sec-head{max-width:760px;margin-bottom:clamp(36px,4vw,64px)}:is(#qabi,#qabi-portal) .sec-head.center{margin-left:auto;margin-right:auto;text-align:center}:is(#qabi,#qabi-portal) .sec-head h2{margin:16px 0 18px}/* ---------- Buttons ------------------------------------------------------- */:is(#qabi,#qabi-portal) .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  height:52px;padding:0 26px;border-radius:26px;
  font-size:15.2px;font-weight:500;letter-spacing:-.005em;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .2s ease,border-color .2s ease;
  white-space:nowrap;
}:is(#qabi,#qabi-portal) .btn svg{flex:none}:is(#qabi,#qabi-portal) .btn--primary{background:var(--in-500);color:#fff;box-shadow:var(--shadow-in)}:is(#qabi,#qabi-portal) .btn--primary:hover{background:var(--in-600);transform:translateY(-2px);box-shadow:0 14px 34px rgba(89,51,229,.26)}:is(#qabi,#qabi-portal) .btn--ghost{background:#fff;color:var(--gun);border:1px solid var(--line);box-shadow:var(--shadow-1)}:is(#qabi,#qabi-portal) .btn--ghost:hover{border-color:var(--in-200);color:var(--in-600);transform:translateY(-2px)}:is(#qabi,#qabi-portal) .btn--line{border:1px solid var(--in-500);color:var(--in-600)}:is(#qabi,#qabi-portal) .btn--line:hover{background:var(--in-50)}:is(#qabi,#qabi-portal) .btn--sm{height:42px;padding:0 20px;font-size:14px}:is(#qabi,#qabi-portal) .btn--lg{height:58px;padding:0 32px;font-size:16px}:is(#qabi,#qabi-portal) .btn-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}:is(#qabi,#qabi-portal) .textlink{display:inline-flex;align-items:center;gap:7px;color:var(--in-600);font-weight:500;font-size:15.2px}:is(#qabi,#qabi-portal) .textlink svg{transition:transform .3s var(--ease)}:is(#qabi,#qabi-portal) .textlink:hover svg{transform:translateX(4px)}/* ---------- Cards --------------------------------------------------------- */:is(#qabi,#qabi-portal) .card{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:28px;box-shadow:var(--shadow-1)}:is(#qabi,#qabi-portal) .card--lav{background:var(--lav);border-color:var(--in-100)}:is(#qabi,#qabi-portal) .card--flat{box-shadow:none}:is(#qabi,#qabi-portal) .card-hover{transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s var(--ease)}:is(#qabi,#qabi-portal) .card-hover:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:var(--in-100)}:is(#qabi,#qabi-portal) .ico-tile{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  background:var(--in-50);color:var(--in-600);flex:none;
}:is(#qabi,#qabi-portal) .ico-tile--mt{background:var(--mt-50);color:var(--mt-700)}:is(#qabi,#qabi-portal) .ico-tile--or{background:var(--or-50);color:var(--or-700)}:is(#qabi,#qabi-portal) .ico-tile--bs{background:var(--bs-50);color:var(--bs-700)}/* ---------- Header -------------------------------------------------------- */:is(#qabi,#qabi-portal) .hdr{position:fixed;inset:0 0 auto 0;z-index:90;transition:background .35s ease,box-shadow .35s ease,border-color .35s ease;border-bottom:1px solid transparent}:is(#qabi,#qabi-portal) .hdr.is-stuck{background:rgba(255,255,255,.86);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);border-bottom-color:var(--line-soft)}:is(#qabi,#qabi-portal) .hdr__in{display:flex;align-items:center;gap:28px;height:74px}:is(#qabi,#qabi-portal) .brand{display:flex;align-items:center;gap:10px;flex:none}:is(#qabi,#qabi-portal) .brand img{height:30px;width:auto}:is(#qabi,#qabi-portal) .nav{display:flex;align-items:center;gap:4px;margin-left:8px}:is(#qabi,#qabi-portal) .nav a,:is(#qabi,#qabi-portal) .nav button.navtop{
  padding:9px 14px;border-radius:var(--r-pill);font-size:14.72px;font-weight:500;color:var(--ink-80);
  display:inline-flex;align-items:center;gap:5px;transition:background .2s,color .2s
}:is(#qabi,#qabi-portal) .nav a:hover,:is(#qabi,#qabi-portal) .nav button.navtop:hover{background:var(--in-50);color:var(--in-700)}:is(#qabi,#qabi-portal) .hdr__cta{margin-left:auto;display:flex;align-items:center;gap:10px}:is(#qabi,#qabi-portal) .burger{display:none;width:44px;height:44px;border-radius:var(--r-pill);border:1px solid var(--line);align-items:center;justify-content:center}:is(#qabi,#qabi-portal) .has-drop{position:relative}:is(#qabi,#qabi-portal) .drop{
  position:absolute;top:calc(100% + 12px);left:-12px;min-width:330px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-3);padding:10px;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.22s var(--ease);
}:is(#qabi,#qabi-portal) .has-drop:hover .drop,:is(#qabi,#qabi-portal) .has-drop:focus-within .drop{opacity:1;visibility:visible;transform:none}:is(#qabi,#qabi-portal) .drop a{display:flex;gap:12px;padding:11px 12px;border-radius:var(--r-md);align-items:flex-start}:is(#qabi,#qabi-portal) .drop a:hover{background:var(--paper-3)}:is(#qabi,#qabi-portal) .drop .t{font-weight:600;font-size:14.4px;color:var(--gun);display:block;line-height:1.35}:is(#qabi,#qabi-portal) .drop .d{font-size:12.48px;color:var(--ink-48);display:block;line-height:1.45}@media(max-width:1080px){:is(#qabi,#qabi-portal) .nav,:is(#qabi,#qabi-portal) .hdr__cta .btn--ghost{display:none}:is(#qabi,#qabi-portal) .burger{display:inline-flex}:is(#qabi,#qabi-portal) .hdr__cta{margin-left:auto}}:is(#qabi,#qabi-portal) .mobilenav{position:fixed;inset:74px 0 0 0;background:#fff;z-index:89;padding:24px var(--gutter) 60px;overflow-y:auto;
  transform:translateY(-8px);opacity:0;visibility:hidden;transition:.28s var(--ease)}:is(#qabi,#qabi-portal) .mobilenav.open{transform:none;opacity:1;visibility:visible}:is(#qabi,#qabi-portal) .mobilenav a{display:block;padding:15px 0;border-bottom:1px solid var(--line-soft);font-size:16.8px;font-weight:500}:is(#qabi,#qabi-portal) .mobilenav .grp{font-size:11.2px;letter-spacing:.14em;text-transform:uppercase;color:var(--in-600);margin:26px 0 4px;font-weight:600}/* ---------- Reveal -------------------------------------------------------- */:is(#qabi,#qabi-portal) .rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}:is(#qabi,#qabi-portal) .rv.in{opacity:1;transform:none}:is(#qabi,#qabi-portal) .rv-d1{transition-delay:.08s}:is(#qabi,#qabi-portal) .rv-d2{transition-delay:.16s}:is(#qabi,#qabi-portal) .rv-d3{transition-delay:.24s}:is(#qabi,#qabi-portal) .rv-d4{transition-delay:.32s}:is(#qabi,#qabi-portal) .rv-d5{transition-delay:.4s}:is(#qabi,#qabi-portal) .rv-d6{transition-delay:.48s}@media (prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .rv{opacity:1;transform:none;transition:none}}/* ---------- Hero ---------------------------------------------------------- */:is(#qabi,#qabi-portal) .hero{position:relative;padding:calc(74px + clamp(48px,7vw,96px)) 0 0}:is(#qabi,#qabi-portal) .hero__bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}:is(#qabi,#qabi-portal) .hero__bg::before{
  content:"";position:absolute;left:50%;top:-340px;transform:translateX(-50%);
  width:1300px;height:900px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(89,51,229,.13),rgba(89,51,229,0) 70%);
}:is(#qabi,#qabi-portal) .hero__bg::after{
  content:"";position:absolute;right:-180px;top:180px;width:760px;height:760px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(13,188,147,.10),rgba(13,188,147,0) 70%);
}:is(#qabi,#qabi-portal) .gridlines{position:absolute;inset:0;
  background-image:linear-gradient(var(--line-soft) 1px,transparent 1px),linear-gradient(90deg,var(--line-soft) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 30%,#000 30%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 30%,#000 30%,transparent 78%);
}:is(#qabi,#qabi-portal) .hero__in{position:relative;z-index:2;text-align:center;max-width:960px;margin:0 auto}:is(#qabi,#qabi-portal) .hero h1{margin:22px 0 0}:is(#qabi,#qabi-portal) .hero h1 .hl{
  position:relative;color:var(--in-500);display:inline-block;
}:is(#qabi,#qabi-portal) .hero h1 .hl::after{
  content:"";position:absolute;left:-2px;right:-2px;bottom:.07em;height:.16em;border-radius:4px;
  background:linear-gradient(90deg,var(--in-200),var(--mt-200));opacity:.38;z-index:-1;
  transform:scaleX(0);transform-origin:left;animation:qabi-underline 1s .5s var(--ease) forwards;
}@keyframes qabi-underline{to{transform:scaleX(1)}}:is(#qabi,#qabi-portal) .hero .lede{margin:24px auto 0;max-width:660px}:is(#qabi,#qabi-portal) .hero .btn-row{justify-content:center;margin-top:34px}:is(#qabi,#qabi-portal) .trustline{display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;margin-top:26px}:is(#qabi,#qabi-portal) .trustline span{display:inline-flex;align-items:center;gap:7px;font-size:12.8px;color:var(--ink-48);font-weight:500}:is(#qabi,#qabi-portal) .trustline svg{color:var(--mt-500);flex:none}/* Scroll-driven hero stage: the product rises and takes the screen */:is(#qabi,#qabi-portal) .hero-stage{position:relative;height:210vh;margin-top:56px}:is(#qabi,#qabi-portal) .hero-stage__sticky{position:sticky;top:0;height:100vh;padding-top:74px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}:is(#qabi,#qabi-portal) .hero-device{
  /* the third term keeps the whole shell inside the viewport at any aspect ratio */
  width:min(1120px,92vw,108vh);will-change:transform,opacity;
  transform-origin:center 58%;
}:is(#qabi,#qabi-portal) .hero-cap{
  margin-top:22px;text-align:center;width:min(720px,90vw);
  opacity:0;transition:opacity .5s ease;
}:is(#qabi,#qabi-portal) .hero-cap h3{font-size:clamp(18.4px,1.8vw,25.6px)}:is(#qabi,#qabi-portal) .hero-cap h3{color:var(--gun)}:is(#qabi,#qabi-portal) .hero-cap p{margin-top:10px;color:var(--ink-64);font-weight:300}@media(max-width:760px){:is(#qabi,#qabi-portal) .hero-stage{height:170vh}}/* Browser chrome shell around the product */:is(#qabi,#qabi-portal) .shell{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-2xl);overflow:hidden;
  box-shadow:var(--shadow-3);
}:is(#qabi,#qabi-portal) .shell__bar{
  height:42px;display:flex;align-items:center;gap:8px;padding:0 16px;
  background:var(--paper-3);border-bottom:1px solid var(--line-soft);
}:is(#qabi,#qabi-portal) .shell__dot{width:10px;height:10px;border-radius:50%;background:#d9dbe1}:is(#qabi,#qabi-portal) .shell__url{
  margin-left:12px;height:24px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--line-soft);
  display:flex;align-items:center;gap:7px;padding:0 12px;font-size:11.2px;color:var(--ink-48);min-width:230px;
}:is(#qabi,#qabi-portal) .shell__url svg{color:var(--mt-600)}/* ---------- Fragmentation section ---------------------------------------- */:is(#qabi,#qabi-portal) .frag{position:relative;overflow:clip}:is(#qabi,#qabi-portal) .frag__stage{position:relative;height:min(470px,54vw);min-height:380px;margin-top:28px}:is(#qabi,#qabi-portal) .frag__tile{
  position:absolute;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-2);padding:14px 16px;display:flex;align-items:center;gap:11px;
  font-size:13.6px;font-weight:500;color:var(--ink-80);white-space:nowrap;
  transition:transform 1.1s var(--ease-io),opacity .8s ease;will-change:transform,opacity;
}:is(#qabi,#qabi-portal) .frag__tile .ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;font-size:14.4px}:is(#qabi,#qabi-portal) .frag__tile small{display:block;font-size:11.2px;color:var(--ink-48);font-weight:400}:is(#qabi,#qabi-portal) .frag__core{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.9);
  opacity:0;transition:all 1s .35s var(--ease);width:min(420px,84%);
}:is(#qabi,#qabi-portal) .frag.is-merged .frag__core{opacity:1;transform:translate(-50%,-50%) scale(1)}:is(#qabi,#qabi-portal) .frag.is-merged .frag__tile{transform:translate(var(--mx),var(--my)) scale(.55);opacity:0}/* ---------- FLEET OS SCROLL EXPERIENCE ----------------------------------- */:is(#qabi,#qabi-portal) .os{position:relative;background:linear-gradient(180deg,#fff 0%,#fbfaff 8%,#fbfaff 92%,#fff 100%)}:is(#qabi,#qabi-portal) .os__rail{position:relative}:is(#qabi,#qabi-portal) .os__sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}:is(#qabi,#qabi-portal) .os__progress{
  position:absolute;left:0;top:0;height:3px;width:100%;background:var(--line-soft);z-index:6;
}:is(#qabi,#qabi-portal) .os__progress i{display:block;height:100%;width:0%;background:linear-gradient(90deg,var(--in-500),var(--mt-500));border-radius:0 3px 3px 0;transition:width .12s linear}:is(#qabi,#qabi-portal) .os__inner{display:grid;grid-template-columns:330px 1fr;gap:40px;align-items:center;width:100%;max-width:1440px;margin:0 auto;padding:0 var(--gutter)}:is(#qabi,#qabi-portal) .os__copy{position:relative;min-height:338px}:is(#qabi,#qabi-portal) .os__chapter{
  position:absolute;inset:0;opacity:0;transform:translateY(16px);pointer-events:none;
  transition:opacity .45s var(--ease),transform .45s var(--ease);
  display:flex;flex-direction:column;justify-content:center;
}:is(#qabi,#qabi-portal) .os__chapter.on{opacity:1;transform:none;pointer-events:auto}:is(#qabi,#qabi-portal) .os__chapter .num{
  font-family:"Nexa";font-size:12px;letter-spacing:.18em;color:var(--in-400);font-weight:900;margin-bottom:14px;
  display:flex;align-items:center;gap:10px;
}:is(#qabi,#qabi-portal) .os__chapter .num i{height:1px;width:34px;background:var(--in-200);display:block}:is(#qabi,#qabi-portal) .os__chapter h3{margin-bottom:12px}:is(#qabi,#qabi-portal) .os__chapter p{color:var(--ink-64);font-weight:300;font-size:15.68px;line-height:1.66}:is(#qabi,#qabi-portal) .os__chapter ul{list-style:none;padding:0;margin:16px 0 0}:is(#qabi,#qabi-portal) .os__chapter li{display:flex;gap:10px;font-size:13.76px;color:var(--ink-64);padding:5px 0;align-items:flex-start}:is(#qabi,#qabi-portal) .os__chapter li svg{flex:none;margin-top:4px;color:var(--mt-500)}:is(#qabi,#qabi-portal) .os__dots{position:absolute;left:0;bottom:-42px;display:flex;gap:7px;flex-wrap:wrap;z-index:2}:is(#qabi,#qabi-portal) .os__dots button{
  height:6px;width:22px;border-radius:3px;background:var(--line);transition:.3s var(--ease);
}:is(#qabi,#qabi-portal) .os__dots button.on{background:var(--in-500);width:40px}:is(#qabi,#qabi-portal) .os__stagewrap{position:relative}/* the device that holds the app */:is(#qabi,#qabi-portal) .appframe{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;
  box-shadow:var(--shadow-3);aspect-ratio:16/10.1;max-height:74vh;margin-left:auto;width:100%;
}@media(max-width:1180px){:is(#qabi,#qabi-portal) .os__inner{grid-template-columns:1fr;gap:20px}:is(#qabi,#qabi-portal) .os__copy{min-height:auto;position:relative;height:200px}:is(#qabi,#qabi-portal) .appframe{aspect-ratio:16/11;max-height:52vh}}@media(max-width:700px){:is(#qabi,#qabi-portal) .os__sticky{justify-content:flex-start;padding-top:74px}:is(#qabi,#qabi-portal) .os__copy{height:190px;order:2;margin-top:14px}:is(#qabi,#qabi-portal) .appframe{max-height:46vh;aspect-ratio:auto;height:46vh}:is(#qabi,#qabi-portal) .os__chapter h3{font-size:20px}:is(#qabi,#qabi-portal) .os__chapter p{font-size:13.76px}:is(#qabi,#qabi-portal) .os__chapter li{font-size:12.48px}}/* ====== In-product UI (exact Fleet OS component language) ================= */:is(#qabi,#qabi-portal) .app{display:flex;height:100%;background:#fff;font-size:12px}:is(#qabi,#qabi-portal) .app__side{
  width:64px;flex:none;background:var(--in-500);display:flex;flex-direction:column;
  align-items:center;padding:14px 0;gap:4px;
}:is(#qabi,#qabi-portal) .app__side .logo{width:30px;height:30px;border-radius:9px;background:#fff;display:grid;place-items:center;margin-bottom:12px}:is(#qabi,#qabi-portal) .app__side .logo img{width:20px}:is(#qabi,#qabi-portal) .sideitem{
  width:44px;height:38px;border-radius:11px;display:grid;place-items:center;color:rgba(255,255,255,.72);
  transition:.3s var(--ease);position:relative;
}:is(#qabi,#qabi-portal) .sideitem svg{width:17px;height:17px}:is(#qabi,#qabi-portal) .sideitem.on{background:rgba(255,255,255,.18);color:#fff}:is(#qabi,#qabi-portal) .sideitem.on::before{content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%);width:3px;height:18px;border-radius:2px;background:#fff}:is(#qabi,#qabi-portal) .app__main{flex:1;min-width:0;display:flex;flex-direction:column;background:#fff;position:relative}:is(#qabi,#qabi-portal) .app__top{
  height:48px;flex:none;display:flex;align-items:center;gap:10px;padding:0 14px;border-bottom:1px solid var(--line-soft);
}:is(#qabi,#qabi-portal) .app__top .ttl{font-family:"Nexa";font-weight:900;font-size:15px;color:var(--gun);letter-spacing:-.01em}:is(#qabi,#qabi-portal) .app__top .sp{flex:1}:is(#qabi,#qabi-portal) .topbtn{width:28px;height:28px;border-radius:50%;background:rgba(0,0,0,.05);display:grid;place-items:center;color:var(--ink-64);position:relative}:is(#qabi,#qabi-portal) .topbtn svg{width:14px;height:14px}:is(#qabi,#qabi-portal) .topbtn .pip{position:absolute;top:1px;right:1px;width:6px;height:6px;border-radius:50%;background:var(--in-500);border:1.5px solid #fff}:is(#qabi,#qabi-portal) .app__body{flex:1;min-height:0;display:flex}:is(#qabi,#qabi-portal) .app__left{width:38%;min-width:0;flex:none;border-right:1px solid var(--line-soft);display:flex;flex-direction:column}:is(#qabi,#qabi-portal) .app__right{flex:1;min-width:0;position:relative;background:#eef0f2}:is(#qabi,#qabi-portal) .searchbar{display:flex;align-items:center;gap:8px;padding:8px 10px;margin:9px;border-radius:var(--r-pill);background:var(--paper-3);color:var(--ink-48);font-size:11px}:is(#qabi,#qabi-portal) .searchbar svg{width:13px;height:13px;flex:none}:is(#qabi,#qabi-portal) .filterchips{display:flex;gap:6px;padding:0 9px 8px;flex-wrap:wrap}:is(#qabi,#qabi-portal) .chip{
  display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:var(--r-pill);
  border:1px solid var(--line);font-size:10px;font-weight:500;color:var(--ink-64);background:#fff;white-space:nowrap;
  transition:.3s var(--ease);
}:is(#qabi,#qabi-portal) .chip .n{font-weight:600;color:var(--gun)}:is(#qabi,#qabi-portal) .chip.on{background:var(--in-50);border-color:var(--in-200);color:var(--in-700)}:is(#qabi,#qabi-portal) .chip.on .n{color:var(--in-700)}:is(#qabi,#qabi-portal) .cardlist{flex:1;min-height:0;overflow:hidden;padding:0 9px 9px;display:flex;flex-direction:column;gap:8px;position:relative}:is(#qabi,#qabi-portal) .cardlist__scroll{display:flex;flex-direction:column;gap:8px;transition:transform .7s var(--ease)}/* vehicle card — mirrors src/pages/Dashboard/Vehicles/VehicleCard.jsx */:is(#qabi,#qabi-portal) .vcard{
  background:var(--paper-2);border:1px solid transparent;border-radius:10px;padding:10px 11px;
  transition:.4s var(--ease);position:relative;
}:is(#qabi,#qabi-portal) .vcard.sel{background:#fff;border:1.5px solid #574596;box-shadow:0 2px 10px rgba(87,69,150,.13)}:is(#qabi,#qabi-portal) .vcard__top{display:flex;justify-content:space-between;gap:10px}:is(#qabi,#qabi-portal) .vcard__id{min-width:0;flex:1}:is(#qabi,#qabi-portal) .vcard__name{font-family:"Nexa";font-weight:900;font-size:13px;color:rgba(0,0,0,.9);line-height:1.2;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:is(#qabi,#qabi-portal) .vcard__plate{font-size:9.5px;color:rgba(0,0,0,.7);margin-top:1px}:is(#qabi,#qabi-portal) .vcard__thumb{width:66px;height:52px;border-radius:6px;background:var(--in-50);display:grid;place-items:center;flex:none}:is(#qabi,#qabi-portal) .vcard__thumb svg{width:46px}:is(#qabi,#qabi-portal) .tagrow{display:flex;flex-wrap:wrap;gap:4px;margin-top:7px}:is(#qabi,#qabi-portal) .tg{display:inline-flex;align-items:center;gap:3px;height:20px;padding:0 6px;border-radius:6px;font-size:9px;font-weight:500;border:1px solid;white-space:nowrap}:is(#qabi,#qabi-portal) .tg svg{width:10px;height:10px}:is(#qabi,#qabi-portal) .tg--on{border-color:var(--mt-700);background:var(--mt-50);color:var(--mt-700)}:is(#qabi,#qabi-portal) .tg--off{border-color:var(--bs-700);background:var(--bs-50);color:var(--bs-700)}:is(#qabi,#qabi-portal) .tg--warn{border-color:var(--or-700);background:var(--or-50);color:var(--or-700)}:is(#qabi,#qabi-portal) .tg--lock{border-color:var(--mt-700);background:var(--mt-50);color:var(--mt-700);width:26px;padding:0;justify-content:center}:is(#qabi,#qabi-portal) .tg--unlock{border-color:var(--or-700);background:var(--or-50);color:var(--or-700);width:26px;padding:0;justify-content:center}:is(#qabi,#qabi-portal) .dot{width:6px;height:6px;border-radius:50%;flex:none}:is(#qabi,#qabi-portal) .iconrow{display:flex;gap:6px;margin-top:8px}:is(#qabi,#qabi-portal) .circbtn{width:26px;height:26px;border-radius:50%;background:rgba(0,0,0,.06);display:grid;place-items:center;color:rgba(0,0,0,.72);transition:.3s var(--ease)}:is(#qabi,#qabi-portal) .circbtn svg{width:12px;height:12px}:is(#qabi,#qabi-portal) .circbtn.hot{background:var(--or-50);box-shadow:inset 0 0 0 1px var(--or-500)}:is(#qabi,#qabi-portal) .actionrow{display:flex;gap:5px;margin-top:9px}:is(#qabi,#qabi-portal) .actbtn{
  flex:1;height:42px;border-radius:12px;border:1px solid;display:grid;place-items:center;background:#fff;
  transition:.28s var(--ease);position:relative;overflow:hidden;
}:is(#qabi,#qabi-portal) .actbtn svg{width:20px;height:20px;position:relative;z-index:2}:is(#qabi,#qabi-portal) .actbtn--lock{border-color:var(--mt-500)}:is(#qabi,#qabi-portal) .actbtn--unlock{border-color:var(--or-500)}:is(#qabi,#qabi-portal) .actbtn--engine{border-color:var(--in-500)}:is(#qabi,#qabi-portal) .actbtn--kill{border-color:var(--bs-500)}:is(#qabi,#qabi-portal) .actbtn.fire::after{
  content:"";position:absolute;inset:0;background:currentColor;opacity:.13;
  transform:scale(0);border-radius:50%;animation:qabi-ripple .75s var(--ease) forwards;
}:is(#qabi,#qabi-portal) .actbtn--lock.fire{color:var(--mt-500)}:is(#qabi,#qabi-portal) .actbtn--unlock.fire{color:var(--or-500)}:is(#qabi,#qabi-portal) .actbtn--engine.fire{color:var(--in-500)}:is(#qabi,#qabi-portal) .actbtn--kill.fire{color:var(--bs-500)}@keyframes qabi-ripple{to{transform:scale(3);opacity:0}}:is(#qabi,#qabi-portal) .vtabs{display:flex;gap:4px;margin-top:9px;border-top:1px solid var(--line-soft);padding-top:8px}:is(#qabi,#qabi-portal) .vtab{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;font-size:9px;color:var(--in-600);font-weight:500;background:var(--lav);border-radius:7px;height:26px}:is(#qabi,#qabi-portal) .vtab svg{width:11px;height:11px}/* map surface */:is(#qabi,#qabi-portal) .map{position:absolute;inset:0;overflow:hidden}/* everything geographic sits on one canvas so a pan moves streets, markers,
   route and geofence together — overlays (toasts, legend, CTA) stay fixed */:is(#qabi,#qabi-portal) .map__canvas{position:absolute;inset:0;transform-origin:center;
  transition:transform 1.2s var(--ease);will-change:transform}:is(#qabi,#qabi-portal) .map svg.basemap{position:absolute;inset:0;width:100%;height:100%}:is(#qabi,#qabi-portal) .mk{position:absolute;z-index:3;transform:translate(-50%,-100%);transition:left 1.6s var(--ease-io),top 1.6s var(--ease-io),opacity .5s ease;will-change:left,top}:is(#qabi,#qabi-portal) .mk__pin{
  width:34px;height:36px;border-radius:12px 12px 12px 3px;background:#fff;border:1.5px solid var(--in-500);
  display:grid;place-items:center;box-shadow:0 3px 10px rgba(16,24,38,.18);transform:rotate(-45deg);
  color:var(--in-500);
}/* the car glyph ships with a baked-in brand fill — re-key it to the pin colour */:is(#qabi,#qabi-portal) .mk__pin svg *{fill:currentColor!important;stroke:none!important}:is(#qabi,#qabi-portal) .mk__pin>*{transform:rotate(45deg)}:is(#qabi,#qabi-portal) .mk--sel{z-index:5}:is(#qabi,#qabi-portal) .mk--sel .mk__pin{border-color:var(--mt-600);background:var(--mt-500);width:40px;height:42px}:is(#qabi,#qabi-portal) .mk--sel .mk__label,:is(#qabi,#qabi-portal) .mk:hover .mk__label{opacity:1}:is(#qabi,#qabi-portal) .mk--sel .mk__pin{color:#fff}:is(#qabi,#qabi-portal) .mk--alert .mk__pin{color:var(--bs-500)}:is(#qabi,#qabi-portal) .mk--alert .mk__pin{border-color:var(--bs-500)}:is(#qabi,#qabi-portal) .mk__label{
  opacity:0;transition:opacity .35s var(--ease);
  position:absolute;left:50%;top:calc(100% + 4px);transform:translateX(-50%);
  background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px 7px;font-size:9px;font-weight:500;
  color:var(--in-700);white-space:nowrap;box-shadow:var(--shadow-1);
}:is(#qabi,#qabi-portal) .mk__ring{
  position:absolute;left:50%;top:50%;width:70px;height:70px;margin:-35px 0 0 -35px;border-radius:50%;
  border:1.5px solid var(--mt-400);opacity:0;
}:is(#qabi,#qabi-portal) .mk--sel .mk__ring{animation:qabi-pulsering 2.4s infinite}@keyframes qabi-pulsering{0%{transform:scale(.45);opacity:.85}100%{transform:scale(1.5);opacity:0}}/* quick-action ring around a selected marker (as in the mobile dashboard) */:is(#qabi,#qabi-portal) .mk__acts{position:absolute;left:50%;top:50%;width:0;height:0}:is(#qabi,#qabi-portal) .mk__acts b{
  position:absolute;width:22px;height:22px;border-radius:50%;background:#fff;border:1.5px solid;
  display:grid;place-items:center;transform:translate(-50%,-50%) scale(0);
  transition:transform .45s var(--ease);box-shadow:var(--shadow-1);
}:is(#qabi,#qabi-portal) .mk--sel .mk__acts b{transform:translate(-50%,-50%) scale(1)}:is(#qabi,#qabi-portal) .mk__acts b svg{width:11px;height:11px}:is(#qabi,#qabi-portal) .mk__acts b:nth-child(1){left:-26px;top:-20px;border-color:var(--or-500);color:var(--or-600);transition-delay:.05s}:is(#qabi,#qabi-portal) .mk__acts b:nth-child(2){left:26px;top:-20px;border-color:var(--mt-500);color:var(--mt-600);transition-delay:.1s}:is(#qabi,#qabi-portal) .mk__acts b:nth-child(3){left:-26px;top:20px;border-color:var(--bs-500);color:var(--bs-600);transition-delay:.15s}:is(#qabi,#qabi-portal) .mk__acts b:nth-child(4){left:26px;top:20px;border-color:var(--or-500);color:var(--or-600);transition-delay:.2s}:is(#qabi,#qabi-portal) .route{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s ease .15s}:is(#qabi,#qabi-portal) .route.draw{opacity:1;transition:opacity .2s ease}:is(#qabi,#qabi-portal) .route path{fill:none;stroke:var(--in-500);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 2.6s var(--ease-io)}:is(#qabi,#qabi-portal) .route.draw path{stroke-dashoffset:0}:is(#qabi,#qabi-portal) .route .band-red{stroke:var(--bs-500)}:is(#qabi,#qabi-portal) .route .band-or{stroke:var(--or-500)}:is(#qabi,#qabi-portal) .route .band-mt{stroke:var(--mt-500)}:is(#qabi,#qabi-portal) .evt{position:absolute;transform:translate(-50%,-50%) scale(0);width:22px;height:22px;border-radius:50%;
  background:#fff;border:1.5px solid var(--bs-400);display:grid;place-items:center;box-shadow:var(--shadow-1);
  transition:transform .45s var(--ease)}:is(#qabi,#qabi-portal) .evt.on{transform:translate(-50%,-50%) scale(1)}:is(#qabi,#qabi-portal) .evt--trip{z-index:2}:is(#qabi,#qabi-portal) .evt svg{width:11px;height:11px;color:var(--bs-600)}/* geofence circle */:is(#qabi,#qabi-portal) .geo{position:absolute;border-radius:50%;border:2px dashed var(--in-400);background:rgba(89,51,229,.08);
  transform:translate(-50%,-50%) scale(0);transition:transform .9s var(--ease);pointer-events:none}:is(#qabi,#qabi-portal) .geo.on{transform:translate(-50%,-50%) scale(1)}:is(#qabi,#qabi-portal) .geo__tag{position:absolute;left:50%;top:-11px;transform:translateX(-50%);background:var(--in-500);color:#fff;
  font-size:9px;font-weight:500;padding:2px 8px;border-radius:var(--r-pill);white-space:nowrap}/* map legend / overlays */:is(#qabi,#qabi-portal) .maplegend{
  position:absolute;left:10px;top:10px;background:rgba(255,255,255,.95);border:1px solid var(--line);
  border-radius:9px;padding:8px 10px;font-size:9px;box-shadow:var(--shadow-1);
  opacity:0;transform:translateY(-6px);transition:.45s var(--ease);
}:is(#qabi,#qabi-portal) .maplegend.on{opacity:1;transform:none}:is(#qabi,#qabi-portal) .maplegend b{display:block;font-size:9.5px;color:var(--gun);margin-bottom:5px;font-weight:600}:is(#qabi,#qabi-portal) .maplegend i{display:flex;align-items:center;gap:6px;font-style:normal;color:var(--ink-64);padding:1.5px 0}:is(#qabi,#qabi-portal) .maplegend i s{width:14px;height:3px;border-radius:2px;display:block;text-decoration:none}:is(#qabi,#qabi-portal) .mapcta{
  position:absolute;left:50%;bottom:12px;transform:translateX(-50%) translateY(8px);
  background:var(--in-500);color:#fff;border-radius:var(--r-pill);height:28px;padding:0 14px;
  display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:500;box-shadow:var(--shadow-in);
  opacity:0;transition:.45s var(--ease);white-space:nowrap;
}:is(#qabi,#qabi-portal) .mapcta.on{opacity:1;transform:translateX(-50%)}/* toast / live notifications */:is(#qabi,#qabi-portal) .toasts{position:absolute;right:12px;bottom:12px;width:206px;display:flex;flex-direction:column-reverse;gap:7px;z-index:8;pointer-events:none}:is(#qabi,#qabi-portal) .toast{
  background:#fff;border:1px solid var(--line);border-left:3px solid var(--or-500);border-radius:9px;
  padding:8px 10px;box-shadow:var(--shadow-2);display:flex;gap:8px;align-items:flex-start;
  transform:translateX(120%);opacity:0;transition:.55s var(--ease);
}:is(#qabi,#qabi-portal) .toast.on{transform:none;opacity:1}:is(#qabi,#qabi-portal) .toast .ti{width:20px;height:20px;border-radius:6px;background:var(--or-50);display:grid;place-items:center;flex:none;color:var(--or-700)}:is(#qabi,#qabi-portal) .toast .ti svg{width:11px;height:11px}:is(#qabi,#qabi-portal) .toast b{display:block;font-size:10px;color:var(--gun);font-weight:600;line-height:1.25}:is(#qabi,#qabi-portal) .toast span{display:block;font-size:9px;color:var(--ink-48);line-height:1.35;margin-top:1px}:is(#qabi,#qabi-portal) .toast--mt{border-left-color:var(--mt-500)}:is(#qabi,#qabi-portal) .toast--mt .ti{background:var(--mt-50);color:var(--mt-700)}:is(#qabi,#qabi-portal) .toast--bs{border-left-color:var(--bs-500)}:is(#qabi,#qabi-portal) .toast--bs .ti{background:var(--bs-50);color:var(--bs-700)}:is(#qabi,#qabi-portal) .toast--in{border-left-color:var(--in-500)}:is(#qabi,#qabi-portal) .toast--in .ti{background:var(--in-50);color:var(--in-700)}/* generic panel used by trips / tracking / access / maintenance chapters */:is(#qabi,#qabi-portal) .panel{position:absolute;inset:0;background:#fff;display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transform:translateY(10px);transition:.5s var(--ease);z-index:3}:is(#qabi,#qabi-portal) .panel.on{opacity:1;visibility:visible;transform:none}:is(#qabi,#qabi-portal) .panel__hd{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--line-soft);flex:none}:is(#qabi,#qabi-portal) .panel__hd .ttl{font-family:"Nexa";font-weight:900;font-size:13px;color:var(--gun)}:is(#qabi,#qabi-portal) .segs{display:flex;gap:5px;margin-left:auto}:is(#qabi,#qabi-portal) .seg{height:22px;padding:0 10px;border-radius:var(--r-pill);background:var(--paper-3);font-size:9.5px;font-weight:500;color:var(--ink-64);display:grid;place-items:center}:is(#qabi,#qabi-portal) .seg.on{background:var(--in-50);color:var(--in-700)}:is(#qabi,#qabi-portal) .panel__bd{flex:1;min-height:0;overflow:hidden;padding:10px 12px;display:flex;flex-direction:column;gap:8px}:is(#qabi,#qabi-portal) .panel__cols{flex:1;min-height:0;display:grid;grid-template-columns:1fr 210px;gap:12px;padding:10px 12px}:is(#qabi,#qabi-portal) .panel__cols>div{min-height:0;display:flex;flex-direction:column;gap:7px}:is(#qabi,#qabi-portal) .panel__aside{background:var(--paper-2);border:1px solid var(--line-soft);border-radius:12px;padding:11px}@media(max-width:700px){:is(#qabi,#qabi-portal) .panel__cols{grid-template-columns:1fr}:is(#qabi,#qabi-portal) .panel__cols .panel__aside{display:none}}/* guest view card */:is(#qabi,#qabi-portal) .guest{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}:is(#qabi,#qabi-portal) .guest__hd{background:var(--in-500);color:#fff;padding:9px 11px}:is(#qabi,#qabi-portal) .guest__hd b{display:block;font-family:"Nexa";font-weight:900;font-size:11px;line-height:1.2}:is(#qabi,#qabi-portal) .guest__hd span{display:block;font-size:8.5px;opacity:.82}:is(#qabi,#qabi-portal) .guest__bd{padding:10px 11px;display:flex;flex-direction:column;gap:8px}:is(#qabi,#qabi-portal) .guest__acts{display:flex;gap:6px}:is(#qabi,#qabi-portal) .guest__acts span{flex:1;height:36px;border-radius:10px;border:1px solid;display:grid;place-items:center}:is(#qabi,#qabi-portal) .guest__acts span svg{width:17px;height:17px}:is(#qabi,#qabi-portal) .trips-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:start}@media(max-width:700px){:is(#qabi,#qabi-portal) .trips-grid{grid-template-columns:1fr}}/* trips */:is(#qabi,#qabi-portal) .trip{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:#fff;
  opacity:0;transform:translateY(12px);transition:.55s var(--ease)}:is(#qabi,#qabi-portal) .trip.on{opacity:1;transform:none}:is(#qabi,#qabi-portal) .trip__bar{height:6px;background:var(--mt-50)}:is(#qabi,#qabi-portal) .trip__bar i{display:block;height:100%;background:var(--mt-500);width:0;transition:width 1.3s var(--ease-io)}:is(#qabi,#qabi-portal) .trip__bd{padding:9px 11px}:is(#qabi,#qabi-portal) .trip__met{display:flex;justify-content:space-between;font-size:9px;color:var(--ink-48);margin-bottom:6px}:is(#qabi,#qabi-portal) .trip__win{display:flex;align-items:center;gap:8px;background:var(--mt-50);border-radius:8px;padding:5px 9px;font-size:10px;color:var(--mt-800);font-weight:500}:is(#qabi,#qabi-portal) .trip__win svg{width:12px;height:12px;flex:none}:is(#qabi,#qabi-portal) .trip__name{font-family:"Nexa";font-weight:900;font-size:12.5px;color:var(--gun);margin-top:7px;display:flex;align-items:center;gap:6px}:is(#qabi,#qabi-portal) .trip__loc{font-size:9.5px;color:var(--ink-64);margin-top:2px}:is(#qabi,#qabi-portal) .trip__foot{display:flex;align-items:center;gap:8px;margin-top:8px}:is(#qabi,#qabi-portal) .trip__price{font-family:"Nexa";font-weight:900;color:var(--mt-700);font-size:13px}:is(#qabi,#qabi-portal) .vendor{display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:5px;font-size:8.5px;font-weight:600;border:1px solid}:is(#qabi,#qabi-portal) .vendor--turo{border-color:#593BFB;background:#593BFB;color:#fff}:is(#qabi,#qabi-portal) .vendor--wheelbase{border-color:#0A00FF;background:#fff;color:#0A00FF}:is(#qabi,#qabi-portal) .vendor--flexways{border-color:#000;background:#FF9900;color:#000}:is(#qabi,#qabi-portal) .vendor--private{border-color:#A8B0BD;background:#F3F4F6;color:#4B5563}:is(#qabi,#qabi-portal) .trip__acts{display:flex;gap:4px;margin-top:8px}:is(#qabi,#qabi-portal) .trip__acts span{flex:1;height:24px;border-radius:7px;background:var(--lav);color:var(--in-700);font-size:9px;
  display:flex;align-items:center;justify-content:center;gap:4px;font-weight:500}:is(#qabi,#qabi-portal) .trip__acts svg{width:10px;height:10px}/* tracking timeline */:is(#qabi,#qabi-portal) .statsrow{display:flex;gap:6px}:is(#qabi,#qabi-portal) .stat{flex:1;background:var(--lav);border-radius:10px;padding:7px 6px;text-align:center}:is(#qabi,#qabi-portal) .stat b{display:block;font-family:"Nexa";font-weight:900;font-size:14px;color:var(--gun);line-height:1.15}:is(#qabi,#qabi-portal) .stat span{display:block;font-size:8.5px;color:var(--ink-48);margin-top:1px}:is(#qabi,#qabi-portal) .tl{display:flex;flex-direction:column;gap:6px;margin-top:2px}:is(#qabi,#qabi-portal) .tlrow{display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--line-soft);padding-bottom:6px;
  opacity:0;transform:translateX(-10px);transition:.5s var(--ease)}:is(#qabi,#qabi-portal) .tlrow.on{opacity:1;transform:none}:is(#qabi,#qabi-portal) .tlrow__t{font-size:10px;color:var(--gun);font-weight:500;white-space:nowrap}:is(#qabi,#qabi-portal) .tlrow__ev{display:flex;gap:3px;margin-top:3px;flex-wrap:wrap}:is(#qabi,#qabi-portal) .evchip{display:inline-flex;align-items:center;gap:3px;height:17px;padding:0 6px;border-radius:var(--r-pill);
  border:1px solid;font-size:8.5px;font-weight:500}:is(#qabi,#qabi-portal) .evchip svg{width:9px;height:9px}:is(#qabi,#qabi-portal) .tlrow__d{margin-left:auto;font-size:10px;color:var(--ink-64);white-space:nowrap}:is(#qabi,#qabi-portal) .tlrow__go{width:20px;height:20px;border-radius:50%;background:var(--in-500);display:grid;place-items:center;color:#fff;flex:none}:is(#qabi,#qabi-portal) .tlrow__go svg{width:10px;height:10px}:is(#qabi,#qabi-portal) .mergebtn{height:30px;border-radius:var(--r-pill);background:var(--in-500);color:#fff;display:flex;align-items:center;
  justify-content:center;gap:7px;font-size:10.5px;font-weight:500;box-shadow:var(--shadow-in)}:is(#qabi,#qabi-portal) .mergebtn svg{width:12px;height:12px}/* access / co-host rows */:is(#qabi,#qabi-portal) .arow{display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid var(--line-soft);
  opacity:0;transform:translateY(8px);transition:.5s var(--ease)}:is(#qabi,#qabi-portal) .arow.on{opacity:1;transform:none}:is(#qabi,#qabi-portal) .arow__m{flex:1;min-width:0}:is(#qabi,#qabi-portal) .arow__n{display:block;font-family:"Nexa";font-weight:900;font-size:11.5px;color:var(--gun);line-height:1.25}:is(#qabi,#qabi-portal) .arow__t{display:block;font-size:9px;color:var(--ink-64);margin-top:1px}:is(#qabi,#qabi-portal) .pillbtn{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none}:is(#qabi,#qabi-portal) .pillbtn svg{width:11px;height:11px}:is(#qabi,#qabi-portal) .pb--in{background:var(--in-500)}:is(#qabi,#qabi-portal) .pb--bs{background:var(--bs-500)}:is(#qabi,#qabi-portal) .pb--mt{background:var(--mt-500)}:is(#qabi,#qabi-portal) .countdown{display:inline-flex;align-items:center;gap:5px;background:var(--mt-50);color:var(--mt-800);
  border:1px solid var(--mt-300);border-radius:var(--r-pill);height:20px;padding:0 8px;font-size:9px;font-weight:600}/* maintenance */:is(#qabi,#qabi-portal) .mnt{display:flex;gap:6px}:is(#qabi,#qabi-portal) .mntcard{flex:1;border:1px solid var(--line);border-radius:11px;padding:12px 9px;text-align:center;
  opacity:0;transform:translateY(10px);transition:.5s var(--ease)}:is(#qabi,#qabi-portal) .mntcard.on{opacity:1;transform:none}:is(#qabi,#qabi-portal) .mntcard .ic{width:26px;height:26px;border-radius:8px;margin:0 auto 6px;display:grid;place-items:center}:is(#qabi,#qabi-portal) .mntcard b{display:block;font-size:9.5px;color:var(--gun);font-weight:600;line-height:1.25}:is(#qabi,#qabi-portal) .mntcard span{display:block;font-size:8px;color:var(--ink-48);margin-top:2px;line-height:1.3}:is(#qabi,#qabi-portal) .hist{display:flex;flex-direction:column;gap:6px;margin-top:4px}:is(#qabi,#qabi-portal) .histrow{display:flex;align-items:center;gap:9px;background:var(--paper-2);border-radius:9px;padding:9px 10px;
  opacity:0;transform:translateX(-8px);transition:.5s var(--ease)}:is(#qabi,#qabi-portal) .histrow.on{opacity:1;transform:none}:is(#qabi,#qabi-portal) .histrow .ic{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex:none}:is(#qabi,#qabi-portal) .histrow b{font-size:10px;color:var(--gun);font-weight:600;display:block;line-height:1.2}:is(#qabi,#qabi-portal) .histrow span{font-size:8.5px;color:var(--ink-48);display:block}:is(#qabi,#qabi-portal) .histrow .amt{margin-left:auto;font-family:"Nexa";font-weight:900;font-size:11px;color:var(--gun)}/* CSV export flash */:is(#qabi,#qabi-portal) .exportflash{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.92);
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px;box-shadow:var(--shadow-3);
  display:flex;align-items:center;gap:12px;opacity:0;transition:.5s var(--ease);z-index:6;pointer-events:none;
}:is(#qabi,#qabi-portal) .exportflash.on{opacity:1;transform:translate(-50%,-50%) scale(1)}:is(#qabi,#qabi-portal) .exportflash b{font-size:12px;color:var(--gun);display:block}:is(#qabi,#qabi-portal) .exportflash span{font-size:9.5px;color:var(--ink-48)}/* ---------- USP cards ----------------------------------------------------- */:is(#qabi,#qabi-portal) .usp{position:relative;border-radius:var(--r-2xl);padding:34px;background:#fff;border:1px solid var(--line);
  overflow:hidden;transition:.45s var(--ease);display:flex;flex-direction:column}:is(#qabi,#qabi-portal) .usp::before{content:"";position:absolute;inset:0;background:linear-gradient(140deg,var(--in-50),transparent 55%);opacity:0;transition:.45s var(--ease)}:is(#qabi,#qabi-portal) .usp:hover{transform:translateY(-5px);box-shadow:var(--shadow-2);border-color:var(--in-100)}:is(#qabi,#qabi-portal) .usp:hover::before{opacity:1}:is(#qabi,#qabi-portal) .usp>*{position:relative;z-index:1}:is(#qabi,#qabi-portal) .usp__badge{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:var(--r-pill);
  background:var(--in-500);color:#fff;font-size:10.56px;font-weight:600;letter-spacing:.09em;text-transform:uppercase}:is(#qabi,#qabi-portal) .usp h3{margin:18px 0 12px}:is(#qabi,#qabi-portal) .usp .vis{margin-top:auto;padding-top:22px}:is(#qabi,#qabi-portal) .usp .vis>div{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:var(--paper-2)}/* ---------- Lifestyle ----------------------------------------------------- */:is(#qabi,#qabi-portal) .life{position:relative}:is(#qabi,#qabi-portal) .life__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}:is(#qabi,#qabi-portal) .lifecard{position:relative;border-radius:var(--r-xl);overflow:hidden;background:#111;isolation:isolate}:is(#qabi,#qabi-portal) .lifecard img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}:is(#qabi,#qabi-portal) .lifecard:hover img{transform:scale(1.045)}:is(#qabi,#qabi-portal) .lifecard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,20,0) 14%,rgba(10,12,20,.30) 40%,rgba(10,12,20,.72) 68%,rgba(10,12,20,.95) 100%)}:is(#qabi,#qabi-portal) .lifecard__cap{position:absolute;inset:auto 0 0 0;padding:24px;z-index:2;color:#fff}:is(#qabi,#qabi-portal) .lifecard__cap .k{font-size:10.24px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.72);font-weight:600}:is(#qabi,#qabi-portal) .lifecard__cap h3{color:#fff;margin:9px 0 7px;font-size:clamp(18.4px,1.7vw,25.6px)}:is(#qabi,#qabi-portal) .lifecard__cap p{color:rgba(255,255,255,.82);font-size:14.08px;font-weight:300;line-height:1.55;max-width:44ch}:is(#qabi,#qabi-portal) .lc-a{grid-column:span 7;aspect-ratio:16/11}:is(#qabi,#qabi-portal) .lc-b{grid-column:span 5;aspect-ratio:16/11}:is(#qabi,#qabi-portal) .lc-c{grid-column:span 4;aspect-ratio:4/3.4}:is(#qabi,#qabi-portal) .lc-d{grid-column:span 4;aspect-ratio:4/3.4}:is(#qabi,#qabi-portal) .lc-e{grid-column:span 4;aspect-ratio:4/3.4}@media(max-width:900px){:is(#qabi,#qabi-portal) .lc-a,:is(#qabi,#qabi-portal) .lc-b,:is(#qabi,#qabi-portal) .lc-c,:is(#qabi,#qabi-portal) .lc-d,:is(#qabi,#qabi-portal) .lc-e{grid-column:span 12;aspect-ratio:16/11}}/* marquee of lifestyle stills */:is(#qabi,#qabi-portal) .marquee{overflow:hidden;position:relative;padding:8px 0;
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}:is(#qabi,#qabi-portal) .marquee__t{display:flex;gap:16px;width:max-content;animation:qabi-slide 70s linear infinite}:is(#qabi,#qabi-portal) .marquee:hover .marquee__t{animation-play-state:paused}@keyframes qabi-slide{to{transform:translateX(-50%)}}:is(#qabi,#qabi-portal) .marquee img{height:clamp(180px,20vw,260px);width:auto;border-radius:var(--r-lg);border:1px solid var(--line)}/* ---------- Scale / fleet size ------------------------------------------- */:is(#qabi,#qabi-portal) .scale{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;background:#fff}:is(#qabi,#qabi-portal) .scale__col{padding:30px 26px;border-right:1px solid var(--line);position:relative;transition:.4s var(--ease)}:is(#qabi,#qabi-portal) .scale__col:last-child{border-right:0}:is(#qabi,#qabi-portal) .scale__col:hover{background:var(--lav)}:is(#qabi,#qabi-portal) .scale__n{font-family:"Nexa";font-weight:900;font-size:35.2px;color:var(--in-500);line-height:1}:is(#qabi,#qabi-portal) .scale__n small{font-size:14.4px;color:var(--ink-48);font-weight:400;font-family:"Poppins"}:is(#qabi,#qabi-portal) .scale__t{font-family:"Nexa";font-weight:900;font-size:16px;color:var(--gun);margin:12px 0 8px}:is(#qabi,#qabi-portal) .scale__col ul{list-style:none;padding:0;margin:14px 0 0}:is(#qabi,#qabi-portal) .scale__col li{font-size:12.8px;color:var(--ink-64);padding:4px 0 4px 18px;position:relative}:is(#qabi,#qabi-portal) .scale__col li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:6px;border-radius:50%;background:var(--mt-400)}@media(max-width:980px){:is(#qabi,#qabi-portal) .scale{grid-template-columns:repeat(2,1fr)}:is(#qabi,#qabi-portal) .scale__col:nth-child(2){border-right:0}:is(#qabi,#qabi-portal) .scale__col:nth-child(1),:is(#qabi,#qabi-portal) .scale__col:nth-child(2){border-bottom:1px solid var(--line)}}@media(max-width:600px){:is(#qabi,#qabi-portal) .scale{grid-template-columns:1fr}:is(#qabi,#qabi-portal) .scale__col{border-right:0;border-bottom:1px solid var(--line)}}/* ---------- Device (Track) ----------------------------------------------- */:is(#qabi,#qabi-portal) .dev-stage{position:relative;height:300vh}:is(#qabi,#qabi-portal) .dev-stage__sticky{position:sticky;top:0;height:100vh;display:grid;place-items:center;overflow:hidden}:is(#qabi,#qabi-portal) .dev-orbit{position:relative;width:min(760px,86vw);aspect-ratio:1/.78;display:grid;place-items:center}:is(#qabi,#qabi-portal) .dev-orbit__glow{position:absolute;width:74%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(closest-side,rgba(89,51,229,.16),transparent 70%);filter:blur(4px)}:is(#qabi,#qabi-portal) .dev-orbit__ring{position:absolute;border:1px solid var(--line);border-radius:50%;width:88%;aspect-ratio:1;
  animation:qabi-spin 40s linear infinite}:is(#qabi,#qabi-portal) .dev-orbit__ring:nth-of-type(2){width:66%;animation-duration:28s;animation-direction:reverse;border-style:dashed;border-color:var(--in-100)}@keyframes qabi-spin{to{transform:rotate(360deg)}}:is(#qabi,#qabi-portal) .dev-frames{position:relative;width:78%;aspect-ratio:1/.8;display:grid;place-items:center}:is(#qabi,#qabi-portal) .dev-frames img{position:absolute;width:100%;height:100%;object-fit:contain;opacity:0;
  transition:opacity .3s linear;filter:drop-shadow(0 34px 44px rgba(16,24,38,.28))}:is(#qabi,#qabi-portal) .dev-frames img.on{opacity:1}:is(#qabi,#qabi-portal) .hotspot{position:absolute;z-index:4;opacity:0;transform:translate(-50%,-50%) scale(.9);transition:.5s var(--ease)}:is(#qabi,#qabi-portal) .hotspot.on{opacity:1;transform:translate(-50%,-50%) scale(1)}:is(#qabi,#qabi-portal) .hotspot__dot{width:13px;height:13px;border-radius:50%;background:var(--in-500);box-shadow:0 0 0 5px rgba(89,51,229,.18);position:relative}:is(#qabi,#qabi-portal) .hotspot__dot::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1.5px solid var(--in-400);animation:qabi-pulsering 2.2s infinite}:is(#qabi,#qabi-portal) .hotspot__card{position:absolute;left:24px;top:-14px;background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:10px 13px;box-shadow:var(--shadow-2);width:230px}:is(#qabi,#qabi-portal) .hotspot__card b{display:block;font-size:12.8px;color:var(--gun);font-weight:600}:is(#qabi,#qabi-portal) .hotspot__card span{display:block;font-size:11.52px;color:var(--ink-48);line-height:1.45;margin-top:3px}:is(#qabi,#qabi-portal) .hotspot--l .hotspot__card{left:auto;right:24px}@media(max-width:720px){:is(#qabi,#qabi-portal) .dev-stage{height:240vh}:is(#qabi,#qabi-portal) .hotspot__card{width:170px;padding:8px 10px}:is(#qabi,#qabi-portal) .hotspot__card b{font-size:11.52px}:is(#qabi,#qabi-portal) .hotspot__card span{font-size:10.24px}}/* device compare */:is(#qabi,#qabi-portal) .cmp{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media(max-width:860px){:is(#qabi,#qabi-portal) .cmp{grid-template-columns:1fr}}:is(#qabi,#qabi-portal) .cmp__card{border:1px solid var(--line);border-radius:var(--r-2xl);overflow:hidden;background:#fff;display:flex;flex-direction:column}:is(#qabi,#qabi-portal) .cmp__top{padding:28px;border-bottom:1px solid var(--line-soft);background:linear-gradient(180deg,var(--paper-3),#fff)}:is(#qabi,#qabi-portal) .cmp__top.is-track{background:linear-gradient(180deg,var(--in-50),#fff)}:is(#qabi,#qabi-portal) .cmp__pic{height:210px;display:grid;place-items:center;padding:16px}:is(#qabi,#qabi-portal) .cmp__pic img{height:100%;width:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 18px 26px rgba(16,24,38,.2))}:is(#qabi,#qabi-portal) .cmp__pic--pending{border:1.5px dashed var(--line);border-radius:var(--r-lg);margin:14px;height:182px;background:var(--paper-3)}:is(#qabi,#qabi-portal) .cmp__list{padding:22px 28px 28px;flex:1}:is(#qabi,#qabi-portal) .cmp__list dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 14px;align-items:start}:is(#qabi,#qabi-portal) .cmp__list dt{font-size:12.48px;color:var(--ink-48);white-space:nowrap}:is(#qabi,#qabi-portal) .cmp__list dd{margin:0;font-size:13.6px;color:var(--ink-80);font-weight:500}:is(#qabi,#qabi-portal) .yn{display:inline-flex;align-items:center;gap:6px;font-size:12.8px}:is(#qabi,#qabi-portal) .yn svg{flex:none}/* ---------- Founder ------------------------------------------------------- */:is(#qabi,#qabi-portal) .founder{background:var(--gun);color:#fff;border-radius:var(--r-2xl);overflow:hidden;position:relative}:is(#qabi,#qabi-portal) .founder::before{content:"";position:absolute;right:-140px;top:-140px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(89,51,229,.5),transparent 70%)}:is(#qabi,#qabi-portal) .founder__in{position:relative;z-index:1;padding:clamp(34px,4.5vw,64px)}:is(#qabi,#qabi-portal) .founder h2{color:#fff}:is(#qabi,#qabi-portal) .founder .lede{color:rgba(255,255,255,.7)}:is(#qabi,#qabi-portal) .shorts{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;margin-top:32px}:is(#qabi,#qabi-portal) .short{position:relative;aspect-ratio:9/16;border-radius:var(--r-lg);overflow:hidden;background:#000;
  border:1px solid rgba(255,255,255,.14);transition:.4s var(--ease)}:is(#qabi,#qabi-portal) .short:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.35)}:is(#qabi,#qabi-portal) .short iframe{position:absolute;inset:0;width:100%;height:100%;border:0}:is(#qabi,#qabi-portal) .short__ph{position:absolute;inset:0;display:grid;place-items:center;cursor:pointer;background:#0c0f16}:is(#qabi,#qabi-portal) .short__ph img{width:100%;height:100%;object-fit:cover;opacity:.72;transition:.5s var(--ease)}:is(#qabi,#qabi-portal) .short:hover .short__ph img{opacity:.9;transform:scale(1.05)}:is(#qabi,#qabi-portal) .short__play{position:absolute;width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.95);
  display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.4)}:is(#qabi,#qabi-portal) .short__play svg{margin-left:3px;color:var(--gun)}:is(#qabi,#qabi-portal) .credrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}:is(#qabi,#qabi-portal) .cred{border:1px solid rgba(255,255,255,.16);border-radius:var(--r-lg);padding:14px 18px;background:rgba(255,255,255,.04);min-width:150px}:is(#qabi,#qabi-portal) .cred b{display:block;font-family:"Nexa";font-weight:900;font-size:24px;color:#fff;line-height:1}:is(#qabi,#qabi-portal) .cred span{display:block;font-size:12px;color:rgba(255,255,255,.6);margin-top:5px}/* ---------- FAQ / AIE ----------------------------------------------------- */:is(#qabi,#qabi-portal) .faq{border-top:1px solid var(--line)}:is(#qabi,#qabi-portal) .faq__item{border-bottom:1px solid var(--line)}:is(#qabi,#qabi-portal) .faq__q{width:100%;text-align:left;display:flex;align-items:flex-start;gap:16px;padding:22px 0;
  font-family:"Nexa";font-weight:900;font-size:clamp(16px,1.3vw,18.56px);color:var(--gun);line-height:1.35}:is(#qabi,#qabi-portal) .faq__q .pm{margin-left:auto;flex:none;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;transition:.3s var(--ease);color:var(--in-600)}:is(#qabi,#qabi-portal) .faq__item.open .faq__q .pm{background:var(--in-500);border-color:var(--in-500);color:#fff;transform:rotate(45deg)}:is(#qabi,#qabi-portal) .faq__a{max-height:0;overflow:hidden;transition:max-height .45s var(--ease)}:is(#qabi,#qabi-portal) .faq__a-in{padding:0 0 24px;max-width:80ch}:is(#qabi,#qabi-portal) .faq__a p{color:var(--ink-64);font-weight:300;font-size:15.2px;line-height:1.7}:is(#qabi,#qabi-portal) .faq__a p+p{margin-top:12px}:is(#qabi,#qabi-portal) .answer-lead{background:var(--lav);border-left:3px solid var(--in-500);border-radius:0 12px 12px 0;
  padding:14px 18px;font-size:14.72px;color:var(--ink-80);font-weight:400;line-height:1.65}/* ---------- Compare table ------------------------------------------------- */:is(#qabi,#qabi-portal) .tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:14.08px;border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden}:is(#qabi,#qabi-portal) .tbl th,:is(#qabi,#qabi-portal) .tbl td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:top}:is(#qabi,#qabi-portal) .tbl thead th{background:var(--paper-3);font-family:"Nexa";font-weight:900;font-size:13.12px;color:var(--gun);white-space:nowrap}:is(#qabi,#qabi-portal) .tbl thead th.is-q{background:var(--in-500);color:#fff}:is(#qabi,#qabi-portal) .tbl tbody tr:last-child td{border-bottom:0}:is(#qabi,#qabi-portal) .tbl td:first-child{font-weight:500;color:var(--ink-80);width:32%}:is(#qabi,#qabi-portal) .tbl td.q{background:var(--lav)}:is(#qabi,#qabi-portal) .tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}/* ---------- CTA ----------------------------------------------------------- */:is(#qabi,#qabi-portal) .cta{position:relative;border-radius:var(--r-2xl);background:linear-gradient(135deg,var(--in-600),var(--in-800) 60%,#1b1150);
  color:#fff;overflow:hidden;text-align:center;padding:clamp(48px,6vw,86px) clamp(24px,5vw,70px)}:is(#qabi,#qabi-portal) .cta::before{content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle at 18% 22%,rgba(13,188,147,.30),transparent 42%),
                   radial-gradient(circle at 84% 78%,rgba(255,150,0,.22),transparent 45%)}:is(#qabi,#qabi-portal) .cta>*{position:relative;z-index:1}:is(#qabi,#qabi-portal) .cta h2{color:#fff}:is(#qabi,#qabi-portal) .cta p{color:rgba(255,255,255,.76);max-width:600px;margin:18px auto 0;font-weight:300}:is(#qabi,#qabi-portal) .cta .btn-row{justify-content:center;margin-top:32px}:is(#qabi,#qabi-portal) .cta .btn--primary{background:#fff;color:var(--in-700);box-shadow:0 12px 30px rgba(0,0,0,.24)}:is(#qabi,#qabi-portal) .cta .btn--primary:hover{background:#fff;color:var(--in-800)}:is(#qabi,#qabi-portal) .cta .btn--ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff;box-shadow:none}:is(#qabi,#qabi-portal) .cta .btn--ghost:hover{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.4)}/* ---------- Footer -------------------------------------------------------- */:is(#qabi,#qabi-portal) .ftr{background:var(--paper-2);border-top:1px solid var(--line);padding:clamp(48px,5vw,76px) 0 34px;margin-top:clamp(56px,7vw,110px)}:is(#qabi,#qabi-portal) .ftr__grid{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:34px}@media(max-width:980px){:is(#qabi,#qabi-portal) .ftr__grid{grid-template-columns:1fr 1fr;gap:28px}}@media(max-width:560px){:is(#qabi,#qabi-portal) .ftr__grid{grid-template-columns:1fr}}:is(#qabi,#qabi-portal) .ftr h5{font-family:"Nexa";font-weight:900;font-size:12.48px;letter-spacing:.1em;text-transform:uppercase;color:var(--gun);margin:0 0 14px}:is(#qabi,#qabi-portal) .ftr ul{list-style:none;padding:0;margin:0}:is(#qabi,#qabi-portal) .ftr li{padding:5px 0}:is(#qabi,#qabi-portal) .ftr li a{font-size:13.6px;color:var(--ink-64);transition:color .2s}:is(#qabi,#qabi-portal) .ftr li a:hover{color:var(--in-600)}:is(#qabi,#qabi-portal) .ftr__bot{margin-top:44px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px;
  align-items:center;justify-content:space-between;font-size:12.48px;color:var(--ink-48)}/* ---------- Utility ------------------------------------------------------- */:is(#qabi,#qabi-portal) .hide{display:none!important}:is(#qabi,#qabi-portal) .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:is(#qabi,#qabi-portal) .note{font-size:11.52px;color:var(--ink-48);line-height:1.55}:is(#qabi,#qabi-portal) .hr{height:1px;background:var(--line);border:0;margin:0}:is(#qabi,#qabi-portal) .badge-soft{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:var(--r-pill);
  background:var(--mt-50);color:var(--mt-800);font-size:11.2px;font-weight:600;border:1px solid var(--mt-200)}:is(#qabi,#qabi-portal) .badge-soft--or{background:var(--or-50);color:var(--or-800);border-color:var(--or-200)}:is(#qabi,#qabi-portal) .badge-soft--in{background:var(--in-50);color:var(--in-700);border-color:var(--in-100)}:is(#qabi,#qabi-portal) .scroll-cue{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:40px;color:var(--ink-28);font-size:11.2px;
  letter-spacing:.18em;text-transform:uppercase}:is(#qabi,#qabi-portal) .scroll-cue i{width:1px;height:42px;background:linear-gradient(var(--in-400),transparent);display:block;
  animation:qabi-cue 2.1s var(--ease) infinite}@keyframes qabi-cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}
  55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}/* ---------- late polish --------------------------------------------------- */:is(#qabi,#qabi-portal) .short__ph{background:linear-gradient(140deg,#1a2233,#2b2150)}:is(#qabi,#qabi-portal) .short__cap{position:absolute;left:12px;right:12px;bottom:12px;font-size:11.52px;color:rgba(255,255,255,.82);
  line-height:1.35;text-align:left;z-index:2;text-shadow:0 1px 6px rgba(0,0,0,.6)}:is(#qabi,#qabi-portal) .lifecard__cap{background:linear-gradient(180deg,rgba(10,12,20,0),rgba(10,12,20,.35))}:is(#qabi,#qabi-portal) .faq__item:first-child .faq__a{will-change:max-height}/* ==========================================================================
   MOBILE — the Fleet OS renders as the mobile application, not a squeezed
   desktop. Map on top, command cards below, hamburger in the header: the same
   arrangement the Qarhami progressive web app uses on a phone.
   ========================================================================== */:is(#qabi,#qabi-portal) .appview{aspect-ratio:16/9.4;position:relative}:is(#qabi,#qabi-portal) .app__burger{display:none;width:26px;height:26px;border-radius:8px;background:var(--in-500);
  color:#fff;place-items:center;flex:none}@media(max-width:820px){/* ---- the app shell ---------------------------------------------------- */:is(#qabi,#qabi-portal) .app{font-size:11.5px}:is(#qabi,#qabi-portal) .app__side{display:none}:is(#qabi,#qabi-portal) .app__burger{display:grid}:is(#qabi,#qabi-portal) .app__top{height:44px;padding:0 12px}:is(#qabi,#qabi-portal) .app__top .ttl{font-size:14px}:is(#qabi,#qabi-portal) .app__body{flex-direction:column}:is(#qabi,#qabi-portal) .app__right{order:1;flex:none;height:42%;min-height:150px;border-bottom:1px solid var(--line-soft)}:is(#qabi,#qabi-portal) .app__left{order:2;width:100%;flex:1;min-height:0;border-right:0}:is(#qabi,#qabi-portal) .searchbar{font-size:11.5px;padding:9px 11px}:is(#qabi,#qabi-portal) .filterchips{gap:5px}:is(#qabi,#qabi-portal) .chip{height:26px;font-size:10.5px}:is(#qabi,#qabi-portal) .vcard__name{font-size:13.5px}:is(#qabi,#qabi-portal) .vcard__plate{font-size:10px}:is(#qabi,#qabi-portal) .tg{height:21px;font-size:9.5px}:is(#qabi,#qabi-portal) .actbtn{height:46px}:is(#qabi,#qabi-portal) .vtab{height:28px;font-size:9.5px}:is(#qabi,#qabi-portal) .mk__pin{width:28px;height:30px}:is(#qabi,#qabi-portal) .mk__label{font-size:8.5px}:is(#qabi,#qabi-portal) .panel__hd{padding:8px 11px}:is(#qabi,#qabi-portal) .panel__cols{grid-template-columns:1fr!important;padding:9px 11px}:is(#qabi,#qabi-portal) .trips-grid{grid-template-columns:1fr}:is(#qabi,#qabi-portal) .maplegend{font-size:8.5px;padding:6px 8px}/* ---- the pinned chapter stage ---------------------------------------- */:is(#qabi,#qabi-portal) .os__sticky{justify-content:flex-start;padding-top:84px}:is(#qabi,#qabi-portal) .os__inner{grid-template-columns:1fr;gap:10px;padding:0 18px}:is(#qabi,#qabi-portal) .os__copy{order:1;position:relative;height:178px;padding-bottom:20px}:is(#qabi,#qabi-portal) .os__stagewrap{order:2}:is(#qabi,#qabi-portal) .os__chapter{position:absolute;inset:0 0 20px 0;justify-content:flex-start}:is(#qabi,#qabi-portal) .os__chapter .num{font-size:10.24px;margin-bottom:7px}:is(#qabi,#qabi-portal) .os__chapter .num i{width:22px}:is(#qabi,#qabi-portal) .os__chapter h3{font-size:19.2px;margin-bottom:7px;line-height:1.16}:is(#qabi,#qabi-portal) .os__chapter p{font-size:12.72px;line-height:1.45}:is(#qabi,#qabi-portal) .os__chapter ul{display:none}:is(#qabi,#qabi-portal) .os__dots{position:absolute;left:0;bottom:0;margin:0}:is(#qabi,#qabi-portal) .os__dots button{width:16px;height:5px}:is(#qabi,#qabi-portal) .os__dots button.on{width:30px}:is(#qabi,#qabi-portal) .appframe{aspect-ratio:auto;height:50vh;max-height:none;width:100%;border-radius:18px}:is(#qabi,#qabi-portal) .maplegend{display:none}:is(#qabi,#qabi-portal) .toasts{width:min(212px,64%);bottom:9px;right:9px}/* ---- hero -------------------------------------------------------------- */:is(#qabi,#qabi-portal) .appview{aspect-ratio:10/12.6}:is(#qabi,#qabi-portal) .hero-device{width:min(96vw,420px)}:is(#qabi,#qabi-portal) .hero-stage{height:190vh}:is(#qabi,#qabi-portal) .hero-cap h3{font-size:18.88px}:is(#qabi,#qabi-portal) .hero-cap p{font-size:13.76px}/* ---- marketing chrome -------------------------------------------------- */:is(#qabi,#qabi-portal) .hero{padding-top:calc(74px + 40px)}:is(#qabi,#qabi-portal) .trustline{gap:8px 16px}:is(#qabi,#qabi-portal) .trustline span{font-size:11.84px}:is(#qabi,#qabi-portal) .sec-head{margin-bottom:30px}/* the scatter becomes a tidy grid that still collapses into one layer */:is(#qabi,#qabi-portal) .frag__stage{position:relative;height:auto;min-height:330px;display:grid;
    grid-template-columns:1fr 1fr;gap:8px;align-content:start}:is(#qabi,#qabi-portal) .frag__tile{position:relative!important;left:auto!important;top:auto!important;
    white-space:normal;font-size:11.52px;padding:10px 11px;--mx:0;--my:0}:is(#qabi,#qabi-portal) .frag__tile:last-of-type{grid-column:1/-1}:is(#qabi,#qabi-portal) .frag__tile .ic{width:26px;height:26px}:is(#qabi,#qabi-portal) .frag__tile small{font-size:9.92px}:is(#qabi,#qabi-portal) .frag__core{width:min(420px,92%)}:is(#qabi,#qabi-portal) .cmp__list dl{grid-template-columns:1fr;gap:2px 0}:is(#qabi,#qabi-portal) .cmp__list dt{margin-top:8px}:is(#qabi,#qabi-portal) .shorts{grid-template-columns:repeat(2,1fr)}:is(#qabi,#qabi-portal) .tbl{font-size:12.8px}:is(#qabi,#qabi-portal) .tbl th,:is(#qabi,#qabi-portal) .tbl td{padding:12px 13px}:is(#qabi,#qabi-portal) .tbl td:first-child{width:auto;min-width:150px}/* on a phone the callouts read better as one caption under the device */:is(#qabi,#qabi-portal) .dev-stage__sticky{padding-top:74px}:is(#qabi,#qabi-portal) .dev-orbit{width:80vw;aspect-ratio:1/1}:is(#qabi,#qabi-portal) .dev-frames{width:88%}:is(#qabi,#qabi-portal) .hotspot{left:50%!important;top:100%!important;bottom:auto!important;margin-top:20px;
    width:min(340px,88vw);z-index:6;transform:translate(-50%,10px)}:is(#qabi,#qabi-portal) .hotspot.on{transform:translate(-50%,0)}:is(#qabi,#qabi-portal) .hotspot__dot{display:none}/* the card is a <span>; static positioning would make it inline again */:is(#qabi,#qabi-portal) .hotspot__card{display:block;position:relative;left:0!important;right:auto!important;top:0;
    width:100%;text-align:center;padding:14px 16px;background:var(--lav);
    border-color:var(--in-100);box-shadow:var(--shadow-1)}:is(#qabi,#qabi-portal) .hotspot__card b{font-size:13.44px}:is(#qabi,#qabi-portal) .hotspot__card span{font-size:12px;margin-top:4px}:is(#qabi,#qabi-portal) #devLabel{display:none}:is(#qabi,#qabi-portal) .ftr__bot{flex-direction:column;align-items:flex-start;gap:8px}}/* on a phone the lifestyle caption sits under the photograph rather than over it */@media(max-width:820px){:is(#qabi,#qabi-portal) .lifecard{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}:is(#qabi,#qabi-portal) .lc-a,:is(#qabi,#qabi-portal) .lc-b,:is(#qabi,#qabi-portal) .lc-c,:is(#qabi,#qabi-portal) .lc-d,:is(#qabi,#qabi-portal) .lc-e{aspect-ratio:auto}:is(#qabi,#qabi-portal) .lifecard::after{display:none}:is(#qabi,#qabi-portal) .lifecard img{aspect-ratio:4/3;height:auto;flex:none}:is(#qabi,#qabi-portal) .lifecard__cap{position:relative;inset:auto;padding:18px 18px 20px;background:#fff;color:inherit}:is(#qabi,#qabi-portal) .lifecard__cap .k{color:var(--in-600)}:is(#qabi,#qabi-portal) .lifecard__cap h3{color:var(--gun);margin:8px 0 6px}:is(#qabi,#qabi-portal) .lifecard__cap p{color:var(--ink-64);max-width:none}:is(#qabi,#qabi-portal) .tblwrap{position:relative}:is(#qabi,#qabi-portal) .tblwrap::after{content:"";position:absolute;right:0;top:0;bottom:0;width:38px;pointer-events:none;
    background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.95))}}@media(max-width:520px){:is(#qabi,#qabi-portal) .appframe{height:46vh}:is(#qabi,#qabi-portal) .os__copy{min-height:160px}:is(#qabi,#qabi-portal) .os__chapter h3{font-size:19.2px}:is(#qabi,#qabi-portal) .hero h1{font-size:34.4px}:is(#qabi,#qabi-portal) .lifecard__cap{padding:18px}:is(#qabi,#qabi-portal) .lifecard__cap h3{font-size:17.6px}:is(#qabi,#qabi-portal) .lifecard__cap p{font-size:12.8px}:is(#qabi,#qabi-portal) .scale__col{padding:24px 20px}:is(#qabi,#qabi-portal) .cta{padding:40px 22px}:is(#qabi,#qabi-portal) .shorts{grid-template-columns:repeat(2,1fr);gap:10px}}/* ---------- focus & motion ------------------------------------------------ */:is(#qabi,#qabi-portal) :focus-visible{outline:2.5px solid var(--in-500);outline-offset:3px;border-radius:6px}:is(#qabi,#qabi-portal) .btn:focus-visible,:is(#qabi,#qabi-portal) .faq__q:focus-visible{outline-offset:4px}:is(#qabi,#qabi-portal) .os__dots button:focus-visible{outline-offset:5px}@media (prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) *,:is(#qabi,#qabi-portal) *::before,:is(#qabi,#qabi-portal) *::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }:is(#qabi,#qabi-portal) .marquee__t{animation:none;transform:none}:is(#qabi,#qabi-portal) .dev-orbit__ring{animation:none}:is(#qabi,#qabi-portal) .hotspot,:is(#qabi,#qabi-portal) .evt,:is(#qabi,#qabi-portal) .mk__acts b,:is(#qabi,#qabi-portal) .geo{opacity:1}}/* honour dark-mode preference without inventing a second theme: the Qarhami
   product surface is a light SaaS surface, so we only soften the page frame */@media (prefers-color-scheme:dark){:is(#qabi,#qabi-portal){color-scheme:light}}

/* ===== assets/css/partner.css ===== */
/* ==========================================================================
   QARHAMI × ABI — partnership announcement layer
   Extends assets/css/site.css. Every token below either comes from site.css
   (which derives 1:1 from tailwind.config.js) or from the ABI brand marks
   supplied by ABI. Nothing is invented.
   ========================================================================== *//* ==========================================================================
   Progressive-enhancement gate.

   site.css hides every .rv element until IntersectionObserver reveals it.
   That is fine on the web, but a standalone file opened in a viewer that
   blocks scripts (iOS mail/Files attachment preview, some webmail readers)
   would then show a blank page. So: content is visible by default, and only
   a page that has confirmed JS is running is allowed to hide it for the
   reveal animation. The gate class is qabi-js (not the generic "js", which
   WordPress themes add for their own purposes); a failsafe in the page head
   removes it again if the page scripts never start.
   ========================================================================== */:is(#qabi,#qabi-portal) .rv{opacity:1;transform:none}html.qabi-js :is(#qabi,#qabi-portal) .rv{opacity:0;transform:translateY(22px)}html.qabi-js :is(#qabi,#qabi-portal) .rv.in{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){html.qabi-js :is(#qabi,#qabi-portal) .rv{opacity:1;transform:none}}:is(#qabi,#qabi-portal){
  --abi-navy:#022851;
  --abi-navy-2:#0a2952;
  --abi-red:#cc171e;
  --abi-grey:#a19d9d;
  --abi-tint:#eef3f9;
}/* ---------- Announcement bar --------------------------------------------- */:is(#qabi,#qabi-portal) .annbar{
  position:fixed;top:0;left:0;right:0;z-index:95;background:var(--gun);color:#fff;
  font-size:12.48px;letter-spacing:.01em;
}:is(#qabi,#qabi-portal){padding-top:var(--annh,38px)}:is(#qabi,#qabi-portal) .annbar .ann-short{display:none}@media(max-width:640px){:is(#qabi,#qabi-portal) .annbar .ann-long{display:none}:is(#qabi,#qabi-portal) .annbar .ann-short{display:inline}:is(#qabi,#qabi-portal) .annbar .dotsep{display:none}}:is(#qabi,#qabi-portal) .annbar__in{display:flex;align-items:center;justify-content:center;gap:12px;
  min-height:38px;padding:8px 0;text-align:center;flex-wrap:wrap}:is(#qabi,#qabi-portal) .annbar b{font-weight:600;color:#fff}:is(#qabi,#qabi-portal) .annbar .dotsep{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.34);flex:none}:is(#qabi,#qabi-portal) .annbar a{color:#fff;display:inline-flex;align-items:center;gap:6px;border-bottom:1px solid rgba(255,255,255,.34)}:is(#qabi,#qabi-portal) .annbar a:hover{border-bottom-color:#fff}:is(#qabi,#qabi-portal) .hdr--offset{top:var(--annh,38px)}@media(max-width:620px){:is(#qabi,#qabi-portal) .annbar__in{font-size:11.52px}}/* ---------- Partner lockup ------------------------------------------------ */:is(#qabi,#qabi-portal) .lockup{display:inline-flex;align-items:center;gap:clamp(14px,2vw,26px);flex-wrap:wrap}:is(#qabi,#qabi-portal) .lockup img.q{height:clamp(30px,3vw,40px);width:auto}:is(#qabi,#qabi-portal) .lockup img.a{height:clamp(32px,3.3vw,44px);width:auto}:is(#qabi,#qabi-portal) .lockup .x{
  width:clamp(28px,2.8vw,34px);height:clamp(28px,2.8vw,34px);border-radius:50%;flex:none;
  display:grid;place-items:center;background:var(--lav);border:1px solid var(--in-100);
  color:var(--in-500);font-family:"Poppins",sans-serif;font-weight:500;
  font-size:clamp(15.2px,1.2vw,18.4px);line-height:1;padding-bottom:2px;
}:is(#qabi,#qabi-portal) .lockup--onDark .x{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:#fff}/* ---------- Hero — copy left, live composition filling the cover ---------- */:is(#qabi,#qabi-portal) .phero{
  position:relative;overflow:hidden;
  padding:calc(74px + clamp(30px,4.5vw,64px)) 0 clamp(40px,5vw,72px);
  background:
    radial-gradient(1100px 620px at 86% -6%, rgba(89,51,229,.12), transparent 62%),
    radial-gradient(900px 540px at 4% 30%, rgba(13,188,147,.09), transparent 60%),
    linear-gradient(180deg,#fff 0%,#fbfaff 56%,#fff 100%);
}:is(#qabi,#qabi-portal) .phero__grid{
  position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(89,51,229,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(89,51,229,.055) 1px,transparent 1px);
  background-size:68px 68px;
  mask-image:radial-gradient(circle at 68% 30%,#000,transparent 74%);
  -webkit-mask-image:radial-gradient(circle at 68% 30%,#000,transparent 74%);
}:is(#qabi,#qabi-portal) .phero__wrap{
  position:relative;z-index:1;display:grid;align-items:center;
  grid-template-columns:minmax(0,600px) minmax(0,1fr);
  gap:clamp(28px,4.5vw,84px);
}:is(#qabi,#qabi-portal) .phero__in{position:relative;z-index:2;min-width:0}:is(#qabi,#qabi-portal) .phero h1{margin:22px 0 0;font-size:clamp(33.6px,4.5vw,59.2px)}:is(#qabi,#qabi-portal) .phero h1 .hl{color:var(--in-500);position:relative;white-space:nowrap}@media(max-width:480px){:is(#qabi,#qabi-portal) .phero h1 .hl{white-space:normal}}:is(#qabi,#qabi-portal) .phero h1 .hl::after{
  content:"";position:absolute;left:-.02em;right:-.02em;bottom:.04em;height:.11em;border-radius:4px;
  background:linear-gradient(90deg,rgba(89,51,229,.26),rgba(13,188,147,.30));z-index:-1;
}:is(#qabi,#qabi-portal) .phero .lede{margin-top:20px;max-width:56ch;font-size:clamp(16px,1.2vw,18.56px)}:is(#qabi,#qabi-portal) .phero .btn-row{margin-top:30px}:is(#qabi,#qabi-portal) .phero__trust{
  display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:28px;
  font-size:13.12px;color:var(--ink-64);
}:is(#qabi,#qabi-portal) .phero__trust span{display:inline-flex;align-items:center;gap:7px}:is(#qabi,#qabi-portal) .phero__trust svg{color:var(--mt-500);flex:none}/* ======= the composition ================================================== */:is(#qabi,#qabi-portal) .phero__art{
  position:relative;width:100%;aspect-ratio:100/104;max-height:660px;min-width:0;
  container-type:inline-size;z-index:1;
}@media(max-width:1080px){:is(#qabi,#qabi-portal) .phero__wrap{grid-template-columns:1fr;gap:40px}:is(#qabi,#qabi-portal) .phero__art{max-width:620px;margin:0 auto;aspect-ratio:100/98}}/* orbit rings with traveling accents — the composite's orbital language */:is(#qabi,#qabi-portal) .orb{position:absolute;border-radius:50%;border:1px solid var(--in-100);pointer-events:none}:is(#qabi,#qabi-portal) .orb--1{width:96%;aspect-ratio:1;right:-14%;top:-6%}:is(#qabi,#qabi-portal) .orb--2{width:72%;aspect-ratio:1;left:-8%;bottom:-12%;border-color:rgba(13,188,147,.28)}:is(#qabi,#qabi-portal) .orb i{
  position:absolute;left:50%;top:-4.5px;width:9px;height:9px;border-radius:50%;
  transform:translateX(-50%);
}:is(#qabi,#qabi-portal) .orb--1 i{background:var(--in-400)}:is(#qabi,#qabi-portal) .orb--1 i.b{top:auto;bottom:-4.5px;background:var(--or-500)}:is(#qabi,#qabi-portal) .orb--2 i{background:var(--mt-400)}:is(#qabi,#qabi-portal) .orb__spin{position:absolute;inset:0;animation:qabi-orbspin 44s linear infinite}:is(#qabi,#qabi-portal) .orb--2 .orb__spin{animation-duration:58s;animation-direction:reverse}@keyframes qabi-orbspin{to{transform:rotate(360deg)}}/* gentle float, staggered per card */@keyframes qabi-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}:is(#qabi,#qabi-portal) .artcard{position:absolute;border-radius:var(--r-xl);background:#fff;border:1px solid var(--line);
  box-shadow:var(--shadow-3);will-change:transform}:is(#qabi,#qabi-portal) .af-1{animation:qabi-drift 7s var(--ease) infinite}:is(#qabi,#qabi-portal) .af-2{animation:qabi-drift 8.6s var(--ease) 1.2s infinite}:is(#qabi,#qabi-portal) .af-3{animation:qabi-drift 7.8s var(--ease) .6s infinite}@media(prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .af-1,:is(#qabi,#qabi-portal) .af-2,:is(#qabi,#qabi-portal) .af-3{animation:none}:is(#qabi,#qabi-portal) .orb__spin{animation:none}}/* the fleet map */:is(#qabi,#qabi-portal) .art-map{right:0;top:1%;width:67%;aspect-ratio:10/7.6;overflow:hidden;padding:0}:is(#qabi,#qabi-portal) .art-map .basemap{position:absolute;inset:0;width:100%;height:100%}:is(#qabi,#qabi-portal) .art-map__hd{
  position:absolute;left:0;right:0;top:0;z-index:4;display:flex;align-items:center;gap:8px;
  padding:9px 12px;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,0));
}:is(#qabi,#qabi-portal) .art-map__hd img{height:15px;width:auto}:is(#qabi,#qabi-portal) .art-map__hd .t{font-size:9.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-48);margin-left:auto}:is(#qabi,#qabi-portal) .art-map .qpin{z-index:3}/* the fleet stack — vehicles joining ABI, one after another */:is(#qabi,#qabi-portal) .art-fleet{left:0;bottom:3%;width:60%;padding:13px;display:flex;flex-direction:column;gap:9px;z-index:5}:is(#qabi,#qabi-portal) .art-fleet__hd{display:flex;align-items:center;gap:8px;padding:0 3px 2px}:is(#qabi,#qabi-portal) .art-fleet__hd .ic{width:22px;height:22px;border-radius:7px;background:var(--in-50);color:var(--in-600);display:grid;place-items:center;flex:none}:is(#qabi,#qabi-portal) .art-fleet__hd .ic svg{width:11px;height:11px}:is(#qabi,#qabi-portal) .art-fleet__hd .t{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-48);white-space:nowrap}:is(#qabi,#qabi-portal) .art-fleet__hd .c{margin-left:auto;font-size:11px;font-weight:600;color:var(--in-600);font-variant-numeric:tabular-nums;white-space:nowrap}:is(#qabi,#qabi-portal) .frow{
  display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:12px;
  background:var(--paper-2);border:1px solid var(--line-soft);transition:.5s var(--ease);
}:is(#qabi,#qabi-portal) .frow__car{width:34px;height:26px;border-radius:7px;background:var(--in-50);display:grid;place-items:center;flex:none;color:var(--in-500)}:is(#qabi,#qabi-portal) .frow__car svg{width:26px;height:auto}:is(#qabi,#qabi-portal) .frow__id{min-width:0;flex:1}:is(#qabi,#qabi-portal) .frow__id b{display:block;font-family:"Nexa",sans-serif;font-weight:900;font-size:12px;color:var(--gun);
  letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}:is(#qabi,#qabi-portal) .frow__id span{display:block;font-size:9px;color:var(--ink-48);margin-top:1px;white-space:nowrap}:is(#qabi,#qabi-portal) .frow__chk{
  display:inline-flex;align-items:center;gap:6px;flex:none;height:24px;padding:0 8px;border-radius:8px;
  border:1px solid var(--line);background:#fff;font-size:9px;font-weight:500;color:var(--ink-48);
  transition:.5s var(--ease);white-space:nowrap;
}:is(#qabi,#qabi-portal) .frow__chk i{
  width:13px;height:13px;border-radius:4px;border:1px solid #ccc;background:#f5f5f5;flex:none;
  display:grid;place-items:center;color:#fff;font-style:normal;transition:.35s var(--ease);
}:is(#qabi,#qabi-portal) .frow__chk i svg{width:8px;height:8px;opacity:0;transform:scale(.4);transition:.3s cubic-bezier(.34,1.56,.64,1) .05s}:is(#qabi,#qabi-portal) .frow.on{background:#fff;border-color:var(--in-100);box-shadow:0 4px 14px rgba(89,51,229,.10)}:is(#qabi,#qabi-portal) .frow.on .frow__chk{border-color:var(--in-200);background:var(--lav);color:var(--in-700)}:is(#qabi,#qabi-portal) .frow.on .frow__chk i{background:var(--in-500);border-color:var(--in-500)}:is(#qabi,#qabi-portal) .frow.on .frow__chk i svg{opacity:1;transform:none}/* the connection badge — mirrors the supplied composite */:is(#qabi,#qabi-portal) .art-link{left:2%;top:13%;padding:13px 16px;display:flex;flex-direction:column;gap:8px;z-index:6;border-radius:18px}:is(#qabi,#qabi-portal) .art-link__row{display:flex;align-items:center;gap:9px}:is(#qabi,#qabi-portal) .art-link__row img.q{width:30px;height:30px}:is(#qabi,#qabi-portal) .art-link__row img.a{width:26px;height:26px}:is(#qabi,#qabi-portal) .art-link__dots{display:flex;align-items:center;gap:4px}:is(#qabi,#qabi-portal) .art-link__dots i{width:5px;height:2.5px;border-radius:2px;background:var(--in-200)}:is(#qabi,#qabi-portal) .art-link__dots i:nth-child(odd){background:var(--mt-200)}:is(#qabi,#qabi-portal) .art-link__tick{
  width:19px;height:19px;border-radius:50%;background:var(--mt-500);display:grid;place-items:center;
  color:#fff;flex:none;box-shadow:0 0 0 0 rgba(13,188,147,.45);animation:qabi-linktick 2.6s infinite;
}:is(#qabi,#qabi-portal) .art-link__tick svg{width:11px;height:11px}@keyframes qabi-linktick{60%{box-shadow:0 0 0 9px rgba(13,188,147,0)}100%{box-shadow:0 0 0 0 rgba(13,188,147,0)}}@media(prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .art-link__tick{animation:none}}:is(#qabi,#qabi-portal) .art-link__cap{font-size:10.5px;font-weight:600;color:var(--gun);text-align:center;white-space:nowrap}/* small floating chips */:is(#qabi,#qabi-portal) .art-chip{
  position:absolute;display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border-radius:14px;
  background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-2);z-index:6;
  font-size:10.5px;font-weight:500;color:var(--ink-80);white-space:nowrap;
}:is(#qabi,#qabi-portal) .art-chip .ico-tile{width:26px;height:26px;border-radius:9px}:is(#qabi,#qabi-portal) .art-chip .ico-tile svg{width:13px;height:13px}:is(#qabi,#qabi-portal) .art-chip--rt{right:2%;bottom:26%}:is(#qabi,#qabi-portal) .art-chip--cv{left:32%;top:0}/* container-query sizing: everything grows with the art column */@container (min-width: 1px){:is(#qabi,#qabi-portal) .art-fleet__hd .t{font-size:clamp(9px,1.75cqw,12px)}:is(#qabi,#qabi-portal) .art-fleet__hd .c{font-size:clamp(9.5px,1.85cqw,12.5px)}:is(#qabi,#qabi-portal) .frow__id b{font-size:clamp(10.5px,2.1cqw,14px)}:is(#qabi,#qabi-portal) .frow__id span{font-size:clamp(8px,1.5cqw,10px)}:is(#qabi,#qabi-portal) .frow__chk{font-size:clamp(8px,1.55cqw,10.5px)}:is(#qabi,#qabi-portal) .art-link__cap{font-size:clamp(9px,1.8cqw,12px)}:is(#qabi,#qabi-portal) .art-chip{font-size:clamp(9px,1.8cqw,12px)}:is(#qabi,#qabi-portal) .art-map__hd .t{font-size:clamp(8px,1.6cqw,10.5px)}}@media(max-width:540px){:is(#qabi,#qabi-portal) .art-chip--rt{display:none}:is(#qabi,#qabi-portal) .art-link{top:10%}}/* ---------- The handshake / conduit --------------------------------------- */:is(#qabi,#qabi-portal) .hs{
  position:relative;border-radius:var(--r-2xl);border:1px solid var(--line);
  background:linear-gradient(180deg,#fff,#fcfbff);box-shadow:var(--shadow-2);
  padding:clamp(24px,3vw,44px);overflow:hidden;
}:is(#qabi,#qabi-portal) .hs::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(520px 260px at 50% 0%,rgba(89,51,229,.07),transparent 70%);
}:is(#qabi,#qabi-portal) .hs__rail{
  position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(12px,2.4vw,28px);z-index:1;
}:is(#qabi,#qabi-portal) .hs__node{
  width:clamp(74px,8vw,104px);height:clamp(74px,8vw,104px);border-radius:26px;flex:none;
  display:grid;place-items:center;background:#fff;border:1px solid var(--line);
  box-shadow:var(--shadow-2);position:relative;
}:is(#qabi,#qabi-portal) .hs__node img{width:60%;height:auto}:is(#qabi,#qabi-portal) .hs__node--abi{border-color:rgba(2,40,81,.16)}:is(#qabi,#qabi-portal) .hs__node::after{
  content:"";position:absolute;inset:-6px;border-radius:32px;border:1px solid var(--in-100);
  opacity:0;transform:scale(.94);transition:.5s var(--ease);
}:is(#qabi,#qabi-portal) .hs__node.pulse::after{animation:qabi-nodepulse 1.1s var(--ease)}@keyframes qabi-nodepulse{0%{opacity:.9;transform:scale(.94)}100%{opacity:0;transform:scale(1.1)}}:is(#qabi,#qabi-portal) .hs__label{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);
  font-size:10.56px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
  color:var(--ink-48);white-space:nowrap;
}:is(#qabi,#qabi-portal) .hs__pipe{
  position:relative;height:clamp(74px,8vw,104px);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--paper-3),#fff);
  border:1px solid var(--line-soft);overflow:hidden;
}:is(#qabi,#qabi-portal) .hs__pipe::before{
  content:"";position:absolute;left:0;right:0;top:50%;height:2px;transform:translateY(-50%);
  background:repeating-linear-gradient(90deg,var(--in-100) 0 7px,transparent 7px 15px);
  opacity:.9;
}:is(#qabi,#qabi-portal) .hs__flow{
  position:absolute;left:0;right:0;top:50%;height:2px;transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,var(--in-400),var(--mt-400),transparent);
  background-size:42% 100%;background-repeat:no-repeat;
  animation:qabi-flowrun 4.6s linear infinite;
}@keyframes qabi-flowrun{0%{background-position:-45% 0}100%{background-position:135% 0}}:is(#qabi,#qabi-portal) .pkt{
  position:absolute;top:50%;left:0;transform:translate(-50%,-50%);
  display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px;border-radius:var(--r-pill);
  background:#fff;border:1px solid var(--in-200);box-shadow:0 4px 14px rgba(89,51,229,.14);
  font-size:13.44px;font-weight:500;color:var(--in-700);white-space:nowrap;
  opacity:0;pointer-events:none;will-change:left,opacity;
}:is(#qabi,#qabi-portal) .pkt svg{width:15px;height:15px;flex:none}/* Each event glides in, slows to a near-stop through the centre of the pipe
   so the label can be read, then carries on to ABI. The dwell (36-66%) covers
   only 12% of the distance in 30% of the time. */:is(#qabi,#qabi-portal) .pkt.run{animation:qabi-pktrun var(--dur,5.4s) ease-in-out forwards}@keyframes qabi-pktrun{
  0%  {opacity:0;left:4%; transform:translate(-50%,-50%) scale(.92);box-shadow:0 4px 14px rgba(89,51,229,.10)}
  10% {opacity:1;left:13%;transform:translate(-50%,-50%) scale(1)}
  36% {opacity:1;left:44%;box-shadow:0 8px 24px rgba(89,51,229,.24)}
  66% {opacity:1;left:56%;box-shadow:0 8px 24px rgba(89,51,229,.24)}
  90% {opacity:1;left:87%;transform:translate(-50%,-50%) scale(1);box-shadow:0 4px 14px rgba(89,51,229,.12)}
  100%{opacity:0;left:96%;transform:translate(-50%,-50%) scale(.92)}
}@media(prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .pkt.run{animation:none;opacity:1;left:50%}:is(#qabi,#qabi-portal) .hs__flow{animation:none}}/* the ledger that fills */:is(#qabi,#qabi-portal) .hs__ledger{margin-top:clamp(22px,2.6vw,34px);position:relative;z-index:1}:is(#qabi,#qabi-portal) .ledger{
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff;
}:is(#qabi,#qabi-portal) .ledger__hd{
  display:flex;align-items:center;gap:10px;padding:12px 16px;
  background:var(--abi-tint);border-bottom:1px solid rgba(2,40,81,.10);
}:is(#qabi,#qabi-portal) .ledger__hd img{height:20px;width:auto}:is(#qabi,#qabi-portal) .ledger__hd .nm{font-size:11.84px;font-weight:600;color:var(--abi-navy);letter-spacing:.01em}:is(#qabi,#qabi-portal) .ledger__hd .t{font-size:11.52px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--abi-navy);margin-left:auto}:is(#qabi,#qabi-portal) .ledger__rows{list-style:none;margin:0;padding:0}:is(#qabi,#qabi-portal) .ledger__rows li{
  display:flex;align-items:center;gap:12px;padding:11px 16px;border-bottom:1px solid var(--line-soft);
  font-size:13.28px;color:var(--ink-80);
  opacity:.28;filter:saturate(.15);transform:translateX(-4px);
  transition:opacity .5s var(--ease),transform .5s var(--ease),filter .5s var(--ease),background .5s var(--ease);
}:is(#qabi,#qabi-portal) .ledger__rows li.in{opacity:1;transform:none;filter:none}:is(#qabi,#qabi-portal) .ledger__rows li.in .meta{color:var(--ink-64)}:is(#qabi,#qabi-portal) .ledger__rows li:last-child{border-bottom:0}:is(#qabi,#qabi-portal) .ledger__rows .ic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex:none;background:var(--in-50);color:var(--in-600)}:is(#qabi,#qabi-portal) .ledger__rows .ic svg{width:14px;height:14px}:is(#qabi,#qabi-portal) .ledger__rows .ic--mt{background:var(--mt-50);color:var(--mt-700)}:is(#qabi,#qabi-portal) .ledger__rows .ic--or{background:var(--or-50);color:var(--or-700)}:is(#qabi,#qabi-portal) .ledger__rows .lbl{font-weight:500;color:var(--gun)}:is(#qabi,#qabi-portal) .ledger__rows .meta{margin-left:auto;font-size:11.84px;color:var(--ink-48);white-space:nowrap;font-variant-numeric:tabular-nums}:is(#qabi,#qabi-portal) .ledger__ft{padding:11px 16px;background:var(--paper-2);border-top:1px solid var(--line-soft);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap}@media(max-width:760px){:is(#qabi,#qabi-portal) .hs__rail{grid-template-columns:1fr;justify-items:center;gap:52px}:is(#qabi,#qabi-portal) .hs__pipe{width:100%;height:78px}:is(#qabi,#qabi-portal) .pkt{font-size:10.88px;height:27px}:is(#qabi,#qabi-portal) .ledger__rows{min-height:0}/* a phone-width pipe only has room for one label: each one fades in, rests
     in the centre, and is gone before the next one appears */:is(#qabi,#qabi-portal) .pkt.run{animation-name:qabi-pktrunm}}@keyframes qabi-pktrunm{
  0%  {opacity:0;left:22%;transform:translate(-50%,-50%) scale(.94)}
  9%  {opacity:1;left:38%;transform:translate(-50%,-50%) scale(1)}
  22% {opacity:1;left:46%;box-shadow:0 8px 24px rgba(89,51,229,.24)}
  54% {opacity:1;left:54%;box-shadow:0 8px 24px rgba(89,51,229,.24)}
  63% {opacity:0;left:64%;transform:translate(-50%,-50%) scale(.96)}
  100%{opacity:0;left:64%}
}/* ---------- Change cards -------------------------------------------------- */:is(#qabi,#qabi-portal) .chg{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-2xl);
  padding:30px 28px;display:flex;flex-direction:column;overflow:hidden;transition:.45s var(--ease);
}:is(#qabi,#qabi-portal) .chg::after{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--in-500),var(--mt-500));
  transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease);
}:is(#qabi,#qabi-portal) .chg:hover{transform:translateY(-5px);box-shadow:var(--shadow-2);border-color:var(--in-100)}:is(#qabi,#qabi-portal) .chg:hover::after,:is(#qabi,#qabi-portal) .chg.in::after,html:not(.qabi-js) :is(#qabi,#qabi-portal) .chg::after{transform:scaleX(1)}:is(#qabi,#qabi-portal) .chg h3{margin:18px 0 11px;font-size:clamp(18.4px,1.5vw,21.76px)}:is(#qabi,#qabi-portal) .chg p{color:var(--ink-64);font-weight:300;font-size:15.04px;line-height:1.68}:is(#qabi,#qabi-portal) .chg .foot{margin-top:18px;padding-top:16px;border-top:1px solid var(--line-soft)}/* ---------- Steps --------------------------------------------------------- */:is(#qabi,#qabi-portal) .steps{counter-reset:s;display:flex;flex-direction:column;gap:2px}:is(#qabi,#qabi-portal) .step{
  position:relative;display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--line-soft);
}:is(#qabi,#qabi-portal) .step:last-child{border-bottom:0}:is(#qabi,#qabi-portal) .step__n{
  width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--in-50);color:var(--in-700);font-family:"Nexa",sans-serif;font-weight:900;font-size:13.6px;
  border:1px solid var(--in-100);
}:is(#qabi,#qabi-portal) .step.on .step__n{background:var(--in-500);color:#fff;border-color:var(--in-500)}:is(#qabi,#qabi-portal) .step h4{margin:4px 0 7px}:is(#qabi,#qabi-portal) .step p{font-size:14.4px;color:var(--ink-64);font-weight:300;line-height:1.66}/* ---------- Phone frame --------------------------------------------------- */:is(#qabi,#qabi-portal) .phone{
  position:relative;width:min(300px,78vw);margin:0 auto;border-radius:38px;
  background:#101826;padding:9px;box-shadow:var(--shadow-3);
}:is(#qabi,#qabi-portal) .phone__screen{border-radius:30px;overflow:hidden;background:#fff;position:relative}:is(#qabi,#qabi-portal) .phone__screen img{width:100%;display:block}:is(#qabi,#qabi-portal) .phone__notch{
  position:absolute;top:9px;left:50%;transform:translateX(-50%);width:96px;height:20px;border-radius:12px;
  background:#101826;z-index:3;
}:is(#qabi,#qabi-portal) .phone__glow{
  position:absolute;inset:-28px;border-radius:60px;z-index:-1;
  background:radial-gradient(closest-side,rgba(89,51,229,.22),transparent 72%);filter:blur(8px);
}/* the ABI row highlight that animates on */:is(#qabi,#qabi-portal) .phone__spot{
  position:absolute;left:3.5%;right:3.5%;border-radius:12px;pointer-events:none;
  border:2px solid var(--in-500);background:rgba(89,51,229,.08);
  opacity:0;transform:scale(.97);transition:.6s var(--ease);
  box-shadow:0 0 0 4px rgba(89,51,229,.10);
}:is(#qabi,#qabi-portal) .phone.lit .phone__spot{opacity:1;transform:none}/* ---------- Toggle proof (live DOM rebuild of the vehicle record) --------- */:is(#qabi,#qabi-portal) .vrec{
  border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;background:#fff;
  box-shadow:var(--shadow-2);max-width:460px;
}:is(#qabi,#qabi-portal) .vrec__hd{padding:15px 18px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:11px}:is(#qabi,#qabi-portal) .vrec__body{padding:17px 18px;display:flex;flex-direction:column;gap:13px}:is(#qabi,#qabi-portal) .tgl{display:flex;align-items:center;gap:12px}:is(#qabi,#qabi-portal) .tgl__box{
  width:21px;height:21px;border-radius:6px;flex:none;display:grid;place-items:center;
  border:1.5px solid var(--ink-28);background:#fff;color:#fff;transition:.35s var(--ease);
}:is(#qabi,#qabi-portal) .tgl__box svg{width:13px;height:13px;opacity:0;transform:scale(.5);transition:.3s var(--ease) .08s}:is(#qabi,#qabi-portal) .tgl.on .tgl__box{background:var(--in-500);border-color:var(--in-500)}:is(#qabi,#qabi-portal) .tgl.on .tgl__box svg{opacity:1;transform:none}:is(#qabi,#qabi-portal) .tgl__lbl{font-size:14.4px;font-weight:500;color:var(--ink-80)}:is(#qabi,#qabi-portal) .tgl.on .tgl__lbl{color:var(--gun)}:is(#qabi,#qabi-portal) .tgl--target{position:relative;border-radius:10px;padding:8px 10px;margin:-8px -10px;transition:.45s var(--ease)}:is(#qabi,#qabi-portal) .tgl--target.on{background:var(--lav);box-shadow:inset 0 0 0 1px var(--in-100)}:is(#qabi,#qabi-portal) .vrec__ack{
  display:flex;align-items:center;gap:9px;font-size:12.48px;font-weight:500;color:var(--mt-700);
  background:var(--mt-50);border:1px solid var(--mt-200);border-radius:var(--r-md);padding:9px 12px;
  opacity:0;transform:translateY(6px);transition:.5s var(--ease);
}:is(#qabi,#qabi-portal) .vrec__ack.in{opacity:1;transform:none}:is(#qabi,#qabi-portal) .vrec__ack svg{width:14px;height:14px;flex:none}/* ---------- Scenario walk ------------------------------------------------- */:is(#qabi,#qabi-portal) .walk{position:relative}:is(#qabi,#qabi-portal) .walk__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:start}:is(#qabi,#qabi-portal) .walk__stageCol{position:sticky;top:104px}:is(#qabi,#qabi-portal) .walk__list{display:flex;flex-direction:column;gap:clamp(18px,2.4vw,30px)}:is(#qabi,#qabi-portal) .scn{
  border:1px solid var(--line);border-radius:var(--r-xl);background:#fff;padding:26px 26px;
  transition:.5s var(--ease);position:relative;
}:is(#qabi,#qabi-portal) .scn::before{
  content:"";position:absolute;left:-1px;top:22px;bottom:22px;width:3px;border-radius:0 3px 3px 0;
  background:var(--in-500);transform:scaleY(0);transform-origin:center;transition:transform .5s var(--ease);
}:is(#qabi,#qabi-portal) .scn.on{box-shadow:var(--shadow-2);border-color:var(--in-100)}:is(#qabi,#qabi-portal) .scn.on::before{transform:scaleY(1)}:is(#qabi,#qabi-portal) .scn__k{font-size:10.56px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--or-700)}:is(#qabi,#qabi-portal) .scn h3{margin:11px 0 10px;font-size:clamp(17.6px,1.45vw,21.12px)}:is(#qabi,#qabi-portal) .scn p{font-size:14.72px;color:var(--ink-64);font-weight:300;line-height:1.68}:is(#qabi,#qabi-portal) .scn__then{
  margin-top:16px;padding-top:14px;border-top:1px solid var(--line-soft);
  font-size:14.08px;color:var(--ink-80);display:flex;gap:10px;align-items:flex-start;
}:is(#qabi,#qabi-portal) .scn__then svg{color:var(--mt-500);flex:none;margin-top:3px}/* evidence stage */:is(#qabi,#qabi-portal) .evst{
  border:1px solid var(--line);border-radius:var(--r-xl);background:#fff;overflow:hidden;
  box-shadow:var(--shadow-2);
}:is(#qabi,#qabi-portal) .evst__hd{
  padding:14px 18px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:10px;
  background:linear-gradient(180deg,#fff,var(--paper-2));
}:is(#qabi,#qabi-portal) .evst__hd .t{font-family:"Nexa",sans-serif;font-weight:900;font-size:15.2px;color:var(--gun)}:is(#qabi,#qabi-portal) .evst__body{padding:16px 18px;min-height:288px;display:flex;flex-direction:column;gap:9px}:is(#qabi,#qabi-portal) .evst__pane{display:none;flex-direction:column;gap:9px}:is(#qabi,#qabi-portal) .evst__pane.on{display:flex}:is(#qabi,#qabi-portal) .evrow{
  display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:var(--r-md);
  background:var(--paper-2);border:1px solid var(--line-soft);font-size:12.96px;color:var(--ink-80);
  opacity:0;transform:translateX(-8px);
}:is(#qabi,#qabi-portal) .evst__pane.on .evrow{animation:qabi-evin .5s var(--ease) forwards}:is(#qabi,#qabi-portal) .evst__pane.on .evrow:nth-child(1){animation-delay:.05s}:is(#qabi,#qabi-portal) .evst__pane.on .evrow:nth-child(2){animation-delay:.14s}:is(#qabi,#qabi-portal) .evst__pane.on .evrow:nth-child(3){animation-delay:.23s}:is(#qabi,#qabi-portal) .evst__pane.on .evrow:nth-child(4){animation-delay:.32s}:is(#qabi,#qabi-portal) .evst__pane.on .evrow:nth-child(5){animation-delay:.41s}@keyframes qabi-evin{to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .evst__pane.on .evrow{animation:none;opacity:1;transform:none}}:is(#qabi,#qabi-portal) .evrow .ic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex:none;background:var(--in-50);color:var(--in-600)}:is(#qabi,#qabi-portal) .evrow .ic svg{width:14px;height:14px}:is(#qabi,#qabi-portal) .evrow .ic--mt{background:var(--mt-50);color:var(--mt-700)}:is(#qabi,#qabi-portal) .evrow .ic--or{background:var(--or-50);color:var(--or-700)}:is(#qabi,#qabi-portal) .evrow .ic--bs{background:var(--bs-50);color:var(--bs-700)}:is(#qabi,#qabi-portal) .evrow b{font-weight:500;color:var(--gun)}:is(#qabi,#qabi-portal) .evrow .meta{margin-left:auto;font-size:11.68px;color:var(--ink-48);white-space:nowrap;font-variant-numeric:tabular-nums}:is(#qabi,#qabi-portal) .evst__ft{padding:12px 18px;border-top:1px solid var(--line-soft);background:var(--abi-tint);
  display:flex;align-items:center;gap:10px;font-size:12.16px;color:var(--abi-navy);font-weight:500}:is(#qabi,#qabi-portal) .evst__ft img{height:17px;width:auto;flex:none}@media(max-width:900px){:is(#qabi,#qabi-portal) .walk__grid{grid-template-columns:1fr;gap:26px}:is(#qabi,#qabi-portal) .walk__stageCol{position:static;order:-1}:is(#qabi,#qabi-portal) .evst__body{min-height:0}}/* ---------- ABI credibility ---------------------------------------------- */:is(#qabi,#qabi-portal) .abi{
  position:relative;border-radius:var(--r-2xl);overflow:hidden;color:#fff;
  background:linear-gradient(135deg,var(--abi-navy) 0%,#04162c 70%,#020d1c 100%);
  padding:clamp(34px,4.4vw,64px);
}:is(#qabi,#qabi-portal) .abi::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(660px 340px at 88% 8%,rgba(204,23,30,.20),transparent 58%),
             radial-gradient(520px 320px at 4% 92%,rgba(89,51,229,.20),transparent 60%);
}:is(#qabi,#qabi-portal) .abi>*{position:relative;z-index:1}:is(#qabi,#qabi-portal) .abi h2{color:#fff}:is(#qabi,#qabi-portal) .abi p{color:rgba(255,255,255,.76);font-weight:300}:is(#qabi,#qabi-portal) .abi .kicker{color:rgba(255,255,255,.66)}:is(#qabi,#qabi-portal) .abi .kicker::before{background:var(--abi-red)}:is(#qabi,#qabi-portal) .abi__logo{background:#fff;border-radius:var(--r-lg);padding:18px 26px;display:inline-flex;align-items:center}:is(#qabi,#qabi-portal) .abi__logo img{height:44px;width:auto}:is(#qabi,#qabi-portal) .abi__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.14);
  border-radius:var(--r-lg);overflow:hidden;margin-top:clamp(28px,3.4vw,44px)}:is(#qabi,#qabi-portal) .abi__stat{background:rgba(255,255,255,.045);padding:22px 20px;backdrop-filter:blur(2px)}:is(#qabi,#qabi-portal) .abi__stat .n{font-family:"Nexa",sans-serif;font-weight:900;font-size:clamp(24px,2.6vw,34.4px);color:#fff;line-height:1}:is(#qabi,#qabi-portal) .abi__stat .l{font-size:12.32px;color:rgba(255,255,255,.62);margin-top:9px;line-height:1.5}@media(max-width:820px){:is(#qabi,#qabi-portal) .abi__stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:460px){:is(#qabi,#qabi-portal) .abi__stats{grid-template-columns:1fr}}:is(#qabi,#qabi-portal) .abi__progs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:26px}@media(max-width:700px){:is(#qabi,#qabi-portal) .abi__progs{grid-template-columns:1fr}}:is(#qabi,#qabi-portal) .abi__prog{border:1px solid rgba(255,255,255,.16);border-radius:var(--r-lg);padding:20px;background:rgba(255,255,255,.04)}:is(#qabi,#qabi-portal) .abi__prog h4{color:#fff;margin:0 0 8px;font-size:16px}:is(#qabi,#qabi-portal) .abi__prog p{font-size:13.6px;line-height:1.6;color:rgba(255,255,255,.70)}/* ---------- Control / consent -------------------------------------------- */:is(#qabi,#qabi-portal) .ctrl{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}@media(max-width:860px){:is(#qabi,#qabi-portal) .ctrl{grid-template-columns:1fr}}:is(#qabi,#qabi-portal) .ctrl__c{
  border:1px solid var(--line);border-radius:var(--r-xl);padding:26px;background:#fff;
  display:flex;flex-direction:column;gap:12px;
}:is(#qabi,#qabi-portal) .ctrl__c h4{margin:0}:is(#qabi,#qabi-portal) .ctrl__c p{font-size:14.24px;color:var(--ink-64);font-weight:300;line-height:1.66}/* ---------- Dual CTA ------------------------------------------------------ */:is(#qabi,#qabi-portal) .dual{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media(max-width:860px){:is(#qabi,#qabi-portal) .dual{grid-template-columns:1fr}}:is(#qabi,#qabi-portal) .dual__c{
  position:relative;border-radius:var(--r-2xl);padding:clamp(28px,3.2vw,44px);overflow:hidden;
  display:flex;flex-direction:column;
}:is(#qabi,#qabi-portal) .dual__c--now{background:linear-gradient(135deg,var(--in-600),var(--in-800) 62%,#1b1150);color:#fff}:is(#qabi,#qabi-portal) .dual__c--now::before{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 16% 20%,rgba(13,188,147,.28),transparent 44%),
             radial-gradient(circle at 86% 80%,rgba(255,150,0,.18),transparent 46%)}:is(#qabi,#qabi-portal) .dual__c--new{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-2)}:is(#qabi,#qabi-portal) .dual__c>*{position:relative;z-index:1}:is(#qabi,#qabi-portal) .dual__c h3{margin:14px 0 12px}:is(#qabi,#qabi-portal) .dual__c--now h3{color:#fff}:is(#qabi,#qabi-portal) .dual__c--now p{color:rgba(255,255,255,.76);font-weight:300}:is(#qabi,#qabi-portal) .dual__c--new p{color:var(--ink-64);font-weight:300}:is(#qabi,#qabi-portal) .dual__c .btn-row{margin-top:auto;padding-top:26px}:is(#qabi,#qabi-portal) .dual__c--now .btn--primary{background:#fff;color:var(--in-700);box-shadow:0 12px 30px rgba(0,0,0,.22)}:is(#qabi,#qabi-portal) .dual__c--now .btn--primary:hover{background:#fff;color:var(--in-800)}:is(#qabi,#qabi-portal) .dual__c--now .kicker{color:rgba(255,255,255,.74)}:is(#qabi,#qabi-portal) .dual__c--now .kicker::before{background:var(--mt-400)}:is(#qabi,#qabi-portal) .dual__ul{list-style:none;padding:0;margin:16px 0 0}:is(#qabi,#qabi-portal) .dual__ul li{display:flex;gap:10px;padding:5px 0;font-size:13.92px;line-height:1.6}:is(#qabi,#qabi-portal) .dual__ul li svg{flex:none;margin-top:4px}:is(#qabi,#qabi-portal) .dual__c--now .dual__ul li{color:rgba(255,255,255,.82)}:is(#qabi,#qabi-portal) .dual__c--now .dual__ul li svg{color:var(--mt-300)}:is(#qabi,#qabi-portal) .dual__c--new .dual__ul li{color:var(--ink-64)}:is(#qabi,#qabi-portal) .dual__c--new .dual__ul li svg{color:var(--mt-500)}/* ---------- Quote --------------------------------------------------------- */:is(#qabi,#qabi-portal) .quote{
  border-left:3px solid var(--in-500);padding:6px 0 6px 26px;max-width:66ch;
}:is(#qabi,#qabi-portal) .quote p{font-family:"Nexa",sans-serif;font-weight:900;letter-spacing:-.015em;
  font-size:clamp(18.4px,1.9vw,25.6px);line-height:1.38;color:var(--gun)}:is(#qabi,#qabi-portal) .quote cite{display:block;margin-top:16px;font-style:normal;font-size:13.44px;color:var(--ink-48)}:is(#qabi,#qabi-portal) .quote cite b{color:var(--gun);font-weight:600}/* ---------- Disclaimer block ---------------------------------------------- */:is(#qabi,#qabi-portal) .disc{
  border:1px solid var(--line);border-radius:var(--r-lg);background:var(--paper-2);
  padding:20px 22px;display:flex;gap:14px;align-items:flex-start;
}:is(#qabi,#qabi-portal) .disc svg{flex:none;margin-top:2px;color:var(--ink-48)}:is(#qabi,#qabi-portal) .disc p{font-size:12.48px;line-height:1.62;color:var(--ink-48)}:is(#qabi,#qabi-portal) .disc p+p{margin-top:9px}/* ---------- misc ---------------------------------------------------------- */:is(#qabi,#qabi-portal) .eyebrow-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}:is(#qabi,#qabi-portal) .pill-date{
  display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 13px;border-radius:var(--r-pill);
  background:var(--gun);color:#fff;font-size:11.2px;font-weight:600;letter-spacing:.06em;
}:is(#qabi,#qabi-portal) .rule{height:1px;background:var(--line);border:0;margin:clamp(42px,5vw,72px) 0}/* very narrow phones: the header keeps only the menu control */@media(max-width:380px){:is(#qabi,#qabi-portal) .hdr__cta .btn{display:none}:is(#qabi,#qabi-portal) .annbar__in{gap:8px;padding:7px 0}}/* grid children default to min-width:auto, which lets a nowrap cell push the
   track wider than its column on very narrow phones */:is(#qabi,#qabi-portal) .walk__stageCol,:is(#qabi,#qabi-portal) .walk__list,:is(#qabi,#qabi-portal) .walk__grid>*{min-width:0}:is(#qabi,#qabi-portal) .evrow{flex-wrap:wrap}:is(#qabi,#qabi-portal) .evrow .meta{margin-left:auto}@media(max-width:400px){:is(#qabi,#qabi-portal) .evrow .meta{margin-left:37px;width:100%;text-align:left}:is(#qabi,#qabi-portal) .evst__ft{flex-wrap:wrap}}/* narrow screens: the composition restacks — map full-width, fleet in front */@media(max-width:640px){:is(#qabi,#qabi-portal) .phero__art{aspect-ratio:100/114;max-width:none}:is(#qabi,#qabi-portal) .art-map{width:100%;right:0;top:2%}:is(#qabi,#qabi-portal) .art-link{left:2%;top:6%;padding:10px 13px;border-radius:15px}:is(#qabi,#qabi-portal) .art-link__row img.q{width:25px;height:25px}:is(#qabi,#qabi-portal) .art-link__row img.a{width:22px;height:22px}:is(#qabi,#qabi-portal) .art-fleet{width:90%;left:1%;bottom:0}:is(#qabi,#qabi-portal) .orb--1{right:-34%;top:-10%}:is(#qabi,#qabi-portal) .orb--2{left:-22%}}/* ==========================================================================
   THE OPERATORS — photo strip + gallery lightbox
   Without JS: a swipeable strip, and :target opens each slide.
   With JS: gallery.js marks the dialog .is-live, clones the strip into a
   seamless marquee (.is-looping) and runs the dialog (keys, swipe, focus
   trap, scroll lock). The gating is per component, so the gallery never
   depends on the page-level gate class.
   ========================================================================== */:is(#qabi,#qabi-portal) .ops__hint{display:inline-flex;align-items:center;gap:9px;margin-top:18px;font-size:13.12px;font-weight:500;color:var(--in-600)}:is(#qabi,#qabi-portal) .ops__hintic{width:26px;height:26px;border-radius:50%;background:var(--in-50);border:1px solid var(--in-100);display:grid;place-items:center;flex:none}:is(#qabi,#qabi-portal) .ops__hintic svg{width:12px;height:12px}:is(#qabi,#qabi-portal) .ops__strip{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:18px 0 30px}:is(#qabi,#qabi-portal) .ops__strip::-webkit-scrollbar{display:none}:is(#qabi,#qabi-portal) .ops__strip .marquee__t{animation:none;padding:0 var(--gutter)}:is(#qabi,#qabi-portal) .ops__strip.is-looping{overflow:hidden;scroll-snap-type:none}:is(#qabi,#qabi-portal) .ops__strip.is-looping .marquee__t{animation:qabi-slide 96s linear infinite;padding:0}:is(#qabi,#qabi-portal) .ops__strip:hover .marquee__t,:is(#qabi,#qabi-portal) .ops__strip:focus-within .marquee__t,:is(#qabi,#qabi-portal) .ops__strip.is-paused .marquee__t{animation-play-state:paused}@media (prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .ops__strip.is-looping .marquee__t{animation:none}}:is(#qabi,#qabi-portal) .lt{position:relative;flex:none;display:block;border-radius:var(--r-lg);overflow:hidden;cursor:zoom-in;
  scroll-snap-align:center;background:#eceff4;isolation:isolate;box-shadow:0 0 0 1px var(--line);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease)}:is(#qabi,#qabi-portal) .ops .lt img{display:block;height:clamp(210px,21vw,290px);width:auto;border:0;border-radius:0;
  transition:transform 1.1s var(--ease)}:is(#qabi,#qabi-portal) .lt::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(16,24,38,0) 52%,rgba(16,24,38,.62));opacity:0;transition:opacity .45s var(--ease)}:is(#qabi,#qabi-portal) .lt:hover,:is(#qabi,#qabi-portal) .lt:focus-visible{transform:translateY(-5px);box-shadow:0 0 0 1px var(--line),0 20px 44px rgba(37,21,96,.20)}:is(#qabi,#qabi-portal) .lt:focus-visible{outline:3px solid var(--in-400);outline-offset:3px}:is(#qabi,#qabi-portal) .lt:hover img,:is(#qabi,#qabi-portal) .lt:focus-visible img{transform:scale(1.05)}:is(#qabi,#qabi-portal) .lt:hover::after,:is(#qabi,#qabi-portal) .lt:focus-visible::after{opacity:1}:is(#qabi,#qabi-portal) .lt__tag{position:absolute;left:12px;bottom:12px;z-index:2;display:inline-flex;align-items:center;gap:6px;
  height:30px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.95);color:var(--in-700);
  font-size:11.84px;font-weight:600;opacity:0;transform:translateY(8px);transition:.45s var(--ease);white-space:nowrap}:is(#qabi,#qabi-portal) .lt__tag svg{width:14px;height:14px}:is(#qabi,#qabi-portal) .lt__zoom{position:absolute;right:12px;top:12px;z-index:2;width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.95);color:var(--in-600);display:grid;place-items:center;
  opacity:0;transform:scale(.8);transition:.45s var(--ease);box-shadow:0 4px 12px rgba(16,24,38,.18)}:is(#qabi,#qabi-portal) .lt__zoom svg{width:16px;height:16px}:is(#qabi,#qabi-portal) .lt:hover .lt__tag,:is(#qabi,#qabi-portal) .lt:focus-visible .lt__tag,:is(#qabi,#qabi-portal) .lt:hover .lt__zoom,:is(#qabi,#qabi-portal) .lt:focus-visible .lt__zoom{opacity:1;transform:none}@media (hover:none){:is(#qabi,#qabi-portal) .lt__zoom{opacity:1;transform:none}}/* ---------- lightbox ------------------------------------------------------ */html.qabi-lock{overflow:hidden}:is(#qabi,#qabi-portal) .lbx{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;
  --side:16px;padding:16px 16px 104px;overscroll-behavior:contain}:is(#qabi,#qabi-portal) .lbx:not(.is-live):has(.lbx__slide:target){display:flex}:is(#qabi,#qabi-portal) .lbx.is-live.open{display:flex}:is(#qabi,#qabi-portal) .lbx__scrim{position:absolute;inset:0;background:rgba(9,7,28,.86);cursor:zoom-out;
  -webkit-backdrop-filter:blur(16px) saturate(125%);backdrop-filter:blur(16px) saturate(125%)}:is(#qabi,#qabi-portal) .lbx__stage{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;max-width:100%;max-height:100%}/* narrow (portrait) — stacked sheet, controls in a bottom bar */:is(#qabi,#qabi-portal) .lbx__slide{display:none;margin:0;background:#fff;border-radius:22px;overflow:hidden auto;
  grid-template-columns:1fr;width:min(560px,100%);max-height:calc(100dvh - 120px);overscroll-behavior:contain;
  box-shadow:0 40px 120px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.06)}:is(#qabi,#qabi-portal) .lbx:not(.is-live) .lbx__slide:target{display:grid}:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on{display:grid}:is(#qabi,#qabi-portal) .lbx__slide:focus,:is(#qabi,#qabi-portal) .lbx__slide:focus-visible{outline:none}:is(#qabi,#qabi-portal) .lbx__media{position:relative;background:#101826;overflow:hidden;min-width:0;aspect-ratio:1360/1190;touch-action:pan-y}:is(#qabi,#qabi-portal) .lbx__media img{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}:is(#qabi,#qabi-portal) .lbx__cap{display:flex;flex-direction:column;padding:22px 22px 24px;min-width:0}:is(#qabi,#qabi-portal) .lbx__top{display:flex;align-items:center;gap:10px}:is(#qabi,#qabi-portal) .lbx__feat{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 13px;border-radius:999px;
  background:var(--in-50);border:1px solid var(--in-100);color:var(--in-700);font-size:11.84px;font-weight:600;white-space:nowrap}:is(#qabi,#qabi-portal) .lbx__feat svg{width:14px;height:14px;flex:none}:is(#qabi,#qabi-portal) .lbx__count{margin-left:auto;font-size:12.48px;color:var(--ink-48);font-variant-numeric:tabular-nums;white-space:nowrap}:is(#qabi,#qabi-portal) .lbx__count b{color:var(--gun);font-weight:600}:is(#qabi,#qabi-portal) .lbx__title{font-family:"Nexa","Poppins",sans-serif;font-weight:900;font-size:clamp(20.8px,2vw,28.8px);
  line-height:1.16;letter-spacing:-.02em;color:var(--gun);margin:20px 0 12px}:is(#qabi,#qabi-portal) .lbx__body{font-size:14.88px;line-height:1.7;color:var(--ink-64);font-weight:300;margin:0}:is(#qabi,#qabi-portal) .lbx__where{margin:22px 0 0;padding-top:16px;border-top:1px solid var(--line-soft);
  display:flex;flex-direction:column;gap:3px;font-size:13.44px;font-weight:500;color:var(--gun)}:is(#qabi,#qabi-portal) .lbx__where span{font-size:10.24px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--in-600)}:is(#qabi,#qabi-portal) .lbx__static{display:none;gap:10px;margin-top:18px}:is(#qabi,#qabi-portal) .lbx:not(.is-live) .lbx__static{display:flex}:is(#qabi,#qabi-portal) .lbx__sbtn{flex:1;height:44px;border-radius:22px;border:1px solid var(--line);display:grid;place-items:center;color:var(--in-600)}:is(#qabi,#qabi-portal) .lbx__sbtn svg{width:18px;height:18px}:is(#qabi,#qabi-portal) .lbx svg.flipx{transform:scaleX(-1)}/* glass controls */:is(#qabi,#qabi-portal) .lbx__btn,:is(#qabi,#qabi-portal) .lbx__close{position:fixed;z-index:3;display:grid;place-items:center;border-radius:50%;color:#fff;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);cursor:pointer;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease),border-color .3s}:is(#qabi,#qabi-portal) .lbx__btn{width:56px;height:56px;bottom:max(24px,env(safe-area-inset-bottom))}:is(#qabi,#qabi-portal) .lbx__btn svg{width:20px;height:20px}:is(#qabi,#qabi-portal) .lbx__btn--prev{left:calc(50% - 28px - 76px)}:is(#qabi,#qabi-portal) .lbx__btn--next{left:calc(50% - 28px + 76px)}:is(#qabi,#qabi-portal) .lbx__close{width:48px;height:48px;left:calc(50% - 24px);bottom:max(28px,calc(env(safe-area-inset-bottom) + 4px))}:is(#qabi,#qabi-portal) .lbx__close svg{width:18px;height:18px}:is(#qabi,#qabi-portal) .lbx__btn:hover,:is(#qabi,#qabi-portal) .lbx__close:hover{background:#fff;color:var(--in-700);border-color:#fff;transform:scale(1.07)}:is(#qabi,#qabi-portal) .lbx__btn:focus-visible,:is(#qabi,#qabi-portal) .lbx__close:focus-visible{outline:3px solid var(--in-300);outline-offset:3px}:is(#qabi,#qabi-portal) .lbx:not(.is-live) .lbx__btn{display:none}:is(#qabi,#qabi-portal) .lbx__bar{position:fixed;left:0;right:0;top:0;height:3px;z-index:3;background:rgba(255,255,255,.10)}:is(#qabi,#qabi-portal) .lbx__bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--in-400),var(--mt-400));
  transition:width .45s var(--ease)}:is(#qabi,#qabi-portal) .lbx:not(.is-live) .lbx__bar{display:none}/* wide — image and caption side by side, controls in the gutters */@media (min-width:1024px),(orientation:landscape) and (min-width:560px){:is(#qabi,#qabi-portal) .lbx{--side:clamp(68px,7.5vw,112px);padding:20px var(--side)}:is(#qabi,#qabi-portal) .lbx__slide{--cap:clamp(260px,29vw,400px);
    --h:min(660px, calc(100dvh - 40px), calc((100vw - 2 * var(--side) - var(--cap)) / 1.1429));
    grid-template-columns:calc(var(--h) * 1.1429) var(--cap);height:var(--h);width:auto;max-height:none;
    overflow:hidden;border-radius:26px}:is(#qabi,#qabi-portal) .lbx__media{aspect-ratio:auto;height:100%}:is(#qabi,#qabi-portal) .lbx__cap{padding:clamp(22px,2.4vw,36px);overflow-y:auto}:is(#qabi,#qabi-portal) .lbx__where{margin-top:auto}:is(#qabi,#qabi-portal) .lbx__btn{top:calc(50% - 28px);bottom:auto}:is(#qabi,#qabi-portal) .lbx__btn--prev{left:calc(var(--side) / 2 - 28px)}:is(#qabi,#qabi-portal) .lbx__btn--next{left:auto;right:calc(var(--side) / 2 - 28px)}:is(#qabi,#qabi-portal) .lbx__close{top:20px;bottom:auto;left:auto;right:calc(var(--side) / 2 - 24px)}}/* short landscape (phones on their side): tighter caption so the card fits */@media (orientation:landscape) and (min-width:560px) and (max-height:520px){:is(#qabi,#qabi-portal) .lbx{--side:58px;padding:10px var(--side)}:is(#qabi,#qabi-portal) .lbx__slide{--cap:clamp(232px,34vw,300px);
    --h:min(660px, calc(100dvh - 20px), calc((100vw - 2 * var(--side) - var(--cap)) / 1.1429))}:is(#qabi,#qabi-portal) .lbx__cap{padding:16px 18px}:is(#qabi,#qabi-portal) .lbx__feat{height:26px;padding:0 10px;font-size:11.2px}:is(#qabi,#qabi-portal) .lbx__title{font-size:17.28px;margin:12px 0 8px}:is(#qabi,#qabi-portal) .lbx__body{font-size:12.8px;line-height:1.55}:is(#qabi,#qabi-portal) .lbx__where{padding-top:10px;font-size:12.16px}:is(#qabi,#qabi-portal) .lbx__btn{width:44px;height:44px;top:calc(50% - 22px)}:is(#qabi,#qabi-portal) .lbx__btn--prev{left:calc(var(--side) / 2 - 22px)}:is(#qabi,#qabi-portal) .lbx__btn--next{right:calc(var(--side) / 2 - 22px)}:is(#qabi,#qabi-portal) .lbx__close{width:40px;height:40px;top:10px;right:calc(var(--side) / 2 - 20px)}}/* motion (JS only) */:is(#qabi,#qabi-portal) .lbx.is-live.opening .lbx__slide.on{animation:qabi-lbxSheet .5s var(--ease) both}:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on .lbx__media img{animation:qabi-lbxImg .6s var(--ease) both}:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on .lbx__cap>*{animation:qabi-lbxCap .55s var(--ease) both}:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on .lbx__cap>*:nth-child(2){animation-delay:.05s}:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on .lbx__cap>*:nth-child(3){animation-delay:.10s}:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on .lbx__cap>*:nth-child(4){animation-delay:.15s}@keyframes qabi-lbxSheet{from{opacity:0;transform:translateY(18px) scale(.975)}to{opacity:1;transform:none}}@keyframes qabi-lbxImg{from{opacity:0;transform:translateX(calc(var(--dir,1) * 28px)) scale(1.02)}to{opacity:1;transform:none}}@keyframes qabi-lbxCap{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .lbx.is-live.opening .lbx__slide.on,:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on .lbx__media img,:is(#qabi,#qabi-portal) .lbx.is-live .lbx__slide.on .lbx__cap>*{animation:none}}

/* ===== assets/css/appsim.css ===== */
/* ==========================================================================
   QARHAMI FLEET OS — live DOM simulation (mobile, 430 x 932)
   A rebuild of the shipped application, not a screenshot and not an
   illustration. Every measurement below is taken from the v5.5.2 source:
     .input-field      src/index.css      h52 / p16 / #F6F6F6 / r6
     .btn-large        src/index.css      h52 / r26 / #5933e5 / Poppins 16 / 500
     .custom-checkbox  src/App.css        20x20 / 1px #ccc / r4 / #f5f5f5
                                          checked -> #5933e5
     colour scales     tailwind.config.js Electric_Indigo / Mint / Bittersweet /
                                          Princeton_Orange
   Screen order and field order follow the recorded in-app flow.
   ========================================================================== *//* ---------- Shell --------------------------------------------------------- */:is(#qabi,#qabi-portal) .sim{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,4.4vw,68px);align-items:center}@media(max-width:980px){:is(#qabi,#qabi-portal) .sim{grid-template-columns:1fr;gap:34px}:is(#qabi,#qabi-portal) .sim__phoneCol{order:-1}}:is(#qabi,#qabi-portal) .sim__phoneCol{display:flex;flex-direction:column;align-items:center;gap:20px}:is(#qabi,#qabi-portal) .simphone{
  position:relative;width:296px;height:618px;flex:none;
  border-radius:46px;background:#0d1320;padding:10px;
  box-shadow:0 30px 70px rgba(16,24,38,.28),0 8px 20px rgba(16,24,38,.12);
}:is(#qabi,#qabi-portal) .simphone::after{
  content:"";position:absolute;inset:-34px;z-index:-1;border-radius:74px;
  background:radial-gradient(closest-side,rgba(89,51,229,.20),transparent 72%);filter:blur(10px);
}:is(#qabi,#qabi-portal) .simphone__screen{
  position:relative;width:100%;height:100%;border-radius:37px;overflow:hidden;background:#fff;
}:is(#qabi,#qabi-portal) .simphone__notch{
  position:absolute;top:8px;left:50%;transform:translateX(-50%);width:86px;height:19px;
  border-radius:11px;background:#0d1320;z-index:60;
}/* the app is authored at 430x932 and scaled down to the shell */:is(#qabi,#qabi-portal) .qapp{
  position:absolute;top:0;left:0;width:430px;height:932px;
  transform:scale(.6419);transform-origin:top left;   /* 276/430 */
  background:#fff;font-family:"Poppins",-apple-system,sans-serif;color:#101826;
  overflow:hidden;
}/* ---------- Status bar ---------------------------------------------------- */:is(#qabi,#qabi-portal) .qsb{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;
  font-size:14px;font-weight:600;color:#101826;position:relative;z-index:50;background:#fff}:is(#qabi,#qabi-portal) .qsb__r{display:flex;align-items:center;gap:6px}:is(#qabi,#qabi-portal) .qsb__r i{display:block;width:15px;height:11px;border-radius:2px;background:#101826;opacity:.85}:is(#qabi,#qabi-portal) .qsb__bat{width:24px;height:12px;border-radius:3px;border:1.4px solid rgba(16,24,38,.5);position:relative}:is(#qabi,#qabi-portal) .qsb__bat::after{content:"";position:absolute;inset:1.6px;width:62%;border-radius:1px;background:#101826}/* ---------- Screens ------------------------------------------------------- */:is(#qabi,#qabi-portal) .qscreen{
  position:absolute;inset:44px 0 0 0;background:#fff;display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transform:translateX(18px);
  transition:opacity .38s cubic-bezier(.22,.61,.36,1),transform .38s cubic-bezier(.22,.61,.36,1),visibility .38s;
  z-index:2;
}:is(#qabi,#qabi-portal) .qscreen.on{opacity:1;visibility:visible;transform:none;z-index:3}:is(#qabi,#qabi-portal) .qscreen.back{transform:translateX(-18px)}/* ---------- App header ---------------------------------------------------- */:is(#qabi,#qabi-portal) .qhdr{height:64px;flex:none;display:flex;align-items:center;gap:10px;padding:0 18px}:is(#qabi,#qabi-portal) .qhdr__t{font-family:"Nexa","Poppins",sans-serif;font-weight:900;font-size:24px;letter-spacing:-.02em;color:#101826}:is(#qabi,#qabi-portal) .qhdr__sp{flex:1}:is(#qabi,#qabi-portal) .qcirc{
  width:44px;height:44px;border-radius:50%;background:#f4f4f5;
  display:grid;place-items:center;color:#101826;flex:none;transition:.25s cubic-bezier(.22,.61,.36,1);
  position:relative;
}:is(#qabi,#qabi-portal) .qcirc svg{width:20px;height:20px}/* the menu button is an indigo outline circle with three indigo rules */:is(#qabi,#qabi-portal) .qcirc--menu{background:transparent;border:1px solid #5933e5;color:#5933e5}:is(#qabi,#qabi-portal) .qcirc--menu i{display:block;width:18px;height:1.5px;border-radius:1px;background:#5933e5;margin:2.2px 0}:is(#qabi,#qabi-portal) .qcirc--in{background:#5933e5;color:#fff}:is(#qabi,#qabi-portal) .qcirc--av{background:#efedfb;color:#5933e5;overflow:hidden;padding:0}:is(#qabi,#qabi-portal) .qcirc--av svg{width:22px;height:22px}:is(#qabi,#qabi-portal) .qcirc .pip{position:absolute;top:9px;right:11px;width:7px;height:7px;border-radius:50%;background:#5933e5}:is(#qabi,#qabi-portal) .qcirc.tap{transform:scale(.88);background:rgba(89,51,229,.16)}/* ---------- Map ----------------------------------------------------------- */:is(#qabi,#qabi-portal) .qmap{position:relative;height:238px;margin:2px 16px 0;border-radius:14px;overflow:hidden;background:#EDEEF0;flex:none}:is(#qabi,#qabi-portal) .qmap .basemap{position:absolute;inset:0;width:100%;height:100%}:is(#qabi,#qabi-portal) .qmap__tl{position:absolute;top:13px;left:13px;width:42px;height:42px;border-radius:13px;background:#5933e5;
  display:grid;place-items:center;color:#fff;box-shadow:0 4px 14px rgba(89,51,229,.30)}:is(#qabi,#qabi-portal) .qmap__tl svg{width:19px;height:19px}/* white pill: satellite toggle + indigo layers square, exactly as shipped */:is(#qabi,#qabi-portal) .qmap__tr{position:absolute;top:13px;right:13px;display:flex;align-items:center;gap:6px;
  background:#fff;border-radius:22px;padding:4px;box-shadow:0 3px 12px rgba(16,24,38,.16)}:is(#qabi,#qabi-portal) .qmap__tr .b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#101826}:is(#qabi,#qabi-portal) .qmap__tr .b svg{width:18px;height:18px}:is(#qabi,#qabi-portal) .qmap__tr .b--on{background:#5933e5;color:#fff;border-radius:12px}/* ---------- Vehicle marker -------------------------------------------------
   Rebuilt from the V4 mobile export: an indigo pin, a lavender disc, the
   purple sedan glyph, and four status satellites sitting on the pin ring.
   Every glyph is the shipped sprite symbol, unmodified.                      */:is(#qabi,#qabi-portal) .qpin{position:absolute;transform:translate(-50%,-100%);width:0;height:0}:is(#qabi,#qabi-portal) .qpin__wrap{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:76px;height:88px}:is(#qabi,#qabi-portal) .qpin__shape{position:absolute;left:8px;top:0;width:60px;height:70px}:is(#qabi,#qabi-portal) .qpin__car{position:absolute;left:50%;top:29px;transform:translate(-50%,-50%);width:36px;color:#5933e5}:is(#qabi,#qabi-portal) .qpin__car svg{width:36px;height:auto}:is(#qabi,#qabi-portal) .qsat{
  position:absolute;width:25px;height:25px;border-radius:50%;background:#fff;border:2px solid;
  display:grid;place-items:center;box-shadow:0 2px 6px rgba(16,24,38,.20);
}:is(#qabi,#qabi-portal) .qsat svg{width:13px;height:13px}:is(#qabi,#qabi-portal) .qsat--or{border-color:#ff9600;color:#b56b00}:is(#qabi,#qabi-portal) .qsat--mt{border-color:#0dbc93;color:#098568}:is(#qabi,#qabi-portal) .qsat--bs{border-color:#ff575a;color:#b53e40}:is(#qabi,#qabi-portal) .qsat--tl{left:0;top:8px}:is(#qabi,#qabi-portal) .qsat--tr{right:0;top:8px}:is(#qabi,#qabi-portal) .qsat--bl{left:5px;top:42px}:is(#qabi,#qabi-portal) .qsat--br{right:5px;top:42px}:is(#qabi,#qabi-portal) .qpin__speed{
  position:absolute;left:50%;top:-12px;transform:translateX(-50%);
  background:#fff;border-radius:6px;padding:2px 8px;font-size:10px;font-weight:600;color:#098568;
  box-shadow:0 2px 7px rgba(16,24,38,.20);white-space:nowrap;
}:is(#qabi,#qabi-portal) .qpin--sm .qpin__wrap{width:54px;height:62px;transform:translateX(-50%) scale(.72);transform-origin:bottom center}/* the address callout the app shows under a selected vehicle */:is(#qabi,#qabi-portal) .qcallout{
  position:absolute;transform:translate(-50%,0);background:#fff;border-radius:8px;padding:6px 9px;
  box-shadow:0 3px 12px rgba(16,24,38,.20);font-size:8.5px;line-height:1.35;color:#243242;max-width:118px;
}:is(#qabi,#qabi-portal) .qcallout b{display:block;color:#5933e5;font-weight:600;margin-bottom:2px}:is(#qabi,#qabi-portal) .qmap__attr{position:absolute;left:8px;bottom:6px;font-size:8px;color:#8b93a0;background:rgba(255,255,255,.7);
  border-radius:3px;padding:1px 5px}/* ---------- Search + filter ----------------------------------------------- */:is(#qabi,#qabi-portal) .qsearchrow{display:flex;align-items:center;gap:10px;padding:14px 16px 10px;flex:none}:is(#qabi,#qabi-portal) .qsearch{flex:1;height:44px;border-radius:22px;background:#F6F6F6;display:flex;align-items:center;
  padding:0 16px;gap:10px;font-size:13px;color:#b9bdc4}:is(#qabi,#qabi-portal) .qsearch svg{width:16px;height:16px;margin-left:auto;color:#8b93a0;flex:none}:is(#qabi,#qabi-portal) .qfilter{width:44px;height:44px;border-radius:22px;border:1px solid #5933e5;display:grid;place-items:center;
  color:#5933e5;flex:none}:is(#qabi,#qabi-portal) .qfilter svg{width:17px;height:17px}/* ---------- Vehicle card (mirrors VehicleCard.jsx) ------------------------ */:is(#qabi,#qabi-portal) .qcards{flex:1;min-height:0;overflow:hidden;padding:0 16px 16px;display:flex;flex-direction:column;gap:12px}:is(#qabi,#qabi-portal) .qvc{background:#fff;border:1px solid rgba(16,24,38,.10);border-radius:12px;padding:12px 13px;flex:none;
  box-shadow:0 1px 3px rgba(16,24,38,.05)}:is(#qabi,#qabi-portal) .qvc.sel{border:1.5px solid #574596;box-shadow:0 2px 10px rgba(87,69,150,.13)}:is(#qabi,#qabi-portal) .qvc__top{display:flex;gap:12px}:is(#qabi,#qabi-portal) .qvc__id{flex:1;min-width:0}:is(#qabi,#qabi-portal) .qvc__name{font-family:"Nexa","Poppins",sans-serif;font-weight:900;font-size:15px;color:rgba(0,0,0,.9);
  letter-spacing:-.01em;display:flex;align-items:center;gap:5px}:is(#qabi,#qabi-portal) .qvc__name svg{width:11px;height:11px;color:#8b93a0;flex:none}:is(#qabi,#qabi-portal) .qvc__st{display:flex;align-items:center;gap:5px;font-size:11px;color:rgba(0,0,0,.66);margin-top:3px}:is(#qabi,#qabi-portal) .qvc__st i{width:7px;height:7px;border-radius:50%;background:#0dbc93;flex:none}:is(#qabi,#qabi-portal) .qvc__thumb{width:76px;flex:none;text-align:center}:is(#qabi,#qabi-portal) .qvc__thumb .im{width:76px;height:52px;border-radius:7px;background:#eef0f2;overflow:hidden;position:relative}:is(#qabi,#qabi-portal) .qvc__thumb .im img{width:100%;height:100%;object-fit:cover}:is(#qabi,#qabi-portal) .qvc__thumb .im i{position:absolute;top:3px;right:3px;width:13px;height:13px;border-radius:50%;
  background:rgba(255,255,255,.92);display:grid;place-items:center;font-size:8px;color:#5933e5;font-style:normal;font-weight:700}:is(#qabi,#qabi-portal) .qvc__plate{font-size:10px;color:rgba(0,0,0,.62);margin-top:3px;letter-spacing:.02em}:is(#qabi,#qabi-portal) .qvc__icons{display:flex;gap:7px;margin-top:9px}:is(#qabi,#qabi-portal) .qvc__icons span{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;border:1px solid}:is(#qabi,#qabi-portal) .qvc__icons span svg{width:13px;height:13px}:is(#qabi,#qabi-portal) .qi--bs{border-color:#b53e40;background:#ffeeef;color:#b53e40}:is(#qabi,#qabi-portal) .qi--or{border-color:#b56b00;background:#fff5e6;color:#b56b00}:is(#qabi,#qabi-portal) .qi--mt{border-color:#098568;background:#e7f8f4;color:#098568}:is(#qabi,#qabi-portal) .qvc__mtag{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:7px;
  background:#fff5e6;border:1px solid #ffcf8a;color:#8c5300;font-size:10px;font-weight:500;margin-top:9px}:is(#qabi,#qabi-portal) .qvc__mtag svg{width:11px;height:11px}:is(#qabi,#qabi-portal) .qvc__acts{display:flex;gap:7px;margin-top:10px}:is(#qabi,#qabi-portal) .qvc__acts b{flex:1;height:38px;border-radius:11px;border:1px solid;display:grid;place-items:center;background:#fff;
  position:relative;overflow:hidden}:is(#qabi,#qabi-portal) .qvc__acts b svg{width:18px;height:18px;position:relative;z-index:2}:is(#qabi,#qabi-portal) .qa--lock{border-color:#0dbc93;color:#098568}:is(#qabi,#qabi-portal) .qa--key{border-color:#ff9600;color:#b56b00}:is(#qabi,#qabi-portal) .qa--eng{border-color:#5933e5;color:#5933e5}:is(#qabi,#qabi-portal) .qa--kill{border-color:#ff575a;color:#b53e40}:is(#qabi,#qabi-portal) .qa--horn{border-color:#ff9600;color:#b56b00}:is(#qabi,#qabi-portal) .qvc__tabs{display:flex;gap:6px;margin-top:10px;padding-top:9px;border-top:1px solid rgba(16,24,38,.07)}:is(#qabi,#qabi-portal) .qvc__tabs b{flex:1;height:26px;border-radius:7px;background:#f7f5ff;color:#512ed0;font-size:9.5px;font-weight:500;
  display:flex;align-items:center;justify-content:center;gap:4px}:is(#qabi,#qabi-portal) .qvc__tabs b svg{width:11px;height:11px}/* ---------- Side drawer --------------------------------------------------- */:is(#qabi,#qabi-portal) .qdrawer{
  position:absolute;inset:0;z-index:40;visibility:hidden;pointer-events:none;
}:is(#qabi,#qabi-portal) .qdrawer.on{visibility:visible;pointer-events:auto}:is(#qabi,#qabi-portal) .qdrawer__scrim{position:absolute;inset:0;background:rgba(16,24,38,.32);opacity:0;transition:opacity .38s cubic-bezier(.22,.61,.36,1)}:is(#qabi,#qabi-portal) .qdrawer.on .qdrawer__scrim{opacity:1}:is(#qabi,#qabi-portal) .qdrawer__panel{
  position:absolute;inset:0 auto 0 0;width:74%;background:#3f24a3;
  background:linear-gradient(170deg,#4a2ac0 0%,#3b2199 62%,#33188a 100%);
  transform:translateX(-100%);transition:transform .42s cubic-bezier(.22,.61,.36,1);
  display:flex;flex-direction:column;padding:20px 0 24px;
}:is(#qabi,#qabi-portal) .qdrawer.on .qdrawer__panel{transform:none}:is(#qabi,#qabi-portal) .qdrawer__brand{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 0 22px}:is(#qabi,#qabi-portal) .qdrawer__brand img{width:42px;height:auto}:is(#qabi,#qabi-portal) .qdrawer__brand b{font-size:11px;font-weight:400;color:rgba(255,255,255,.7)}:is(#qabi,#qabi-portal) .qnav{display:flex;flex-direction:column;gap:2px;padding:0 14px}:is(#qabi,#qabi-portal) .qnav a{
  display:flex;align-items:center;gap:13px;height:44px;padding:0 14px;border-radius:10px;
  font-size:14px;font-weight:400;color:rgba(255,255,255,.88);transition:.28s cubic-bezier(.22,.61,.36,1);
}:is(#qabi,#qabi-portal) .qnav a svg{width:17px;height:17px;flex:none;opacity:.92}:is(#qabi,#qabi-portal) .qnav a.on{background:rgba(255,255,255,.16);color:#fff;font-weight:500}:is(#qabi,#qabi-portal) .qnav a.tap{background:rgba(255,255,255,.28)}:is(#qabi,#qabi-portal) .qdrawer__ft{margin-top:auto;padding:0 28px;display:flex;flex-direction:column;gap:18px}:is(#qabi,#qabi-portal) .qdrawer__ft a{display:flex;align-items:center;gap:12px;font-size:13.5px;color:rgba(255,255,255,.88)}:is(#qabi,#qabi-portal) .qdrawer__ft svg{width:16px;height:16px;flex:none}/* ---------- Vehicles table ------------------------------------------------ */:is(#qabi,#qabi-portal) .qtable{margin:6px 16px 0;border:1px solid rgba(16,24,38,.10);border-radius:12px;overflow:hidden;background:#fff;flex:none}:is(#qabi,#qabi-portal) .qtable__hd,:is(#qabi,#qabi-portal) .qtable__row{display:grid;grid-template-columns:1fr 104px;align-items:center;gap:10px;padding:11px 14px}:is(#qabi,#qabi-portal) .qtable__hd{background:#fff;border-bottom:1px solid rgba(16,24,38,.10)}:is(#qabi,#qabi-portal) .qtable__hd b{font-size:12.5px;font-weight:600;color:#101826}:is(#qabi,#qabi-portal) .qtable__row{border-bottom:1px solid rgba(16,24,38,.06);transition:background .3s cubic-bezier(.22,.61,.36,1)}:is(#qabi,#qabi-portal) .qtable__row:last-child{border-bottom:0}:is(#qabi,#qabi-portal) .qtable__row.hot{background:#f7f5ff}:is(#qabi,#qabi-portal) .qtable__row span{font-size:12.5px;color:#101826;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:is(#qabi,#qabi-portal) .qview{height:26px;border-radius:6px;background:#5933e5;color:#fff;font-size:10.5px;font-weight:500;
  display:grid;place-items:center;transition:.25s cubic-bezier(.22,.61,.36,1)}:is(#qabi,#qabi-portal) .qview.tap{transform:scale(.93);background:#3f24a3}/* the per-vehicle sharing state is page chrome, NOT app UI — it is drawn
   outside the phone in .fleetgrid, never inside .qapp *//* ---------- Vehicle detail ------------------------------------------------ */:is(#qabi,#qabi-portal) .qback{padding:12px 18px 4px;flex:none}:is(#qabi,#qabi-portal) .qcontact{margin:0 16px;background:#fff5e6;border:1px solid #ffdeb0;border-radius:8px;padding:7px 12px;
  font-size:10.5px;color:#8c5300;text-align:center;flex:none}:is(#qabi,#qabi-portal) .qhero{display:flex;flex-direction:column;align-items:center;gap:14px;padding:20px 0 6px;flex:none}:is(#qabi,#qabi-portal) .qhero__ph{width:124px;height:124px;border-radius:50%;overflow:hidden;background:#eef0f2;border:1px solid rgba(16,24,38,.08)}:is(#qabi,#qabi-portal) .qhero__ph img{width:100%;height:100%;object-fit:cover}:is(#qabi,#qabi-portal) .qhero__stats{display:flex;gap:26px}:is(#qabi,#qabi-portal) .qstat{display:flex;flex-direction:column;align-items:center;gap:6px}:is(#qabi,#qabi-portal) .qstat__ic{width:38px;height:38px;border-radius:50%;border:2px solid;display:grid;place-items:center}:is(#qabi,#qabi-portal) .qstat__ic svg{width:18px;height:18px}:is(#qabi,#qabi-portal) .qstat--mt .qstat__ic{border-color:#0dbc93;color:#098568}:is(#qabi,#qabi-portal) .qstat--in .qstat__ic{border-color:#5933e5;color:#5933e5}:is(#qabi,#qabi-portal) .qstat b{font-size:11.5px;font-weight:500;color:#101826}:is(#qabi,#qabi-portal) .qacc{margin:16px 16px 0;display:flex;flex-direction:column;gap:10px;flex:none}:is(#qabi,#qabi-portal) .qaccrow{
  border:1px solid rgba(16,24,38,.10);border-radius:9px;background:#fff;overflow:hidden;
}:is(#qabi,#qabi-portal) .qaccrow__hd{display:flex;align-items:center;gap:10px;padding:14px 14px;font-size:13px;color:#101826}:is(#qabi,#qabi-portal) .qaccrow__hd .sp{flex:1}:is(#qabi,#qabi-portal) .qaccrow__hd .ed{font-size:12px;color:#5933e5;font-weight:500}:is(#qabi,#qabi-portal) .qaccrow__hd svg{width:14px;height:14px;color:#5b6472;flex:none;transition:transform .35s cubic-bezier(.22,.61,.36,1)}:is(#qabi,#qabi-portal) .qaccrow.open .qaccrow__hd svg.chev{transform:rotate(180deg)}:is(#qabi,#qabi-portal) .qaccrow__bd{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.22,.61,.36,1)}:is(#qabi,#qabi-portal) .qaccrow.open .qaccrow__bd{max-height:340px}:is(#qabi,#qabi-portal) .qdl{padding:0 14px 14px;display:flex;flex-direction:column;gap:9px}:is(#qabi,#qabi-portal) .qdl div{display:flex;align-items:center;gap:10px;font-size:11.5px}:is(#qabi,#qabi-portal) .qdl dt{color:#101826;font-weight:500;margin:0}:is(#qabi,#qabi-portal) .qdl dd{margin:0 0 0 auto;color:rgba(16,24,38,.66);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}/* ---------- Edit form ----------------------------------------------------- */:is(#qabi,#qabi-portal) .qform{flex:1;min-height:0;overflow:hidden;position:relative}:is(#qabi,#qabi-portal) .qform__scroll{position:absolute;inset:0;padding:6px 16px 22px;display:flex;flex-direction:column;gap:14px;
  transition:transform .8s cubic-bezier(.22,.61,.36,1)}:is(#qabi,#qabi-portal) .qfield label{display:block;font-size:12.5px;font-weight:500;color:#101826;margin-bottom:7px}:is(#qabi,#qabi-portal) .qinput{width:100%;height:46px;padding:0 14px;display:flex;align-items:center;background:#F6F6F6;border-radius:6px;
  border:1px solid transparent;font-size:13px;color:rgba(16,24,38,.78);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:is(#qabi,#qabi-portal) .qchk{display:flex;align-items:center;gap:11px;padding:4px 0;position:relative;border-radius:8px}:is(#qabi,#qabi-portal) .qchk__b{
  width:20px;height:20px;border-radius:4px;border:1px solid #ccc;background:#f5f5f5;flex:none;
  display:grid;place-items:center;color:#fff;transition:background .3s cubic-bezier(.22,.61,.36,1),border-color .3s;
}:is(#qabi,#qabi-portal) .qchk__b svg{width:12px;height:12px;opacity:0;transform:scale(.4);transition:opacity .26s ease .06s,transform .3s cubic-bezier(.34,1.56,.64,1) .06s}:is(#qabi,#qabi-portal) .qchk.on .qchk__b{background:#5933e5;border-color:#5933e5}:is(#qabi,#qabi-portal) .qchk.on .qchk__b svg{opacity:1;transform:none}:is(#qabi,#qabi-portal) .qchk span{font-size:13px;color:#101826}:is(#qabi,#qabi-portal) .qchk--focus{box-shadow:0 0 0 3px rgba(89,51,229,.16);background:rgba(89,51,229,.05);
  margin:0 -8px;padding:4px 8px}:is(#qabi,#qabi-portal) .qsave{height:48px;border-radius:24px;background:#5933e5;color:#fff;font-size:14px;font-weight:500;
  display:grid;place-items:center;margin-top:6px;transition:.25s cubic-bezier(.22,.61,.36,1)}:is(#qabi,#qabi-portal) .qsave.tap{transform:scale(.97);background:#3f24a3}/* ---------- Toast --------------------------------------------------------- */:is(#qabi,#qabi-portal) .qtoast{
  position:absolute;left:16px;right:16px;bottom:22px;z-index:55;
  background:#101826;color:#fff;border-radius:12px;padding:13px 15px;display:flex;align-items:center;gap:11px;
  font-size:12.5px;box-shadow:0 12px 30px rgba(16,24,38,.32);
  opacity:0;transform:translateY(14px);transition:.42s cubic-bezier(.22,.61,.36,1);
}:is(#qabi,#qabi-portal) .qtoast.on{opacity:1;transform:none}:is(#qabi,#qabi-portal) .qtoast .tick{width:22px;height:22px;border-radius:50%;background:#0dbc93;display:grid;place-items:center;flex:none}:is(#qabi,#qabi-portal) .qtoast .tick svg{width:13px;height:13px;color:#fff}/* the tap ring the sim draws where a finger would land */:is(#qabi,#qabi-portal) .qtap{
  position:absolute;width:40px;height:40px;border-radius:50%;z-index:58;pointer-events:none;
  border:2px solid rgba(89,51,229,.8);background:rgba(89,51,229,.16);
  transform:translate(-50%,-50%) scale(.4);opacity:0;
}:is(#qabi,#qabi-portal) .qtap.go{animation:qabi-qtapgo .62s cubic-bezier(.22,.61,.36,1)}@keyframes qabi-qtapgo{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}
  28%{opacity:1;transform:translate(-50%,-50%) scale(.82)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.5)}
}@media(prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .qtap.go{animation:none}}/* ==========================================================================
   The stage — one bounded product panel holding either the live rebuild or
   the screen recording, with the step rail beside it. Page chrome only:
   nothing here claims to be a product screen.
   ========================================================================== */:is(#qabi,#qabi-portal) .stage{
  position:relative;border-radius:var(--r-2xl);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow-2);
  background:
    radial-gradient(760px 420px at 22% 0%, rgba(89,51,229,.10), transparent 64%),
    radial-gradient(620px 420px at 96% 96%, rgba(13,188,147,.09), transparent 62%),
    linear-gradient(180deg,#fdfcff,#f8f6ff);
}:is(#qabi,#qabi-portal) .stage__tabs{
  display:flex;align-items:center;gap:6px;padding:14px 18px;
  border-bottom:1px solid var(--line-soft);background:rgba(255,255,255,.72);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);flex-wrap:wrap;
}:is(#qabi,#qabi-portal) .stab{
  display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:19px;
  font-size:13.44px;font-weight:500;color:var(--ink-64);transition:.3s var(--ease);border:1px solid transparent;
}:is(#qabi,#qabi-portal) .stab svg{width:15px;height:15px}:is(#qabi,#qabi-portal) .stab:hover{color:var(--in-600);background:#fff}:is(#qabi,#qabi-portal) .stab.on{background:var(--in-500);color:#fff;box-shadow:0 6px 16px rgba(89,51,229,.22)}:is(#qabi,#qabi-portal) .stage__live{
  margin-left:auto;display:inline-flex;align-items:center;gap:8px;
  font-size:11.52px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--mt-700);
}:is(#qabi,#qabi-portal) .stage__live i{width:7px;height:7px;border-radius:50%;background:var(--mt-500);
  box-shadow:0 0 0 0 rgba(13,188,147,.5);animation:qabi-livedot 2.2s infinite}@keyframes qabi-livedot{70%{box-shadow:0 0 0 7px rgba(13,188,147,0)}100%{box-shadow:0 0 0 0 rgba(13,188,147,0)}}@media(prefers-reduced-motion:reduce){:is(#qabi,#qabi-portal) .stage__live i{animation:none}}:is(#qabi,#qabi-portal) .stage__body{
  display:grid;grid-template-columns:minmax(0,472px) minmax(0,1fr);
  gap:clamp(20px,2.6vw,44px);padding:clamp(26px,3.4vw,46px);align-items:center;
}@media(max-width:940px){:is(#qabi,#qabi-portal) .stage__body{grid-template-columns:1fr;gap:28px}:is(#qabi,#qabi-portal) .stage__deviceCol{order:-1}}/* the device well */:is(#qabi,#qabi-portal) .stage__deviceCol{position:relative;display:flex;justify-content:flex-start}@media(max-width:1100px){:is(#qabi,#qabi-portal) .stage__deviceCol{justify-content:center}}:is(#qabi,#qabi-portal) .devwell{position:relative;height:626px;display:grid;align-items:center;justify-items:start;width:100%}@media(max-width:1100px){:is(#qabi,#qabi-portal) .devwell{justify-items:center}}@media(max-width:520px){:is(#qabi,#qabi-portal) .devwell{height:auto;padding:4px 0}}:is(#qabi,#qabi-portal) .devpane{position:absolute;inset:0;display:grid;align-items:center;justify-items:inherit;opacity:0;visibility:hidden;
  transition:opacity .4s var(--ease),visibility .4s}:is(#qabi,#qabi-portal) .devpane.on{opacity:1;visibility:visible;position:relative}:is(#qabi,#qabi-portal) .simphone{
  position:relative;width:296px;height:618px;flex:none;
  border-radius:46px;background:#0d1320;padding:10px;
  box-shadow:0 30px 70px rgba(16,24,38,.26),0 8px 20px rgba(16,24,38,.10);
}:is(#qabi,#qabi-portal) .simphone::after{
  content:"";position:absolute;inset:-34px;z-index:-1;border-radius:74px;
  background:radial-gradient(closest-side,rgba(89,51,229,.20),transparent 72%);filter:blur(10px);
}:is(#qabi,#qabi-portal) .simphone__screen{position:relative;width:100%;height:100%;border-radius:37px;overflow:hidden;background:#fff}:is(#qabi,#qabi-portal) .simphone__notch{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:86px;height:19px;
  border-radius:11px;background:#0d1320;z-index:60}@media(max-width:430px){:is(#qabi,#qabi-portal) .simphone{width:272px;height:570px;border-radius:42px}:is(#qabi,#qabi-portal) .simphone__screen{border-radius:34px}:is(#qabi,#qabi-portal) .qapp{transform:scale(.5860)}/* 252 / 430 */}@media(max-width:360px){:is(#qabi,#qabi-portal) .simphone{width:252px;height:530px;border-radius:38px}:is(#qabi,#qabi-portal) .simphone__screen{border-radius:31px}:is(#qabi,#qabi-portal) .qapp{transform:scale(.5395)}/* 232 / 430 */}/* the recording already ships inside its own device mockup — it is shown bare */:is(#qabi,#qabi-portal) .clip{position:relative;width:min(344px,100%);justify-self:start;border-radius:22px;overflow:hidden;background:#fff;
  box-shadow:0 20px 50px rgba(16,24,38,.14)}:is(#qabi,#qabi-portal) .clip video{width:100%;height:auto;display:block;background:#fff}:is(#qabi,#qabi-portal) .clip__tag{
  position:absolute;left:50%;transform:translateX(-50%);bottom:14px;z-index:2;display:inline-flex;align-items:center;gap:7px;
  height:30px;padding:0 13px;border-radius:15px;background:rgba(16,24,38,.82);color:#fff;
  font-size:11.2px;font-weight:500;backdrop-filter:blur(6px);
}:is(#qabi,#qabi-portal) .clip__tag i{width:7px;height:7px;border-radius:50%;background:var(--bs-500)}/* fleet counter — docks against the device rather than floating below it */:is(#qabi,#qabi-portal) .fleetgrid{
  position:absolute;left:276px;bottom:74px;width:212px;z-index:5;
  border:1px solid var(--line);border-radius:var(--r-lg);background:rgba(255,255,255,.95);
  padding:13px 14px;box-shadow:var(--shadow-2);backdrop-filter:blur(12px);
}@media(max-width:1100px){:is(#qabi,#qabi-portal) .fleetgrid{position:relative;left:auto;bottom:auto;width:100%;max-width:296px;margin:18px auto 0}}:is(#qabi,#qabi-portal) .fleetgrid__hd{display:flex;align-items:center;gap:7px;padding-bottom:9px;border-bottom:1px solid var(--line-soft);flex-wrap:nowrap}:is(#qabi,#qabi-portal) .fleetgrid__hd .t{font-size:10.08px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-48);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:is(#qabi,#qabi-portal) .fleetgrid__hd .c{margin-left:auto;font-size:11.52px;font-weight:600;color:var(--in-600);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}:is(#qabi,#qabi-portal) .fleetgrid__list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:3px}:is(#qabi,#qabi-portal) .fleetgrid__list li{display:flex;align-items:center;gap:8px;font-size:10.88px;line-height:1.5;color:var(--ink-64)}:is(#qabi,#qabi-portal) .fleetgrid__list li .dotb{
  width:14px;height:14px;border-radius:4px;flex:none;border:1px solid var(--ink-28);background:#fff;
  display:grid;place-items:center;color:#fff;transition:.4s var(--ease);
}:is(#qabi,#qabi-portal) .fleetgrid__list li .dotb svg{width:8px;height:8px;opacity:0;transform:scale(.4);transition:.3s cubic-bezier(.34,1.56,.64,1)}:is(#qabi,#qabi-portal) .fleetgrid__list li.shared .dotb{background:var(--in-500);border-color:var(--in-500)}:is(#qabi,#qabi-portal) .fleetgrid__list li.shared .dotb svg{opacity:1;transform:none}:is(#qabi,#qabi-portal) .fleetgrid__list li.shared{color:var(--gun);font-weight:500}:is(#qabi,#qabi-portal) .fleetgrid__list li.now{color:var(--in-600);font-weight:500}:is(#qabi,#qabi-portal) .fleetgrid__ft{margin-top:10px;padding-top:9px;border-top:1px solid var(--line-soft);
  font-size:9.92px;color:var(--ink-48);line-height:1.45}/* ---------- step rail ----------------------------------------------------- */:is(#qabi,#qabi-portal) .simsteps{display:flex;flex-direction:column;gap:3px}:is(#qabi,#qabi-portal) .simstep{
  display:flex;gap:14px;padding:13px 15px;border-radius:14px;cursor:pointer;align-items:flex-start;
  transition:.4s var(--ease);border:1px solid transparent;text-align:left;width:100%;background:transparent;
}:is(#qabi,#qabi-portal) .simstep:hover{background:rgba(255,255,255,.7)}:is(#qabi,#qabi-portal) .simstep.on{background:#fff;border-color:var(--in-100);box-shadow:var(--shadow-1)}:is(#qabi,#qabi-portal) .simstep__n{
  width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:#fff;border:1px solid var(--line);color:var(--ink-48);
  font-family:"Nexa",sans-serif;font-weight:900;font-size:11.52px;transition:.4s var(--ease);
}:is(#qabi,#qabi-portal) .simstep.on .simstep__n{background:var(--in-500);border-color:var(--in-500);color:#fff}:is(#qabi,#qabi-portal) .simstep.done .simstep__n{background:var(--mt-500);border-color:var(--mt-500);color:#fff}:is(#qabi,#qabi-portal) .simstep__t{display:block;font-size:14.56px;font-weight:500;color:var(--gun);line-height:1.4}:is(#qabi,#qabi-portal) .simstep__d{display:block;font-size:12.8px;color:var(--ink-64);font-weight:300;line-height:1.55;margin-top:3px}:is(#qabi,#qabi-portal) .simstep.on .simstep__d{color:var(--ink-80)}:is(#qabi,#qabi-portal) .simbar{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap;padding:0 15px}:is(#qabi,#qabi-portal) .simbtn{
  display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:20px;
  border:1px solid var(--line);background:#fff;font-size:13.44px;font-weight:500;color:var(--gun);
  transition:.3s var(--ease);box-shadow:var(--shadow-1);
}:is(#qabi,#qabi-portal) .simbtn:hover{border-color:var(--in-200);color:var(--in-600)}:is(#qabi,#qabi-portal) .simbtn svg{width:15px;height:15px}:is(#qabi,#qabi-portal) .simbtn--go{background:var(--in-500);border-color:var(--in-500);color:#fff;box-shadow:var(--shadow-in)}:is(#qabi,#qabi-portal) .simbtn--go:hover{background:var(--in-600);color:#fff;border-color:var(--in-600)}:is(#qabi,#qabi-portal) .simprog{flex:1;min-width:110px;height:4px;border-radius:2px;background:var(--line);overflow:hidden}:is(#qabi,#qabi-portal) .simprog i{display:block;height:100%;width:0;border-radius:2px;
  background:linear-gradient(90deg,var(--in-500),var(--mt-500));transition:width .3s linear}:is(#qabi,#qabi-portal) .simcap{font-size:11.52px;color:var(--ink-48);line-height:1.55;padding:0 15px;margin-top:16px}/* back-arrow reuses the forward arrow symbol, mirrored */:is(#qabi,#qabi-portal) .qapp svg.flipx{transform:scaleX(-1)}@media(max-width:1100px){:is(#qabi,#qabi-portal) .clip{justify-self:center}}/* the stage keeps its live badge without the tab bar */:is(#qabi,#qabi-portal) .stage__live--float{position:absolute;top:18px;right:22px;z-index:6}:is(#qabi,#qabi-portal) .stage__body{padding-top:clamp(40px,4.5vw,56px)}

/* --------------------------------------------------------------------------
   3 · WordPress fit
   -------------------------------------------------------------------------- */
/* the gallery portal renders no box of its own; it only carries the scope */
div#qabi-portal{display:contents!important}
/* the embed layout sits under the theme's header: no announcement-bar offset,
   and the hero no longer needs to clear the page's own fixed header */
#qabi.qabi--embed{padding-top:0}
#qabi.qabi--embed .phero{padding-top:clamp(30px,4.5vw,64px)}
/* logged in: keep the fixed announcement bar and header below the admin bar */
@media screen and (min-width:601px){
  body.admin-bar #qabi .annbar{top:46px}
  body.admin-bar #qabi .hdr--offset{top:calc(var(--annh,38px) + 46px)}
}
@media screen and (min-width:783px){
  body.admin-bar #qabi .annbar{top:32px}
  body.admin-bar #qabi .hdr--offset{top:calc(var(--annh,38px) + 32px)}
}
/* the Elementor container and widget that hold the page run edge to edge,
   whatever the container's width, padding and gap settings are */
.elementor-widget-html:has(#qabi){width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
.elementor-widget-html:has(#qabi)>.elementor-widget-container{margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
.e-con:has(#qabi),.e-con:has(#qabi)>.e-con-inner{max-width:none!important;width:100%!important;margin:0!important;padding:0!important;gap:0!important;overflow:visible!important}
.e-con:has(#qabi){--content-width:100%;--container-max-width:100%;--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;--gap:0px;--row-gap:0px;--column-gap:0px}
.elementor-section:has(#qabi),.elementor-section:has(#qabi)>.elementor-container,
.elementor-column:has(#qabi)>.elementor-widget-wrap{max-width:none!important;padding:0!important;overflow:visible!important}
/* a canvas page runs edge to edge even if the theme leaves the default body margin */
body:has(#qabi.qabi--canvas){margin:0}
/* smooth in-page links, as on the standalone page */
html:has(#qabi){scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html:has(#qabi){scroll-behavior:auto}}