/* Slow material light and recognisable O silhouettes, always behind the reading plane. */
/* Centre the desktop compositions against the actual browser content area. */
@media(min-width:701px){
 .opening .copy,.making .copy{top:50%;translate:0 -50%}
 .making .workbench{inset:16% 5% 16% 43%}
 .opening h1{font-size:clamp(58px,min(7.3vw,12.5svh),126px)}
 .making h2{font-size:clamp(54px,min(6.5vw,12svh),112px)}
.calm .opening .copy,.calm .making .copy{translate:0 -50%}
}
.opening h1 span,.opening h1 em{display:block}
.opening h1 span:nth-child(2){margin-left:clamp(8px,1.3vw,24px)}
.opening h1 em{margin-left:clamp(18px,3vw,56px)}
.tier-art.essential-art img,.tier-art.expressive-art img{filter:brightness(0) invert(1);opacity:1}
.tier-art.expressive-art img+img{opacity:.3}
.ambient:after{background:radial-gradient(ellipse at 70% 55%,#16362b33,transparent 65%)!important;opacity:var(--make)!important}.making{color:#eee6d6}.making em{color:#d4aa78}.making .description{color:#d0c4af}.making .paper{border:1px solid #e3ceb14a;backdrop-filter:blur(18px);box-shadow:0 25px 70px #0005}.making .sketch{background:linear-gradient(140deg,#394b3dcc,#182a23b8);color:#dfcdb0}.making .sketch svg{stroke:#dfbd8b;stroke-width:1.7;filter:drop-shadow(0 0 5px #d4a45d55)}.making .sketch i{color:#ead8bb;font-family:Display,Arial,sans-serif;font-style:normal;font-weight:800;font-size:clamp(15px,1.8vw,28px);line-height:1.05;letter-spacing:-.035em}.making .type{background:linear-gradient(130deg,#241f19e6,#76532d99);color:#f3e8d3}.making .type strong{color:#f0d5ab;text-shadow:0 3px 25px #efc58222}.making .material{background:radial-gradient(ellipse at 25% 15%,#bd966480,#1b372bb3 65%);border:1px solid #e3ceb14a;backdrop-filter:blur(12px);box-shadow:0 25px 60px #0004}.making .material>span{color:#f1dfc2}.making .swatches{border:1px solid #e3ceb155;box-shadow:0 15px 35px #0005}.making .swatches i:nth-child(1){background:#192d27}.making .swatches i:nth-child(2){background:#6c9884}.making .swatches i:nth-child(3){background:#ae773f}.making .swatches i:nth-child(4){background:#e8d4ad}.making .scene-caption{color:#ddcdb3;opacity:.9}body.calm .making,body:not(.enhanced) .making{background:linear-gradient(125deg,#172c25dd,#63401dcc)}
.travelling-o{max-width:880px}.liquid-o{position:absolute;inset:0;pointer-events:none}.travelling-o.metal-ready>img,.travelling-o.metal-ready>.glint{opacity:0}.calm .liquid-o{display:none}.gradient-canvas{filter:saturate(1.25) contrast(1.12)}
body{background:#191d1b}.brand-atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;isolation:isolate;background:radial-gradient(ellipse at 80% 25%,#78674770,transparent 65%),radial-gradient(ellipse at 45% 100%,#82472870,transparent 75%),#191d1b}.gradient-canvas{position:absolute;inset:0;opacity:.86;transition:opacity 1.2s ease}.gradient-canvas[data-status=paused],.gradient-canvas[data-status=unavailable]{opacity:0}.atmosphere-shade{position:absolute;inset:0;background:linear-gradient(90deg,#171b1bee 0%,#1c1c1ba8 38%,#151a1a28 76%),linear-gradient(0deg,#171b1b9e,transparent 35%,#171b1b4d);z-index:1}.logo-echoes{position:absolute;inset:-7%;z-index:2;transform:translate(var(--pointer-x,0px),var(--pointer-y,0px));will-change:transform}.logo-echo{position:absolute;width:49vw;aspect-ratio:1;mask:url('assets/offscript-mark.png') center/contain no-repeat;-webkit-mask:url('assets/offscript-mark.png') center/contain no-repeat;background:linear-gradient(140deg,#c7b79670,#c5976022 55%,#72867844);opacity:.2;animation:logo-breathe 25s ease-in-out infinite alternate;transform:rotate(-15deg)}.logo-echo.one{left:-24%;top:13%;width:60vw}.logo-echo.two{left:27%;top:-42%;animation-delay:-11s;transform:rotate(18deg)}.logo-echo.three{right:-13%;bottom:-35%;width:61vw;animation-delay:-18s;transform:rotate(-26deg)}.atmosphere-grain{position:absolute;inset:0;z-index:3;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23g)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E");mix-blend-mode:soft-light}.stage{background:transparent}.ambient{background:radial-gradient(ellipse at 75% 50%,#bf81321a,transparent 60%)}.ambient:after{opacity:calc(var(--make) * .93)}.offer{background:#e8e1d1f2;overflow:hidden;isolation:isolate}.offer:before{content:'';position:absolute;z-index:-1;right:-26%;top:-8%;width:95vw;aspect-ratio:1;mask:url('assets/offscript-mark.png') center/contain no-repeat;-webkit-mask:url('assets/offscript-mark.png') center/contain no-repeat;background:linear-gradient(140deg,#ad855312,#6e71501a);transform:rotate(-19deg)}.offer:after{content:'';position:absolute;z-index:-2;inset:0;background:radial-gradient(ellipse at 90% 0%,#bc956b1a,transparent 65%);opacity:.8}.brand-atmosphere[data-paused=true] .logo-echo{animation-play-state:paused}.calm .logo-echoes{transform:none}.calm .brand-atmosphere .logo-echo{animation:none}
@keyframes logo-breathe{from{translate:0 0;opacity:.16}to{translate:0 22px;opacity:.3}}
@media(max-width:700px){.gradient-canvas{opacity:.75}.atmosphere-shade{background:linear-gradient(180deg,#171b1bc9 0%,#171b1ba8 43%,#171b1b33 80%,#171b1b88)}.logo-echo.one{width:120vw;left:-55%;top:20%}.logo-echo.two{width:100vw;left:30%;top:-17%}.logo-echo.three{width:130vw;right:-53%;bottom:-7%}.offer:before{width:180vw;right:-95%;top:10%}}
@media(prefers-reduced-motion:reduce){.logo-echo{animation:none}.logo-echoes{transform:none}.gradient-canvas{transition:none}}
/* One metal identity, including the device studies and pricing illustrations. */
.brand-metal{aspect-ratio:1;background:url('assets/offscript-mark.png') center/contain no-repeat;pointer-events:none}
.brand-metal:has(canvas){background:none}
.tier-art .brand-metal{width:105px;height:105px;position:relative}
.expressive-art .brand-metal{width:125px;height:125px}
.immersive-art .brand-metal{width:185px;height:185px}
.immersive-art{cursor:crosshair;touch-action:pan-y}
.immersive-art .brand-metal{transition:transform .18s ease}
.immersive-art .immersive-hint{position:absolute;right:8px;bottom:4px;font:7px ui-monospace,monospace;letter-spacing:.08em;color:#cab38f;opacity:.8}
.making .type{top:0}
@media(hover:none){.immersive-art .immersive-hint{display:none}}
.device-hero .brand-metal{height:auto;aspect-ratio:1}
.sketch svg{overflow:visible}
.sketch .study{stroke-dasharray:1100;stroke-dashoffset:1100;opacity:0;animation:sketch-study 15s linear infinite}
.sketch .study-two{animation-delay:3s}
.sketch .study-three{animation-delay:6s}
.sketch .study-four{animation-delay:9s}
.sketch .study-five{animation-delay:12s}
.making[inert] .study{animation-play-state:paused}
.sketch .study-guide{opacity:.22;stroke-dasharray:3 5;stroke-dashoffset:0}
@keyframes sketch-study{0%{opacity:1;stroke-dashoffset:1100}15%{opacity:1;stroke-dashoffset:0}19%{opacity:1;stroke-dashoffset:0}20%,100%{opacity:0;stroke-dashoffset:0}}
.calm .sketch .study{animation:none;opacity:0}.calm .sketch .study-five{opacity:1;stroke-dashoffset:0}
@media(prefers-reduced-motion:reduce){.sketch .study{animation:none;opacity:0}.sketch .study-five{opacity:1;stroke-dashoffset:0}}
.support-plan{border-top:1px solid #c1a68155;padding:22px 0}
.support-plan summary{display:flex;justify-content:space-between;gap:18px;cursor:pointer;list-style:none}
.support-plan summary::-webkit-details-marker{display:none}
.support-plan summary strong{font-size:26px;letter-spacing:-.03em;display:block}
.support-plan .support-price{display:block;margin:10px 0;font-size:38px}
.support-plan .support-price small{font:11px ui-monospace,monospace}
.support-toggle{font-size:11px;color:#c7bda9}.support-plan summary b{font-size:24px;color:#d4ae7f;font-weight:400}
.support-plan[open] summary b{transform:rotate(45deg);align-self:flex-start}
.support-detail{padding-top:18px}.support-detail p{font-size:13px;margin-bottom:14px}

/* The metal shader is the object itself: no offset mask or duplicate silhouette. */
.travelling-o,.brand-metal{filter:none}
.tier-art .sculpt-mark{display:block;position:relative;width:112px;height:112px;flex:none;transform:none}
.sculpt-mark::after{content:"";position:absolute;inset:0;mask:url('assets/offscript-mark.png') center/contain no-repeat;-webkit-mask:url('assets/offscript-mark.png') center/contain no-repeat;background:radial-gradient(ellipse at 27% 13%,#fffdf6 0%,#e9ddca 38%,#bcae9b 72%,#f2e8db 94%)}
.expressive-art{--pair-x:0px;--pair-y:0px;--pair-tilt:0deg;--first-turn:-17deg;--second-turn:19deg;cursor:crosshair;touch-action:pan-y}
.expressive-pair{position:relative;display:block;width:190px;height:150px;transform:translate(var(--pair-x),var(--pair-y)) rotate(var(--pair-tilt));pointer-events:none}
.expressive-pair .sculpt-mark{position:absolute;left:50%;top:50%;width:118px;height:118px;filter:drop-shadow(0 9px 5px #11130d80)}
.expressive-pair .link-first{z-index:2;transform:translate(-50%,-50%) translate(-31px,-8px) rotate(var(--first-turn))}
.expressive-pair .link-second{z-index:1;transform:translate(-50%,-50%) translate(31px,8px) rotate(var(--second-turn))}
.expressive-pair .link-second::after{background:radial-gradient(ellipse at 24% 12%,#f6dfb5 0%,#d0a776 36%,#8b5f3e 76%,#e1bc8e 96%)}
.expressive-hint{position:absolute;right:8px;bottom:4px;font:9px ui-monospace,monospace;letter-spacing:.08em;color:#cab38f;opacity:.85;pointer-events:none}
@media(hover:none){.expressive-hint{font-size:0}.expressive-hint::after{content:"TAP TO MOVE ↗";font-size:9px}}
@media(prefers-reduced-motion:reduce){.expressive-hint{display:none}}
.calm .expressive-hint{display:none}
@media(max-width:700px){.tier-art .sculpt-mark{width:95px;height:95px}.expressive-pair{width:170px;height:130px}.expressive-pair .sculpt-mark{width:100px;height:100px}}

/* Keep the supplied founder portrait uncropped and true to its colour. */
.founder-photo>img{aspect-ratio:2/3;object-position:center;filter:none}
