/* macOS inspired authentication window. Scoped to auth pages so workspace styling stays unchanged. */
body.auth-page{
  --auth-bg:#edf3fa;
  --auth-ink:#1f2e43;
  --auth-muted:#73859a;
  --auth-soft:#f7faff;
  --auth-line:rgba(102,128,157,.2);
  --auth-blue:#0a84ff;
  --auth-blue-deep:#006edb;
  --auth-shadow:0 28px 80px rgba(49,76,111,.18),0 3px 12px rgba(49,76,111,.08);
  background:var(--auth-bg)!important;
  color:var(--auth-ink)!important;
  color-scheme:light;
  overflow-x:hidden;
}
body.auth-page:before,body.auth-page:after{display:none!important}
body.auth-page .tech-atmosphere,body.auth-page .tech-orbit{display:none!important}
body.auth-page .tech-reveal{animation:none!important;opacity:1!important}
body.auth-page .brand img{display:none}
body.auth-page .auth-shell{
  min-height:100svh;
  display:grid;
  grid-template-columns:minmax(320px,.88fr) minmax(480px,1.12fr);
  align-items:center;
  gap:clamp(38px,7vw,120px);
  padding:clamp(28px,5vw,72px) clamp(28px,7vw,132px);
  background:
    radial-gradient(ellipse at 10% 0%,rgba(255,255,255,.92),transparent 43%),
    linear-gradient(145deg,#f4f8fd 0%,#e8f0fa 54%,#eef5fb 100%)!important;
}
body.auth-page .auth-story{
  min-height:0;
  height:auto;
  padding:16px 0 20px;
  background:transparent!important;
  border:0!important;
  overflow:visible;
  justify-content:space-between;
  align-self:stretch;
}
body.auth-page .auth-story:before{
  width:clamp(360px,42vw,680px);
  height:clamp(360px,42vw,680px);
  left:-16%;
  top:16%;
  border:1px solid rgba(112,151,195,.17);
  box-shadow:0 0 0 62px rgba(255,255,255,.15),0 0 0 124px rgba(146,182,218,.07);
}
body.auth-page .auth-story>.brand,body.auth-page .auth-story>.story-body,body.auth-page .auth-story>.story-footer{z-index:1}
body.auth-page .auth-story>.brand{font-size:22px;color:#1f4268!important}
body.auth-page .auth-story>.brand small{color:#7892ab!important}
body.auth-page .auth-story>.brand img{filter:none!important}
body.auth-page .story-body{margin:auto 0;max-width:500px;padding:70px 0 44px}
body.auth-page .story-body .eyebrow{display:inline-flex;align-items:center;gap:8px;color:#6c86a2;letter-spacing:1.6px}
body.auth-page .story-body .eyebrow:before{content:'';width:7px;height:7px;border-radius:50%;background:#34a6f4;box-shadow:0 0 0 5px rgba(52,166,244,.12)}
body.auth-page .story-body h1{margin:20px 0 20px;color:#1c3551!important;font-size:clamp(40px,4vw,64px);line-height:1.18;letter-spacing:-1.8px;font-weight:700}
body.auth-page .story-body h1 em{color:#0a84ff!important}
body.auth-page .story-body h1 em:after{display:none}
body.auth-page .story-body>p{font-size:15px;line-height:1.9;color:#71859c!important}
body.auth-page .story-scene{display:none}
body.auth-page .story-points{display:flex;flex-wrap:wrap;gap:18px;color:#738aa3!important;font-size:12px}
body.auth-page .story-points span{display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border:1px solid rgba(115,145,177,.18);border-radius:10px;background:rgba(255,255,255,.38);backdrop-filter:blur(12px)}
body.auth-page .story-points .icon{width:14px;color:#4b9ee8}
body.auth-page .story-footer{display:flex;justify-content:space-between;gap:18px;color:#8ca0b5!important;font-size:10px;letter-spacing:.8px}
body.auth-page .auth-main{
  position:relative;
  width:min(100%,600px);
  min-height:640px;
  max-height:none;
  overflow:visible;
  padding:0 clamp(28px,4vw,62px) 28px;
  align-self:center;
  justify-self:end;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(255,255,255,.78)!important;
  border-radius:28px;
  box-shadow:var(--auth-shadow)!important;
  backdrop-filter:blur(30px) saturate(145%);
  -webkit-backdrop-filter:blur(30px) saturate(145%);
}
body.auth-page .auth-window-chrome{height:62px;display:flex;align-items:center;gap:16px;margin:0 -8px 14px;padding:0 4px;border-bottom:1px solid rgba(108,135,163,.14);color:#7a8da2}
body.auth-page .traffic-lights{display:flex;align-items:center;gap:8px}
body.auth-page .traffic-lights i{display:block;width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12),0 1px 2px rgba(33,57,80,.12)}
body.auth-page .traffic-red{background:#ff5f57}.traffic-yellow{background:#febc2e}.traffic-green{background:#28c840}
body.auth-page .window-title{font-size:12px;font-weight:600;letter-spacing:.2px;color:#73869b}
body.auth-page .auth-theme-toggle{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid rgba(101,128,157,.18);border-radius:9px;background:rgba(255,255,255,.5);color:#71859a;font-size:11px;transition:.2s}
body.auth-page .auth-theme-toggle:hover{background:#fff;border-color:rgba(10,132,255,.35);color:var(--auth-blue)}
body.auth-page .auth-theme-toggle .icon{width:14px;height:14px}
body.auth-page .auth-mobile-brand{display:none}
body.auth-page .auth-top{padding-top:3px;text-align:right;color:#7c8da1;font-size:12px}
body.auth-page .auth-top a{color:var(--auth-blue);font-weight:600;margin-left:8px}
body.auth-page .auth-card{max-width:none;margin:0;padding:30px 0 22px;align-self:auto}
body.auth-page .reg-card{padding-top:28px}
body.auth-page .welcome-chip{margin-bottom:18px;padding:6px 10px;border:1px solid rgba(10,132,255,.16);border-radius:8px;background:rgba(232,243,255,.8);color:#6f8ca9;font-size:10px;letter-spacing:1.3px}
body.auth-page .welcome-chip i{width:6px;height:6px;background:#0a84ff;box-shadow:0 0 0 4px rgba(10,132,255,.12)}
body.auth-page .auth-card h2{color:#1d2d42!important;font-size:32px;letter-spacing:-.5px;font-weight:700}
body.auth-page .auth-card>p{color:#7c8da0!important;font-size:13px;margin-bottom:30px}
body.auth-page .auth-tabs{gap:26px;margin-bottom:26px;border-bottom:1px solid rgba(102,128,157,.2)}
body.auth-page .auth-tabs button{padding-bottom:12px;color:#8393a5;font-size:13px}
body.auth-page .auth-tabs button.active{color:var(--auth-blue);font-weight:650}
body.auth-page .auth-tabs button.active:after{height:2px;background:var(--auth-blue);box-shadow:none}
body.auth-page .field{margin-bottom:17px}
body.auth-page .field>span{color:#586e86;font-size:12px;margin-bottom:7px}
body.auth-page .field input,body.auth-page .field select,body.auth-page .field textarea{min-height:48px;border:1px solid rgba(100,128,159,.2);border-radius:11px;background:rgba(248,251,255,.72)!important;color:#20344b!important;box-shadow:inset 0 1px 1px rgba(50,80,110,.03)!important}
body.auth-page .field input:focus,body.auth-page .field select:focus,body.auth-page .field textarea:focus{background:#fff!important;border-color:rgba(10,132,255,.62);box-shadow:0 0 0 3px rgba(10,132,255,.11)!important}
body.auth-page .field input::placeholder{color:#a1afbd}
body.auth-page .input-action{gap:8px}
body.auth-page .auth-options{margin:2px 0 20px;color:#8293a5}
body.auth-page .check{color:#7d8da0}
body.auth-page .btn{border-radius:10px;min-height:42px}
body.auth-page .btn.primary{background:var(--auth-blue)!important;color:#fff!important;border:0!important;box-shadow:0 8px 18px rgba(10,132,255,.22)!important}
body.auth-page .btn.primary:hover{background:var(--auth-blue-deep)!important;transform:translateY(-1px)}
body.auth-page .btn.outline{background:rgba(255,255,255,.55);border-color:rgba(97,126,157,.2);color:#58718b}
body.auth-page .btn.text{color:#5f88b2}
body.auth-page .login-submit{height:50px;letter-spacing:3px}
body.auth-page .school-entry{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:26px;padding:13px 15px;border:1px solid rgba(105,134,164,.16);border-radius:13px;background:rgba(248,251,255,.62)}
body.auth-page .school-entry-copy{display:flex;align-items:center;gap:10px}
body.auth-page .school-entry-copy>.icon{width:19px;color:#4b9ee8}
body.auth-page .school-entry-copy strong{display:block;color:#4e6680;font-size:12px}
body.auth-page .school-entry-copy small{display:block;color:#94a3b2;font-size:10px;margin-top:2px}
body.auth-page .demo-area{margin-top:28px;padding-top:20px;border-top:1px solid rgba(104,132,161,.16)}
body.auth-page .demo-area>p{color:#91a1b1;font-size:10px}
body.auth-page .demo-role,body.auth-page .role-choice{background:rgba(248,251,255,.62);border-color:rgba(102,130,159,.17);color:#6e849a}
body.auth-page .demo-role:hover,body.auth-page .role-choice:hover{background:#fff;border-color:rgba(10,132,255,.34);color:var(--auth-blue)}
body.auth-page .role-choice.active{background:#edf6ff;border-color:rgba(10,132,255,.48);color:var(--auth-blue);box-shadow:0 0 0 2px rgba(10,132,255,.07)}
body.auth-page .role-choice small{color:#9aa8b6}
body.auth-page .auth-main footer{padding-top:12px;color:#93a1af!important}
body.auth-page .auth-main footer .btn{color:#7895b4}
body.auth-page .form-error{color:#c4515b}

body.auth-page.auth-dark{
  --auth-bg:#111820;
  --auth-ink:#e8eff7;
  --auth-muted:#9baec0;
  --auth-soft:#192330;
  --auth-line:rgba(191,211,231,.18);
  --auth-blue:#4aa3ff;
  --auth-blue-deep:#2589e7;
  --auth-shadow:0 28px 80px rgba(0,0,0,.4),0 3px 12px rgba(0,0,0,.22);
  color-scheme:dark;
}
body.auth-page.auth-dark .auth-shell{background:radial-gradient(ellipse at 10% 0%,rgba(81,113,143,.18),transparent 42%),linear-gradient(145deg,#172331,#101821 60%,#151f2a)!important}
body.auth-page.auth-dark .auth-story>.brand{color:#e2edf8!important}.auth-dark .auth-story>.brand small{color:#8ba2b8!important}
body.auth-page.auth-dark .story-body .eyebrow,body.auth-page.auth-dark .story-body>p,body.auth-page.auth-dark .story-points,body.auth-page.auth-dark .story-footer{color:#9aafc2!important}
body.auth-page.auth-dark .story-body h1{color:#e8f1fa!important}.auth-dark .story-points span{background:rgba(27,41,55,.62);border-color:rgba(187,211,234,.14)}
body.auth-page.auth-dark .auth-main{background:rgba(28,39,52,.76)!important;border-color:rgba(255,255,255,.12)!important}
body.auth-page.auth-dark .auth-window-chrome{border-bottom-color:rgba(196,216,237,.12);color:#9db0c3}
body.auth-page.auth-dark .window-title,body.auth-page.auth-dark .auth-top{color:#9cafc0}
body.auth-page.auth-dark .auth-theme-toggle{background:rgba(29,45,61,.76);border-color:rgba(191,213,233,.18);color:#a9bed1}
body.auth-page.auth-dark .auth-card h2{color:#eff6fd!important}.auth-dark .auth-card>p{color:#a5b5c4!important}
body.auth-page.auth-dark .auth-tabs{border-bottom-color:rgba(191,213,233,.18)}.auth-dark .auth-tabs button{color:#95a7b8}
body.auth-page.auth-dark .auth-card .field>span,body.auth-page.auth-dark .check{color:#a6b8c8}
body.auth-page.auth-dark .field input,body.auth-page.auth-dark .field select,body.auth-page.auth-dark .field textarea{background:rgba(16,28,41,.72)!important;border-color:rgba(191,213,233,.18);color:#e9f1f8!important}
body.auth-page.auth-dark .field input:focus,body.auth-page.auth-dark .field select:focus{background:rgba(20,35,50,.95)!important}
body.auth-page.auth-dark .field input::placeholder{color:#71869a}
body.auth-page.auth-dark .school-entry,body.auth-page.auth-dark .demo-role,body.auth-page.auth-dark .role-choice{background:rgba(17,31,45,.58);border-color:rgba(191,213,233,.15);color:#a6bacb}
body.auth-page.auth-dark .school-entry-copy strong{color:#c9d8e6}.auth-dark .school-entry-copy small{color:#8399ad}
body.auth-page.auth-dark .demo-role:hover,body.auth-page.auth-dark .role-choice:hover{background:rgba(46,73,99,.58);color:#bfe0ff}
body.auth-page.auth-dark .role-choice.active{background:rgba(44,121,196,.22);border-color:rgba(74,163,255,.58);color:#bfe0ff}
body.auth-page.auth-dark .welcome-chip{background:rgba(50,126,201,.16);border-color:rgba(74,163,255,.28);color:#a8c7e5}
body.auth-page.auth-dark .auth-main footer{color:#8ea3b7!important}

@media(max-width:980px){body.auth-page .auth-shell{grid-template-columns:minmax(260px,.7fr) minmax(430px,1.3fr);gap:30px;padding:28px}.story-body h1{font-size:42px}}
@media(max-width:760px){
  body.auth-page .auth-shell{display:block;min-height:100svh;padding:14px;background:linear-gradient(145deg,#f5f9fd,#eaf2fb)!important}
  body.auth-page.auth-dark .auth-shell{background:linear-gradient(145deg,#182432,#111921)!important}
  body.auth-page .auth-story{display:none}
  body.auth-page .auth-main{width:100%;max-width:620px;min-height:calc(100svh - 28px);max-height:none;margin:0 auto;padding:0 22px 23px;border-radius:22px}
  body.auth-page .auth-window-chrome{height:53px;margin:0 -4px 5px}
  body.auth-page .window-title{font-size:11px}
  body.auth-page .auth-theme-toggle{padding:7px 8px}.auth-theme-toggle span{display:none}
  body.auth-page .auth-mobile-brand{display:flex;padding-top:5px;font-size:20px;color:#23486f!important}.auth-dark .auth-mobile-brand{color:#e7f1fa!important}
  body.auth-page .auth-mobile-brand img{width:31px;height:31px}
  body.auth-page .auth-top{padding-top:14px;font-size:11px}
  body.auth-page .auth-card{padding:36px 0 25px}.auth-card h2{font-size:28px!important}
  body.auth-page .role-picker{grid-template-columns:repeat(2,1fr)}
  body.auth-page .form-grid{grid-template-columns:1fr}
  body.auth-page .demo-roles{grid-template-columns:repeat(3,1fr)}
  body.auth-page .story-footer{display:none}
}
@media(prefers-reduced-motion:reduce){body.auth-page *{transition:none!important;animation:none!important}}
/* Registration uses a single, readable identity row on mobile and desktop. */
body.auth-page .role-picker{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:18px 0 24px}
body.auth-page .role-choice{min-width:0;padding:14px 6px;border-radius:18px;font-size:16px;font-weight:700;line-height:1.35;display:grid;justify-items:center;gap:4px}
body.auth-page .role-choice strong{font-weight:750}
body.auth-page .role-choice small{font-size:10px;font-weight:500;white-space:nowrap}
body.auth-page .reg-card .welcome-chip{margin-bottom:10px}
body.auth-page .register-role-hint{padding:18px;border:1px dashed rgba(10,132,255,.28);border-radius:17px;background:rgba(239,247,255,.65);color:#6f8ca9;text-align:center;font-size:14px;font-weight:600}
@media(max-width:760px){body.auth-page .role-picker{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-top:12px}body.auth-page .role-choice{padding:10px 2px;font-size:14px;border-radius:15px}body.auth-page .role-choice .icon{width:22px;height:22px}body.auth-page .role-choice small{font-size:8px;letter-spacing:-.2px}}
body.auth-page .reg-card{padding-top:18px}
body.auth-page .reg-card h2{margin-top:0;margin-bottom:6px}
body.auth-page .reg-card>p{margin:0 0 12px}
body.auth-page .reg-card .role-picker{margin-top:10px;margin-bottom:14px}
body.auth-page .register-choice-group{border:0;padding:0;margin:10px 0 14px}
body.auth-page .register-choice-group legend{font-size:13px;font-weight:700;color:#52718d;margin-bottom:7px}
body.auth-page .register-choice-row{display:flex;gap:8px;flex-wrap:wrap}
body.auth-page .register-choice-button{flex:1 1 0;min-height:40px;border:1px solid rgba(114,151,184,.28);border-radius:13px;background:rgba(255,255,255,.68);color:#5d7890;font-size:14px;font-weight:700;cursor:pointer;box-shadow:inset 0 1px 0 #fff,0 5px 12px rgba(50,88,118,.07)}
body.auth-page .register-choice-button::before{content:'○';display:inline-block;margin-right:6px;color:#9aabba}
body.auth-page .register-choice-button.selected{background:linear-gradient(145deg,#edf7ff,#dceeff);border-color:rgba(10,132,255,.52);color:#0878d7;box-shadow:inset 0 0 0 1px rgba(10,132,255,.16),0 6px 14px rgba(10,132,255,.12)}
body.auth-page .register-choice-button.selected::before{content:'●';color:#0a84ff}
body.auth-page .license-type-choice .register-choice-button{flex:0 0 auto;min-width:78px;padding:0 14px}
body.auth-page .education-school-field{margin-top:4px}
body.auth-page .register-privacy{margin:10px 0 12px!important}
body.auth-page .register-password-hint{margin-top:8px!important}
@media(max-width:760px){body.auth-page .auth-card.reg-card{padding-top:15px;padding-bottom:16px}body.auth-page .reg-card .role-picker{margin-bottom:10px}body.auth-page .reg-card .role-choice{padding:8px 2px}body.auth-page .register-choice-group{margin:7px 0 10px}body.auth-page .register-choice-button{min-height:36px;font-size:13px}}

/* Keep the authentication window compact and translucent on small screens. */
body.auth-page .auth-shell{align-items:start!important;padding-top:clamp(16px,2.8vw,38px)!important;padding-bottom:24px!important;background:radial-gradient(ellipse at 15% 0%,rgba(255,255,255,.96),transparent 45%),linear-gradient(145deg,#f4f8fd,#e7f0f9 58%,#eef5fb)!important}
body.auth-page .auth-main{align-self:start!important;margin-top:0!important;background:rgba(255,255,255,.66)!important;box-shadow:0 24px 68px rgba(44,74,106,.14),inset 0 1px 0 rgba(255,255,255,.92)!important;backdrop-filter:blur(34px) saturate(150%);-webkit-backdrop-filter:blur(34px) saturate(150%)}
body.auth-page .auth-card{padding-top:20px!important;padding-bottom:14px!important}
body.auth-page .auth-card>p{margin-bottom:20px!important}
body.auth-page .auth-tabs{margin-bottom:18px!important}
body.auth-page .auth-main footer{padding-top:7px!important}
@media(max-width:760px){
  body.auth-page .auth-shell{padding:7px 9px 12px!important;min-height:100svh}
  body.auth-page .auth-main{min-height:calc(100svh - 19px)!important;border-radius:22px!important}
  body.auth-page .auth-window-chrome{height:45px!important;margin-bottom:0!important}
  body.auth-page .auth-top{padding-top:5px!important}
  body.auth-page .auth-card{padding:18px 18px 10px!important}
  body.auth-page .auth-card>p{margin-bottom:15px!important}
  body.auth-page .auth-main footer{padding:4px 18px 0!important}
  body.auth-page .reg-card{padding-top:12px!important}
  body.auth-page .reg-card>p{margin-bottom:8px!important}
  body.auth-page .reg-card .role-picker{margin-top:6px!important;margin-bottom:8px!important}
  body.auth-page .reg-card .field{margin-bottom:10px!important}
}
