/* 8086: restrained product-first system, independent of the retained 8085. */
/* One approved 3:2 master, with a protected portrait crop (x≈22–75%).
   Keep drawings, tablet and BOTH bench feet inside the mobile window.
   Do not cap height independently: that would change the protected crop. */
.studio86 .s86-learn-hero{display:block;width:100%;aspect-ratio:8 / 5;overflow:hidden;border-radius:18px;background:#f5f5f7}
.studio86 .s86-learn-hero>img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;object-position:47% 50%;border-radius:inherit}
@media(max-width:700px){
 .studio86 .s86-learn-hero{aspect-ratio:4 / 5;border-radius:12px}
}
body.studio86{--s85-ink:#1d1d1f;--s85-muted:#6e6e73;--s85-line:#dedee1;--s85-paper:#fff;--s85-green:#0066cc;--s86-footer-gap:105px;background:#fff;color:#1d1d1f}
/* Preserve the header snapshot across same-origin document navigation. */
@view-transition{navigation:auto}
.studio86 .odic-header{view-transition-name:odic-header}
::view-transition-group(odic-header){animation-duration:0s;z-index:100}
::view-transition-old(odic-header){animation:none;opacity:0}
::view-transition-new(odic-header){animation:none;mix-blend-mode:normal}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
.studio86 .odic-nav__webapp{min-width:58px;justify-content:center}
.studio86 .s85-details{padding-bottom:104px}
.studio86 .s85-spec-list>div:last-child{border-bottom:0}
@media(max-width:700px){.studio86 .s85-details{padding-bottom:80px}}
/* 8080's fixed 48px glass header; its original rules live in main.css. */
body.studio86{padding-top:calc(48px + env(safe-area-inset-top))}
.studio86 .odic-header{color:var(--odic-text);font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.5}
/* Keep the navigation in its established 40px row. */
.studio86 .odic-header .odic-header__inner{height:40px;transform:none}
/* Apply glass on the transition element itself: a child backdrop cannot
   sample page content outside the header's view-transition backdrop root. */
.studio86 .odic-header{background:rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 0 26px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.8),inset 0 -1px 0 rgba(255,255,255,.5)}
.studio86 .odic-header .odic-header__glass{bottom:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
/* Only type size changes: match the announcement at both breakpoints. */
body.studio86{--s86-toolbar-font-size:14px}
.studio86 .odic-nav a,.studio86 .odic-early__bar{font-size:var(--s86-toolbar-font-size)}
@media(max-width:700px){body.studio86{--s86-toolbar-font-size:13px}}
.studio86 .s85-button{background:#1c1c1e;color:#fff!important;border-color:transparent;border-radius:999px;font-size:15px;padding:0 23px;height:40px;min-height:40px;box-sizing:border-box;line-height:1.2}
.studio86 .s85-button:hover{background:#333;transform:none}
.studio86 .s85-button--outline{background:transparent;color:#1c1c1e!important;border-color:#1c1c1e}
.studio86 .s85-button--outline:hover{background:#1c1c1e;color:#fff!important}
.studio86 .s85-eyebrow{color:#6e6e73}
.studio86 .s85-eyebrow .s86-webapp-link{color:#0066cc;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.studio86 .s85-eyebrow .s86-webapp-link:hover{color:#004c99}
.studio86 .s85-eyebrow .s86-webapp-link:focus-visible{outline:2px solid #0066cc;outline-offset:4px;border-radius:2px}
.studio86 .s85-feature-section--tinted,.studio86 .s85-value{background:#f5f5f7}
.studio86 .s85-value-notes article+article{border-color:#dedee1}
.studio86 .s85-gallery-stage,.studio86 .s85-video{background:#f5f5f7}
.studio86 .s85-feature-note{border-color:#d3d3d7}
.studio86 .s85-option{background:#fafafa;border-color:#e5e5e7}
.studio86 .s85-option li{border-color:#e5e5e7}
.studio86 .s85-board-name{color:#6e6e73}
.studio86 .s85-included,.studio86 .s85-form-notice,.studio86 .s85-policy-preview{background:#f5f5f7;color:#454549;border-color:#e5e5e7}
.studio86 .s85-included p,.studio86 .s85-form-hint,.studio86 .s85-policy-preview strong{color:#6e6e73}
.studio86 .s85-size-picker label>span{border-color:#d2d2d7}
.studio86 .s85-size-picker input:checked+span{border-color:#0066cc;background:#f4f8ff;box-shadow:inset 0 0 0 1px #0066cc}
.studio86 .s85-size-picker input{accent-color:#0066cc}
.studio86 .s85-legal-grid aside [aria-current]{background:#f5f5f7}
.studio86 .s85-form{background:#fafafa;border-color:#e5e5e7}
.studio86 .s85-form :is(input,select,textarea),.studio86 .odic-early__field :is(input,select){border-color:#c8c8cd;color:#1d1d1f}
.studio86 .odic-early{position:fixed;top:auto;bottom:0;left:0;right:0;z-index:70;padding-bottom:env(safe-area-inset-bottom);background:#f5f5f7;border-top:1px solid #e9e9ed;border-bottom:0;box-shadow:0 -4px 24px #1c1c1e06}
.studio86 .odic-early__panel{top:auto;bottom:calc(100% + 8px);left:12px;right:12px;width:auto;max-width:1120px;margin-inline:auto;border:1px solid #e9e9ed;border-radius:24px;padding-inline:40px;transform-origin:bottom center;max-height:calc(100dvh - var(--s86-header-height,calc(48px + env(safe-area-inset-top))) - 80px - env(safe-area-inset-bottom))}
body.studio86{--s86-bottom-notice:0px}
body.studio86:has(.odic-early:not([hidden])){--s86-bottom-notice:calc(40px + env(safe-area-inset-bottom));padding-bottom:var(--s86-bottom-notice)}
/* Override the legacy header script's inline bottom offset. */
.studio86 .odic-back-to-top{bottom:calc(24px + var(--s86-bottom-notice))!important}
.studio86:has(.odic-early:not([hidden]) details[open]) .odic-back-to-top{opacity:0;visibility:hidden;pointer-events:none}
@media(max-width:700px){.studio86 .odic-early__panel{left:10px;right:10px;padding:24px 22px;border-radius:20px}.studio86 .odic-back-to-top{bottom:calc(16px + var(--s86-bottom-notice))!important}}
.studio86 .odic-early__bar{height:40px;min-height:40px;align-items:center;justify-content:center;background:#f5f5f7;border-color:#e9e9ed}
.studio86 .odic-early__dismiss{top:0;width:40px;height:40px}
.studio86 .odic-early__panel{background:#ffffffe3;backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px);box-shadow:0 -12px 40px #00000010}
.studio86 .odic-early__intro>p:not(.odic-early__eyebrow),.studio86 .odic-early__consent,.studio86 .odic-early__terms,.studio86 .odic-early__footnote{color:#626267}
.studio86 .odic-early__submit{background:#1c1c1e;color:#fff;border-radius:999px;height:40px;min-height:40px;padding:0 23px;box-sizing:border-box;line-height:1.2}
.studio86 .odic-early__submit:hover{background:#333}
.studio86 .s85-footer{position:relative;margin-top:0;background:#191a1d;color:#f5f5f7;border-top:0;padding-top:48px;--footer-shoulder-height:clamp(24px,2.3vw,44px);--footer-shoulder-width:clamp(86px,14vw,270px)}
/* Smooth mirrored shoulders rise into the final section and share the footer fill. */
.studio86 .s85-footer::before,.studio86 .s85-footer::after{content:"";position:absolute;bottom:calc(100% - 1px);width:var(--footer-shoulder-width);height:var(--footer-shoulder-height);background:inherit;pointer-events:none;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 44' preserveAspectRatio='none'%3E%3Cpath d='M0 0H132C166 0 174 44 218 44H240V45H0Z'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 44' preserveAspectRatio='none'%3E%3Cpath d='M0 0H132C166 0 174 44 218 44H240V45H0Z'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
.studio86 .s85-footer::before{left:0}.studio86 .s85-footer::after{right:0;transform:scaleX(-1)}
.studio86 .s85-footer-top{padding-bottom:36px}
.studio86 .s85-footer-top>div>p{font-size:22px}
.studio86 .s85-footer-top nav>span{color:#a7a7ae}
.studio86 .s85-footer a{color:#f5f5f7}
.studio86 .s85-footer a:hover{color:#fff}
.studio86 .s85-footer .s85-brand img{filter:brightness(0) invert(1)}
.studio86 .s85-footer-bottom{border-color:#37373d;color:#a7a7ae}
.studio86 .s85-footer-bottom a{color:#c5c5cd}
.studio86 .s85-preview-note{color:#a7a7ae}
.studio86 .s85-lightbox{background:#fff}

/* Four visual chapters. No feature list or FAQ repeated on the homepage. */
.s86-home{overflow:clip}
.s86-kicker{font-size:12px;line-height:1.5;font-weight:600;letter-spacing:.13em;margin:0 0 20px;color:#6e6e73}
.s86-hero{position:relative;text-align:center;background:linear-gradient(#f5f5f7 0%,#fbfbfc 60%,#f5f5f7 100%);padding:48px 0 26px}
.s86-hero-copy{position:relative;z-index:1}
.s86-hero .s86-kicker{font-size:15px;letter-spacing:.1em;color:#303035;margin-bottom:12px}
.studio86 .s86-hero h1{font-size:clamp(48px,5.2vw,76px);line-height:1.05;letter-spacing:-.055em;font-weight:600;margin:0}
.s86-mobile-break{display:none}
.s86-hero-intro{font-size:21px;font-weight:400;line-height:1.5;letter-spacing:-.02em;color:#333333;margin:12px 0 18px}
.studio86 .s86-hero-year{color:#333333;font-weight:400;font-size:inherit}
.studio86 .s85-lead,.studio86 .s86-chapter-head>p:last-child,.studio86 .s86-launch>p:not(.s86-kicker):not(.s86-launch-fine){color:#333333}
.s86-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:14px}
.s86-device-stage{position:relative;width:min(562px,calc(100% - 32px));max-width:562px;margin:44px auto 0}
.s86-device-stage .odic-hero__device{width:100%;max-width:none;margin:0}
.s86-device-stage .odic-device-card{width:100%;filter:drop-shadow(0 24px 28px #30303a20)}
/* Both handles are anchored to the same screen box, never to the outer bezel. */
.s86-device-stage .odic-device-card__pin{top:56%;height:11.81%;width:2px;z-index:3}
.s86-device-stage .odic-device-card__pin--l{left:1px;right:auto}
.s86-device-stage .odic-device-card__pin--r{right:1px;left:auto}
.s86-device-stage .s86-device-from-8080 .odic-device-card__pin{top:55.42%;height:10.15%;width:2px}
.s86-device-stage .s86-device-from-8080 .odic-device-card__pin--l{left:4.08%;right:auto}
.s86-device-stage .s86-device-from-8080 .odic-device-card__pin--r{left:95.75%;right:auto}
.s86-parent-child-bubble,.s86-code-bubble{position:absolute;inset:-20%;width:140%;height:140%;max-width:none;overflow:visible;pointer-events:none}
.s86-hero-caption{font-size:13px;line-height:1.7;color:#6e6e73;margin:28px 24px 0}
.s86-hero-caption a{color:#0066cc;margin-left:8px}
.s86-hero-caption a:hover{text-decoration:underline;text-underline-offset:3px}
.s86-chapter-head{padding:106px 0 54px;text-align:center}
.studio86 .s86-home h2{font-size:clamp(42px,4.5vw,64px);font-weight:600;line-height:1.06;letter-spacing:-.055em;margin:0 0 24px}
.s86-chapter-head>p:last-child{font-size:21px;line-height:1.5;letter-spacing:-.02em;color:#6e6e73;margin:0}
.s86-everyday-lead{font-size:19px;line-height:1.55;letter-spacing:-.01em;color:#6e6e73;margin:24px 0 0;max-width:560px;margin-inline:auto}
.s86-lifestyle{position:relative;margin:0;width:100%;background:#faf8ef}
.s86-lifestyle>picture,.s86-lifestyle>picture>img,.s86-lifestyle>img{display:block;width:100%;height:auto}
.s86-lifestyle figcaption{position:absolute;bottom:12px;right:24px;color:#fff;font-size:10px;line-height:1.4;padding:4px 7px;background:#0006;border-radius:3px}
.s86-use-links{display:grid;grid-template-columns:repeat(3,1fr);gap:52px;padding:45px 0 80px}
.s86-use-links>a{position:relative;padding-right:28px;color:#1d1d1f}
.s86-use-links>a>span:first-child{font-size:10px;letter-spacing:.12em;color:#76767b;display:block;margin-bottom:12px}
.studio86 .s86-use-links h3{font-size:25px;line-height:1.25;letter-spacing:-.035em;font-weight:500;margin:0}
.s86-use-arrow{position:absolute;right:0;bottom:6px;font-size:20px;color:#86868b;transition:transform .2s,color .2s}
.s86-use-links a:hover .s86-use-arrow{transform:translate(2px,-2px);color:#0066cc}
.s86-use-links a:hover h3{color:#0066cc}
.s86-ownership{padding:112px 0 72px;text-align:center;background:#191a1d;color:#f5f5f7}
.s86-ownership .s86-kicker{color:#a7a7ae}
.studio86 .s86-ownership h2{color:#f5f5f7;font-size:clamp(48px,5.6vw,80px);letter-spacing:-.06em;margin-bottom:28px}
.s86-ownership h2>span{color:#afb6c6}
.s86-ownership .s85-wrap>p:not(.s86-kicker){font-size:21px;line-height:1.5;color:#aaaab2;margin:0 0 32px;letter-spacing:-.02em}
.studio86 .s86-button-white{background:#f5f5f7;color:#202124!important}
.studio86 .s86-button-white:hover{background:#fff}
.s86-ownership-aside{border-top:1px solid #37373d;max-width:530px;margin:60px auto 0;padding-top:30px;font-size:13px;line-height:1.8;color:#a7a7ae}
.s86-ownership-aside a{color:#f5f5f7}
.s86-ownership-aside a:hover{text-decoration:underline;text-underline-offset:4px}
.s86-ownership--light{background:#fff;color:#1d1d1f}
.studio86 .s86-ownership--light h2,.s86-ownership--light h2>span{color:#1d1d1f}
.s86-ownership--light .s86-kicker{color:#6e6e73}
.s86-ownership--light .s85-wrap>p:not(.s86-kicker){color:#1d1d1f}
.s86-ownership--light .s86-ownership-aside{border-color:#dcdce0;color:#6e6e73}
.s86-ownership--light .s86-ownership-aside a{color:#1d1d1f}
.s86-privacy{position:relative}
.s86-privacy::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:min(530px,calc(100% - 48px));height:1px;background:#37373d}
.s86-privacy-lock{display:flex;justify-content:center;align-items:center;margin:0 auto 30px;color:#afb6c6}
.s86-privacy-lock svg{display:block;width:64px;height:72px}
.s86-privacy-options{display:flex;justify-content:center;gap:14px 32px;flex-wrap:wrap;list-style:none;padding:0;margin:0;font-family:inherit;font-weight:400;color:#aaaab2;font-size:21px;line-height:1.5;letter-spacing:-.02em}
.s86-privacy-options li{display:flex;align-items:center;gap:9px}
.s86-privacy-options li::before{content:"";width:4px;height:4px;flex:none;border-radius:50%;background:#afb6c6}
@media(max-width:700px){.s86-privacy-lock{margin-bottom:25px}.s86-privacy-lock svg{width:54px;height:61px}.s86-privacy-options{display:grid;justify-content:center;text-align:left;gap:10px;font-size:17px;line-height:1.6}}
.s86-launch{text-align:center;padding:112px 20px var(--s86-footer-gap);background:#f5f8f6;color:#1d1d1f}
.studio86 .s86-launch h2{color:#1d1d1f}
.studio86 .s86-launch .s86-kicker{color:#6e6e73}
.studio86 .s86-launch .s86-status-dot{background:#05ce78}
.studio86 .s86-launch .s85-button{background:#1c1c1e;color:#fff!important}
.studio86 .s86-launch .s85-button:hover{background:#333;color:#fff!important}
.studio86 .s86-launch .s85-button:focus-visible{outline:2px solid #1d1d1f;outline-offset:4px}
.s86-launch-copy{max-width:1200px;margin-inline:auto}
.s86-status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#23804c;vertical-align:middle;margin-right:5px}
.s86-launch-copy>p:not(.s86-kicker):not(.s86-launch-fine){font-size:21px;line-height:1.5;letter-spacing:-.02em;color:#333333;margin:0 0 28px}
.s86-launch .s86-launch-fine{font-size:12px;color:#6e6e73;margin:21px 0 12px}
.s86-quiet-link{font-size:13px;color:#6e6e73!important}
.s86-quiet-link:hover{text-decoration:underline;text-underline-offset:3px}
.s86-reveal-ready [data-s86-reveal]{opacity:.15;transform:translateY(20px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.65,.3,1)}
.s86-reveal-ready [data-s86-reveal].is-visible{opacity:1;transform:none}

@media(min-width:1800px){.s86-device-stage{width:940px}.s86-hero{padding-top:60px}.s86-chapter-head{padding-top:120px}.s86-lifestyle{max-width:1920px;margin-inline:auto}}
@media(max-width:1000px){.s86-device-stage{width:76vw}.s86-use-links{gap:32px}.studio86 .s86-use-links h3{font-size:22px}}
@media(max-width:700px){
 .studio86 .s85-nav{min-height:60px}.studio86 .s85-nav-cta{min-height:40px;padding:8px 16px}
 .s86-hero{padding:36px 0 30px}.s86-hero .s86-kicker{font-size:12px;margin-bottom:16px}.studio86 .s86-hero h1{font-size:50px;line-height:1.04;letter-spacing:-.055em}.s86-mobile-break{display:block}
 .s86-hero-intro{font-size:17px;line-height:1.5;max-width:310px;margin:14px auto 20px}
 .s86-actions{gap:10px}.s86-actions .s85-button{font-size:13px;padding-inline:16px}
 .s86-device-stage{width:calc(100% - 32px);margin-top:40px;padding-bottom:0}.s86-device-stage .odic-device-card{filter:drop-shadow(0 14px 16px #30303a18)}
 .s86-hero-caption{font-size:11px;margin:24px 24px 0;line-height:1.8}.s86-hero-caption a{display:block;margin-left:0}
 .s86-chapter-head{padding:70px 0 38px}.s86-kicker{font-size:9px;letter-spacing:.1em;margin-bottom:18px}.studio86 .s86-home h2{font-size:42px;line-height:1.08;margin-bottom:21px}
 .s86-chapter-head>p:last-child{font-size:17px}.s86-everyday-lead{font-size:15px;margin-top:16px;padding:0 24px}.s86-lifestyle{width:calc(100% - 24px);margin-inline:auto;border-radius:12px;overflow:hidden}.s86-lifestyle figcaption{right:8px;bottom:8px;font-size:8px;padding:3px 5px}
 .s86-use-links{grid-template-columns:1fr;gap:0;padding:15px 0 56px}.s86-use-links>a{padding:20px 36px 20px 0;border-bottom:1px solid #e8e8eb;display:grid;grid-template-columns:82px 1fr;align-items:start;gap:12px}
 .s86-use-links>a>span:first-child{margin:5px 0 0;font-size:9px}.studio86 .s86-use-links h3{font-size:21px;line-height:1.3}.s86-use-arrow{bottom:34px;font-size:19px}
 .s86-ownership{padding:68px 0 44px}.studio86 .s86-ownership h2{font-size:46px;line-height:1.08;letter-spacing:-.06em}.s86-ownership .s85-wrap>p:not(.s86-kicker){font-size:17px;line-height:1.6;margin-bottom:25px}.s86-ownership-aside{margin-top:42px;padding-top:24px;font-size:12px}
 .s86-launch{padding:72px 20px 65px}.s86-launch-copy>p:not(.s86-kicker):not(.s86-launch-fine){font-size:17px;line-height:1.6}.s86-launch .s86-launch-fine{font-size:11px;max-width:280px;margin:20px auto 14px}
 .studio86 .s85-footer-top>div>p{font-size:21px}.studio86 .s85-footer-top{padding-bottom:30px}
}
@media(max-width:360px){.studio86 .s86-hero h1{font-size:44px}.s86-hero-intro{font-size:16px}.s86-actions .s85-button{font-size:12px;padding-inline:14px}.studio86 .s86-home h2{font-size:38px}.s86-use-links>a{grid-template-columns:72px 1fr}.studio86 .s86-use-links h3{font-size:20px}}
/* Desktop visual anchor: ~62% of the viewport, capped for wide screens.
   The existing <=700px tablet sizing is intentionally unchanged. */
@media(min-width:701px){
 .s86-device-stage{width:clamp(640px,62vw,900px);max-width:calc(100% - 64px);margin-top:24px}
 /* Leave room for the tablet's 24px-offset, 28px-blur shadow to fade. */
 .s86-hero{padding-top:48px;padding-bottom:104px}
}
.studio86 .s86-hero .s85-button{padding-inline:20px}
@media(prefers-reduced-motion:reduce){.s86-reveal-ready [data-s86-reveal]{opacity:1;transform:none;transition:none}}

/* 2026-09-13 preview: move the complete hero down 40px and grow its background equally. */
.studio86 .s86-hero{padding-top:88px}
@media(max-width:700px){.studio86 .s86-hero{padding-top:76px}}

/* Homepage: extend the hero behind the fixed glass header without moving its content. */
body.home.studio86{padding-top:0}
.home.studio86 .s86-hero{padding-top:calc(136px + env(safe-area-inset-top))}
@media(max-width:700px){.home.studio86 .s86-hero{padding-top:calc(124px + env(safe-area-inset-top))}}
/* Match the header glass; use a compact, gently repeating text shimmer. */
.studio86 .odic-early{background:rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:0;box-shadow:0 0 26px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.8),inset 0 -1px 0 rgba(255,255,255,.5)}
.studio86 .odic-early__bar{background:transparent;border-color:transparent}
.studio86 .odic-early__sweep-light{background-image:linear-gradient(105deg,transparent 44%,rgba(255,255,255,.45) 48%,rgba(255,255,255,.85) 50%,rgba(255,255,255,.45) 52%,transparent 56%);background-size:240% 100%;animation:s86-thinking-shimmer 2.4s cubic-bezier(.4,0,.6,1) infinite}
@keyframes s86-thinking-shimmer{0%,10%{background-position:100% 0}80%,100%{background-position:0 0}}
@media(prefers-reduced-motion:reduce){.studio86 .odic-early__sweep-light{display:none;animation:none}}
/* Expand as an edge-to-edge sheet joined to the announcement bar. */
.studio86 .odic-early__panel{left:0;right:0;bottom:100%;width:100%;max-width:none;margin-inline:0;border-radius:0;border-left:0;border-right:0;box-shadow:none;padding-inline:max(40px,calc((100% - 1120px)/2));box-sizing:border-box}
@media(max-width:700px){.studio86 .odic-early__panel{left:0;right:0;border-radius:0;padding-inline:24px}}
/* Separate glass surfaces so the parent does not block the panel's page backdrop. */
.studio86 .odic-early{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.studio86 .odic-early__bar{background:rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 0 26px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.8),inset 0 -1px 0 rgba(255,255,255,.5)}
.studio86 .odic-early__panel{background:rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* Move the homepage artwork group only; preserve the hero background and layout height. */
.home.studio86 .s86-hero-copy,
.home.studio86 .s86-device-stage{translate:0 -8px}
/* Mobile connected apps: two rows, with the next column visibly peeking in. */
@media(max-width:700px){
 .studio86 .s85-feature-copy{min-width:0}
 .studio86 .s85-app-cards{display:grid;grid-template-columns:none;grid-template-rows:repeat(2,auto);grid-auto-flow:column;grid-auto-columns:70%;gap:10px;width:100%;max-width:none;min-width:0;margin:24px 0 0;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;padding-bottom:2px}
 .studio86 .s85-app-cards::-webkit-scrollbar{display:none}
 .studio86 .s85-app-frame{scroll-snap-align:start}
 .studio86 .s85-app-card>span{font-size:clamp(11px,6.25cqw,16px)}
}
/* Complete tablet frame and a screen-sized playback control. */
.studio86 .s86-demo-stage{width:61.8%;margin:48px auto 0}
.studio86 .s86-demo-video{display:block;width:100%;height:100%;max-height:none;object-fit:contain;background:#000}
.studio86 .s86-demo-toggle{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;background:transparent;cursor:pointer;z-index:2}
.studio86 .s86-demo-toggle:focus-visible{outline:3px solid #0066cc;outline-offset:-4px}
.studio86 .s86-demo-feedback{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:#0007;color:#fff;pointer-events:none;z-index:3}
.studio86 .s86-demo-feedback[hidden],.studio86 .s86-demo-toggle[hidden]{display:none}
@media(max-width:700px){.studio86 .s86-demo-stage{width:100%;margin-top:30px}}

/* Fill the frame aperture, including its two-pixel aspect difference. */
.studio86 .s86-demo-video{object-fit:fill}

.studio86 .s85-size-picker legend>.s86-size-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0;font-size:15px;font-weight:500;color:inherit}
.studio86 #s85-size-note{font-size:12px;font-weight:400;color:var(--s85-muted);text-align:right}

/* Give the product hero room below the fixed navigation. */
.studio86 .s85-board-grid{padding-top:64px}
@media(max-width:700px){.studio86 .s85-board-grid{padding-top:40px}}

/* Software: purpose, pricing, then compatibility. */
.studio86 .s86-software-page .s85-page-hero{padding-top:64px}
.studio86 .s86-software-plans{padding-top:48px;padding-bottom:64px;scroll-margin-top:80px}
.studio86 .s86-software-plans .s85-section-head{margin-bottom:28px}
.studio86 .s86-software-plans .s85-section-head>p{color:var(--s85-muted);margin:16px 0 0}
.studio86 .s86-software-plans .s85-option{padding:32px}
.studio86 .s86-software-plans .s85-option h3{font-size:22px;margin:0 0 24px}
.studio86 .s86-software-plans .s86-plan-price{display:flex;align-items:baseline;gap:8px;margin:0 0 12px}
.studio86 .s86-plan-price strong{font-size:48px;line-height:1.1;letter-spacing:-.04em;font-weight:600;color:#1d1d1f}
.studio86 .s86-plan-price span{font-size:16px;color:var(--s85-muted)}
.studio86 .s86-plan-action{text-align:center;margin-top:28px}
.studio86 .s86-plan-action .s85-micro{margin-top:12px}
.studio86 .s86-software-compat{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;border-top:1px solid var(--s85-line);padding-block:48px 64px}
.studio86 .s86-software-compat h2{font-size:28px;letter-spacing:-.03em;margin:0 0 14px}
.studio86 .s86-software-compat h3{font-size:21px;margin:0 0 14px}
.studio86 .s86-software-compat p{font-size:15px;color:var(--s85-muted);margin:0 0 20px}
@media(max-width:700px){
.studio86 .s86-software-page .s85-page-hero{padding-top:40px}
.studio86 .s86-software-plans{padding-top:24px;padding-bottom:40px}
.studio86 .s86-software-plans .s85-two-cards{grid-template-columns:1fr 1fr;gap:12px}
.studio86 .s86-software-plans .s85-option{padding:24px 16px}
.studio86 .s86-software-plans .s86-plan-price{display:block}
.studio86 .s86-plan-price strong{display:block;font-size:36px}
.studio86 .s86-plan-price span{display:block;margin-top:6px;font-size:13px}
.studio86 .s86-software-plans .s85-option>p:last-child{font-size:12px}
.studio86 .s86-software-compat{grid-template-columns:1fr;gap:32px;padding-block:36px 48px}
.studio86 .s86-software-board{border-top:1px solid var(--s85-line);padding-top:28px}
}
/* Secondary product paths sit apart from the primary signup action. */
.studio86 .s86-board-secondary{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-top:24px}
/* A quiet holding page for the upcoming Web App. */
.studio86 .s86-webapp-preview{display:grid;align-items:center;min-height:72svh;padding:72px 0 88px;text-align:center;background:#fff}
.studio86 .s86-webapp-preview .s85-eyebrow{margin:0 0 28px}
.studio86 .s86-webapp-preview h1{font-size:clamp(52px,7.5vw,104px);line-height:1.02;letter-spacing:-.055em;font-weight:600;margin:0;color:#1d1d1f}
.studio86 .s86-webapp-intro{font-size:clamp(16px,1.6vw,21px);line-height:1.65;color:#6e6e73;margin:30px auto 0;max-width:640px}
@media(max-width:700px){.studio86 .s86-webapp-preview{min-height:68svh;padding:56px 0 72px}.studio86 .s86-webapp-preview .s85-eyebrow{font-size:10px;letter-spacing:.12em;margin-bottom:24px}.studio86 .s86-webapp-intro{max-width:330px;margin-top:24px}}

.studio86 .s86-in-box{scroll-margin-top:80px}
.studio86 .s86-in-box .s85-section-head{margin-bottom:32px}
.studio86 .s86-in-box .s85-section-head p{color:var(--s85-muted);font-size:16px;margin:16px 0 0}
.studio86 .s86-in-box-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.studio86 .s86-in-box-items figure{margin:0;text-align:center}
.studio86 .s86-in-box-items figure>div{display:flex;align-items:center;justify-content:center;min-height:180px}
.studio86 .s86-in-box-items img{display:block;width:112px;height:112px;object-fit:contain}
.studio86 .s86-in-box-items figcaption{font-size:16px;font-weight:500;margin-top:16px}
@media(max-width:700px){
.studio86 .s86-in-box-items{gap:12px}
.studio86 .s86-in-box-items figure>div{min-height:100px}
.studio86 .s86-in-box-items img{width:72px;height:72px}
.studio86 .s86-in-box-items figcaption{font-size:12px;line-height:1.4;margin-top:12px}
}
.studio86 .s86-in-box-items figure{background:#fafafa;border:1px solid #e5e5e7;border-radius:16px;padding:24px 20px 32px}
@media(max-width:700px){.studio86 .s86-in-box-items figure{padding:12px 6px 20px;border-radius:14px}}

/* Checkout uses the same field language as Support, including its inset chevron. */
.studio86 .odic-checkout__section,.studio86 .odic-checkout__summary{background:#fafafa;border:1px solid #e5e5e7;border-radius:16px;padding:32px;box-shadow:none}
.studio86 .odic-checkout__section-body .form-row{margin:0 0 20px;padding:0}
.studio86 .odic-checkout__section-body label{font-size:14px;font-weight:500;line-height:1.5;color:#39443c;margin:0 0 8px}
.studio86 .odic-checkout__section-body :is(input.input-text,select),.studio86 .odic-card-fields__input{
 display:block;width:100%;height:50px;min-height:50px;box-sizing:border-box;border:1px solid #c8c8cd;border-radius:9px;background-color:#ffffffd6;padding:12px 14px;font-family:inherit;font-size:16px;font-weight:400;line-height:1.5;color:#1d1d1f;box-shadow:0 1px 2px #28332603;
}
.studio86 .odic-checkout__section-body input.input-text::placeholder,.studio86 .odic-card-fields__input::placeholder{color:#7a8279;font-weight:400}
.studio86 .odic-card-fields__field,.studio86 .odic-card-fields__row .odic-card-fields__field{margin-bottom:20px;min-width:0}
.studio86 .odic-checkout__section-body .select2-container--default .select2-selection--single{height:50px;border:1px solid #c8c8cd;border-radius:9px;background:#ffffffd6;box-shadow:0 1px 2px #28332603}
.studio86 .odic-checkout__section-body .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:48px;padding:0 44px 0 14px;font-size:16px;font-weight:400;color:#1d1d1f}
.studio86 .odic-checkout__section-body .select2-container--default .select2-selection--single .select2-selection__arrow{height:48px;width:12px;right:16px;top:0}
.studio86 .odic-checkout__section-body .select2-selection__arrow b{display:none}
@media(max-width:700px){.studio86 .odic-checkout__section,.studio86 .odic-checkout__summary{padding:22px;border-radius:12px}}
/* Inset select chevrons to match the form's internal spacing. */
.studio86 .s85-form select,.studio86 .odic-early__field select,.studio86 .odic-checkout__section-body select,.studio86 .odic-checkout__section-body .select2-selection__arrow{
appearance:none;-webkit-appearance:none;padding-right:44px;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%231d1d1f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat;background-position:right 16px center;background-size:12px 12px;
}
.studio86 .odic-checkout__section-body .select2-selection__arrow{padding:0;background-position:center}
.studio86 .odic-checkout__section-body select{padding-right:44px}
@media(forced-colors:active){.studio86 .s85-form select,.studio86 .odic-early__field select,.studio86 .odic-checkout__section-body select{appearance:auto;background-image:none}.studio86 .odic-checkout__section-body .select2-selection__arrow{background-image:none}.studio86 .odic-checkout__section-body .select2-selection__arrow b{display:block}}
.studio86 .s86-scroll-gallery .s85-gallery-stage{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y pinch-zoom}
.studio86 .s86-scroll-gallery .s85-gallery-stage::-webkit-scrollbar{display:none}
.studio86 .s86-scroll-gallery .s85-gallery-image{flex:0 0 100%;min-width:0;scroll-snap-align:center;scroll-snap-stop:normal;user-select:none;-webkit-user-select:none}
.studio86 .s86-scroll-gallery .s85-gallery-image img{pointer-events:none}
/* Use the original 8080 carousel transition and keep indicators inside the image. */
.studio86 .s86-feature-gallery .odic-feature-carousel__stage{border-radius:18px;background:#f5f5f7}
.studio86 .s86-feature-gallery .odic-feature-carousel__slide{object-fit:contain}
.studio86 .s86-feature-gallery:not(.odic-feature-carousel) .odic-feature-carousel__stage{cursor:default}
.studio86 .s86-feature-gallery .odic-feature-carousel__dots{bottom:20px;gap:8px}
.studio86 .s86-feature-gallery .odic-feature-carousel__dots span{position:relative;background:#d2d2d7;transition:width .3s ease,background-color .3s ease}
.studio86 .s86-feature-gallery .odic-feature-carousel__dots span.is-active{width:24px;background:#1d1d1f}
.studio86 .s86-feature-gallery .odic-feature-carousel__dots span::before{content:"";position:absolute;inset:-12px -4px}
.studio86 .s86-feature-gallery .odic-feature-carousel__dots span:focus-visible{outline:2px solid #007aff;outline-offset:5px}
.studio86 .s86-reminder-examples{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:20px}
.studio86 .s86-reminder-examples strong{font-size:15px;font-weight:500}
.studio86 .s86-reminder-examples p{font-size:15px;line-height:1.6;color:var(--s85-muted);margin:5px 0 0}

.studio86 .s86-reminder-examples li{display:grid;grid-template-columns:20px minmax(0,1fr);column-gap:12px;align-items:start}
.studio86 .s86-reminder-speaker{width:20px;height:20px;object-fit:contain;grid-row:1 / 3;margin-top:2px}
.studio86 .s86-reminder-examples li>p{grid-column:2}

.studio86 .s85-app-card{background:#f8f8f8;border-color:#f8f8f8}
.studio86 .s85-app-card::before{border-color:#ffffff}
.studio86 .s85-app-brand{filter:brightness(0) invert(1)}

.studio86 #memories .s85-app-card{background:#ffffff;border-color:#ffffff}
.studio86 #memories .s85-app-card::before{border-color:#f0f0f0}
.studio86 #memories .s85-app-brand{filter:none}

.studio86 #family .s85-app-brand{filter:none}

/* Keep the full right handle inside the screen on phones. */
@media(max-width:700px){.s86-device-stage .s86-device-from-8080 .odic-device-card__pin--r{left:calc(4.08% + 91.83% - 2px - .1px);right:auto}}

/* Cover the frame's dark inner seam after mobile fractional scaling. */
@media(max-width:700px){
.studio86 .s86-demo-device .odic-device-card__screen{left:calc(4.08% - .5px);top:calc(7.3% - .5px);width:calc(91.83% + 1px);height:calc(85.95% + 1px)}
.studio86 .s86-demo-video{background:transparent}
}

/* Quiet press feedback without browser tap rectangles. */
html{-webkit-tap-highlight-color:transparent}
*,*::before,*::after{-webkit-tap-highlight-color:transparent}
button,a,summary,[role="button"]{transition:background-color .18s,color .18s,opacity .18s}
button:active,a:active,summary:active,[role="button"]:active{opacity:.72}
:focus:not(:focus-visible){outline:none}
:focus-visible{outline-color:#888!important}

/* Homepage composition: fit the complete hero; give the lifestyle image its own crop per device. */
.home.studio86 .s86-hero-copy,.home.studio86 .s86-device-stage{translate:none}
.home.studio86 .s86-chapter-head{padding:64px 0 40px}
.home.studio86 .s86-chapter-head h2{margin:0}
.home.studio86 .s86-lifestyle{width:min(92%,1440px,140svh);margin-inline:auto;aspect-ratio:3 / 2;border-radius:24px;overflow:hidden;background:#eeeae4}
.home.studio86 .s86-lifestyle>picture{display:block;width:100%;height:100%}
.home.studio86 .s86-lifestyle>picture>img{display:block;width:100%;height:100%;object-fit:cover;object-position:0 44%}
.home.studio86 .s86-use-links{width:min(92%,1440px,140svh);max-width:none;padding-top:32px;padding-bottom:64px}
@media(min-width:701px){
 .home.studio86 .s86-hero{padding:calc(clamp(80px,10svh,108px) + env(safe-area-inset-top)) 0 64px}
 .home.studio86 .s86-device-stage{width:min(62vw,900px,calc((100svh - 360px) * 1.65));max-width:calc(100% - 64px);margin-top:24px}
}
@media(min-width:701px) and (max-height:650px){
 .home.studio86 .s86-hero{padding-top:calc(64px + env(safe-area-inset-top));padding-bottom:48px}
 .home.studio86 .s86-hero h1{font-size:48px}
 .home.studio86 .s86-hero-intro{font-size:18px;margin:8px 0 14px}
 .home.studio86 .s86-device-stage{width:min(58vw,740px,calc((100svh - 300px) * 1.65));margin-top:16px}
}
@media(max-width:700px){
 .home.studio86 .s86-hero{padding:calc(92px + env(safe-area-inset-top)) 0 44px}
 .home.studio86 .s86-device-stage{width:calc(100% - 32px);max-width:562px;margin-top:28px}
 .home.studio86 .s86-chapter-head{padding:48px 0 28px}
 .home.studio86 .s86-chapter-head h2{font-size:38px;line-height:1.08;margin:0}
 .home.studio86 .s86-lifestyle{width:calc(100% - 36px);aspect-ratio:9 / 10;border-radius:16px}
 .home.studio86 .s86-use-links{width:calc(100% - 40px);padding-top:16px;padding-bottom:48px}
}

/* Use one full master. ResizeObserver positions the live viewport crop around protected subjects. */

/* Shared chapter typography, including the everyday and launch sections. */
.home.studio86 .s86-home :is(.s86-chapter-head,.s86-ownership,.s86-launch) h2{font-size:clamp(36px,4vw,56px);font-weight:600;line-height:1.06;letter-spacing:-.06em}
@media(max-width:700px){.home.studio86 .s86-home :is(.s86-chapter-head,.s86-ownership,.s86-launch) h2{font-size:36px;line-height:1.08}}
@media(max-width:360px){.home.studio86 .s86-home :is(.s86-chapter-head,.s86-ownership,.s86-launch) h2{font-size:32px}}
@media(min-width:701px) and (max-height:650px){.home.studio86 .s86-home :is(.s86-chapter-head,.s86-ownership,.s86-launch) h2{font-size:36px}}

/* The two closing calls to action share one typography and spacing system. */
.studio86 .s86-closing-section{padding-top:112px;padding-bottom:var(--s86-footer-gap)}
.studio86 .s86-closing-section h2{margin:0 0 28px}
.studio86 .s86-closing-section .s86-closing-description{font-size:21px;line-height:1.5;letter-spacing:-.02em;color:#333;margin:0 0 28px}
.studio86 .s86-closing-notes{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:530px;margin:24px auto 0;border:0;padding:0;font-size:13px;line-height:1.6;color:#6e6e73}
.studio86 .s86-closing-notes p{font:inherit;color:inherit;margin:0}
.studio86 .s86-closing-notes a{font:inherit;color:inherit;text-decoration:none}
.studio86 .s86-closing-notes a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){
 .studio86 .s86-closing-section{padding-top:72px}
 .studio86 .s86-closing-section h2{margin-bottom:21px}
 .studio86 .s86-closing-section .s86-closing-description{font-size:17px;line-height:1.6;margin-bottom:25px}
 .studio86 .s86-closing-notes{font-size:12px;margin-top:24px;max-width:320px}
}

/* Share the homepage's final-text-to-footer rhythm on content pages only.
   Holding pages (Login, Web App, availability) retain their centered layout. */
.studio86 #main-content>:is(.s85-details,.s85-company,.s86-software-compat,.s85-legal-grid):last-child{padding-bottom:var(--s86-footer-gap);margin-bottom:0}
.studio86 .s85-details .s85-spec-list>div:last-child{padding-bottom:0}
.studio86 .s85-policy>:last-child,.studio86 .s85-company>div>:last-child{margin-bottom:0}
.studio86 #main-content>.s85-faq:last-child{padding-bottom:calc(var(--s86-footer-gap) - 23px);margin-bottom:0}
.studio86 #main-content>.s85-faq:last-child:has(details:last-child[open]){padding-bottom:calc(var(--s86-footer-gap) - 25px)}
.studio86 #main-content>.s85-support-grid:last-child{padding-bottom:calc(var(--s86-footer-gap) - 33px);margin-bottom:0}
.studio86 .s85-support-grid .s85-form>:last-child{margin-bottom:0}
@media(max-width:700px){
 body.studio86{--s86-footer-gap:65px}
 .studio86 .s86-launch{padding-bottom:var(--s86-footer-gap)}
 .studio86 #main-content>.s85-support-grid:last-child{padding-bottom:var(--s86-footer-gap)}
}
