/* RABEX desktop layer. Loaded after style.css.
   Theme tokens: new rules use these semantic variables only, so a light-glass
   conversion later is a token swap for everything in this file. (style.css still
   has older hard-coded colours; convert those in a separate pass.) */
:root{
  --surface:rgba(255,255,255,.045);--surface-hi:rgba(255,255,255,.09);
  --glass-bg:rgba(8,14,32,.62);--glass-blur:saturate(160%) blur(18px);
  --edge:rgba(255,255,255,.10);--edge-hi:rgba(255,255,255,.22);
  --text:var(--fg);--text-mute:var(--mute);--accent:var(--b);
  --shadow-card:0 30px 70px -30px rgba(0,0,0,.85);
  --r-card:24px;--r-pill:99px;
  --wrap-desktop:1280px;
}
.dlgrid{display:grid;gap:28px;align-items:start;grid-template-columns:1fr}
.dlside{display:flex;flex-direction:column;gap:18px;padding:26px;border-radius:var(--r-card);background:var(--surface);border:1px solid var(--edge);text-align:left;box-shadow:var(--shadow-card)}
.qrbox{display:flex;gap:16px;align-items:center}
.qrbox img{flex:none;width:132px;height:132px;padding:8px;border-radius:16px;background:#fff}
.qrbox p{font-size:14px;line-height:1.5;color:var(--text-mute)}.qrbox b{color:var(--text)}
.steps{list-style:none;counter-reset:s;display:grid;gap:10px;margin:0;padding:0;font-size:15px;line-height:1.45;color:var(--text-mute)}
.steps li{counter-increment:s;display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start}
.steps li:before{content:counter(s);flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:12px;font-weight:700;color:var(--text);background:var(--surface-hi);border:1px solid var(--edge)}
.steps b{color:var(--text)}
.copyhash{align-self:flex-start;font:600 13px/1 inherit;font-family:inherit;color:var(--text);padding:10px 16px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--edge);cursor:pointer;transition:background .24s var(--ease),border-color .24s var(--ease),transform .24s var(--ease)}
.copyhash:hover{background:var(--surface-hi);border-color:var(--edge-hi)}.copyhash:active{transform:scale(.96)}
.copyhash:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.nav{transition:background .3s var(--ease),border-color .3s var(--ease),backdrop-filter .3s var(--ease)}
@media(min-width:1100px){
  .nav{position:fixed;max-width:none;padding:16px max(32px,calc((100vw - var(--wrap-desktop))/2 + 32px));border-bottom:1px solid transparent}
  .nav.stuck{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-bottom-color:var(--edge)}
  .nav-links{gap:30px!important}.nav-links a{font-size:15px!important;padding:6px 0}
  .nav-links a:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--accent),var(--o));transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
  .nav-links a:hover:after{transform:scaleX(1)}
  .nav-cta{padding:11px 22px;font-size:14px}
  .hero{max-width:var(--wrap-desktop);padding:150px 40px 110px;gap:64px}
  .hero-copy{min-width:0;flex:1 1 0}.hero .stage{flex:none}.hero h1{font-size:clamp(56px,5vw,88px)}
  .hero .sub{max-width:30ch;font-size:clamp(20px,1.5vw,24px)}
  .hero .phone{width:clamp(300px,24vw,380px)}
  .wrap{max-width:var(--wrap-desktop);padding-left:40px;padding-right:40px}
  h2{font-size:clamp(44px,3.6vw,64px)}
  .features{padding:150px 40px 170px}
  .grid{gap:22px}.card{padding:30px;border-radius:var(--r-card)}.card h3{font-size:20px}.card p{font-size:16px}
  .dl,.log{padding:110px 40px 130px}
  .dlgrid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:40px}
  .dlmain .dlcard{max-width:none;margin:0;align-items:flex-start;text-align:left;padding:46px 44px}
  .dlmain .trust{max-width:none}.dlmain .dlnote{text-align:left}
  .dl h2,.dl .eyebrow{text-align:left}
  .tl{max-width:860px}
}
@media(min-width:1700px){:root{--wrap-desktop:1440px}.hero h1{font-size:clamp(80px,4.8vw,104px)}}
@media(max-width:520px){.qrbox{flex-direction:column;align-items:flex-start}.dlside{padding:20px}}
@media(max-width:1099px){.qrbox{display:none}}
@media(prefers-reduced-motion:reduce){.nav,.copyhash,.nav-links a:after{transition:none}}
.dlgrid>*{min-width:0}.dlmain{min-width:0}.dlmain .trust code{word-break:break-all;overflow-wrap:anywhere}.dlmain .dlcard{max-width:100%}
@media(max-width:1099px){.dlgrid{width:100%;max-width:620px;margin:0 auto}.dlmain .dlcard{margin:0 auto}}

