@import url('/src/type.css');

:root{color-scheme:dark;font-family:Inter,"Segoe UI",Arial,sans-serif;background:#0a1017;color:#edf2f7;font-synthesis:none;--muted:#9ba9ba;--blue:#83b9ff;--line:rgba(172,194,221,.18);--surface:#101923;--ease:cubic-bezier(.2,.75,.3,1)}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{color:inherit;cursor:pointer}button{border:0}button:disabled{opacity:.25;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible,summary:focus-visible{outline:2px solid #a3caff;outline-offset:5px}button svg{flex-shrink:0}a{color:inherit}button{touch-action:manipulation}svg{vertical-align:middle}button span[data-icon]{display:inline-flex}button{background:none}h1,h2,h3,p{margin:0}a:hover{color:#b8d6ff}::selection{background:#416996;color:white}button:disabled:hover{transform:none}
.scenery{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(4,8,13,.63),rgba(5,10,17,.15) 39%,rgba(5,10,17,.2) 57%,#070c12 100%),url('/assets/backdrop.png') center 51%/cover;z-index:-1}.scenery:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 65%,transparent 20%,rgba(0,0,0,.24) 80%)}.app-shell{max-width:2100px;margin:0 auto;padding:32px 34px 18px}.site-header{display:flex;align-items:center;gap:28px;min-height:68px}.identity{flex-shrink:0}.identity h1{font-size:clamp(27px,2.5vw,40px);font-weight:650;letter-spacing:-1.5px;line-height:1.1}.title-dot{color:var(--blue)}.identity p{margin-top:10px;font-size:17px;letter-spacing:1px;color:#a9b5c4}.identity p span{padding:0 6px;color:#617389}.intro{font-size:13px;line-height:1.7;color:#94a0af;margin:0 0 0 2px;flex-shrink:0}.filters{display:flex;align-items:center;justify-content:center;gap:9px;margin:auto;white-space:nowrap}.filter{height:48px;display:flex;align-items:center;gap:10px;justify-content:center;padding:0 21px;border:1px solid rgba(191,204,223,.25);border-radius:28px;color:#aeb8c6;font-size:14px;background:rgba(7,12,19,.22);transition:border-color .2s,background .2s,color .2s,box-shadow .2s}.filter svg{width:20px;height:20px}.filter.active{color:#e9f2ff;background:linear-gradient(135deg,rgba(43,91,151,.33),rgba(17,29,44,.5));border-color:#669ce9;box-shadow:0 0 25px #2b73d51d,inset 0 0 15px #2c6fba0c}.filter.active svg{color:#84c2ff}.filter:hover{border-color:#82a9d8;color:#fff;background:#172637aa}.header-end{display:flex;align-items:center;gap:16px;margin-left:auto}.header-end p{color:#91a0b1;font-size:13px;line-height:1.65;white-space:nowrap}.icon-button{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:#a8b7ca;transition:background .2s,color .2s}.icon-button svg{width:21px;height:21px}.icon-button:hover{background:#a9c4e414;color:#fff}.search-toggle{background:#8ea8ce08}.timeline-section{position:relative;margin:27px -34px 0}.timeline-topline{position:absolute;top:0;left:48px;right:48px;display:flex;align-items:center;justify-content:space-between;pointer-events:none;z-index:2}.eyebrow{color:#a5b3c5;font-size:11px;font-weight:500;letter-spacing:2.3px}.timeline-topline #view-count{font-size:12px;color:#8190a4;letter-spacing:.2px}.timeline{height:505px;width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;user-select:none;touch-action:pan-x pan-y;overscroll-behavior-x:contain;mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}.timeline::-webkit-scrollbar{display:none}.timeline.dragging,.timeline.dragging button{cursor:grabbing}.timeline-track{height:100%;position:relative}.axis{position:absolute;bottom:65px;height:1px;background:linear-gradient(90deg,#738eb266,#9dbce0bb,#738eb266)}.device-node{position:absolute;top:27px;width:330px;height:440px;transform:translateX(-50%);isolation:isolate}.device-object{position:absolute;left:50%;top:0;transform:translateX(-50%);width:300px;height:327px;display:flex;align-items:flex-end;justify-content:center;isolation:isolate}.device-art{display:block;background-image:var(--art-url);background-size:var(--art-size);background-position:var(--art-position);background-repeat:no-repeat;aspect-ratio:1;flex-shrink:0}.device-object .device-art{width:280px;filter:brightness(.84) saturate(.75) drop-shadow(0 16px 12px #0008);transition:transform .5s var(--ease),filter .5s;transform:translateY(-5px);position:relative;z-index:2}.device-node.phones .device-object .device-art{width:277px}.device-node.laptops .device-object .device-art{width:340px;transform:translateY(-18px)}.device-node.desktops .device-object .device-art{width:303px;transform:translateY(-7px)}.device-node.selected .device-object .device-art{filter:brightness(1.08) saturate(.95) drop-shadow(0 0 17px #689fdf26) drop-shadow(0 18px 12px #0007);transform:translateY(-10px) scale(1.045)}.device-node.laptops.selected .device-object .device-art{transform:translateY(-23px) scale(1.025)}.device-node.desktops.selected .device-object .device-art{transform:translateY(-12px) scale(1.035)}.device-object:hover .device-art{filter:brightness(1.1) saturate(1)}.device-platform{position:absolute;bottom:4px;left:50%;transform:translateX(-50%);width:240px;height:27px;border:1px solid #b9d8ff40;border-radius:50%;background:radial-gradient(ellipse,rgba(81,130,198,.14),rgba(126,175,243,.06) 52%,rgba(164,203,255,.12) 80%,transparent);box-shadow:0 0 12px #7baae520,inset 0 0 11px #88b4f12b;z-index:0;transition:all .3s}.device-node.selected .device-platform{border-color:#8dbdff80;box-shadow:0 0 20px #83b8ff40,inset 0 0 13px #7faff84d}.device-platform:after{content:"";position:absolute;width:74%;height:95px;top:20px;left:13%;background:linear-gradient(#5285c71c,transparent);filter:blur(8px);transform:perspective(60px) rotateX(20deg)}.device-caption{position:absolute;left:50%;top:346px;transform:translateX(-50%);width:340px;text-align:center;z-index:3}.device-caption h2{font-size:15px;font-weight:500;letter-spacing:.1px;line-height:1.3;text-shadow:0 1px 5px #000}.device-caption h2 button{padding:0}.device-caption h2 button:hover{color:#b4d6ff}.device-caption p{font-size:12px;color:#8e9aad;margin-top:5px;max-width:270px;margin-left:auto;margin-right:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-node.selected h2{color:#f2f6ff}.connector{position:absolute;left:50%;top:324px;height:89px;width:1px;z-index:1;background:linear-gradient(#80adf060,rgba(112,153,215,.07) 24%,rgba(112,153,215,.07) 72%,#8abafb70)}.device-node.selected .connector{background:linear-gradient(#9fcfff,#7aa7e44a 24%,#7aa7e42a 75%,#a8d1ff);box-shadow:0 0 5px #75aafa6b}.timeline-dot{position:absolute;top:407px;left:50%;height:8px;width:8px;transform:translateX(-50%);border-radius:50%;background:#8e9fb9;padding:0;z-index:3}.timeline-dot:after{content:"";position:absolute;inset:-12px;border-radius:50%}.device-node.selected .timeline-dot{width:11px;height:11px;top:405px;background:white;box-shadow:0 0 0 3px #5799fe25,0 0 14px 3px #80b4ff}.node-year{position:absolute;top:435px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:15px;color:#91a0b4;font-variant-numeric:tabular-nums;letter-spacing:.3px}.selected .node-year{color:#f5faff;font-weight:600;text-shadow:0 0 8px #6da7ff,0 0 20px #6da7ff}.upgrade-label{font-size:9px;letter-spacing:1.5px;color:#9fc4f8;display:flex;align-items:center;justify-content:center;gap:5px;margin-top:-16px;margin-bottom:4px}.upgrade-label svg{width:11px;height:11px}.upgrade-node .device-object .device-art{filter:brightness(.7) saturate(.65)}.timeline-arrow{position:absolute;top:47%;width:43px;height:43px;border:1px solid #94aac64a;border-radius:50%;display:grid;place-items:center;background:#0a10187d;color:#c4d3e7;z-index:5;transition:background .2s,border-color .2s}.timeline-arrow:hover:not(:disabled){background:#1a2b43;border-color:#86b5f2}.timeline-arrow svg{width:24px;height:24px}.previous{left:23px}.next{right:23px}.explore-bar{display:flex;align-items:center;justify-content:space-between;max-width:630px;margin:7px auto 0;padding:0 20px}.drag-hint{display:flex;align-items:center;gap:17px;font-size:13px;color:#91a2b7;letter-spacing:.15px}.drag-hint svg{width:18px;color:#8bb6ec}.drag-hint [data-icon=hand] svg{width:24px;height:28px;color:#aebfd7}.text-button{padding:5px 0;color:#9aa9bc;display:inline-flex;align-items:center;gap:7px;font-size:12px}.text-button:hover{color:#d4e7ff}.text-button svg{width:15px;height:15px}.era-button{color:#6b7f9b;font-size:11px;letter-spacing:.5px}.overview{position:relative;height:27px;margin:11px auto 18px;width:min(430px,65%)}.overview-line{position:absolute;height:1px;background:#769bca23;top:8px;left:0;right:0}.year-marker{position:absolute;top:0;left:var(--year-position);transform:translateX(-50%);height:23px;width:19px;padding:0;display:flex;justify-content:center;align-items:flex-start}.year-marker>span{margin-top:6px;width:3px;height:5px;background:#829abb65;transition:height .2s,background .2s}.year-marker.active>span{background:#a8ceff;height:11px;margin-top:3px;box-shadow:0 0 7px #79b2ff}.year-marker small{position:absolute;top:22px;font-size:10px;opacity:0;color:#a8c9ef;transition:opacity .2s;pointer-events:none}.year-marker:hover small,.year-marker:focus-visible small{opacity:1}.year-marker:hover>span{background:#d8e9ff}.quick-card{position:absolute;z-index:7;top:50px;width:265px;padding:21px 20px 15px;border:1px solid #8bb8f440;background:linear-gradient(135deg,#111b27f5,#0c121ae8);backdrop-filter:blur(18px);border-radius:9px;box-shadow:0 18px 40px #0004;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .2s,transform .2s}.quick-card.visible{opacity:1;transform:translateY(0);pointer-events:auto}.quick-kicker{font-size:10px;color:#92b4e0;letter-spacing:1.1px}.quick-card h3{font-size:19px;font-weight:550;line-height:1.2;margin-top:7px}.quick-release{font-size:12px;color:#9babc0;margin-top:6px}.quick-card ul{list-style:none;padding:0;margin:18px 0 14px;display:grid;gap:11px}.quick-card li{display:flex;align-items:center;gap:11px;font-size:12px;line-height:1.4}.quick-card li svg{color:#a9bbd5;width:17px;height:17px;flex-shrink:0}.quick-card li small{display:block;color:#788da7;font-size:10px;margin-bottom:2px}.quick-story{font-size:12px;line-height:1.65;color:#a7b5c8;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.quick-more{margin-top:15px;padding:12px 0 0;border-top:1px solid #adcaef18;display:flex;align-items:center;justify-content:space-between;width:100%;font-size:12px;color:#aed1ff}.quick-more svg{width:17px;height:17px}.collection{display:grid;grid-template-columns:1.15fr 1fr 1fr;border:1px solid #9ab7e023;border-radius:15px;background:linear-gradient(120deg,#0c131ae0,#14212a8c,#0a1118d9);backdrop-filter:blur(14px);padding:22px 6px 20px;box-shadow:0 14px 55px #0002;gap:0}.collection-group{min-width:0;padding:0 23px}.collection-group+.collection-group{border-left:1px solid #a6c9f026}.collection-heading{display:flex;align-items:center;gap:10px;margin-bottom:19px}.collection-heading h2{font-size:16px;font-weight:600;letter-spacing:-.2px}.collection-heading>span{font-size:11px;color:#8291a4}.collection-filter{margin-left:auto;color:#667f9d;padding:0 2px}.collection-filter svg{width:17px;height:17px}.collection-filter:hover{color:#cce1ff}.thumbnail-strip{display:flex;align-items:center;gap:7px;overflow-x:auto;padding:4px 3px 11px;margin:0 -3px;scrollbar-width:thin;scrollbar-color:#637da34a transparent;scroll-padding:3px}.thumbnail{height:74px;min-width:47px;flex:0 0 47px;position:relative;border:1px solid #9ebae71c;border-radius:6px;display:flex;align-items:center;justify-content:center;background:linear-gradient(140deg,#9fb4cf16,#718aad09);transition:border-color .25s,background .25s,box-shadow .25s;overflow:hidden}.thumbnail .device-art{width:64px;filter:brightness(.92);transform:translateY(-2px)}.thumbnail:hover{border-color:#8baee07a;background:#7fa3d325}.thumbnail.selected{border-color:#6ca8ff;box-shadow:0 0 0 1px #529cff55,0 0 13px #4c8fee28;background:#438be028}.thumbnail.selected .device-art{filter:brightness(1.15)}.thumbnail-year{position:absolute;bottom:4px;left:0;right:0;font-size:9px;color:#889bb7;text-align:center;opacity:0;transition:opacity .2s}.thumbnail:hover .thumbnail-year,.thumbnail.selected .thumbnail-year{opacity:1}.collection-group:nth-child(2) .thumbnail{flex-basis:65px;min-width:65px}.collection-group:nth-child(2) .thumbnail .device-art{width:83px}.collection-group:nth-child(3) .thumbnail{flex:1 0 59px}.collection-group:nth-child(3) .thumbnail .device-art{width:76px}.site-footer{display:flex;justify-content:space-between;align-items:center;margin:17px 3px 0;color:#61748f;font-size:11px;gap:12px}.site-footer a{text-decoration:none;color:#8b9bb1}.site-footer .text-button{font-size:11px;color:#7b8da6}.site-footer svg{width:13px;height:13px}.empty-state{position:absolute;inset:80px 0;text-align:center}.empty-state h2{margin-top:15px}.empty-state p{margin:10px 0;color:var(--muted)}.empty-state[hidden]{display:none}

dialog{border:1px solid #809ec53a;background:#101821;color:#edf2f7;padding:0;box-shadow:0 30px 100px #0009;max-height:90dvh;border-radius:16px}dialog::backdrop{background:#03070dcc;backdrop-filter:blur(9px)}dialog .close-dialog{position:absolute;top:15px;right:15px;z-index:3;background:#0b1425aa}.details-dialog{width:min(1020px,calc(100% - 48px));overflow:hidden}.details-dialog #detail-content{display:grid;grid-template-columns:39% 61%;position:relative;padding-bottom:55px;min-height:560px}.detail-visual{position:relative;background:radial-gradient(ellipse at 50% 48%,#2a416136,#090f1800 70%),linear-gradient(145deg,#0c1521,#121f30 70%,#0a131e);display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden}.detail-visual>.eyebrow{position:absolute;top:32px;left:30px;font-size:10px}.detail-visual .device-art{width:105%;z-index:1;filter:drop-shadow(0 22px 16px #0006)}.detail-visual.laptops .device-art{width:114%}.detail-platform{position:absolute;top:72%;left:16%;width:68%;height:26px;border:1px solid #88bdf954;border-radius:50%;background:#90b6ff08;box-shadow:0 0 20px #66a5ff26,inset 0 0 15px #66a5ff2e}.detail-year{position:absolute;bottom:35px;font-size:38px;font-weight:300;letter-spacing:-1px;color:#b3d3ff;z-index:1}.illustration-note{position:absolute;bottom:14px;color:#6e83a0;font-size:10px;letter-spacing:.4px}.detail-copy{min-width:0;max-height:calc(90dvh - 55px);display:flex;flex-direction:column}.detail-heading{padding:35px 46px 21px 32px}.detail-heading>.eyebrow{font-size:10px;color:#8db6ed}.detail-heading h2{font-size:29px;letter-spacing:-1px;line-height:1.15;margin-top:10px;font-weight:560}.detail-heading p{font-size:13px;color:#96a6bb;margin-top:9px;line-height:1.5}.detail-tabs{display:flex;gap:23px;border-bottom:1px solid var(--line);margin:0 32px;flex-shrink:0}.detail-tabs button{padding:11px 0 13px;position:relative;font-size:13px;color:#879ab4}.detail-tabs button[aria-selected=true]{color:#c4ddff}.detail-tabs button[aria-selected=true]:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#88baff}.tab-indicator{width:4px;height:4px;display:inline-block;background:#8ec2ff;vertical-align:top;border-radius:50%;margin:3px 0 0 4px}.detail-panel{padding:24px 32px 30px;overflow-y:auto;min-height:250px;scrollbar-width:thin;scrollbar-color:#52739c45 transparent;scroll-behavior:smooth}.device-story{font-size:15px;line-height:1.7;color:#bdc8d8}.date-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:23px 0}.date-grid>div{padding:14px 16px;border:1px solid #8baedf1d;border-radius:7px;background:#88add207}.date-grid span{font-size:9px;letter-spacing:1.15px;color:#7e96b5;display:block;margin-bottom:8px}.date-grid strong{font-size:17px;font-weight:450;color:#d7e7ff}.detail-panel h3{font-size:16px;font-weight:500;letter-spacing:-.15px;margin:22px 0 15px}.fun-facts{list-style:none;padding:0;display:grid;gap:14px;margin:0}.fun-facts li{display:flex;align-items:flex-start;gap:12px;font-size:13px;line-height:1.65;color:#acbdd1}.fun-facts svg{width:15px;height:15px;color:#7599c8;flex-shrink:0;margin-top:3px}.price-card{border:1px solid #8ab6e627;background:linear-gradient(110deg,#658cbd0d,#101e3000);border-radius:8px;padding:16px;margin:20px 0}.price-card>div{display:flex;align-items:center;justify-content:space-between;gap:16px}.price-card>div>span{font-size:12px;color:#9fb0c5}.price-card strong{font-size:23px;font-weight:450;white-space:nowrap;color:#d6e7ff}.price-card a{font-size:10px;color:#8aaddb;display:inline-flex;align-items:center;gap:5px;text-decoration:none;margin:8px 0}.price-card svg{width:10px;height:10px}.price-card p{font-size:10px;color:#68819f}.section-label{display:block;font-size:10px;letter-spacing:1.3px;color:#7d9ec9;margin-top:7px}.section-label+h3{margin-top:8px}.spec-table{margin:0 0 28px}.spec-table>div{display:grid;grid-template-columns:35% 65%;padding:12px 0;gap:8px;border-bottom:1px solid #98b8dd13;font-size:13px;line-height:1.5}.spec-table dt{color:#8398b3}.spec-table dd{margin:0;color:#c3d0e1;overflow-wrap:anywhere}.small-note{font-size:12px;line-height:1.7;color:#8499b4;margin:-5px 0 17px}.muted{font-size:14px;line-height:1.6;color:#92a6c0;margin-bottom:30px}.sources{border-top:1px solid #97b6e020;padding-top:17px;margin-top:27px}.sources summary{font-size:12px;color:#8a9db8;cursor:pointer}.sources summary span{font-size:10px;display:inline-block;margin-left:7px;color:#6681a4}.sources ul{list-style:none;padding:0;display:grid;gap:9px;margin-bottom:0}.sources a{font-size:12px;color:#9fbbdf;text-decoration:none;display:inline-flex;align-items:flex-start;gap:7px;line-height:1.5}.sources svg{width:11px;height:11px;flex-shrink:0;margin-top:3px}.sources a:hover{text-decoration:underline}.benchmark{border:1px solid #8ca9d326;border-radius:9px;padding:18px;margin-top:14px;background:#678cbd07}.benchmark>div{display:flex;align-items:center;justify-content:space-between;gap:20px}.benchmark>div>span{color:#b1c4df;font-size:13px}.benchmark strong{color:#b0d2ff;font-size:27px;font-weight:450;white-space:nowrap}.benchmark p{color:#8fa4c1;font-size:12px;line-height:1.6;margin:12px 0}.benchmark a{font-size:11px;color:#9dbde8;display:inline-flex;align-items:center;gap:6px;text-decoration:none}.benchmark a svg{width:11px;height:11px}.no-benchmark{text-align:center;padding:25px 10px 15px;color:#597899}.no-benchmark>svg{width:30px;height:30px}.no-benchmark p{font-size:14px;color:#acbed6;margin:15px 0 10px}.no-benchmark span{font-size:12px;line-height:1.6;color:#7e94b2}.upgrade-link{display:flex;align-items:center;gap:12px;background:#73aaff0a;border:1px solid #93bafa26;border-radius:8px;padding:15px;width:100%;margin-top:22px;text-align:left}.upgrade-link>svg{color:#80a8db;width:21px}.upgrade-link>span{flex:1;font-size:13px;color:#bcd4f6;line-height:1.5}.upgrade-link small{display:block;font-size:9px;color:#7292ba;letter-spacing:.8px;margin-bottom:6px}.upgrade-link:hover{background:#73aaff17}.detail-navigation{position:absolute;bottom:0;left:0;right:0;height:55px;display:flex;align-items:center;justify-content:space-between;padding:0 27px;border-top:1px solid #89ace326;background:#0c141f}.detail-navigation>span{font-size:11px;color:#587597}.detail-navigation .text-button{font-size:12px}.search-dialog{width:min(580px,calc(100% - 32px));max-height:80dvh;padding:23px}.search-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.search-heading h2{font-size:21px;font-weight:500;letter-spacing:-.5px}.search-field{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px solid #95b9e54a;border-radius:7px;background:#0c131e}.search-field>span{color:#88a6cf;display:inline-flex}.search-field svg{width:18px;height:18px}.search-field input{border:0;outline:0!important;background:none;color:#e5efff;width:100%;font-size:15px;min-width:0}.search-field input::placeholder{color:#667e9e}.search-results{overflow-y:auto;max-height:calc(80dvh - 155px);margin-top:10px;scrollbar-width:thin;scrollbar-color:#6581a85c transparent}.search-count{font-size:11px;color:#647e9f;padding:9px 2px}.search-result{display:flex;width:100%;align-items:center;gap:10px;text-align:left;padding:5px 8px 5px 0;border-radius:7px}.search-result:hover{background:#88b9ff0d}.search-result .device-art{width:57px}.search-result>span:nth-child(2){flex:1}.search-result strong{display:block;font-size:14px;font-weight:450;color:#cbd9ed}.search-result small{display:block;font-size:11px;color:#8096b4;margin-top:4px}.search-result>svg{width:16px;color:#6b89b1}.search-empty{font-size:14px;color:#93a9c5;padding:26px 0;text-align:center}.about-dialog{width:min(590px,calc(100% - 36px));padding:40px}.about-dialog h2{font-size:29px;letter-spacing:-.8px;line-height:1.2;margin:16px 0 22px;font-weight:500}.about-dialog p{font-size:14px;line-height:1.8;color:#a9b9ce;margin-bottom:16px}.about-dialog h3{font-size:16px;margin:27px 0 13px;font-weight:500}.about-dialog .about-signoff{font-size:12px;color:#7b98be;margin:25px 0 0;padding-top:20px;border-top:1px solid #a2c0e525}.skip-link{position:fixed;left:12px;top:-80px;background:#233d60;color:white;padding:10px 15px;border-radius:7px;z-index:100}.skip-link:focus{top:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{position:fixed;inset:20%;padding:30px;background:#101c2b;border:1px solid #7b9ecb;border-radius:15px;z-index:99}.noscript p{margin-top:15px;color:#a4b8d4}

@media(min-width:1600px){.app-shell{padding:35px 38px 20px}.site-header{gap:37px}.intro{font-size:14px}.filter{height:52px;padding:0 25px}.timeline-section{margin-left:-38px;margin-right:-38px;margin-top:32px}.timeline{height:570px}.device-node{top:41px;height:490px}.device-object{height:365px}.device-object .device-art,.device-node.phones .device-object .device-art{width:315px}.device-node.laptops .device-object .device-art{width:382px}.device-node.desktops .device-object .device-art{width:337px}.device-caption{top:388px}.connector{top:362px;height:102px}.timeline-dot{top:458px}.device-node.selected .timeline-dot{top:456px}.node-year{top:487px}.axis{bottom:66px}.quick-card{top:72px}.collection{padding-top:24px;padding-bottom:24px}.thumbnail{height:83px;flex-basis:51px;min-width:51px}.thumbnail .device-art{width:73px}.collection-group:nth-child(2) .thumbnail{flex-basis:73px;min-width:73px}.collection-group:nth-child(2) .thumbnail .device-art{width:94px}.collection-group:nth-child(3) .thumbnail .device-art{width:84px}.collection-heading{margin-bottom:20px}.explore-bar{margin-top:12px}.overview{margin-bottom:22px}.site-footer{margin-top:18px}.quick-card{width:265px}}
@media(min-width:1800px){.collection-group:nth-child(1) .thumbnail{flex:1 0 45px}.collection-group:nth-child(2) .thumbnail{flex:1 0 61px}.collection-group:nth-child(3) .thumbnail{flex:1 0 65px}.header-end p{font-size:14px}.site-header{gap:45px}.collection-group{padding:0 26px}.timeline{height:600px}.device-node{top:64px}.axis{bottom:72px}.timeline-topline{top:5px}.quick-card{top:99px}}
@media(max-width:1250px){.intro{display:none}.site-header{gap:22px}.header-end p{display:none}.filters{gap:7px}.filter{padding:0 18px}.collection-group{padding:0 17px}.collection{grid-template-columns:1fr 1fr 1fr}.collection-heading{gap:7px}.collection-heading>span{font-size:10px}.collection-group:nth-child(3) .thumbnail{flex:0 0 57px}.quick-card{width:250px}.site-header .identity h1{font-size:32px}}
@media(max-width:900px){.app-shell{padding:26px 24px 18px}.site-header{flex-wrap:wrap;gap:20px}.identity p{font-size:14px;margin-top:8px}.site-header .identity h1{font-size:32px}.header-end{order:2}.header-end p{display:block;font-size:12px}.filters{order:3;width:100%;justify-content:flex-start;margin:0;gap:9px}.filter{height:44px;flex:1;max-width:160px;padding:0 14px;font-size:13px}.filter svg{width:18px}.timeline-section{margin:22px -24px 0}.timeline{height:474px}.device-node{top:7px}.timeline-topline{left:32px;right:32px}.timeline-topline .eyebrow{font-size:9px}.timeline-topline #view-count{font-size:10px}.axis{bottom:56px}.device-node .timeline-dot{top:405px}.device-node.selected .timeline-dot{top:404px}.node-year{top:430px;font-size:14px}.explore-bar{margin-top:3px}.collection{grid-template-columns:1fr;padding:17px 0 10px;gap:17px}.collection-group{padding:0 19px}.collection-group+.collection-group{border-left:0;border-top:1px solid #a6c9f01a;padding-top:17px}.collection-heading{margin-bottom:8px}.collection-heading h2{font-size:15px}.collection-heading>span{font-size:11px}.thumbnail{height:72px;flex:0 0 47px}.collection-group:nth-child(2) .thumbnail{flex:0 0 69px}.collection-group:nth-child(3) .thumbnail{flex:0 0 69px}.thumbnail-strip{padding-bottom:4px}.collection-group:nth-child(3) .thumbnail .device-art{width:77px}.quick-card{display:none}.details-dialog{width:calc(100% - 36px)}.details-dialog #detail-content{grid-template-columns:35% 65%}.detail-heading{padding:28px 44px 18px 24px}.detail-heading h2{font-size:25px}.detail-tabs{margin:0 24px;gap:17px}.detail-panel{padding:21px 24px 27px}.detail-visual>.eyebrow{left:22px;font-size:9px}.detail-visual .device-art{width:125%}.detail-year{font-size:29px}.site-footer{margin-top:17px}.site-footer>span{font-size:10px}.drag-hint{font-size:12px}}
@media(max-width:600px){.app-shell{padding:23px 18px 18px}.site-header{gap:22px}.site-header .identity h1{font-size:30px;letter-spacing:-1.2px}.identity p{font-size:13px;letter-spacing:.6px}.header-end p{font-size:11px}.header-end{gap:8px}.header-end .icon-button{width:34px;height:34px}.filters{gap:6px}.filter{height:41px;font-size:11px;gap:6px;padding:0 10px}.filter svg{width:16px;height:16px}.filter:first-child{flex:1.15}.timeline-section{margin:23px -18px 0}.timeline-topline{left:24px;right:24px}.timeline{height:440px;mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent)}.device-node{top:18px;width:260px;height:383px}.device-object{width:255px;height:281px}.device-object .device-art,.device-node.phones .device-object .device-art{width:249px}.device-node.laptops .device-object .device-art{width:283px;transform:translateY(-12px)}.device-node.desktops .device-object .device-art{width:260px}.device-node.laptops.selected .device-object .device-art{transform:translateY(-17px) scale(1.02)}.device-platform{width:213px;height:23px;bottom:4px}.device-caption{top:295px;width:260px}.device-caption h2{font-size:14px}.device-caption p{font-size:11px;max-width:230px}.connector{top:278px;height:92px}.device-node .timeline-dot{top:365px}.device-node.selected .timeline-dot{top:364px}.node-year{top:391px;font-size:14px}.axis{bottom:52px}.timeline-arrow{width:35px;height:35px;top:44%;background:#0a14238c}.timeline-arrow svg{width:19px;height:19px}.previous{left:13px}.next{right:13px}.explore-bar{padding:0 31px;margin-top:6px}.drag-hint{gap:10px;font-size:11px}.drag-hint svg{width:14px;height:14px}.drag-hint [data-icon=hand] svg{width:22px;height:22px}.era-button{font-size:10px}.overview{width:60%;margin-top:9px;margin-bottom:14px}.overview .year-marker small{font-size:9px}.collection{border-radius:12px;padding-top:16px;gap:14px}.collection-group{padding-left:15px;padding-right:15px}.collection-group+.collection-group{padding-top:14px}.collection-heading{margin-bottom:7px}.collection-heading h2{font-size:14px}.collection-heading>span{font-size:10px}.thumbnail{height:65px;flex-basis:44px;min-width:44px}.thumbnail .device-art{width:61px}.collection-group:nth-child(2) .thumbnail{flex-basis:61px;min-width:61px}.collection-group:nth-child(2) .thumbnail .device-art{width:77px}.collection-group:nth-child(3) .thumbnail{flex-basis:59px;min-width:59px}.collection-group:nth-child(3) .thumbnail .device-art{width:70px}.site-footer{flex-direction:column;gap:5px;align-items:flex-start;padding:0 1px;margin-top:15px}.details-dialog{width:calc(100% - 20px);max-height:94dvh;border-radius:13px}.details-dialog #detail-content{display:flex;flex-direction:column;min-height:0;max-height:94dvh;padding-bottom:50px;overflow-y:auto;scrollbar-width:thin}.detail-visual{height:220px;min-height:220px;flex-shrink:0;overflow:hidden}.detail-visual>.eyebrow{top:23px;left:21px}.detail-visual .device-art{width:220px;margin-top:-12px}.detail-visual.laptops .device-art{width:245px;margin-top:-2px}.detail-visual.desktops .device-art{width:221px}.detail-platform{width:175px;left:50%;transform:translateX(-50%);height:19px;top:auto;bottom:35px}.detail-year{font-size:18px;bottom:20px;right:22px;letter-spacing:0}.illustration-note{left:20px;bottom:23px;font-size:9px}.detail-copy{max-height:none;overflow:visible;flex-shrink:0}.detail-heading{padding:23px 23px 14px}.detail-heading h2{font-size:27px;line-height:1.13}.detail-heading p{font-size:12px}.detail-tabs{margin:0 23px;justify-content:space-between;gap:12px}.detail-tabs button{font-size:12px}.detail-panel{overflow:visible;min-height:0;padding:20px 23px 25px}.device-story{font-size:14px;line-height:1.7}.date-grid{gap:10px;margin-top:18px}.date-grid>div{padding:12px}.date-grid strong{font-size:15px}.date-grid span{font-size:8px;letter-spacing:.8px}.detail-navigation{position:sticky;bottom:-50px;min-height:50px;margin-bottom:-50px;padding:0 16px}.detail-navigation .text-button{font-size:11px}.detail-navigation .text-button svg{width:13px}.detail-heading>.eyebrow{font-size:9px}.spec-table>div{font-size:12px;grid-template-columns:32% 68%}.detail-panel h3{font-size:15px}.fun-facts li{font-size:13px}.benchmark strong{font-size:22px}.about-dialog{padding:32px 25px}.about-dialog h2{font-size:26px;padding-right:10px}.about-dialog p{font-size:13px}.search-dialog{padding:19px}.search-field input{font-size:14px}.search-heading h2{font-size:20px}.search-result strong{font-size:13px}.search-result .device-art{width:51px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Compact controls and modal scroll containment. */
body:has(dialog[open]){overflow:hidden}
@media(max-width:600px){.filter{min-width:0;padding:0 7px;gap:5px;font-size:11px}.filter:first-child{flex:.8}.filter svg{width:14px;height:14px}.timeline-topline #view-count{font-size:10px}}
@media(max-width:360px){.header-end p{display:none}.header-end{margin-left:auto}.filter{padding:0 5px;gap:4px;font-size:10px}}

body{min-width:0}
@media(max-width:360px){.drag-hint>span:first-child,.drag-hint>span:last-child{display:none}.explore-bar{padding:0 24px}}
