/* Download page: a hero with the release at a glance, one card per system (the visitor's own is lit),
   notes for anyone updating, what the download holds, the first five minutes, and every earlier release.
   Each system card carries its own stop of the logo gradient as --c. */
.dl-grad{background:linear-gradient(90deg,#30B9FE,#5B6DFF 35%,#8151FE 62%,#DD3BFC)}

/* hero */
.dl-hero{position:relative;padding-block:calc(var(--barh) + var(--navh) + 52px) 64px;overflow:hidden}
.dl-hero canvas{position:absolute;inset:0;width:100%;height:100%}
.dl-hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:center}
.dl-hero h1{font-size:clamp(48px,6.2vw,100px);line-height:.92;letter-spacing:-.055em}
.dl-hero h1 i{font-style:normal;background:linear-gradient(90deg,#30B9FE,#5B6DFF 35%,#8151FE 62%,#DD3BFC);-webkit-background-clip:text;background-clip:text;color:transparent}
.dl-hero .sub{margin-top:24px;font-size:clamp(18px,1.5vw,22px);line-height:1.42;max-width:540px}
.dl-hero .ctas{margin-top:30px}
.dl-hero .ctas .btn.solid{min-width:236px;justify-content:space-between}
.dl-sys{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:26px;color:var(--mute)}
.dl-sys a{display:flex;align-items:center;gap:8px;transition:color .2s}
.dl-sys a:hover{color:var(--fg)}
.dl-sys i{width:7px;height:7px;border-radius:50%;background:var(--c)}
.dl-phone{display:none;margin-top:18px;max-width:460px;padding:12px 14px;border:1px solid var(--line-2);border-radius:5px;background:rgba(11,15,19,.8);color:var(--mute);font-size:15px}
.dl-phone.show{display:block}

/* the release at a glance */
.dl-glance{position:relative;border:1px solid var(--line-2);border-radius:8px;background:rgba(11,15,19,.86);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:26px 26px 20px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.45)}
.dl-glance::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,#30B9FE,#5B6DFF 35%,#8151FE 62%,#DD3BFC)}
.dl-glance header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:16px}
.dl-glance header b{font-family:var(--display);font-size:clamp(24px,2.1vw,30px);font-weight:600;letter-spacing:-.035em;line-height:1}
.dl-latest{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;line-height:1;letter-spacing:.08em;text-transform:uppercase;color:var(--ok);padding:5px 8px;border:1px solid color-mix(in srgb,var(--ok) 38%,transparent);border-radius:3px;background:color-mix(in srgb,var(--ok) 8%,transparent);white-space:nowrap}
.dl-latest i{width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok);flex:none}
.dl-glance dl{display:grid;margin:0}
.dl-glance dl div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;padding:12px 0;border-top:1px solid var(--line)}
.dl-glance dt{font-family:var(--mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--dim);padding-top:3px}
.dl-glance dd{margin:0;font-size:15.5px;line-height:1.45;color:var(--mute)}
.dl-glance dd b{color:var(--fg);font-weight:500}
.dl-glance .more2{display:flex;justify-content:space-between;gap:12px;margin-top:6px;padding-top:14px;border-top:1px solid var(--line);font-size:14.5px;color:var(--fg)}
.dl-glance .more2 span{color:var(--accent);font-family:var(--mono)}
.dl-glance .more2:hover{color:var(--accent)}

