/* Scoped Canvas2D loading / no-WebGL surface. All imagery is native Canvas UI. */

.stage.has-fallback #loading{display:none}
.stage.has-fallback .device-controls{z-index:12}
.fallback-experience{position:absolute;inset:14px 85px 16px 20px;z-index:10;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:12px;min-width:0;min-height:0;color:#f7eae7;font-family:var(--body,Manrope,Arial,sans-serif);isolation:isolate}
.fallback-experience[hidden]{display:none}
.fallback-heading{display:flex;align-items:center;justify-content:center;gap:12px;min-height:25px;white-space:nowrap}
.fallback-kicker{font-size:9px;font-weight:700;letter-spacing:.17em;color:#f86c63;border-right:1px solid #684144;padding-right:12px}
.fallback-source{font-size:12px;font-weight:600;color:#d8c9c5}
.fallback-viewport{min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.fallback-frame{box-sizing:border-box;flex:none;max-width:100%;max-height:100%;padding:8px;border:1px solid #76666a;border-radius:40px;background:#101014;box-shadow:0 0 0 1px #1c1a1e,0 18px 38px #0009,inset 0 1px 0 #e4d8dd33;overflow:hidden}
.fallback-canvas{display:block;width:100%;height:100%;object-fit:contain;border-radius:31px;background:#08090d}
.fallback-experience[data-source=glasses] .fallback-frame{padding:6px;border-radius:34px 34px 45px 45px;border-color:#727c88;background:#121720}
.fallback-experience[data-source=glasses] .fallback-canvas{border-radius:27px 27px 38px 38px}
.fallback-experience[data-source=earbuds] .fallback-frame{border-radius:37px;border-color:#868083;background:#161619}
.fallback-experience[data-source=earbuds] .fallback-canvas{border-radius:28px}
.fallback-experience[data-source=desktop] .fallback-frame{border-radius:14px;border-color:#78767b;background:#151518}
.fallback-experience[data-source=desktop] .fallback-canvas{border-radius:6px}
.fallback-footer{display:flex;align-items:center;justify-content:center;gap:15px;min-height:30px}
.fallback-caption{font-size:11px;line-height:1.4;color:#bdaead;text-align:center}
.fallback-pause{font:600 10px var(--body,Arial,sans-serif);letter-spacing:.02em;min-width:48px;min-height:30px;padding:5px 9px;border:1px solid #694044;border-radius:4px;background:#221319;color:#efdad8;flex:none}
.fallback-pause:hover{background:#40181d;border-color:#b74a46}
.fallback-pause[hidden]{display:none}
.fallback-status{font-size:10px;line-height:1.4;text-align:center;color:#a49597;margin:0;min-height:0}
.fallback-status:empty{display:none}
@media(max-width:1100px) and (min-width:721px){.fallback-experience{inset:14px 82px 14px 16px;gap:9px}.fallback-caption{max-width:190px}}
@media(max-width:720px){.fallback-experience{inset:6px 60px 8px 15px;gap:7px}.fallback-heading{gap:9px;min-height:20px}.fallback-kicker{font-size:8px;padding-right:9px}.fallback-source{font-size:10px}.fallback-footer{gap:9px;min-height:26px}.fallback-caption{font-size:9px}.fallback-pause{min-height:26px;font-size:9px;min-width:44px}.fallback-status{font-size:9px}}
@media(max-height:650px) and (max-width:720px){.fallback-experience{gap:4px;top:3px}.fallback-heading{min-height:17px}.fallback-kicker{display:none}.fallback-footer{min-height:24px}.fallback-caption{display:none}.fallback-pause{min-height:24px}}
@media(max-height:420px){.fallback-experience{inset:3px 57px 5px 6px;gap:3px}.fallback-heading{min-height:16px}.fallback-kicker,.fallback-caption{display:none}.fallback-source{font-size:9px}.fallback-footer{min-height:23px}.fallback-pause{min-height:23px}.fallback-status{font-size:8px}}
@media(prefers-reduced-motion:reduce){.fallback-experience *{animation:none!important;transition:none!important}}

.fallback-pause:disabled{cursor:default;opacity:.7}

.fallback-experience{opacity:1;transition:opacity .65s cubic-bezier(.2,.8,.2,1);pointer-events:none}.fallback-experience.is-hidden{opacity:0}.fallback-status{font-size:12px}
@media(prefers-reduced-motion:reduce){.fallback-experience{transition:none}}

.fallback-experience[data-source=watch] .fallback-frame{padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
.watch-poster-surface{position:absolute;left:0;top:0;width:500px;height:700px;transform-origin:0 0}
.watch-poster-surface img{display:block;width:500px;height:700px}
.watch-poster-surface .fallback-canvas{position:absolute;left:0;top:0;width:768px;height:960px;max-width:none;border-radius:137.578px / 138.142px;transform-origin:0 0;transform:matrix(.226696798,.03230803,-.041083526,.243189902,169.179797,212.778819);animation:watch-data-in .35s ease-out both}
.fallback-experience[data-source=watch] .fallback-frame{position:relative}
.fallback-viewport{overflow:visible}
@keyframes watch-data-in{from{opacity:0}to{opacity:1}}

.fallback-status{font-size:13px;font-variant-numeric:tabular-nums;color:#e2c9c9}
.fallback-status{min-height:18px;line-height:18px}
.fallback-status:empty{display:block;visibility:hidden}

/* Native contextual UI stays sharp over the actual laptop geometry poster. */
.fallback-experience[data-source=desktop] .fallback-frame{position:relative;padding:0;border:0;background:transparent;box-shadow:none;overflow:visible;border-radius:0}
.laptop-poster-surface{position:absolute;left:0;top:0;width:1100px;height:850px;transform-origin:0 0}
.laptop-poster-surface img{display:block;width:1100px;height:850px}
.fallback-experience[data-source=desktop] .laptop-poster-surface .fallback-canvas{position:absolute;left:0;top:0;width:1400px;height:780px;max-width:none;max-height:none;border-radius:0;transform-origin:0 0;transform:matrix(.623701671,.005652432,0,.629706335,111.718701,114.156565);clip-path:path(evenodd, "M 11.543859649122806 0 L 1388.4561403508771 0 Q 1400 0 1400 11.542821158690174 L 1400 768.4571788413098 Q 1400 780 1388.4561403508771 780 L 11.543859649122806 780 Q 0 780 0 768.4571788413098 L 0 11.542821158690174 Q 0 0 11.543859649122806 0 Z M 582 0 L 818 0 Q 818 0 818 0 L 818 37 Q 818 37 818 37 L 582 37 Q 582 37 582 37 L 582 0 Q 582 0 582 0 Z")}