*{box-sizing:border-box}:root{--text:#f4f6ff;--muted:#aeb7ca;--purple:#c278ff;--blue:#49c8ff;--green:#66e5b3}html{min-height:100%;background:#090817}body{margin:0;min-height:100vh;color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif}button,input{font:inherit}.LoginBody{min-height:100vh;overflow-x:hidden;background:#090817}.ambient-background{position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 78% 18%,rgba(189,91,255,.28),transparent 31%),radial-gradient(circle at 12% 70%,rgba(48,142,255,.24),transparent 36%),radial-gradient(circle at 66% 92%,rgba(255,82,155,.14),transparent 31%),linear-gradient(135deg,#080713 0%,#101126 48%,#090817 100%)}.ambient-background:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.75) .8px,transparent .8px),radial-gradient(rgba(123,220,255,.65) .8px,transparent .8px);background-size:105px 105px,157px 157px;background-position:15px 22px,71px 83px;opacity:.16}.login-shell{width:min(1160px,calc(100% - 48px));min-height:100vh;margin:auto;padding:70px 0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(390px,.72fr);align-items:center;gap:clamp(50px,8vw,120px)}.login-brand-panel{padding:20px 0}.eyebrow,.card-kicker{margin:0 0 18px;color:#c796ff;font-size:10px;font-weight:700;letter-spacing:4px}.eyebrow span{display:inline-block;width:44px;height:3px;margin-right:13px;vertical-align:middle;border-radius:10px;background:linear-gradient(90deg,var(--blue),var(--purple));box-shadow:0 0 16px rgba(73,200,255,.55)}.brand{display:inline-block;margin-bottom:35px;color:#fff;text-decoration:none;font-size:clamp(29px,4vw,43px);font-weight:300;letter-spacing:12px}.brand span{color:#7bdcff;text-shadow:0 0 25px rgba(73,200,255,.5)}.login-brand-panel h1{margin:0;font-size:clamp(48px,6vw,78px);line-height:.98;letter-spacing:-2px}.login-brand-panel h1 strong{color:#d79bff;text-shadow:0 0 34px rgba(194,120,255,.24)}.brand-copy{max-width:570px;margin:28px 0 35px;color:var(--muted);font-size:16px;line-height:1.75}.login-card{position:relative;overflow:hidden;padding:42px;border:1px solid rgba(255,255,255,.14);border-radius:25px;background:rgba(11,14,34,.72);backdrop-filter:blur(24px);box-shadow:0 30px 90px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.07)}.card-glow{position:absolute;width:240px;height:240px;top:-150px;right:-100px;border-radius:50%;background:rgba(194,120,255,.2);filter:blur(38px);pointer-events:none}.login-card h2,.signupDialog h2{margin:0 0 8px;font-size:31px}.card-subtitle,.signupIntro{margin:0 0 28px;color:var(--muted);font-size:14px;line-height:1.55}.inputContainers,.signupField{display:grid;gap:8px;margin-bottom:17px}.inputContainers label,.signupField label{color:#c8ccda;font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase}.inputContainers input,.signupField input{width:100%;padding:14px 15px;border:1px solid rgba(255,255,255,.12);border-radius:11px;outline:none;color:#fff;background:rgba(4,6,19,.68);transition:.2s}.inputContainers input:focus,.signupField input:focus{border-color:rgba(194,120,255,.7);box-shadow:0 0 0 3px rgba(194,120,255,.1)}.showPasswordLabel{width:fit-content;margin:3px 0 24px;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;cursor:pointer}.showPasswordLabel input{accent-color:var(--purple)}.buttons{margin-bottom:11px}.buttons button,.createAccountButton{width:100%;min-height:48px;border-radius:12px;cursor:pointer;transition:.2s}.buttons button:hover,.createAccountButton:hover{transform:translateY(-1px)}.primary-action button,.createAccountButton{border:1px solid rgba(212,158,255,.52);color:#fff;background:linear-gradient(135deg,#8f4fd3,#5e55d9);box-shadow:0 10px 28px rgba(125,76,217,.24)}.secondary-action button,.portfolio-action button{border:1px solid rgba(255,255,255,.13);color:#e9eafd;background:rgba(255,255,255,.055)}.secondary-action button:hover,.portfolio-action button:hover{border-color:rgba(194,120,255,.4);background:rgba(194,120,255,.09)}.login-divider{position:relative;margin:22px 0;text-align:center;color:#656b80;font-size:9px;letter-spacing:2px}.login-divider:before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(255,255,255,.08)}.login-divider span{position:relative;padding:0 12px;background:#0c0e20}.invite-note{margin:17px 0 0;color:#747b91;text-align:center;font-size:11px}.signupDialog{width:min(460px,calc(100% - 30px));max-height:calc(100vh - 40px);padding:0;overflow:auto;border:1px solid rgba(255,255,255,.14);border-radius:24px;color:var(--text);background:rgba(11,14,34,.96);box-shadow:0 30px 100px rgba(0,0,0,.65)}.signupDialog::backdrop{background:rgba(2,3,12,.76);backdrop-filter:blur(8px)}.signupDialog form{position:relative;padding:36px}.signupClose{position:absolute;top:15px;right:17px;width:34px;height:34px;border:none;border-radius:50%;color:#b8bdd1;background:transparent;font-size:24px;cursor:pointer}.signupClose:hover{color:#fff;background:rgba(255,255,255,.06)}.signupMessage{min-height:20px;margin:5px 0 12px;color:#ffc0dd;font-size:12px}.createAccountButton{font-size:14px}.createAccountButton:disabled{opacity:.55;cursor:wait}@media(max-width:820px){.login-shell{width:min(520px,calc(100% - 30px));padding:38px 0;grid-template-columns:1fr;gap:30px}.login-brand-panel{padding:0 5px}.brand{margin-bottom:18px}.login-brand-panel h1{font-size:clamp(42px,13vw,64px)}.brand-copy{margin:20px 0 24px}.login-card{padding:30px 24px}}@media(max-width:480px){.login-shell{width:min(calc(100% - 22px),430px);padding:25px 0}.brand{font-size:27px;letter-spacing:8px}.login-brand-panel h1{font-size:43px}.login-card{border-radius:20px}.signupDialog form{padding:30px 22px}}
/* Login layout refinement */
.login-shell{width:min(1060px,calc(100% - 64px));grid-template-columns:minmax(0,1fr) minmax(360px,420px);gap:clamp(48px,7vw,108px);padding:60px 0}
.login-brand-panel{padding:0 0 5px}
.eyebrow{margin-bottom:24px;letter-spacing:2.7px}
.brand{margin-bottom:25px;font-size:clamp(30px,3.5vw,39px);letter-spacing:9px}
.login-brand-panel h1{font-size:clamp(48px,5.8vw,70px);line-height:1.07;letter-spacing:-2.3px}
.login-card{padding:40px 38px;border-radius:20px;background:rgba(12,15,33,.82);box-shadow:0 24px 72px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.065)}
.card-kicker{margin-bottom:12px;letter-spacing:2.7px}
.login-card h2{font-size:29px;letter-spacing:-.6px}
.card-subtitle{margin-bottom:27px}
.inputContainers{margin-bottom:18px}
.showPasswordLabel{margin:1px 0 24px}
.primary-action{margin:0}
.primary-action button{font-weight:650}
.signup-prompt{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:5px;margin:23px 0 0;color:var(--muted);font-size:12px}
.signup-prompt button{border:0;padding:3px 4px;background:transparent;color:#d79bff;font:inherit;font-weight:700;cursor:pointer}
.signup-prompt button:hover,.signup-prompt button:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:3px}
@media(max-width:820px){.login-shell{width:min(520px,calc(100% - 30px));grid-template-columns:1fr;gap:28px;padding:36px 0}.login-brand-panel{padding:0 5px}.brand{margin-bottom:16px}.login-brand-panel h1{font-size:clamp(42px,10vw,60px)}.login-card{padding:32px 28px}}
@media(max-width:480px){.login-shell{width:min(430px,calc(100% - 24px));padding:28px 0;gap:24px}.brand{font-size:27px;letter-spacing:8px}.login-brand-panel h1{font-size:43px}.login-card{padding:28px 23px;border-radius:18px}}

