/* Silver MacBook proposal — isolated from the published design. */
.illustrated-laptop{margin:0 18px 35px;padding:11px 10px 16px;border:1px solid #b5b5b8;border-radius:19px 19px 5px 5px;background:linear-gradient(130deg,#77787c 0%,#d5d5d7 .7%,#242427 1.4%,#111114 4%,#17171a 96%,#66666a 99%,#c2c2c5);box-shadow:0 2px 2px #00000018,0 25px 40px -28px #172b2460;position:relative}.illustrated-laptop:before{background:#141417;top:10px;left:44%;width:12%;height:10px;border-radius:0 0 6px 6px}.illustrated-laptop:after{content:"";position:absolute;top:12px;left:50%;width:3px;height:3px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#35546a,#080a12);z-index:21}.illustrated-laptop .mac-preview{height:400px;border:0;border-radius:7px 7px 2px 2px;background:radial-gradient(ellipse at 75% 90%,#eeeef6 0%,transparent 68%),#f9fbf8}.laptop-base{position:relative;top:16px;height:15px;margin:0 -40px -16px;border:0;border-top:1px solid #eeeef0;border-radius:2px 2px 45% 45%/2px 2px 100% 100%;background:linear-gradient(#dedee1 0%,#f4f4f6 13%,#c5c5ca 34%,#a6a7ad 65%,#85868c 83%,#d0d0d4 100%);box-shadow:0 5px 4px -4px #0005,0 17px 19px -11px #172c243a}.laptop-base:after{top:-1px;left:40%;height:5px;width:20%;border:0;border-radius:0 0 7px 7px;background:linear-gradient(#aaaab0,#d8d8dd);box-shadow:inset 0 1px 1px #7778}.how-product #how-caption{margin-top:33px}.illustrated-laptop .mac-menu{background:#f7f8f5dd}.how-layout{grid-template-columns:220px minmax(0,1fr);gap:35px}.native-list{top:92px}.native-body{padding-top:14px}.native-body h3{margin-bottom:10px}#native-tasks{max-height:130px}.how-section{padding-bottom:65px}@media(min-width:1100px){.how-layout{grid-template-columns:220px minmax(0,1fr);gap:40px}.illustrated-laptop .mac-preview{height:420px}}@media(max-width:560px){.illustrated-laptop{margin:0 14px 32px;padding:8px 7px 12px;border-radius:14px 14px 4px 4px}.illustrated-laptop .mac-preview{height:380px}.illustrated-laptop:before{top:8px}.illustrated-laptop:after{top:10px}.laptop-base{top:12px;margin:0 -25px -12px;height:12px}.how-layout{grid-template-columns:1fr}}
/* Forest-green bezel, silver base, with more space beside the steps. */
.illustrated-laptop{background:linear-gradient(130deg,#759084 0%,#b7c8bd .7%,#174d3b 1.4%,#103c2e 4%,#164a38 96%,#527363 99%,#99b1a3);border-color:#668372;margin-left:34px;margin-right:0}.illustrated-laptop:before{background:#103c2e}.illustrated-laptop:after{background:radial-gradient(circle at 35% 35%,#4a6d60,#081b15)}@media(max-width:900px){.illustrated-laptop{margin-left:18px;margin-right:18px}}@media(max-width:560px){.illustrated-laptop{margin-left:14px;margin-right:14px}}
/* Keep the hardware realistic: graphite bezel with a restrained green edge. */
.illustrated-laptop{background:linear-gradient(130deg,#779083 0%,#b9c6be .65%,#272b29 1.3%,#151917 4%,#1b201d 96%,#505e55 99%,#a0b0a5);border-color:#84968a;margin-left:48px;margin-right:-8px}.illustrated-laptop:before{background:#161b18}.illustrated-laptop:after{background:radial-gradient(circle at 35% 35%,#456052,#07100c)}.laptop-base{height:18px;background:linear-gradient(#e2e3e5 0%,#fafafa 12%,#d1d2d6 30%,#a9abb1 64%,#888b91 82%,#cacdd0 100%)}@media(max-width:900px){.illustrated-laptop{margin-left:18px;margin-right:18px}}@media(max-width:560px){.illustrated-laptop{margin-left:14px;margin-right:14px}}

/* One proportional desktop, so app UI scales with the laptop screen. */
.illustrated-laptop .mac-preview{height:auto;aspect-ratio:1120/650;position:relative}.demo-canvas{position:absolute;left:0;top:0;width:1120px;height:650px;transform-origin:0 0;--panel-colour:#d1cff5}.demo-canvas .native-list{left:65px;top:120px;width:365px;max-width:none}.demo-canvas .native-body{padding:22px}.demo-canvas .native-body h3{font-size:32px;margin-bottom:18px}.demo-canvas #native-tasks{max-height:205px}.demo-canvas .preview-work{inset:125px 40px 45px 260px}.demo-canvas .ambient-window{left:80px;right:180px;top:190px;height:355px}.demo-canvas .native-panel{height:40px;top:45px;left:4%;width:92%}.demo-canvas .mac-menu{height:32px;font-size:12px;padding:0 20px}.demo-canvas .quick-settings{top:115px;max-height:420px}.demo-canvas .settings-body{max-height:355px}.demo-canvas .voice-preview{top:170px}.how-layout{grid-template-columns:230px minmax(0,1fr);gap:65px}.illustrated-laptop{margin-left:55px;margin-right:-18px}@media(max-width:900px){.how-layout{grid-template-columns:1fr;gap:30px}.illustrated-laptop{margin-left:18px;margin-right:18px}}@media(max-width:560px){.illustrated-laptop{margin-left:14px;margin-right:14px}}
/* Share the hero's outer grid; the silver base ends on its right boundary. */
@media(min-width:901px){.how-section.wrap{max-width:1280px;padding-left:32px;padding-right:32px}.illustrated-laptop{margin-left:55px;margin-right:30px}}