/* Purple palette, sculpted corners and visible keyboard focus. */
button,.landing-cta,.landing-login,.landing-outline{border-radius:12px 22px 12px 22px;transition:background .2s,box-shadow .2s,transform .2s}
button:focus-visible,a:focus-visible{outline:2px solid #e8bcff;outline-offset:4px}
.primary,.landing-cta{background:linear-gradient(125deg,#e3bcfa,#c393e9 75%);box-shadow:inset 0 1px 0 #ffffff7a,0 5px 18px #a65bc921;color:#24172e}
.primary:hover,.landing-cta:hover{background:linear-gradient(125deg,#efd4ff,#cea1f0);box-shadow:0 8px 28px #a65bc934;transform:translateY(-1px)}
.landing-login,.landing-outline{border-radius:12px 22px 12px 22px!important}
.login{max-width:1240px;width:calc(100% - 72px);margin:55px auto;min-height:740px;display:grid;grid-template-columns:1.05fr 1fr;border:1px solid #b48ddc25;border-radius:26px;overflow:visible;background:#17131e;box-shadow:0 28px 100px #0005;position:relative}
.login .login-back{position:absolute;top:-32px;left:4px;color:#b6a5c8;font-size:12px;z-index:4}
.login-art{position:relative;overflow:hidden;isolation:isolate;min-height:740px;padding:40px;background:radial-gradient(ellipse at 55% 65%,#492a664d,transparent 65%),#1d1529;border-radius:25px 0 0 25px;display:flex;flex-direction:column;justify-content:flex-start}
.login-art .brand{position:relative;z-index:3;font-size:24px;gap:5px}.login-art .brand-logo{width:44px;height:44px;margin-right:8px}
.login-art .matrix-rain{position:absolute;inset:0;z-index:-1;opacity:.13;pointer-events:none}
.auth-art-copy{position:relative;z-index:2;margin-top:52px;pointer-events:none}.auth-art-copy h1{font-size:48px;font-weight:500;line-height:1.08;margin:17px 0;color:#f3e9fc;letter-spacing:-2px}.auth-art-copy p{color:#b7a3c9;line-height:1.6;font-size:14px}
.login-art .auth-face{position:absolute;inset:220px -35px 35px;height:auto;min-height:430px;z-index:1;pointer-events:none;opacity:.85}.auth-face canvas{width:100%;height:100%;position:absolute;inset:0}.auth-face .scan-brackets{inset:20% 26% 18%}.auth-face .scan-beam{left:23%;width:54%}
.auth-art-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:12px;position:relative;z-index:3;font:9px monospace;color:#ac88c9;letter-spacing:1px}.auth-art-footer button{border:0;background:#20162dbb;font-size:10px;color:#c4a2df;padding:8px;letter-spacing:0}
.auth-panel{padding:44px 52px;align-self:center;min-width:0}.auth-tabs{display:flex;gap:6px;background:#ffffff04;border:1px solid #c498e621;border-radius:13px;padding:5px;margin-bottom:38px}.auth-tabs a{flex:1;text-align:center;padding:11px 10px;color:#ab9ab8;font-size:13px;border-radius:9px;text-decoration:none}.auth-tabs a.active{background:#b389ce1e;color:#ecd4fc;box-shadow:inset 0 0 0 1px #c99bef25}
.login .auth-panel form{padding:0;width:100%;max-width:none;background:none;border:0}.auth-panel h2{font-size:31px;letter-spacing:-1px;margin:12px 0}.auth-panel form>p{font-size:13px;color:#b1a1be;line-height:1.65;margin:0 0 26px}.auth-panel label{font-size:12px;line-height:1.5;color:#d4c3e0;margin:17px 0 0}.auth-panel input{margin-top:7px;background:#100d1680;border:1px solid #9174a32f;padding:14px;border-radius:10px;color:#f0e2fa;min-width:0;width:100%}.auth-panel input:focus{border-color:#bd91db;outline:2px solid #bd91db1a}.auth-panel input::placeholder{color:#776584}
.auth-panel a{color:#d0a5ec}.auth-forgot{display:block;text-align:right;font-size:12px;margin:14px 0 25px}.auth-submit{display:flex;justify-content:space-between;align-items:center;width:100%;padding:14px 17px;margin-top:22px;font-size:13px;font-weight:600}.auth-submit span{display:grid;place-items:center;border:1px solid #54306633;width:27px;height:27px;border-radius:8px;font-size:18px}.auth-panel .auth-bottom{margin-top:23px;text-align:center;font-size:12px}.auth-bottom a{margin-left:5px}.auth-security{margin-top:35px;padding-top:23px;border-top:1px solid #ffffff0b;font-size:10px;color:#9683a4;text-align:center}.auth-security span{margin:0 8px}
.captcha-box{margin-top:20px;padding:12px;border:1px solid #b48ddc21;border-radius:12px;background:#100d1633}.captcha-box>div{display:flex;justify-content:space-between;align-items:center;gap:6px}.captcha-box img{max-width:70%;object-fit:contain}.captcha-box button{padding:8px;font-size:11px;background:transparent;color:#c6a0e0}.captcha-box label{margin-top:7px}.captcha-box input{padding:10px 12px}
.terms{margin-top:20px;color:#b9a3ca;font-size:11px;line-height:1.65}.terms summary{cursor:pointer;color:#dec0f1}.terms>div{max-height:230px;overflow:auto;padding:12px;background:#100d16;border-radius:8px;margin-top:10px}.terms h3{font-size:12px}.auth-panel .terms-check{display:flex;align-items:flex-start;gap:10px;font-size:11px;color:#b9a9c4;line-height:1.7}.terms-check input{width:16px;height:16px;flex:0 0 16px;accent-color:#c89be8;margin-top:3px}.auth-panel .auth-message,#loginError{margin-top:17px;color:#e8b5d5;font-size:12px;line-height:1.6}.auth-info{padding:12px;background:#b589d00f;border:1px solid #b589d02b;border-radius:10px}

@media(max-width:950px){.login{width:calc(100% - 32px);grid-template-columns:.85fr 1fr;margin-top:50px}.auth-panel{padding:32px 25px}.login-art{padding:25px}.auth-art-copy h1{font-size:38px}.auth-art-footer{flex-direction:column;align-items:flex-start}.login-art .auth-face{inset:250px -65px 50px}}
@media(max-width:680px){.login{display:block;margin:46px 16px 20px;min-height:0}.login-art{min-height:230px;height:230px;border-radius:25px 25px 0 0;padding:23px}.login-art .brand{font-size:20px}.login-art .brand-logo{width:34px;height:34px}.auth-art-copy{margin-top:16px}.auth-art-copy h1{font-size:28px;margin:10px 0}.auth-art-copy p,.auth-art-copy .eyebrow,.auth-art-footer{display:none}.login-art .auth-face{inset:-22px -60px -55px 95px;min-height:0;opacity:.7}.auth-panel{padding:25px}.auth-tabs{margin-bottom:26px}.auth-panel h2{font-size:27px}.auth-security{line-height:1.7}.captcha-box img{max-width:65%}}
@media(prefers-reduced-motion:reduce){button,.landing-cta{transition:none}}

.login .login-back{right:auto;bottom:auto;background:none;border:0;padding:0;border-radius:0;box-shadow:none}
#emotionCamera,#emotionOverlay{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:scaleX(-1)}
.expression-result h2{font-size:25px;line-height:1.3;min-height:65px;margin-top:18px}.expression-score{display:flex;align-items:center;gap:16px;padding:0 0 24px;margin-bottom:18px;border-bottom:1px solid #bd8edd22}.expression-score strong{font-size:42px;font-weight:500;color:#dbb5f5}.expression-score span{font-size:12px;color:#c6acd9}.expression-score small{font-size:10px;color:#9987a9}.expression-row{display:grid;grid-template-columns:65px 1fr 40px;align-items:center;gap:12px;margin:15px 0;font-size:12px;color:#b9a4ca}.expression-row b{text-align:right;font-size:11px;font-weight:500}.expression-row meter{width:100%;height:10px;border:0;border-radius:8px;background:#2b2037}.expression-row meter::-webkit-meter-bar{border:0;border-radius:8px;background:#2b2037}.expression-row meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#835aa5,#d0a4ef);border-radius:8px}.expression-row meter::-moz-meter-bar{background:#bd91dd}

/* Gilroy-inspired geometric typography; self-hosted, OFL-licensed Manrope. */
@font-face{font-family:Manrope;src:url('/fonts/manrope.ttf') format('truetype');font-style:normal;font-weight:200 800;font-display:swap}
body{font-family:Manrope,'Segoe UI',Arial,sans-serif;font-optical-sizing:auto}
button,input,select,textarea{font-family:inherit}
h1,h2,h3{font-weight:600}
.landing-copy h1{font-weight:500;letter-spacing:-.055em}
.auth-art-copy h1{font-weight:500;letter-spacing:-.045em}
.auth-panel h2{font-weight:600;letter-spacing:-.035em}

/* A fixed outer shell: longer forms scroll inside the right panel. */
.login{height:740px;min-height:0}
.login-art{height:100%;min-height:0}
.auth-panel{height:100%;min-height:0;align-self:stretch;display:flex;flex-direction:column;overflow:hidden;padding:32px 42px}
.auth-tabs{flex:none;margin-bottom:25px}
.login .auth-panel form{flex:1;min-height:0;margin:0;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;padding-right:10px;scrollbar-width:thin;scrollbar-color:#75518f transparent;overscroll-behavior:contain}
.auth-security{flex:none;margin-top:20px;padding-top:18px}
#registerForm>p{margin-bottom:14px}#registerForm label{margin-top:10px}#registerForm input{padding:10px 12px}
#registerForm .captcha-box{margin-top:13px;padding:9px 11px}#registerForm .captcha-box label{margin-top:5px}
#registerForm .terms{margin-top:12px}#registerForm .terms-check{margin-top:12px}#registerForm .terms-check input{padding:0}
#registerForm .auth-submit{margin-top:16px}#registerForm .auth-message:empty{margin:0}
@media(max-width:950px){.auth-panel{padding:30px 25px}}
@media(max-width:680px){.login{display:grid;grid-template-columns:1fr;grid-template-rows:230px minmax(0,1fr);height:870px;min-height:0}.login-art{height:230px;min-height:0}.auth-panel{padding:24px}.auth-tabs{margin-bottom:20px}.auth-security{margin-top:14px;padding-top:14px}.landing a.tech-button{gap:16px;padding-left:16px;font-size:11px}.landing a.landing-login.tech-button{gap:12px;padding-left:13px}.landing-actions{gap:16px}.landing a.landing-cta.tech-button{gap:13px}.landing a.landing-cta.tech-button>span{width:31px;height:31px;flex-basis:31px}}
@media(prefers-reduced-motion:reduce){.landing a.tech-button,#loginForm button.tech-button,.landing a.tech-button::after,#loginForm button.tech-button::after,.landing a.tech-button>span,#loginForm button.tech-button>span{transition:none}.landing a.tech-button:hover,#loginForm button.tech-button:hover{transform:none}}

.auth-tabs{order:0}.login .auth-panel form{order:1}.auth-security{order:2}

#registerForm .auth-submit{margin-top:22px;padding:14px 17px;border-radius:12px 22px 12px 22px;background:linear-gradient(125deg,#e3bcfa,#c393e9 75%);color:#24172e;box-shadow:inset 0 1px 0 #ffffff7a,0 5px 18px #a65bc921}
#registerForm .auth-submit>span{width:27px;height:27px;border:1px solid #54306633;border-radius:8px;background:transparent;color:inherit;font-size:18px;box-shadow:none}
.auth-tabs a[data-auth-view=register]{border-radius:9px;font-weight:400}
/* Restore straightforward rectangular entry buttons. */
.landing a.landing-login,.landing a.landing-cta,#loginForm .auth-submit{border-radius:6px!important}

.account-actions{display:flex;align-items:center;gap:16px;margin-left:auto;flex-shrink:0}.account-actions .account{gap:9px}.account-details{min-width:0}.account-details small{display:block;font-size:10px;margin-top:3px}.account-details select{width:170px;max-width:100%;margin:0;padding:7px 28px 7px 10px;background:#21172e;color:#edddfa;border:1px solid #73548b70;border-radius:6px;font-size:12px}.account-details #adminError:empty{display:none}.account-details #adminError{color:#ffb8c4;max-width:180px}.account-actions .logout{margin:0;position:static;order:0}#adminWorkspace[hidden]{display:none}
@media(max-width:1450px){#workspace>aside{flex-wrap:wrap}#workspace>aside>nav{order:2;flex:0 0 100%;justify-content:center;overflow:auto}#workspace>aside .account-actions{order:1;margin-left:auto}}
@media(max-width:650px){#workspace>aside>nav{justify-content:flex-start}.account-actions{gap:9px}.account-actions .avatar{display:none}.account-details select{width:128px;font-size:11px}.account-actions .logout{font-size:10px;padding:8px}.account-details small{font-size:9px}}
@media(max-width:440px){#workspace>aside .brand{width:100%}#workspace>aside .account-actions{width:100%;justify-content:space-between}.account-actions .avatar{display:flex}.account-details select{width:180px}}

/* Persistent left navigation; compact screens use the same panel as a drawer. */
#workspace>aside{position:fixed;inset:0 auto 0 0;width:244px;max-width:none;height:100dvh;min-height:0;margin:0;padding:28px 18px 20px;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:0;background:linear-gradient(165deg,#1f162b,#120e1a 65%);border:0;border-right:1px solid #ae8ed42b;overflow-y:auto;z-index:30}
#workspace>aside .brand{font-size:19px;margin:0 0 28px;width:auto;flex-shrink:0}#workspace>aside .brand-logo{width:35px;height:35px}
#workspace>aside .navlabel{display:block;margin:0 12px 13px;color:#9f8eae;font-size:9px;letter-spacing:1.8px}
#workspace>aside>nav{order:0;display:flex;flex-direction:column;flex:0 0 auto;width:100%;margin:0;gap:5px;overflow:visible;justify-content:flex-start}
#workspace>aside>nav button{width:100%;margin:0;padding:13px 12px;gap:10px;border-radius:9px;font-size:12px;white-space:nowrap;min-height:44px;text-align:left}
#workspace>aside .account-actions{order:0;display:flex;flex-direction:column;align-items:stretch;gap:15px;width:100%;margin: auto 0 0;padding-top:26px;flex-shrink:0}
#workspace>aside .account{padding-top:20px;border-top:1px solid #ae8ed427;gap:9px}#workspace>aside .avatar{display:grid;flex:0 0 32px;width:32px;height:32px}
#workspace>aside .account-details{flex:1;min-width:0}#workspace>aside .account-details select{width:100%;font-size:11px;padding-left:8px}#workspace>aside .account-details small{font-size:9px}
#workspace>aside .logout{margin:0;width:100%;border-radius:8px;font-size:12px;padding:11px}
#workspace>main{margin:0 0 0 244px;width:calc(100% - 244px);max-width:none;min-width:0;padding:35px clamp(20px,3vw,48px) 24px}
.sidebar-toggle,.sidebar-shade{display:none}
@media(min-width:761px) and (max-width:1100px){#workspace .two-col{grid-template-columns:1fr}#workspace .stats{grid-template-columns:repeat(2,minmax(0,1fr))}#workspace .overview-grid{grid-template-columns:1fr}#workspace .overview-hero h2{font-size:34px}}
@media(max-width:760px){#workspace>aside{transform:translateX(-100%);transition:transform .2s;width:244px;box-shadow:20px 0 60px #0005}#workspace.sidebar-open>aside{transform:translateX(0)}#workspace>main{margin:0;width:100%;padding:20px 16px}.sidebar-toggle{display:block;align-self:flex-start;order:-1;margin:0 0 22px;border-radius:8px;background:#241930;color:#e5c8fa}.sidebar-shade:not([hidden]){display:block;position:fixed;inset:0;width:100%;height:100dvh;background:#08050dbb;border:0;border-radius:0;z-index:29}#workspace>aside .account-actions{margin-top:auto}}
@media(prefers-reduced-motion:reduce){#workspace>aside{transition:none}}

#workspaceSidebar .menu-icon{display:block;width:21px;height:21px;flex:0 0 21px;color:#ad91c5;transition:color .18s}
#workspaceSidebar nav button{align-items:center}#workspaceSidebar nav button.active .menu-icon{color:#ead2ff}#workspaceSidebar nav button:hover .menu-icon{color:#d9b3f7}
#workspaceSidebar .logout{display:flex;align-items:center;justify-content:center;gap:10px}#workspaceSidebar .logout .menu-icon{width:18px;height:18px;flex-basis:18px}