/* Interactive studio: a heated metal frame and a dimensional design object. */
.forge-lab{isolation:isolate;border-color:#ba8c524d;border-radius:8px;background:linear-gradient(135deg,#26323a,#09151f 60%);box-shadow:inset 0 1px #e4d7be22,0 30px 85px #0007;overflow:hidden}.forge-lab:before{inset:0;width:auto;height:auto;padding:1px;border-radius:8px;z-index:4;pointer-events:none;background:conic-gradient(from var(--molten-border-angle),#65402544 0deg,#84532744 150deg,#ff9d3a 240deg,#ffe0ad 263deg,#b7521455 290deg,#65402544 360deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:studio-perimeter 16s linear infinite;animation-play-state:paused;box-shadow:none}.studio-visible .forge-lab:before{animation-play-state:running}.lab-toolbar{padding:25px 28px;background:radial-gradient(ellipse at 5% 100%,#d96a1428,transparent 65%),linear-gradient(120deg,#2e393e,#101d26);border-color:#e0b7802c}.lab-brand{font-size:9px;letter-spacing:.16em;color:#d8b891}.lab-brand:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#ffc277;box-shadow:0 0 12px #f18c2844;margin-right:11px}.lab-tabs{padding:5px;border-radius:4px;background:#08131b;border-color:#b4a07c33;gap:5px}.lab-tab{position:relative;border-radius:2px;font-size:11px;padding:13px 19px;transition:background .4s,color .4s,box-shadow .4s}.lab-tab[aria-selected=true]{background:linear-gradient(140deg,#674323,#282a27 80%);box-shadow:inset 0 1px #f6c48a77,inset 0 -2px #e8933b55,0 0 20px #f5801909;color:#ffe0b2}.lab-description{background:linear-gradient(150deg,#263139c7,#111e27e0);padding:40px 30px;border-color:#d0a66b22}.lab-description h3{font-size:clamp(31px,3vw,43px);letter-spacing:-.035em;line-height:1.13}.lab-description h3 em{background:var(--heat);background-clip:text;color:transparent}.lab-stage{background-color:#09151f;background-image:radial-gradient(ellipse at 50% 65%,#dc691819,transparent 58%),linear-gradient(#bdbdb607 1px,transparent 1px),linear-gradient(90deg,#bdbdb607 1px,transparent 1px);background-size:auto,48px 48px,48px 48px;padding:55px 30px 35px;perspective:1600px}.lab-stage:before{width:80%;height:55%;top:29%;border:1px solid #dfac6533;transform:rotateX(67deg);box-shadow:0 0 0 24px #f58f2704,inset 0 0 45px #f28c2310,0 0 75px #d9781810;opacity:.7;animation:studio-floor 9s ease-in-out infinite;animation-play-state:paused}.studio-visible .lab-stage:before{animation-play-state:running}.demo-browser{max-width:620px;border-color:#d7b78888;box-shadow:0 2px 0 #d19a5355,10px 14px 0 #1b2b34,10px 14px 0 1px #8d8f7833,0 35px 65px #000b;transform:perspective(1400px) rotateY(-7deg) rotateX(5deg);transition:width .8s cubic-bezier(.22,1,.36,1),transform 1s cubic-bezier(.22,1,.36,1),border-radius .7s}.demo-browser.is-phone{transform:perspective(1400px) rotateY(-4deg) rotateX(2deg);box-shadow:0 2px 0 #d19a5355,7px 10px 0 #1b2b34,0 25px 50px #000a}.demo-chrome{height:34px;background:linear-gradient(#364247,#17242d);border-color:#d8bb8233}.demo-site{background:radial-gradient(ellipse at 85% 65%,color-mix(in srgb,var(--lab-accent) 13%,transparent),transparent 55%),#0b161e}.demo-content{padding:29px;min-height:340px}.demo-site-title{font-size:clamp(27px,4.7cqw,42px);letter-spacing:-.035em}.demo-site-grid{grid-template-columns:1.1fr .9fr;gap:15px;margin-top:43px}.demo-sculpture{height:175px;transform:none;perspective:650px;transform-style:preserve-3d}.demo-sculpture:before,.demo-sculpture:after{display:none}.studio-core{position:absolute;width:69px;height:69px;border-radius:50%;background:radial-gradient(circle at 32% 25%,#eef2e95c,#71818b66 13%,#132731 37%,#08151f 65%,color-mix(in srgb,var(--lab-accent) 38%,#101a22) 95%);box-shadow:inset -5px -6px 12px #0008,inset 2px 2px 6px #edf0d622,0 8px 20px #0006}.studio-orbit{position:absolute;width:122px;height:122px;border-radius:50%;border:9px solid transparent;background:linear-gradient(#16252c,#16252c) padding-box,conic-gradient(from 40deg,#fff1cc,var(--lab-accent),#6b3417,#ffc986,#fff5dc,var(--lab-accent),#fff1cc) border-box;box-shadow:inset 1px 1px 2px #ffe2b988,2px 4px 0 #241b13,0 0 20px color-mix(in srgb,var(--lab-accent) 16%,transparent);transform-style:preserve-3d;animation:studio-orbit-a 13s linear infinite;animation-play-state:paused;backface-visibility:visible}.studio-orbit.orbit-b{width:94px;height:94px;border-width:5px;animation-name:studio-orbit-b;animation-duration:17s;box-shadow:1px 3px 0 #241b13,0 0 13px color-mix(in srgb,var(--lab-accent) 13%,transparent)}.studio-orbit.orbit-c{width:147px;height:147px;border-width:1px;opacity:.4;animation-name:studio-orbit-c;animation-duration:23s;background:none;border-color:var(--lab-accent);box-shadow:none}.studio-visible .studio-orbit{animation-play-state:running}.lab-control{border-radius:3px;padding:11px 13px;background:#0b1820;border-color:#9d9f8d33;transition:border-color .3s,background .3s,box-shadow .3s}.lab-control[aria-pressed=true]{border-color:#e9b77b;background:#6a441e33;box-shadow:inset 0 1px #eac18d33,0 0 15px #f39c1910}.tone-dot{width:10px;height:10px;box-shadow:inset 0 1px #fff6,0 0 10px color-mix(in srgb,var(--dot) 22%,transparent)}.lab-bottom{background:#0a1620;border-top-color:#d8a2672b;padding:18px 28px}.lab-panel-enter{animation:studio-panel-enter .65s cubic-bezier(.22,1,.36,1)}.demo-note{color:#99acb5!important;font-size:9px!important;letter-spacing:.05em}.studio-changing .demo-browser{animation:studio-design-shift .55s cubic-bezier(.22,1,.36,1)}
@keyframes studio-orbit-a{from{transform:rotateX(57deg) rotateY(-25deg) rotateZ(0deg)}to{transform:rotateX(57deg) rotateY(-25deg) rotateZ(360deg)}}@keyframes studio-orbit-b{from{transform:rotateX(-30deg) rotateY(65deg) rotateZ(0deg)}to{transform:rotateX(-30deg) rotateY(65deg) rotateZ(-360deg)}}@keyframes studio-orbit-c{from{transform:rotateX(65deg) rotateY(30deg) rotateZ(0deg)}to{transform:rotateX(65deg) rotateY(30deg) rotateZ(360deg)}}@keyframes studio-floor{0%,100%{opacity:.4;scale:.95}50%{opacity:.85;scale:1.04}}@keyframes studio-perimeter{to{--molten-border-angle:360deg}}@keyframes studio-panel-enter{from{opacity:.2;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes studio-design-shift{0%{filter:brightness(1)}40%{filter:brightness(1.15)}100%{filter:brightness(1)}}
@media(max-width:700px){.lab-toolbar{padding:20px}.lab-tabs{margin-top:15px}.lab-tab{padding:12px 10px;font-size:10px}.lab-description{padding:30px 24px}.lab-description h3{font-size:36px}.lab-stage{padding:42px 23px 30px}.demo-content{padding:23px;min-height:320px}.demo-site-grid{gap:8px}.studio-orbit{width:96px;height:96px;border-width:7px}.studio-orbit.orbit-b{width:74px;height:74px;border-width:4px}.studio-orbit.orbit-c{width:115px;height:115px}.studio-core{width:52px;height:52px}.lab-bottom{padding:17px 20px}.demo-sculpture{height:135px}}
@container forge-demo (max-width:330px){.demo-content{min-height:385px;padding:22px 18px}.demo-site-grid{grid-template-columns:1fr}.demo-sculpture{position:absolute;right:0;bottom:-72px;width:90px;height:100px;opacity:.65}.demo-site-title{font-size:30px}.studio-orbit{width:80px;height:80px;border-width:5px}.studio-orbit.orbit-b{width:60px;height:60px;border-width:3px}.studio-orbit.orbit-c{width:95px;height:95px}.studio-core{width:44px;height:44px}.demo-site-footer{margin-top:70px}}
@media(prefers-reduced-motion:reduce){.forge-lab:before,.studio-orbit,.lab-stage:before,.lab-panel-enter,.studio-changing .demo-browser{animation:none!important}.demo-browser,.demo-browser.is-phone{transform:none;transition:none}}
.motion-paused .forge-lab:before,.motion-paused .studio-orbit,.motion-paused .lab-stage:before{animation-play-state:paused!important}.motion-paused .lab-panel-enter,.motion-paused .studio-changing .demo-browser{animation:none!important}