:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#f5f8fc;background:#090d17;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 77% 20%,#142b41 0,transparent 30%),radial-gradient(circle at 2% 92%,#152f35 0,transparent 34%),#090d17}.layout{max-width:1200px;margin:auto;padding:0 38px}.masthead{height:106px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff16}.brand{display:flex;align-items:center;gap:13px;color:white;text-decoration:none;font-size:12px;line-height:1.08;letter-spacing:.22em}.brand strong{font-size:16px;letter-spacing:.13em}.brand-mark{display:grid;place-items:center;width:45px;height:45px;border:1px solid #7bd7e4;border-radius:50%;color:#7bd7e4;font-size:30px;line-height:1;box-shadow:0 0 30px #26c6df3b}.edition{color:#8495a3;font-size:13px}.intro{min-height:340px;display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;overflow:hidden}.intro-copy{z-index:1;max-width:670px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.24em;color:#73d9e9;display:flex;align-items:center;gap:11px}.live-dot{width:7px;height:7px;border-radius:50%;background:#78edc0;box-shadow:0 0 12px #78edc0}h1{font-size:clamp(45px,6vw,78px);letter-spacing:-.055em;line-height:1.06;margin:22px 0 18px;font-weight:700}h1 em{font-style:normal;color:#7cd3e4}.intro p{font-size:16px;line-height:1.7;color:#a5b1bd;max-width:590px;margin:0}.orbit{width:285px;height:285px;flex:none;display:grid;place-items:center;position:relative;margin-right:42px}.orbit-ring{position:absolute;border-radius:50%;border:1px solid #6de7f63d}.ring-one{inset:5px}.ring-two{inset:38px;border-style:dashed;animation:turn 28s linear infinite}.orbit-core{height:140px;width:140px;display:grid;place-items:center;border-radius:50%;font-size:54px;font-weight:100;letter-spacing:-.08em;color:#c4faff;background:radial-gradient(circle at 35% 30%,#235e7a,#0d243a 65%,#0a1725);border:1px solid #6ae3f57c;box-shadow:0 0 65px #2dd0e45d,inset 0 0 24px #75edff36}@keyframes turn{to{transform:rotate(360deg)}}.versions{padding:10px 0 80px}.section-heading{display:flex;align-items:baseline;gap:20px;border-bottom:1px solid #ffffff21;margin-bottom:24px}.section-heading h2{font-size:23px;margin:0 0 17px;letter-spacing:-.025em}.section-heading span{color:#6e8996;font-size:11px;letter-spacing:.2em}.version-list{display:grid;grid-template-columns:1fr;gap:20px}.version-card{min-height:304px;border:1px solid #36515d;border-radius:18px;background:linear-gradient(120deg,#132b3a 0%,#101a2b 54%,#101622 100%);display:grid;grid-template-columns:39% 61%;overflow:hidden;box-shadow:0 24px 64px #0005}.version-art{position:relative;display:grid;place-items:center;min-height:304px;background:radial-gradient(circle at 51% 55%,#237c91 0,#125167 24%,transparent 63%),linear-gradient(135deg,#152b3f,#0c1728);overflow:hidden}.version-art:before,.version-art:after{content:"";position:absolute;width:340px;height:340px;border:1px solid #62def633;border-radius:50%}.version-art:after{width:470px;height:470px}.mini-phone{position:relative;width:135px;height:260px;border:5px solid #0b0d14;border-radius:19px;background:#0b0d14 url('versions/4.0.4/assets/aosp-wallpaper.jpg') center/cover;box-shadow:0 12px 25px #000a,0 0 0 1px #52626b;transform:rotate(-8deg) translateY(22px);overflow:hidden;color:#fff}.mini-status{height:12px;background:#040709;text-align:right;padding-right:5px;font-size:6px;color:#6bcff3}.mini-search{margin:13px 7px 0;padding:4px;background:#ecf0f1;color:#737b80;display:flex;justify-content:space-between;font-size:7px}.mini-clock{text-align:center;margin-top:36px;font-size:31px;font-weight:100;text-shadow:0 2px 8px #000}.mini-dock{position:absolute;bottom:19px;left:3px;right:3px;display:flex;justify-content:space-around;font-size:15px;text-shadow:0 2px 4px #000}.mini-nav{position:absolute;bottom:0;left:0;right:0;height:17px;background:#07090e;text-align:center;font-size:9px;color:#b5c8cf}.version-details{padding:33px 42px 26px;display:flex;flex-direction:column}.version-meta{display:flex;align-items:center;gap:17px;color:#8ca5ac;font-size:12px}.badge{padding:7px 10px;border:1px solid #74decc6b;border-radius:3px;color:#7ce8d1;font-size:10px;font-weight:700;letter-spacing:.12em}.version-details h3{font-size:34px;letter-spacing:-.04em;margin:18px 0 2px}.version-details h4{font-size:20px;color:#7ad5e5;font-weight:400;margin:0 0 12px}.version-details p{line-height:1.6;color:#9cafb7;margin:0;max-width:560px}.version-bottom{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:12px;color:#8399a5;padding-top:24px}.launch{display:inline-flex;align-items:center;gap:20px;background:#7bd6e5;color:#0c2330;border-radius:5px;padding:14px 18px;text-decoration:none;font-size:13px;font-weight:700;white-space:nowrap;transition:transform .2s,background .2s}.launch:hover,.launch:focus-visible{transform:translateY(-2px);background:#a1f0fa}.footer{border-top:1px solid #ffffff18;padding:28px 0 36px;display:flex;justify-content:space-between;color:#6f8793;font-size:12px}@media(max-width:780px){.layout{padding:0 20px}.masthead{height:82px}.edition,.orbit{display:none}.intro{min-height:300px}.version-card{grid-template-columns:1fr}.version-art{height:225px;min-height:225px}.mini-phone{transform:rotate(-8deg) translateY(40px)}.version-details{padding:26px}.version-bottom{align-items:flex-start;flex-direction:column}.footer{gap:15px;flex-direction:column}}@media(max-width:440px){h1{font-size:45px}.intro{min-height:330px}.version-details h3{font-size:29px}.launch{width:100%;justify-content:space-between}}
/* Future versions stay visible in the catalog but cannot be launched yet. */
.version-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.version-card{grid-column:1/-1}
.planned-card{min-height:128px;border:1px solid #ffffff1b;border-radius:13px;background:linear-gradient(125deg,#14222e,#101924);display:flex;align-items:center;gap:21px;padding:19px 25px;color:#91a9b4}
.planned-number{width:80px;flex:none;font-size:32px;letter-spacing:-.08em;color:#4b8193}
.planned-badge{font-size:10px;letter-spacing:.18em;color:#70a4ae}
.planned-card h3{font-size:21px;color:#d4e3e9;font-weight:400;margin:6px 0 2px}
.planned-card p{font-size:12px;color:#79909b;margin:0}
.planned-lock{margin-left:auto;color:#476b7b}
@media(max-width:780px){.version-list{grid-template-columns:1fr}}
.header-right{display:flex;align-items:center;gap:24px}
#language-select{border:1px solid #6a9da556;border-radius:5px;background:#152835;color:#c9e8ec;padding:8px 10px;font-size:12px;cursor:pointer}
@media(max-width:780px){.header-right{gap:0}}
/* The catalog thumbnail uses the same ICS assets and layout as the simulator. */
.mini-phone{width:146px;height:280px;border:2px solid #30383d;border-radius:27px;background:linear-gradient(125deg,#1c2226,#050708 43%,#151b20);box-shadow:0 12px 25px #000a,inset 0 0 0 2px #090c0f,0 0 0 1px #52626b;transform:rotate(-8deg) translateY(25px);overflow:hidden}
.mini-earpiece{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:30px;height:3px;border-radius:4px;background:#070b0d;box-shadow:0 1px 1px #687177}
.mini-camera{position:absolute;top:9px;right:31px;width:5px;height:5px;border:1px solid #37434b;border-radius:50%;background:#0a1118}
.mini-screen{position:absolute;top:25px;bottom:18px;left:6px;right:6px;overflow:hidden;background:#05080d url('versions/4.0.4/assets/wallpaper_chroma.jpg') center/cover}
.mini-status{height:12px;padding:0 3px;background:#040709d9;display:flex;align-items:center;justify-content:space-between}
.mini-status>img{width:7px;height:7px;object-fit:contain}
.mini-status-right{display:flex;align-items:center;gap:2px;font-size:6px;color:#6bcff3}
.mini-status-right img{width:7px;height:7px;object-fit:contain}
.mini-search{height:15px;margin:6px 5px 0;padding:1px 3px;background:#030609a1;border:1px solid #aeb7ba;color:#fff;font:8px Georgia,'Times New Roman',serif;display:flex;align-items:center;justify-content:space-between}
.mini-search img{width:11px;height:11px;object-fit:contain;filter:brightness(0) invert(1)}
.mini-clock{display:block;width:62px;height:62px;margin:19px auto 0;filter:drop-shadow(0 1px 2px #000)}
.mini-shortcuts{position:absolute;bottom:51px;left:8px;right:8px;display:flex;align-items:center;justify-content:space-between}
.mini-shortcuts>img{width:21px;height:21px;object-fit:contain}
.mini-shortcuts .mini-google{border:1px solid #b0b5ba;border-radius:50%;width:23px;height:23px;display:grid;grid-template-columns:repeat(2,1fr);place-items:center;gap:0;padding:2px;background:#12191fa6}
.mini-google img{width:8px;height:8px;object-fit:contain}
.mini-dock{bottom:17px;left:2px;right:2px;height:31px;border-top:1px solid #b7bec0;align-items:center}
.mini-dock img{width:19px;height:19px;object-fit:contain}
.mini-nav{height:17px;background:#050709;display:flex;align-items:center;justify-content:space-around}
.mini-nav img{width:15px;height:12px;object-fit:contain}
@media(max-width:780px){.mini-phone{transform:rotate(-8deg) translateY(40px)}}
.mini-clock{position:relative}.mini-clock img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}

/* Jelly Bean miniature: Launcher2 4.3's filled, rounded search_frame and its own microphone. */
.mini-search-jb{border:3px solid transparent;border-image:url('versions/4.3/assets/jb-search_frame.png') 9 fill/3px stretch;background:none;color:#f4f4f4;text-shadow:0 1px 1px #0006}
.mini-search-jb img{filter:none;width:7px;height:10px}

.orbit-core{transition:opacity .35s,transform .35s}.orbit-core.switching{opacity:0;transform:scale(.92)}
.orbit-core.planned{color:#7fa7b3}

/* The logo mark is drawn, so it sits exactly in the middle of its ring. */
.brand-mark svg{display:block;width:24px;height:24px}
/* A calmer headline size; it stays on two lines in every language. */
h1{font-size:clamp(38px,4.6vw,60px)}
.footer-link{color:inherit;text-decoration:none;border-bottom:1px solid #6f879355}.footer-link:hover,.footer-link:focus-visible{color:#9fdbe6;border-bottom-color:#9fdbe6}

/* Nexus 4 miniature: a flatter slab with tighter corners, a silver rim and a 5:3 screen. */
.mini-phone-nexus4{width:150px;height:292px;border-radius:19px/18px;border:2px solid #8d969b;background:linear-gradient(160deg,#16191b,#07090a 40%,#121517)}
.mini-phone-nexus4 .mini-screen{top:33px;bottom:33px;left:7px;right:7px}
.mini-phone-nexus4 .mini-earpiece{top:15px;width:26px}
.mini-phone-nexus4 .mini-camera{top:13px;right:38px}

/* Landing miniatures drawn with the same device SVGs; the screen insets are the frame paddings in percent. */
.mini-phone{width:150px;height:auto;aspect-ratio:368.15/721.32;border:0;border-radius:0;background:url('versions/4.0.4/assets/device-galaxy-nexus.svg') 0 0/100% 100% no-repeat;box-shadow:none;filter:drop-shadow(0 12px 20px #000a);overflow:visible}
.mini-phone .mini-earpiece,.mini-phone .mini-camera{display:none}
.mini-phone .mini-screen{top:13.15%;bottom:11.44%;left:8.21%;right:8.67%;border-radius:0}
.mini-phone-nexus4{aspect-ratio:374.77/722.2;border:0;border-radius:0;background-image:url('versions/4.3/assets/device-nexus-4.svg')}
.mini-phone-nexus4 .mini-screen{top:11.86%;bottom:12.68%;left:6.37%;right:6.37%}

/* Nexus S miniature: no navigation bar, the screen insets are the frame paddings in percent. */
.mini-phone-nexus5{aspect-ratio:370.57/728.24;border:0;border-radius:0;background-image:url('versions/4.4.4/assets/device-nexus-5.svg?v=2')}
.mini-phone-nexus5 .mini-screen{top:8.83%;bottom:11.53%;left:5.94%;right:6.02%}
.mini-phone-nexuss{aspect-ratio:349.3/675.33;border:0;border-radius:0;background-image:url('versions/2.3.6/assets/device-nexus-s.svg?v=4')}
.mini-phone-nexuss .mini-screen{top:15.89%;bottom:15.99%;left:10.49%;right:10.49%}
.mini-phone-nexuss .mini-nav{display:none}
.mini-phone-nexuss .mini-dock{bottom:2px}
.mini-phone-nexuss .mini-shortcuts{bottom:36px}

/* A miniature can show a capture of the simulator's own home screen instead of the drawn layers. */
.mini-screen.mini-shot{background-size:100% 100%;background-position:0 0}
/* Work in progress versions: an amber badge, and the Nexus 6 in recovery as the picture. */
.badge.badge-preview{border-color:#f0b35a73;color:#f5c27a}
.mini-phone-nexus6{aspect-ratio:332/637.2;border:0;border-radius:0;background-image:url('versions/5.1.1/assets/device-nexus-6.svg')}
.mini-phone-nexus6 .mini-screen{top:8.6%;bottom:8.6%;left:5.3%;right:5.3%}
.mini-phone-nexus6 .mini-earpiece,.mini-phone-nexus6 .mini-camera{display:none}