/* system cards */
.dl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dl-os{position:relative;display:flex;flex-direction:column;gap:18px;padding:30px 30px 26px;border:1px solid var(--line);border-radius:8px;background:var(--ink-2);min-width:0;overflow:hidden;scroll-margin-top:calc(var(--barh) + var(--navh) + 24px);transition:border-color .25s,box-shadow .25s}
.dl-os::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--c)}
.dl-os.dl-on{border-color:color-mix(in srgb,var(--c) 70%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 45%,transparent),0 34px 70px -40px color-mix(in srgb,var(--c) 70%,transparent)}
.dl-os:target{border-color:var(--c)}
.dl-os .top2{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.dl-os .w{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--c)}
.dl-os .w i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.dl-os h3{font-size:clamp(34px,3.4vw,52px);line-height:.98;letter-spacing:-.045em;margin-top:10px}
.dl-os h3 small{display:block;font-family:var(--body);font-size:clamp(16px,1.3vw,18px);font-weight:400;letter-spacing:0;color:var(--mute);margin-top:10px}
.dl-you{display:none;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--c);padding:5px 8px;border-radius:3px;white-space:nowrap}
.dl-on .dl-you{display:inline-flex}
.dl-exp{display:inline-flex;align-items:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--c);padding:5px 8px;border:1px solid color-mix(in srgb,var(--c) 45%,transparent);border-radius:3px;white-space:nowrap}
.dl-get{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.dl-get .btn.solid{background:var(--fg)}
.dl-on .dl-get .btn.solid{background:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 35%,transparent)}
.dl-pkg{color:var(--mute)}
.dl-req{display:grid;margin:0;border-top:1px solid var(--line-2)}
.dl-req div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.dl-req dt{font-family:var(--mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--dim);padding-top:3px}
.dl-req dd{margin:0;font-size:15.5px;line-height:1.48;color:var(--mute)}
.dl-req dd b{color:var(--fg);font-weight:500}
.dl-notes{list-style:none;padding:0;margin:0;display:grid;gap:9px;color:var(--mute);font-size:15px;line-height:1.45}
.dl-notes li{position:relative;padding-left:18px}
.dl-notes li::before{content:"";position:absolute;left:0;top:.66em;width:7px;height:1.5px;background:var(--c)}
.dl-notes b{color:var(--fg);font-weight:500}
.dl-pks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.dl-pk{border:1px solid var(--line);border-radius:6px;padding:16px;background:var(--ink-3);display:flex;flex-direction:column;gap:8px;min-width:0}
.dl-pk b{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--fg)}
.dl-pk span{font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--c)}
.dl-pk p{font-size:14.5px;line-height:1.45;color:var(--mute)}
.dl-same{margin-top:16px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;color:var(--mute);font-size:15px}
.dl-same b{color:var(--fg);font-weight:500}

/* updating */
.dl-up{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line-2)}
.dl-up div{padding:24px 26px 6px 0;display:flex;flex-direction:column;gap:10px;border-right:1px solid var(--line);min-width:0}
.dl-up div + div{padding-left:26px}
.dl-up div:last-child{border-right:0}
.dl-up span{font-family:var(--mono);font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--c)}
.dl-up h3{font-size:clamp(22px,2vw,28px);letter-spacing:-.03em;line-height:1.1}
.dl-up p{color:var(--mute);font-size:15.5px}

/* what you get */
.dl-doors{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.dl-door{display:flex;flex-direction:column;gap:12px;min-width:0;color:var(--fg)}
.dl-door figure{margin:0;aspect-ratio:4/3;border:1px solid var(--line-2);border-radius:6px;overflow:hidden;background:#000;position:relative}
.dl-door figure::after{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:var(--c)}
.dl-door img{width:100%;height:100%;object-fit:cover;transform:scale(var(--z,1));transform-origin:var(--o,50% 50%);transition:transform .5s}
a.dl-door:hover img{transform:scale(calc(var(--z,1) * 1.04))}
.dl-door b{display:flex;align-items:center;gap:8px;font-family:var(--display);font-size:21px;font-weight:600;letter-spacing:-.03em}
.dl-door b i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.dl-door p{color:var(--mute);font-size:14.5px;line-height:1.45}
.dl-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:44px;border-top:1px solid var(--line-2)}
.dl-facts > *{padding:22px 22px 4px 0;display:flex;flex-direction:column;gap:8px;border-right:1px solid var(--line);min-width:0}
.dl-facts > * + *{padding-left:22px}
.dl-facts > *:last-child{border-right:0}
.dl-facts b{font-family:var(--display);font-size:clamp(22px,2vw,28px);font-weight:600;letter-spacing:-.03em;line-height:1.1}
.dl-facts span{color:var(--mute);font-size:15px}
.dl-facts a b::after{content:" →";color:var(--accent);font-family:var(--mono);font-size:.7em}
.dl-nolimit{display:flex;flex-wrap:wrap;gap:6px;margin-top:22px}
.dl-nolimit span{font-size:14px;padding:6px 11px;border:1px solid var(--line-2);border-radius:999px;color:var(--mute)}

/* first five minutes */
.dl-next{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,72px);align-items:start}
.dl-next .steps{gap:16px}
.dl-next .steps li{font-size:16.5px;line-height:1.5}
.dl-next .steps li b{color:var(--fg);font-weight:500}
.dl-n{font-family:var(--mono);font-size:.86em;color:var(--fg);padding:1px 6px;border:1px solid var(--line-2);border-radius:3px;background:var(--ink-2);white-space:nowrap}
.dl-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.dl-side .code pre{white-space:pre}
.dl-go{display:grid;gap:10px}
.dl-go a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 14px;padding:18px 20px;border:1px solid var(--line);border-radius:6px;background:var(--ink-2);transition:border-color .2s}
.dl-go a:hover{border-color:var(--accent)}
.dl-go b{font-family:var(--display);font-size:20px;font-weight:600;letter-spacing:-.03em}
.dl-go small{grid-column:1;color:var(--mute);font-size:14.5px}
.dl-go em{grid-row:1/3;grid-column:2;font-style:normal;font-family:var(--mono);color:var(--accent)}

