/* Product Office premium portal and controls — v1 */
:root{--po-mint:#d9dadd;--po-violet:#adaeb0;--po-edge:rgba(255,255,255,.18)}
body.splash-active{overflow:hidden}

/* Cinematic entrance: architecture + emblem + clean editorial title. */
.splash{display:grid !important;place-items:center !important;overflow:hidden;background:#101115 !important;perspective:1200px}
.splash::before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 25% 45%,rgba(173,174,176,.12),transparent 29%),radial-gradient(circle at 72% 40%,rgba(217,218,221,.09),transparent 26%),linear-gradient(115deg,transparent 42%,rgba(255,255,255,.025) 42.2%,transparent 42.5%);animation:splashAtmosphere 8s ease-in-out infinite alternate}
.splash-grid{inset:0 !important;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) !important;background-size:52px 52px !important;mask-image:radial-gradient(ellipse at center,#000 5%,transparent 72%);opacity:.5 !important;transform:perspective(620px) rotateX(66deg) translateY(35%) scale(1.5);transform-origin:50% 100%;animation:gridArrival 2s cubic-bezier(.16,1,.3,1) both}
.splash-stage{position:relative;z-index:4;width:min(980px,90vw);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;transform-style:preserve-3d}
.splash-orbit{position:relative !important;inset:auto !important;width:232px !important;height:232px !important;margin:0 auto 8px !important;transform:none !important;border:0 !important;filter:drop-shadow(0 32px 38px rgba(0,0,0,.54));animation:emblemEnter 1.25s .2s cubic-bezier(.16,1,.3,1) both !important}
.splash-orbit::before{content:"";position:absolute;inset:34px;border-radius:50%;background:radial-gradient(circle at 34% 25%,rgba(255,255,255,.35) 0 3%,rgba(173,174,176,.38) 10%,rgba(65,65,66,.52) 29%,rgba(17,19,24,.98) 68%),conic-gradient(from 210deg,rgba(173,174,176,.28),rgba(217,218,221,.08),rgba(173,174,176,.28));border:1px solid rgba(255,255,255,.28);box-shadow:inset -24px -28px 43px rgba(0,0,0,.72),inset 12px 10px 26px rgba(217,218,221,.12),0 0 0 8px rgba(255,255,255,.018),0 0 58px rgba(173,174,176,.18)}
.splash-orbit::after{content:"";position:absolute;left:54px;right:54px;bottom:2px;height:25px;border-radius:50%;background:rgba(0,0,0,.62);filter:blur(13px);transform:rotateX(65deg)}
.splash-orbit i{position:absolute !important;inset:17px !important;width:auto !important;height:auto !important;border:1px solid rgba(173,174,176,.48) !important;border-radius:50% !important;background:none !important;box-shadow:0 0 22px rgba(173,174,176,.09);animation:portalRingA 7s linear infinite !important}
.splash-orbit i:nth-child(2){inset:42px 5px !important;border-color:rgba(217,218,221,.46) !important;animation:portalRingB 8s linear infinite !important}.splash-orbit i:nth-child(3){inset:5px 52px !important;animation:portalRingC 9s linear infinite !important}
.splash-orbit b{position:absolute !important;z-index:4 !important;left:50% !important;top:50% !important;right:auto !important;bottom:auto !important;margin:0 !important;width:auto !important;height:auto !important;display:block !important;color:#f2f3f6 !important;font:400 62px/.84 'Cormorant Garamond',Georgia,serif !important;letter-spacing:-.075em !important;background:none !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;text-shadow:0 1px 0 rgba(255,255,255,.58),0 3px 0 rgba(78,78,79,.95),0 10px 24px rgba(0,0,0,.78) !important;transform:translate(-50%,-50%) !important}
.splash-orbit span{position:absolute;z-index:5;right:31px;top:68px;width:9px;height:9px;border-radius:50%;background:var(--po-mint);box-shadow:0 0 18px var(--po-mint);animation:portalPulse 1.8s infinite}
.splash-copy{position:relative !important;inset:auto !important;transform:none !important;text-align:center !important;max-width:900px;animation:copyEnter 1.1s .45s cubic-bezier(.16,1,.3,1) both}
.wordmark-splash{display:inline-flex !important;margin:0 0 14px !important;font-size:14px !important;opacity:.78}
.splash-eyebrow{display:block;margin-bottom:17px;color:var(--po-mint);font:600 9px/1 Manrope,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.splash-copy .splash-title{margin:0 !important;display:flex;justify-content:center;align-items:baseline;gap:.17em;font:400 clamp(72px,8.1vw,126px)/.78 'Cormorant Garamond',Georgia,serif !important;letter-spacing:-.067em !important;color:#edeef1 !important;text-shadow:0 1px 0 #fff,0 3px 0 #8e8e98,0 6px 0 #484951,0 10px 0 #24252b,0 23px 42px rgba(0,0,0,.62) !important;transform:perspective(800px) rotateX(4deg);transform-origin:center bottom}
.splash-copy .splash-title span,.splash-copy .splash-title em{display:block;white-space:nowrap}.splash-copy .splash-title em{padding-left:0;color:#a8a9ab !important;font-style:italic !important;text-shadow:0 1px 0 #e9eaed,0 3px 0 #6e6e70,0 7px 0 #373738,0 17px 34px rgba(0,0,0,.65) !important}
.splash-copy p{max-width:620px;margin:25px auto 15px !important;color:rgba(236,235,244,.62) !important;font:400 13px/1.65 Manrope,sans-serif !important;letter-spacing:0 !important;text-transform:none !important}
.splash-line{position:relative;width:100% !important;height:1px !important;background:rgba(255,255,255,.09) !important;overflow:visible !important}.splash-line i{display:block !important;width:0 !important;height:1px !important;background:linear-gradient(90deg,var(--po-violet),var(--po-mint)) !important;box-shadow:0 0 14px rgba(217,218,221,.45);animation:premiumLoad 3s .55s cubic-bezier(.4,0,.2,1) forwards !important}.splash-line i::after{content:"";position:absolute;right:-3px;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--po-mint);box-shadow:0 0 13px var(--po-mint)}
.splash-status{display:flex;justify-content:center;gap:22px;margin-top:15px;color:rgba(255,255,255,.46);font:600 7px/1 Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase}.splash-status span{display:flex;align-items:center;gap:7px}.splash-status span::before{content:"";width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.45)}
.splash > button{position:absolute !important;z-index:9 !important;right:30px !important;bottom:28px !important;top:auto !important;display:flex;align-items:center;gap:12px;padding:8px 8px 8px 16px !important;color:rgba(255,255,255,.7) !important;background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.035)) !important;border:1px solid var(--po-edge) !important;border-radius:14px !important;backdrop-filter:blur(14px);box-shadow:inset 0 1px rgba(255,255,255,.15),0 12px 30px rgba(0,0,0,.25);font:600 8px/1 Manrope,sans-serif !important;letter-spacing:.08em !important;text-transform:uppercase !important;transition:.35s ease}.splash > button i{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:rgba(173,174,176,.75);color:#111216;font-style:normal;font-size:11px}.splash > button:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.34) !important}.splash.is-done .splash-stage,.splash.is-done > button{opacity:0;transform:scale(.96);transition:opacity .45s ease,transform .65s ease}

/* Premium exit and office actions. */
.exit-link,.office-button,.room-exit-button,.splash > button{
  overflow:hidden;isolation:isolate;border:1px solid rgba(255,255,255,.16) !important;background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.035)) !important;backdrop-filter:blur(17px) saturate(135%);-webkit-backdrop-filter:blur(17px) saturate(135%);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 13px 32px rgba(0,0,0,.25) !important;transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .3s ease,box-shadow .4s ease !important
}

