/* Mobile-only port of approved mihub-olt-mobile-ambient.html (2026-09-07).
   Existing Optical Flow desktop CSS/JS are intentionally unchanged. */
#olt-optical>.olt-mobile-network,#olt-optical .olt-mobile-footer{display:none}
@media(max-width:899px){
 #olt-optical[data-layout]{--olt-bg:#0c0e1c;--olt-text:#f3f1fc;--olt-muted:#acacc0;--olt-bg-opacity:.27;display:flex;flex-direction:column;isolation:isolate;width:100%;max-width:none!important;min-width:0;min-height:100svh;height:auto;aspect-ratio:auto;margin:0;border-radius:0;overflow:hidden;background:#0c0e1c}
 #olt-optical[data-layout] .olt-wash{z-index:-2;background:radial-gradient(ellipse at 98% 30%,#35274766,transparent 60%),radial-gradient(ellipse at 5% 95%,#153e4533,transparent 60%)}
 #olt-optical[data-layout]>.olt-mobile-network{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:-1;opacity:var(--olt-bg-opacity);pointer-events:none;mask-image:linear-gradient(90deg,#0009,#000 75%)}
 #olt-optical .olt-ambient-wire{fill:none;stroke:#b59afb;stroke-width:1}
 #olt-optical .olt-ambient-light{fill:none;stroke:#80efe7;stroke-width:2;stroke-linecap:round;stroke-dasharray:2 98;animation:olt-flow-ambient 9s linear infinite;filter:drop-shadow(0 0 3px #81f6ec)}
 #olt-optical .olt-ambient-device{fill:#17182c;stroke:#b9a5fc;stroke-width:1}
 #olt-optical .olt-mobile-network text{fill:#cfc0fe;font:11px ui-monospace,monospace;letter-spacing:.5px}
 #olt-optical[data-layout] .olt-header{width:100%;max-width:430px;margin:0 auto;flex:none;display:flex;padding:28px 25px 0;border:0}
 #olt-optical[data-layout] .olt-brand{gap:10px;font-size:21px;font-weight:600;letter-spacing:-.7px}
 #olt-optical[data-layout] .olt-brand .olt-icon{width:25px;height:25px;color:#b7a0ff}
 #olt-optical[data-layout] .olt-brand b{color:#b7a0ff;font-weight:600}
 #olt-optical[data-layout] .olt-header>.olt-overline{display:none}
 #olt-optical[data-layout] .olt-main{display:block;flex:none;min-height:0;max-width:430px;width:100%;margin:0 auto;padding:36px 25px 0}
 #olt-optical[data-layout] .olt-login{padding:0;width:100%;max-width:none}
 #olt-optical[data-layout] .olt-eyebrow{gap:8px;color:#b8a7e3;font-size:10px;font-weight:500;line-height:15px;letter-spacing:1.65px;margin:0 0 13px}
 #olt-optical[data-layout] .olt-dot{width:5px;height:5px;flex-shrink:0;background:#71e2dd;box-shadow:0 0 9px #71e2dd70}
 #olt-optical[data-layout] h1{font-size:29px;line-height:1.14;letter-spacing:-1.1px;font-weight:600;margin:0 0 12px;text-shadow:0 2px 20px #0c0e1c}
 #olt-optical[data-layout] .olt-subtitle{font-size:13px;line-height:1.5;color:#acacc0;margin:0 0 23px;max-width:255px}
 #olt-optical[data-layout] .olt-subtitle br{display:initial}
 #olt-optical[data-layout] form{margin:0;display:grid;gap:16px}
 #olt-optical[data-layout] .olt-field{margin:0;color:#c9c8da;font-size:12px;line-height:15px}
 #olt-optical[data-layout] .olt-field input{height:47px;margin-top:7px;border:1px solid #34344b;border-radius:10px;background:#131525;color:#f1ecff;padding:0 13px;font-family:inherit;font-size:16px;box-shadow:0 3px 16px #00000014}
 #olt-optical[data-layout] .olt-field input::placeholder{color:#7f8095;opacity:1}
 #olt-optical[data-layout] .olt-password input{padding-right:47px}
 #olt-optical[data-layout] .olt-eye{right:1px;top:1px;width:44px;height:44px;color:#a5a2bc}
 #olt-optical[data-layout] .olt-eye .olt-icon{width:19px;height:19px}
 #olt-optical[data-layout] .olt-options{gap:3px;margin:-5px 0 0;min-height:44px;align-items:center;justify-content:space-between;flex-wrap:wrap;color:#b8b7c9}
 #olt-optical[data-layout] .olt-options>label{gap:7px;min-height:44px;font-size:11px;white-space:nowrap}
 #olt-optical[data-layout] input[type=checkbox]{width:15px;height:15px;accent-color:#b7a0ff;margin:0}
 #olt-optical[data-layout] .olt-options>.olt-link{font-size:11px;min-height:44px;display:flex;align-items:center;padding:0 2px;color:#c8b9ee}
 #olt-optical[data-layout] .olt-options>.olt-help{margin:0;font-size:11px}
 #olt-optical[data-layout] .olt-help summary{min-height:44px;display:flex;align-items:center;cursor:pointer;color:#c8b9ee;list-style:none}
 #olt-optical[data-layout] .olt-help summary::-webkit-details-marker{display:none}
 #olt-optical[data-layout] .olt-help[open]{flex-basis:100%;order:2}
 #olt-optical[data-layout] .olt-help p{margin:0 0 8px;padding:10px 12px;background:#17182c;border:1px solid #36324c;border-radius:8px;font-size:12px;line-height:1.5}
 #olt-optical[data-layout] .olt-enter{height:48px;margin-top:-4px;padding:0 16px;border:1px solid #c6b6ff77;border-radius:10px;background:linear-gradient(115deg,#c3aeff,#aa8fed);color:#171328;font-size:14px;font-weight:600;box-shadow:0 7px 26px #aa8fed1c}
 #olt-optical[data-layout] .olt-enter .olt-icon{width:20px;height:20px}
 #olt-optical[data-layout] .olt-sso{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:44px;min-height:44px;margin:37px 0 0;border:1px solid #36324c;border-radius:10px;background:#111322;color:#cdc3e8;font-size:13px;text-decoration:none}
 #olt-optical[data-layout] .olt-sso::before{content:"ou";position:absolute;top:-29px;left:0;right:0;height:16px;line-height:16px;font-size:10px;color:#7d7c92;background:linear-gradient(90deg,#2b2b40 44%,transparent 44%,transparent 56%,#2b2b40 56%) center/100% 1px no-repeat;pointer-events:none}
 #olt-optical[data-layout] .olt-scene{display:none}
 #olt-optical[data-layout] .olt-footer{width:100%;max-width:430px;flex:none;margin: auto auto 0;padding:23px 25px 18px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;border:0;color:#88889f;font-size:10px;letter-spacing:.2px}
 #olt-optical[data-layout] .olt-footer>span:first-child{display:none}
 #olt-optical[data-layout] .olt-footer>.olt-mobile-footer{display:flex;align-items:center;gap:7px;max-width:none;font-size:10px;line-height:1.5}
 #olt-optical[data-layout] .olt-footer .olt-motion{min-width:44px;min-height:44px;padding:0;border:0;background:transparent;color:#a5a1ba;font-size:10px}
 #olt-optical[data-layout] .olt-motion:disabled{cursor:default;opacity:.7}
 #olt-optical[data-layout] .olt-error,#olt-optical[data-layout] .olt-notice{position:static;margin-bottom:16px;overflow-wrap:anywhere}
 #olt-optical[data-mobile-paused=true] .olt-ambient-light{animation-play-state:paused}
 @keyframes olt-flow-ambient{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
 @media(max-width:350px){
  #olt-optical[data-layout] .olt-header{padding:24px 20px 0}
  #olt-optical[data-layout] .olt-main{padding:29px 20px 0}
  #olt-optical[data-layout] h1{font-size:26px}
  #olt-optical[data-layout] .olt-eyebrow{letter-spacing:1.05px}
  #olt-optical[data-layout] .olt-footer{padding:18px 20px 13px}
 }
 @media(max-height:740px){
  #olt-optical[data-layout] .olt-header{padding-top:22px}
  #olt-optical[data-layout] .olt-main{padding-top:24px}
  #olt-optical[data-layout] .olt-subtitle{margin-bottom:18px}
  #olt-optical[data-layout] form{gap:13px}
  #olt-optical[data-layout] .olt-footer{padding-top:12px;padding-bottom:10px}
 }
 @media(max-height:640px){
  #olt-optical[data-layout] .olt-header{padding-top:18px}
  #olt-optical[data-layout] .olt-main{padding-top:20px}
  #olt-optical[data-layout] .olt-eyebrow{margin-bottom:10px}
  #olt-optical[data-layout] form{gap:10px}
  #olt-optical[data-layout] .olt-field input{height:44px}
 }
 @media(prefers-reduced-motion:reduce){#olt-optical .olt-ambient-light{animation:none!important}}
}