/* Atmospheric Stellaz login — visual-only refinement */
.LoginBody{isolation:isolate;background:#070916}
.ambient-background{z-index:-1;overflow:hidden;background:
 radial-gradient(ellipse 37% 50% at 27% 46%,rgba(41,103,206,.18),transparent 78%),
 radial-gradient(ellipse 37% 46% at 75% 43%,rgba(131,62,215,.21),transparent 78%),
 radial-gradient(ellipse 45% 38% at 55% 105%,rgba(38,56,132,.12),transparent 76%),
 linear-gradient(125deg,#070916 0%,#101026 52%,#090917 100%)}
.ambient-background:before{background-size:118px 118px,184px 184px;opacity:.23;mask-image:linear-gradient(to bottom,transparent,black 24%,black 78%,transparent)}
.ambient-background:after{content:"";position:absolute;inset:8% 0 0;pointer-events:none;background:
 radial-gradient(circle at 26% 51%,transparent 0 182px,rgba(100,138,255,.10) 183px,transparent 184px),
 radial-gradient(circle at 26% 51%,transparent 0 270px,rgba(150,104,249,.08) 271px,transparent 272px),
 radial-gradient(circle at 26% 51%,rgba(67,113,234,.09),transparent 37%);
 opacity:.85}
.login-shell{width:min(1140px,calc(100% - 72px));grid-template-columns:minmax(0,1.08fr) minmax(360px,420px);gap:clamp(55px,8vw,135px)}
.login-brand-panel{position:relative;padding:38px 0 46px 14px}
.login-brand-panel:before{content:"";position:absolute;z-index:-1;width:380px;height:380px;top:50%;left:32%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(95,70,220,.19),rgba(65,115,238,.05) 45%,transparent 72%);filter:blur(14px);pointer-events:none}
.brand{font-weight:450;letter-spacing:10px;text-shadow:0 0 30px rgba(111,177,255,.10)}
.login-brand-panel h1{font-size:clamp(53px,6vw,76px);letter-spacing:-3px;line-height:1.11;text-shadow:0 9px 38px rgba(0,0,0,.24)}
.login-brand-panel h1 strong{background:linear-gradient(105deg,#f0b7ff 3%,#b98cff 57%,#89b6ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.eyebrow{color:#b6bcda}
.eyebrow span{height:2px;background:linear-gradient(90deg,#50c5ff,#bb83ff)}
.login-card{isolation:isolate;overflow:visible;border-radius:30px;border:1px solid rgba(176,169,255,.22);background:linear-gradient(155deg,rgba(38,36,78,.78),rgba(16,18,42,.89) 39%,rgba(11,13,32,.94));backdrop-filter:blur(28px) saturate(130%);-webkit-backdrop-filter:blur(28px) saturate(130%);box-shadow:0 34px 95px rgba(0,0,0,.45),0 0 78px rgba(105,71,206,.12),inset 0 1px rgba(255,255,255,.11)}
.login-card:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.065),transparent 36%);z-index:-1}
.login-card:after{content:"";position:absolute;z-index:-2;left:12%;right:12%;bottom:-20px;height:55px;background:rgba(130,75,245,.27);filter:blur(38px);border-radius:50%;pointer-events:none}
.card-glow{top:-110px;right:-105px;width:260px;height:260px;background:rgba(138,96,241,.19);filter:blur(52px)}
.login-card h2{font-size:31px;letter-spacing:-.9px}
.card-kicker{color:#bfa5ff}
.inputContainers label{color:#b9c0dd}
.inputContainers input{min-height:49px;background:rgba(9,12,31,.76);border-color:rgba(177,184,239,.17);border-radius:14px;color:#f7f8ff;box-shadow:inset 0 1px 3px rgba(0,0,0,.20)}
.inputContainers input::placeholder{color:#7e86a4}
.inputContainers input:focus{background:rgba(16,19,46,.96);border-color:#a68bff;box-shadow:0 0 0 3px rgba(156,122,255,.15)}
.inputContainers input:-webkit-autofill,.inputContainers input:-webkit-autofill:hover,.inputContainers input:-webkit-autofill:focus{-webkit-text-fill-color:#f7f8ff;box-shadow:0 0 0 1000px #151833 inset;caret-color:white;transition:background-color 9999s ease-out}
.primary-action button{min-height:51px;border-radius:14px;border:1px solid rgba(216,189,255,.49);background:linear-gradient(112deg,#ab66e9 0%,#7857e1 51%,#526bdb 100%);box-shadow:0 12px 27px rgba(100,79,214,.26),inset 0 1px rgba(255,255,255,.22);font-weight:700}
.primary-action button:hover{filter:brightness(1.11);box-shadow:0 15px 30px rgba(114,92,235,.36),inset 0 1px rgba(255,255,255,.28)}
.signup-prompt{margin-top:26px}
@media(max-width:820px){.login-shell{width:min(520px,calc(100% - 32px));grid-template-columns:1fr;gap:22px;padding:44px 0}.login-brand-panel{padding:12px 8px}.login-brand-panel:before{width:300px;height:300px}.login-brand-panel h1{font-size:clamp(44px,10vw,62px)}.login-card{padding:34px 30px;border-radius:26px}.ambient-background:after{background:radial-gradient(circle at 35% 30%,rgba(91,90,219,.12),transparent 55%)}}
@media(max-width:480px){.login-shell{width:min(430px,calc(100% - 26px));padding:24px 0 36px}.login-brand-panel{padding:8px 5px}.login-brand-panel h1{font-size:43px;letter-spacing:-2px}.login-card{padding:30px 24px;border-radius:23px}.login-card h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){.primary-action button{transition:none}}

/* Phase 1: split login and static modular homescreen showcase */
.LoginBody{display:block;min-height:100vh}
.login-shell{width:min(1260px,calc(100% - 64px));min-height:min(850px,calc(100vh - 76px));margin:38px auto;padding:18px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:0;align-items:stretch;border:1px solid rgba(192,181,246,.17);border-radius:30px;background:rgba(20,19,41,.88);box-shadow:0 40px 110px rgba(0,0,0,.42);overflow:hidden}
.login-brand-panel{min-width:0;position:relative;padding:30px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;border-radius:22px;background:radial-gradient(ellipse at 15% 3%,rgba(178,136,255,.19),transparent 48%),radial-gradient(ellipse at 95% 90%,rgba(74,156,232,.19),transparent 45%),linear-gradient(150deg,#352956 0%,#26264e 54%,#141e3c 100%)}
.login-brand-panel:before{display:none}
.showcase-topline{display:flex;justify-content:space-between;align-items:center;gap:16px}
.showcase-topline .brand{margin:0;font-size:25px;line-height:1;letter-spacing:6px}
.showcase-label{color:#c6c0e6;font-size:9px;letter-spacing:1.4px;font-weight:700;text-align:right}
.showcase-intro{padding:0 4px}
.showcase-intro .eyebrow{margin-bottom:12px;font-size:9px}
.showcase-intro h1{font-size:clamp(35px,4vw,54px);letter-spacing:-1.7px;line-height:1.1}
.module-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(60px,1fr));gap:10px;min-height:290px;max-height:350px;flex:1}
.module-tile{min-width:0;min-height:0;border-radius:15px;padding:15px 13px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:8px;border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px rgba(255,255,255,.10),0 10px 25px rgba(13,12,40,.17);font-size:clamp(10px,1.05vw,14px);font-weight:700;color:#fff;overflow:hidden}
.module-symbol{font-size:19px;line-height:1;font-weight:500;opacity:.9}
.module-entertainment{grid-column:span 2;grid-row:span 2;background:#7451b5}
.module-emails{grid-column:span 2;background:#366ba6}
.module-notes{grid-column:span 1;grid-row:span 2;background:#a15d90}
.module-calendar{background:#446a9a}
.module-smart{background:#357d83}
.module-finances{grid-column:span 2;background:#537a60}
.module-robot{background:#6862aa}
.module-collection{background:#906247}
.showcase-footer{margin:0 4px;color:#d0cbe8;font-size:12px;letter-spacing:.1px}
.login-card{min-width:0;align-self:center;width:min(100%,480px);margin:auto;padding:clamp(28px,4vw,60px);border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.login-card:before,.login-card:after,.login-card .card-glow{display:none}
.login-card h2{font-size:clamp(30px,3vw,39px)}
.login-card .card-subtitle{margin-bottom:32px}
.login-card .inputContainers input{background:rgba(48,44,69,.78);border-color:rgba(196,184,231,.15)}
@media(max-width:900px){.login-shell{width:min(760px,calc(100% - 36px));grid-template-columns:1fr;min-height:auto;margin:22px auto;padding:12px}.login-brand-panel{padding:24px;gap:20px}.module-board{max-height:280px;min-height:250px}.login-card{padding:38px 28px 32px;max-width:500px}.showcase-intro h1{font-size:40px}}
@media(max-width:520px){.login-shell{width:calc(100% - 20px);margin:10px auto;padding:8px;border-radius:23px}.login-brand-panel{padding:19px;border-radius:18px;gap:17px}.showcase-topline .brand{font-size:20px;letter-spacing:4px}.showcase-label{font-size:8px}.showcase-intro .eyebrow{font-size:8px}.showcase-intro h1{font-size:35px}.module-board{gap:6px;min-height:215px;max-height:240px;grid-template-rows:repeat(4,minmax(40px,1fr))}.module-tile{border-radius:10px;padding:9px 7px;font-size:10px}.module-symbol{font-size:15px}.showcase-footer{font-size:11px}.login-card{padding:30px 17px 27px}.login-card h2{font-size:30px}}

/* Phase 1 polish — wider, lighter, more translucent layout */
.LoginBody{background:#393348}
.ambient-background{background:radial-gradient(ellipse at 21% 12%,rgba(188,169,218,.45),transparent 51%),radial-gradient(ellipse at 87% 85%,rgba(115,107,157,.28),transparent 55%),linear-gradient(135deg,#655d74 0%,#494259 53%,#383549 100%)}
.ambient-background:before{opacity:.055}
.ambient-background:after{opacity:.18}
.login-shell{width:min(1480px,calc(100% - 76px));min-height:min(800px,calc(100vh - 74px));margin:37px auto;padding:18px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid rgba(233,223,255,.22);background:rgba(32,26,49,.70);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);box-shadow:0 36px 90px rgba(22,17,34,.31)}
.login-brand-panel{background:radial-gradient(ellipse at 9% 7%,rgba(194,156,255,.23),transparent 52%),radial-gradient(ellipse at 94% 92%,rgba(78,142,219,.24),transparent 55%),linear-gradient(143deg,rgba(88,67,142,.83),rgba(45,47,91,.78) 53%,rgba(29,55,97,.82));border:1px solid rgba(220,207,255,.12)}
.showcase-intro{margin-top:10px}
.login-card{width:min(100%,560px);padding:clamp(30px,5vw,72px)}
.login-card .inputContainers input{background:rgba(105,91,128,.30);border-color:rgba(219,201,246,.21)}
.login-card .inputContainers input:focus{background:rgba(70,57,95,.58)}
@media(max-width:900px){.login-shell{width:min(760px,calc(100% - 36px));grid-template-columns:1fr;min-height:auto;margin:22px auto;padding:12px}.login-card{max-width:560px;padding:38px 28px 32px}}
@media(max-width:520px){.login-shell{width:calc(100% - 20px);margin:10px auto;padding:8px}.login-card{padding:30px 17px 27px}}

/* Brand hierarchy: prominent STELLAZ, compact tagline, taller dashboard preview */
.login-brand-panel{justify-content:flex-start;gap:0}
.showcase-topline{flex:0 0 auto}
.showcase-topline .brand{font-size:clamp(42px,4vw,57px);font-weight:500;letter-spacing:7px;line-height:1.12;white-space:nowrap}
.showcase-intro{margin:12px 0 24px;padding:0 4px;flex:0 0 auto}
.showcase-intro h1{font-size:clamp(21px,2vw,27px);font-weight:600;letter-spacing:-.6px;line-height:1.2}
.module-board{flex:1 1 auto;min-height:350px;max-height:none;grid-template-rows:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.showcase-topline .brand{font-size:clamp(38px,7vw,52px)}.showcase-intro{margin:12px 0 22px}.showcase-intro h1{font-size:25px}.module-board{min-height:310px;max-height:410px}}
@media(max-width:520px){.showcase-topline .brand{font-size:clamp(30px,8vw,42px);letter-spacing:4px}.showcase-intro{margin:9px 0 18px}.showcase-intro h1{font-size:21px;letter-spacing:-.3px}.module-board{min-height:255px;max-height:315px;grid-template-rows:repeat(4,minmax(0,1fr))}}

/* Phase 2: modular preview motion and typography balance */
.showcase-topline .brand{font-size:clamp(40px,3.65vw,53px)}
.showcase-intro h1{font-size:clamp(24px,2.2vw,30px)}
.module-board[data-animated-preview]{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));isolation:isolate}
.module-board[data-animated-preview] .module-tile{will-change:auto;contain:layout paint}
@media(max-width:900px){.showcase-topline .brand{font-size:clamp(36px,6.5vw,49px)}.showcase-intro h1{font-size:27px}}
@media(max-width:520px){.showcase-topline .brand{font-size:clamp(29px,7.6vw,39px)}.showcase-intro h1{font-size:23px}}
@media(prefers-reduced-motion:reduce){.module-board[data-animated-preview] .module-tile{animation:none!important;transition:none!important}}
