/* CampusShield AI — cinematic, motion-aware login experience.
   Presentation-only layer. Existing auth, verification and form hooks remain unchanged. */
#login-screen .login-intro{background-size:130% 130%,130% 130%,100% 100%;animation:cs-login-atmosphere 26s ease-in-out infinite alternate}
#login-screen .login-intro::before{background-size:48px 48px,48px 48px;animation:cs-login-grid-drift 34s linear infinite}
#login-screen .login-intro::after{animation:cs-login-orbit-breathe 16s ease-in-out infinite}
#login-screen .login-brand-logo{filter:drop-shadow(0 0 12px rgba(38,226,190,.22))}
#login-screen .login-hero-copy{animation:cs-login-rise .7s cubic-bezier(.2,.7,.2,1) both}
#login-screen .login-hero-copy .hero-highlight{background:linear-gradient(95deg,#19d9b5 4%,#a3ffdf 48%,#2fcab9 92%);background-size:180% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:cs-login-highlight 8s ease-in-out infinite}
#login-screen .login-capability-strip{display:grid;gap:9px;margin-top:20px;position:relative;z-index:3}
#login-screen .login-capability-label{color:#80b8c5;font-size:9px;font-weight:900;letter-spacing:.16em}
#login-screen .login-capability-list{display:flex;align-items:center;flex-wrap:wrap;gap:7px}
#login-screen .login-capability-list span{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:7px 11px;border:1px solid rgba(111,226,208,.24);border-radius:999px;background:linear-gradient(125deg,rgba(14,64,79,.7),rgba(6,36,54,.66));color:#e4f9f5;font-size:10px;font-weight:750;box-shadow:inset 0 1px rgba(255,255,255,.06),0 7px 18px rgba(0,0,0,.09);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:cs-login-chip-in .55s both}
#login-screen .login-capability-list span:nth-child(2){animation-delay:.07s}
#login-screen .login-capability-list span:nth-child(3){animation-delay:.14s}
#login-screen .login-capability-list span:nth-child(4){animation-delay:.21s}
#login-screen .login-capability-list i{display:grid;place-items:center;width:17px;height:17px;border-radius:6px;background:rgba(20,211,177,.17);color:#70f0d7;font-size:11px;font-style:normal}
#login-screen .login-feature-card{position:relative;overflow:hidden;isolation:isolate;border-color:rgba(121,222,211,.22);background:linear-gradient(145deg,rgba(12,48,70,.94),rgba(5,27,48,.96));box-shadow:0 15px 34px rgba(0,0,0,.15),inset 0 1px rgba(255,255,255,.055)}
#login-screen .login-feature-card::after{content:"";position:absolute;z-index:-1;top:-65%;left:-45%;width:55%;height:230%;transform:rotate(24deg);background:linear-gradient(90deg,transparent,rgba(104,255,224,.07),transparent);transition:transform .7s ease}
#login-screen .login-feature-card:hover::after{transform:translateX(240%) rotate(24deg)}
#login-screen .login-feature-card:nth-child(1){animation:cs-login-rise .55s .06s both}
#login-screen .login-feature-card:nth-child(2){animation:cs-login-rise .55s .13s both}
#login-screen .login-feature-card:nth-child(3){animation:cs-login-rise .55s .20s both}
#login-screen .login-visual{transform-origin:55% 50%;animation:cs-login-visual-float 13s ease-in-out infinite}
#login-screen .login-trust-strip{border-color:rgba(96,220,208,.25);box-shadow:inset 0 1px rgba(255,255,255,.045),0 10px 25px rgba(0,0,0,.08)}
#login-screen .login-form-wrap{overflow:hidden;background:radial-gradient(ellipse at 93% 8%,rgba(131,239,216,.37),transparent 35%),radial-gradient(ellipse at 4% 92%,rgba(102,177,207,.12),transparent 35%),linear-gradient(140deg,#fbfefd 0%,#f1f8f7 100%)}
#login-screen .login-form-wrap::after{content:"";position:absolute;z-index:-1;right:-180px;top:26%;width:380px;aspect-ratio:1;border:1px solid rgba(18,157,133,.09);border-radius:50%;box-shadow:0 0 0 26px rgba(18,157,133,.025),0 0 0 70px rgba(18,157,133,.018),0 0 0 120px rgba(18,157,133,.012);pointer-events:none;animation:cs-login-orbit-breathe 18s ease-in-out infinite reverse}
#login-screen .auth-panel{border-color:rgba(202,225,220,.95);background:rgba(255,255,255,.91);box-shadow:0 28px 78px rgba(14,55,61,.10),0 4px 14px rgba(14,55,61,.045),inset 0 1px #fff;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:cs-login-panel-in .65s cubic-bezier(.2,.7,.2,1) both}
#login-screen .auth-panel::before{content:"";position:absolute;top:0;left:clamp(20px,2.15vw,34px);right:clamp(20px,2.15vw,34px);height:2px;border-radius:0 0 6px 6px;background:linear-gradient(90deg,transparent,#18b998 22%,#8ae8d0 68%,transparent);opacity:.9}
#login-screen .auth-kicker{display:flex;align-items:center;gap:8px;color:#087e70;letter-spacing:.17em}
#login-screen .auth-kicker::before{content:"";width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#16b995;box-shadow:0 0 0 4px rgba(22,185,149,.12),0 0 12px rgba(22,185,149,.36)}
#login-screen .auth-panel h2{letter-spacing:-.06em}
#login-screen .auth-role-picker{gap:9px}
#login-screen .auth-role-option{position:relative;overflow:hidden;min-height:72px;border-color:#dce9e5;border-radius:14px;background:linear-gradient(155deg,#fff,#f7fbf9);box-shadow:0 3px 10px rgba(14,55,61,.035);transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}
#login-screen .auth-role-option:hover{transform:translateY(-2px);border-color:#9ed8c8;box-shadow:0 8px 18px rgba(14,94,77,.08)}
#login-screen .auth-role-option[aria-pressed="true"]{border-color:#0da98e;background:linear-gradient(150deg,#f0fcf8,#e6f8f1);color:#076d60;box-shadow:inset 0 0 0 1px rgba(13,169,142,.15),0 8px 18px rgba(13,169,142,.09)}
#login-screen .auth-role-option[aria-pressed="true"] svg{color:#078d78}
#login-screen .auth-tabs{gap:5px;padding:4px;border:1px solid #e0ece8;border-radius:13px;background:#f2f8f5}
#login-screen .auth-tabs button{min-height:39px;border-radius:9px;transition:background .18s ease,color .18s ease,box-shadow .18s ease}
#login-screen .auth-tabs button[aria-pressed="true"]{border:1px solid #e1eee8;border-radius:9px;background:#fff;color:#0d5148;box-shadow:0 3px 9px rgba(18,65,56,.08)}
#login-screen .auth-tabs button[aria-pressed="true"]::after{display:none}
#login-screen .auth-panel .field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),#login-screen .auth-panel .field select,#login-screen .auth-panel .field textarea{border-color:#d8e6e0;border-radius:12px;background:rgba(255,255,255,.96);box-shadow:0 2px 7px rgba(18,65,56,.035)}
#login-screen .auth-panel .field input:hover,#login-screen .auth-panel .field select:hover{border-color:#a9cfc2}
#login-screen .auth-panel .field input:focus,#login-screen .auth-panel .field select:focus,#login-screen .auth-panel .field textarea:focus{border-color:#0da98e;box-shadow:0 0 0 4px rgba(13,169,142,.13),0 3px 10px rgba(18,65,56,.045)}
#login-screen #auth-submit{position:relative;overflow:hidden;min-height:50px;border-radius:13px;background:linear-gradient(105deg,#087e70 0%,#0ba984 48%,#075c57 100%);background-size:180% 100%;box-shadow:0 9px 20px rgba(7,126,112,.24),inset 0 1px rgba(255,255,255,.18);transition:transform .18s ease,box-shadow .18s ease,background-position .6s ease}
#login-screen #auth-submit:hover{transform:translateY(-2px);background-position:100% 0;box-shadow:0 13px 26px rgba(7,126,112,.29),inset 0 1px rgba(255,255,255,.2)}
#login-screen #auth-submit:active{transform:translateY(0)}
#login-screen .auth-panel #google-signin-button{min-height:47px;border-color:#d9e5e2;border-radius:12px;box-shadow:0 3px 9px rgba(16,57,54,.035);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
#login-screen .auth-panel #google-signin-button:hover{transform:translateY(-1px);border-color:#a9cfc2;box-shadow:0 7px 16px rgba(16,57,54,.08)}
#login-screen .login-official-link{border-color:#d5e6e1;background:rgba(255,255,255,.72);color:#14574c;box-shadow:0 4px 13px rgba(14,55,61,.045)}
#login-screen .login-official-link:hover{border-color:#61bea7;background:#fff;transform:translateY(-1px)}
#login-screen .login-public-nav a::after{transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
#login-screen .login-public-nav a:hover::after,#login-screen .login-public-nav a:focus-visible::after{transform:scaleX(1)}
#login-screen .login-footer-links a{transition:color .18s ease,opacity .18s ease}
#login-screen .auth-panel button:disabled{cursor:not-allowed;transform:none;opacity:.62}
@keyframes cs-login-atmosphere{0%{background-position:0% 0%,100% 100%,50% 50%}100%{background-position:100% 40%,0% 60%,50% 50%}}
@keyframes cs-login-grid-drift{0%{background-position:0 0,0 0}100%{background-position:48px 48px,-48px -48px}}
@keyframes cs-login-orbit-breathe{0%,100%{transform:scale(.96);opacity:.65}50%{transform:scale(1.04);opacity:1}}
@keyframes cs-login-highlight{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes cs-login-visual-float{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-9px,0)}}
@keyframes cs-login-rise{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes cs-login-chip-in{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes cs-login-panel-in{from{opacity:0;transform:translate3d(0,12px,0) scale(.992)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@media(max-width:960px){#login-screen .login-intro{animation:none;background-size:100% 100%}#login-screen .login-capability-strip{margin-top:14px}}
@media(max-width:650px){#login-screen .login-capability-list{gap:6px}#login-screen .login-capability-list span{min-height:29px;padding:6px 9px;font-size:9px}#login-screen .login-capability-label{font-size:8px}#login-screen .login-feature-card{box-shadow:0 8px 20px rgba(0,0,0,.11),inset 0 1px rgba(255,255,255,.05)}#login-screen .auth-panel{box-shadow:0 18px 46px rgba(14,55,61,.09),inset 0 1px #fff}}
@media(prefers-reduced-motion:reduce){
  #login-screen .login-intro,#login-screen .login-intro::before,#login-screen .login-intro::after,#login-screen .login-hero-copy,#login-screen .login-hero-copy .hero-highlight,#login-screen .login-feature-card,#login-screen .login-visual,#login-screen .login-form-wrap::after,#login-screen .auth-panel,#login-screen .login-capability-list span{animation:none!important;transform:none!important}
  #login-screen *,#login-screen *::before,#login-screen *::after{scroll-behavior:auto!important;transition-duration:.01ms!important}
}
