@font-face{font-family:JuiceDisplay;src:local("Avenir Next"),local("Avenir");font-display:swap}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:30px}
body{margin:0;background:#191c1b;color:#f0eee6;font-family:JuiceDisplay,"Trebuchet MS",sans-serif;line-height:1.65}
a{color:inherit;text-underline-offset:5px}
a:focus-visible,summary:focus-visible{outline:3px solid #ffc077;outline-offset:6px}
a:hover{color:#ffc077}
.wrap{width:min(1180px,calc(100% - 64px));margin:auto}
header{display:flex;align-items:center;justify-content:space-between;padding:30px 0;gap:24px}
.brand{display:flex;align-items:center;gap:10px;font-size:25px;font-weight:800;letter-spacing:-1px;text-decoration:none}
nav{display:flex;gap:28px;font-size:14px}
nav a{text-decoration:none}
.hero{display:grid;grid-template-columns:1.13fr 1fr;align-items:start;gap:55px;padding:72px 0 70px}
.intro{padding-top:30px}
h1{font-size:clamp(76px,8.4vw,116px);letter-spacing:-7px;line-height:.98;margin:0 0 30px;font-weight:700}
h1 em{font-style:normal;color:#ffb261}
.lead{font-size:21px;line-height:1.65;color:#c4c8c1}
.actions{display:flex;align-items:center;gap:24px;margin:34px 0 20px}
.button{display:inline-flex;justify-content:space-between;gap:32px;align-items:center;text-decoration:none;color:#22241d;background:#ffb261;border:1px solid #ffb261;border-radius:10px;padding:13px 21px;font-weight:700;font-size:15px;transition:background .15s,transform .15s}
.button:hover{background:#ffd5a3;color:#22241d;transform:translateY(-2px)}
.quiet{font-size:14px}
.small,.caption,figcaption{font-size:12px;color:#9fa69e;line-height:1.7}
.hero-art{position:relative;padding:0 0 10px;border-radius:30px;background:radial-gradient(ellipse at 60% 35%,#40483d 0,transparent 65%)}




.tray{display:block;width:100%;max-width:365px;margin-inline:auto;height:auto;border-radius:13px;box-shadow:0 18px 55px #0004}
.caption{text-align:center;font-size:10px;margin:13px 0}
.feature{display:grid;grid-template-columns:1fr;gap:22px;padding-top:85px}
h2{font-weight:600;font-size:clamp(32px,4vw,48px);letter-spacing:-1.8px;line-height:1.15;margin:0 0 24px}
.feature>div{max-width:760px}
.feature p{max-width:720px;font-size:16px;color:#b4bcb1}
.wide{grid-column:1/-1;margin:12px 0 0}
.wide img{display:block;width:100%;height:auto;max-height:720px;object-fit:cover;object-position:top;border:1px solid #ffffff20;border-radius:14px}
.wide figcaption{margin-top:10px}
.details{display:grid;grid-template-columns:1fr 1fr;gap:90px;padding:110px 0 50px}
.details dl{margin:0}
.details dt{font-size:18px;color:#ffbf7c;margin-bottom:8px}
.details dd{margin:0 0 28px;color:#b4bcb1;font-size:15px}
.last{padding:70px 0 85px;border-top:1px solid #ffffff18;text-align:center}
.last .button{min-width:205px}
.last h2{font-size:48px}
footer{display:flex;justify-content:space-between;gap:25px;border-top:1px solid #ffffff18;padding:28px 0 42px!important;font-size:12px;color:#aeb5a9}
footer nav{gap:20px;font-size:12px}
.skip{position:absolute;left:20px;top:-100px;background:#ffb261;color:#191c1b;padding:10px;z-index:2}
.skip:focus{top:15px}
.article{max-width:800px;padding:50px 0 80px}
.article h1{font-size:64px;letter-spacing:-3px}
.article h2{font-size:28px;margin-top:45px}
.article p,.article li{color:#c6ccc2}
.article code{background:#30372e;border-radius:4px;padding:3px 7px;font-size:14px}
.article li{margin-bottom:12px}
.article details{border-top:1px solid #ffffff20;padding:18px 0}
.article summary{cursor:pointer;font-size:18px;color:#ffbf7c}
.article .note{padding:18px 22px;border-left:3px solid #ffb261;background:#242824}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}
header{padding:22px 0}
header nav{gap:16px}
header nav a[href="#how"]{display:none}
.hero{gap:30px;padding-top:35px;grid-template-columns:1fr 1fr}
h1{font-size:75px;letter-spacing:-4px}
.lead{font-size:17px}
.actions{flex-direction:column;align-items:flex-start;gap:16px}
.hero-art{padding:0}
.details{gap:35px}
.feature{grid-template-columns:1fr;gap:16px}
.wide img{max-height:540px}
footer{flex-direction:column}
.last h2{font-size:38px}
}
@media(max-width:560px){.hero{grid-template-columns:1fr;padding-top:20px}
.intro{padding-top:0}
h1{font-size:84px}
.lead{font-size:19px}
.actions{flex-direction:row;align-items:center;flex-wrap:wrap}
.hero-art{max-width:390px;width:100%;margin:25px auto 0}
.tray{max-height:none}
.feature{padding-top:70px}
.details{grid-template-columns:1fr;padding-top:70px;gap:20px}
.wide img{max-height:360px}
.article h1{font-size:48px}
footer nav{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.button{transition:none}
}

.icon{width:19px;height:19px;flex:none;vertical-align:-4px}
nav .icon,footer .icon{width:15px;height:15px;vertical-align:-3px}
.quiet{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.release-links{display:flex;gap:20px;font-size:12px;color:#aeb5a9;margin-top:8px}
.menubar{height:32px;display:flex;justify-content:flex-end;align-items:center;gap:17px;padding:0 13px;margin:0 0 8px;border-bottom:1px solid #ffffff24;background:#444a43;color:#fafbf8;font-family:-apple-system,BlinkMacSystemFont,sans-serif;white-space:nowrap}

.system-icon{display:block;flex:none;width:19px;height:18px}
.system-icon.battery{width:26px;height:14px}
.menu-date{font-size:11px;font-weight:500;display:flex;gap:9px}
@media(max-width:1000px) and (min-width:561px){.menubar{gap:9px;padding-inline:8px}.menu-date{font-size:10px;gap:5px}.system-icon{width:16px}.system-icon.battery{width:22px}}
@media(max-width:700px) and (min-width:561px){.hero{grid-template-columns:1fr}.hero-art{max-width:440px;width:100%;margin:15px auto 0}.actions{flex-direction:row;align-items:center}.menubar{gap:16px}}
@media(max-width:380px){.menubar{gap:9px;padding-inline:8px}.menu-date{font-size:10px;gap:5px}.system-icon{width:16px}.system-icon.battery{width:22px}header{gap:12px}.brand{font-size:23px}header nav{gap:12px;font-size:12px}}

.button[aria-disabled="true"]{background:#30362f;border-color:#475044;color:#c4c8c1;cursor:default;transform:none;font-size:14px;gap:12px}
.button[aria-disabled="true"] .icon{display:none}
.download-options{font-size:12px;color:#aeb5a9;max-width:370px;margin:14px 0}
.download-options summary{cursor:pointer;width:fit-content;text-decoration:underline;text-underline-offset:4px}
.download-options a{display:flex;justify-content:space-between;gap:12px;margin-top:12px;padding:10px 12px;border:1px solid #ffffff25;border-radius:7px;text-decoration:none;color:#f0eee6}
.download-options a:hover{border-color:#ffb261}
.download-options a span{color:#aeb5a9;white-space:nowrap}
.download-options p{margin:8px 0}

.menu-limits{height:22px;width:auto;display:block;flex:none}