/* earlier releases */
.dl-vers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,4vw,56px);border-top:1px solid var(--line-2)}
.dl-vers a{display:grid;grid-template-columns:76px minmax(0,1fr) auto;align-items:baseline;gap:6px 16px;padding:15px 2px;border-bottom:1px solid var(--line);transition:color .2s}
.dl-vers a:hover{color:var(--accent)}
.dl-vers a:hover p{color:var(--fg)}
.dl-vers b{font-family:var(--mono);font-size:15px;font-weight:500}
.dl-vers p{color:var(--mute);font-size:15px;line-height:1.45;transition:color .2s}
.dl-vers p em{font-style:normal;display:inline-flex;align-items:center;gap:6px;margin-right:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--c);vertical-align:1px}
.dl-vers p em i{width:6px;height:6px;border-radius:50%;background:var(--c)}
.dl-vers span{font-family:var(--mono);color:var(--dim)}

/* stuck */
.dl-help{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,4vw,60px);align-items:center;margin-top:52px;padding:26px 28px;border:1px solid var(--line);border-radius:8px;background:var(--ink-2)}
.dl-help h3{font-size:clamp(24px,2.4vw,32px);letter-spacing:-.035em;line-height:1.05}
.dl-help p{color:var(--mute);margin-top:8px;font-size:15.5px}
.dl-help p a{color:var(--fg);border-bottom:1px solid var(--line-2)}
.dl-help p a:hover{border-color:var(--fg)}

@media (max-width:1180px){
  .dl-doors{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1080px){
  .dl-hero .wrap,.dl-next,.dl-help{grid-template-columns:1fr}
  .dl-grid{grid-template-columns:1fr}
  .dl-facts{grid-template-columns:1fr 1fr}
  .dl-facts > *:nth-child(2){border-right:0}
  .dl-facts > *:nth-child(3){padding-left:0}
  .dl-vers{grid-template-columns:1fr}
}
@media (max-width:760px){
  .dl-hero{padding-bottom:44px}
  .dl-hero .ctas .btn{width:100%;justify-content:space-between}
  .dl-os{padding:26px 20px 22px}
  .dl-req div,.dl-glance dl div{grid-template-columns:1fr;gap:4px}
  .dl-pks{grid-template-columns:1fr}
  .dl-up{grid-template-columns:1fr}
  .dl-up div,.dl-up div + div{border-right:0;padding-left:0;padding-bottom:22px;border-bottom:1px solid var(--line)}
  .dl-up div:last-child{border-bottom:0}
  .dl-doors{grid-template-columns:1fr;gap:10px}
  .dl-door{display:grid;grid-template-columns:132px minmax(0,1fr);gap:4px 16px;align-items:center}
  .dl-door figure{grid-row:1/3}
  .dl-door b{font-size:19px;align-self:end}
  .dl-door p{align-self:start}
  .dl-facts{grid-template-columns:1fr}
  .dl-facts > *,.dl-facts > * + *{border-right:0;padding-left:0;padding-bottom:18px;border-bottom:1px solid var(--line)}
  .dl-facts > *:last-child{border-bottom:0}
  .dl-vers a{grid-template-columns:58px minmax(0,1fr);}
  .dl-vers span{display:none}
  .dl-help{padding:22px 20px}
}
#platforms{padding-top:clamp(16px,2vw,32px)}
.dl-door video{width:100%;height:100%;object-fit:cover;object-position:50% 62%}