/* v2026.10.09-3: Android and Windows downloads as two clearly separate cards */
.dlplats{display:grid;gap:22px;grid-template-columns:minmax(0,1fr);max-width:1180px;margin:30px auto 0;text-align:left}
@media(min-width:1000px){.dlplats{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:start}}
.dlplat{position:relative;padding:22px;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.12);box-shadow:0 30px 80px -34px rgba(0,0,0,.9)}
.dlplat.andr{border-color:rgba(39,211,255,.38)}.dlplat.win{border-color:rgba(255,154,31,.38)}
.dlph{display:flex;align-items:center;gap:14px;margin:0 0 18px}.dlph>div{flex:1;min-width:0}
.dlph h3{margin:0;font-size:clamp(19px,5vw,24px);letter-spacing:-.01em;line-height:1.2}.dlph p{margin:2px 0 0;color:var(--mute);font-size:14px}
.dlpi{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgba(39,211,255,.1);border:1px solid rgba(39,211,255,.35);color:#27d3ff}
.dlplat.win .dlpi{background:rgba(255,154,31,.1);border-color:rgba(255,154,31,.4);color:#ff9a1f}
.dlchip{flex:none;padding:5px 11px;border-radius:99px;font-size:12px;font-weight:700;letter-spacing:.04em;color:#27d3ff;background:rgba(39,211,255,.1);border:1px solid rgba(39,211,255,.4)}
.dlchip.warn{color:#ffc83d;background:rgba(255,154,31,.12);border-color:rgba(255,154,31,.5)}
.dlplat .dlgrid{display:block;max-width:none;margin:0}.dlplat .dlside{margin-top:18px}
.dlplat .dlcard{margin:0 auto;max-width:none;padding:26px 20px;text-align:center;align-items:center}
.dlplat .dlmeta b{font-size:clamp(19px,5vw,26px)}
.dlplat .trust{max-width:none}.dlplat .dlnote{text-align:left}
.dlplat.win .steps{margin-top:18px}
.dlplat .qrbox{flex-wrap:wrap}
@media(max-width:480px){.dlplat{padding:16px;border-radius:22px}.dlchip{font-size:11px;padding:4px 9px}.dlpi{width:42px;height:42px}}
.dlplat .trust li{overflow-wrap:anywhere}.dlplat .trust code{display:block;max-width:100%;word-break:break-all;overflow-wrap:anywhere;font-size:12px}
@media(min-width:1000px){.dl .dsub{margin-left:0;text-align:left}}

.dlrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px;width:100%}
.dlqr{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px}
.dlqr img{display:block;width:104px;height:104px;padding:6px;border-radius:12px;background:#fff}
.dlqr figcaption{font-size:12px;line-height:1.3;color:var(--text-mute)}

.promo{padding:34px 20px 24px;text-align:center}
.promovid{position:relative;margin:22px auto 0;max-width:640px;border-radius:20px;overflow:hidden;border:1px solid var(--theme-edge,#27d3ff55);background:#000;line-height:0}
.promovid video{display:block;width:100%;height:auto;aspect-ratio:848/478}
.promosnd{position:absolute;left:10px;bottom:10px;line-height:1.2;font:600 12px/1.2 inherit;padding:7px 11px;border-radius:999px;border:1px solid #ffffff55;background:#0b1730cc;color:#fff;cursor:pointer}
@media(max-width:520px){.promo{padding:26px 16px 18px}}