/* .office-button is the PRIMARY action in each room, and products.css paints it
   as a solid pill: background:var(--mint) behind dark #17181b text. The rule
   above swept it in with the ghost controls and overrode that background with
   !important, so the dark text ended up on a 13%-white wash over a dark room --
   measured 1.35:1 from real device pixels on an S10+, in all six rooms, for
   "View project", "Open web app" and "Google Play". Every other selector in that
   rule has LIGHT text and is genuinely meant to read as a ghost; this one never
   was. This predates the retint -- the mint fill has never actually painted --
   and it only became legible-looking to audit once the fill went near-white.
   Restore the fill; keep the shared border, shadow and blur. */
.office-button{background:var(--mint) !important}
.exit-link:hover,.office-button:hover,.room-exit-button:hover{transform:translateY(-3px) !important;border-color:rgba(255,255,255,.3) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 20px 42px rgba(0,0,0,.34),0 0 27px rgba(173,174,176,.08) !important}
.premium-exit{min-width:176px !important;min-height:48px !important;padding:6px 6px 6px 14px !important;border-radius:15px !important;display:flex !important;align-items:center;justify-content:space-between;gap:16px;color:#f2f3f6 !important}
.exit-copy{display:flex;flex-direction:column;gap:3px}.exit-copy small{font:600 6px/1 Manrope,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.46)}.exit-copy b{font:600 10px/1 Manrope,sans-serif;text-shadow:0 1px 0 rgba(255,255,255,.18),0 2px 2px rgba(0,0,0,.65)}.exit-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(173,174,176,.86),rgba(217,218,221,.72));border:1px solid rgba(255,255,255,.4);color:#16171b;font-weight:700;box-shadow:inset 0 1px 0 rgba(255,255,255,.58),0 7px 17px rgba(0,0,0,.25)}

/* Important lettering carries physical depth. */
.room-copy h2,.room-sign b{
  transform-style:preserve-3d;text-shadow:0 1px 0 rgba(255,255,255,.18),0 2px 0 rgba(20,21,25,.86),0 4px 0 rgba(12,13,16,.7),0 14px 28px rgba(0,0,0,.48) !important
}

@keyframes splashAtmosphere{to{transform:translate3d(3%,1%,0) scale(1.03)}}
@keyframes gridArrival{from{opacity:0;transform:perspective(620px) rotateX(72deg) translateY(62%) scale(1.6)}to{opacity:.5;transform:perspective(620px) rotateX(66deg) translateY(35%) scale(1.5)}}
@keyframes emblemEnter{from{opacity:0;transform:translateY(-34px) rotateX(-22deg) scale(.76)}to{opacity:1;transform:none}}
@keyframes copyEnter{from{opacity:0;transform:translateY(34px) translateZ(-50px)}to{opacity:1;transform:none}}
@keyframes portalRingA{to{transform:rotateX(66deg) rotateZ(360deg)}}@keyframes portalRingB{to{transform:rotateY(64deg) rotateZ(-360deg)}}@keyframes portalRingC{to{transform:rotateX(34deg) rotateY(60deg) rotateZ(360deg)}}
@keyframes portalPulse{0%,100%{opacity:.4;transform:scale(.7)}50%{opacity:1;transform:scale(1.25)}}
@keyframes premiumLoad{0%{width:0}70%,100%{width:100%}}

@media(max-width:820px){.splash-stage{gap:7px;text-align:center;width:min(620px,88vw)}.splash-orbit{width:146px !important;height:146px !important;margin:0 auto 3px !important}.splash-orbit::before{inset:20px}.splash-orbit b{width:auto !important;height:auto !important;font-size:34px !important}.splash-orbit i{inset:11px !important}.splash-orbit i:nth-child(2){inset:26px 3px !important}.splash-orbit i:nth-child(3){inset:3px 33px !important}.splash-copy{text-align:center !important}.wordmark-splash{margin-bottom:10px !important}.splash-copy .splash-title{font-size:clamp(54px,14vw,82px) !important;align-items:baseline;gap:.13em}.splash-copy .splash-title em{padding-left:0}.splash-copy p{margin:18px auto 12px !important}.splash-status{justify-content:center;flex-wrap:wrap}.premium-exit{min-width:48px !important;width:48px !important;padding:6px !important}.exit-copy{display:none}.exit-icon{width:34px;flex:0 0 34px}}
@media(max-width:520px){.splash-status span:nth-child(2){display:none}.splash > button{right:16px !important;bottom:16px !important}.splash-copy p{font-size:11px !important}.splash-stage{gap:4px}}
@media(prefers-reduced-motion:reduce){.splash *,.exit-link,.office-button{animation:none !important;transition-duration:.01ms !important}}
@media(max-width:720px)
@media(max-height:820px) and (min-width:821px){.splash-stage{transform:scale(.78)}.splash-orbit{margin-bottom:-8px !important}.splash-copy p{margin-top:18px !important}}