:root{font-family:Segoe UI,Arial,sans-serif;color:#081b3a;background:#061d32;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 75% 5%,#124367,transparent 65%),#061d32}button,input{font:inherit}button,a,input{outline-offset:4px}button{cursor:pointer}a{color:#008d9e}.login-shell{width:min(1340px,94vw);min-height:90vh;margin:5vh auto;display:grid;grid-template-columns:44% 56%;border:1px solid #155b7c;border-radius:30px;overflow:hidden;background:#092944;box-shadow:0 22px 80px #00101e66}.brand-panel{position:relative;min-height:800px;background:linear-gradient(180deg,#09294222,#06243c55),url('/images/laboratory-panel.png') center/cover no-repeat,#0b3453;display:flex;flex-direction:column;justify-content:space-between}.brand-content{text-align:center;padding:70px 28px 20px}.dolphin-mark{width:245px;height:185px;object-fit:contain}.wordmark{font-size:clamp(36px,4vw,64px);letter-spacing:.16em;font-weight:400;color:#fff;margin-top:4px}.backoffice-label{font-size:27px;letter-spacing:.34em;color:#0dcce1;margin-top:0}.brand-divider{height:1px;background:#72b1c980;margin:18px auto;width:85%}.management-label{font-size:16px;letter-spacing:.27em;color:#b9d9ed;margin:16px 0}.brand-caption{font-size:18px;color:#b9ddf0;margin:0}.brand-footer{padding:24px 26px;color:#e0eff9;font-size:13px;line-height:1.8}.gncm-wordmark{font-size:46px;line-height:1.2;font-weight:800;font-style:italic;letter-spacing:-4px;color:#ff9418;text-shadow:-9px 3px #0089e8;margin-bottom:8px}.form-panel{display:flex;align-items:center;padding:46px 32px 46px 0}.login-card{background:#fafcff;border-radius:26px;width:100%;padding:60px 42px;min-height:710px;box-shadow:0 18px 50px #00172c40}.eyebrow{color:#008b9e;font-size:15px;font-weight:650;letter-spacing:.12em;margin:0 0 26px}h1{font-size:clamp(34px,3.2vw,52px);font-weight:650;letter-spacing:-.04em;line-height:1.15;margin:0 0 10px}.subtitle{color:#5b7094;font-size:22px;line-height:1.45;margin:0 0 34px}form label{display:block;font-size:17px;font-weight:600;margin:25px 0 10px}.input-wrap{display:flex;align-items:center;border:1px solid #c9d7e9;background:#f5f8fd;border-radius:10px;min-height:62px;overflow:hidden}.input-wrap:focus-within{outline:2px solid #008eaa;outline-offset:2px}.field-icon{width:60px;text-align:center;color:#597497;font-size:28px;flex-shrink:0;border-right:1px solid #e0e8f2}.input-wrap input{width:100%;min-width:0;background:transparent;border:0;padding:15px 16px;font-size:18px;color:#10284a;outline:none}.input-wrap input::placeholder{color:#8497af}.password-toggle{background:none;border:0;padding:14px;color:#5c7495;font-size:23px}.sign-in{display:flex;gap:16px;align-items:center;justify-content:center;width:100%;margin-top:32px;min-height:66px;background:#008b9e;color:#fff;border:0;border-radius:10px;font-size:23px;font-weight:550}.sign-in:hover{background:#007486}.sign-in span{font-size:31px}.restricted{color:#627698;display:flex;justify-content:center;align-items:center;gap:12px;font-size:16px;margin:35px 0 0}.form-error{border-left:3px solid #c64848;background:#fff0f0;color:#953535;padding:12px;font-size:14px}.workspace{min-height:100vh;background:#f2f6fb}.workspace-header{background:#092942;color:white;display:flex;align-items:center;justify-content:space-between;padding:22px 5vw}.workspace-brand{font-size:24px;letter-spacing:.16em;color:#fff;text-decoration:none}.workspace-brand small{display:block;font-size:11px;color:#00d0e4;letter-spacing:.3em;margin-top:4px}.logout{border:1px solid #4d8ba5;background:transparent;border-radius:7px;padding:10px 20px;color:#fff}.workspace-body{max-width:1100px;margin:auto;padding:70px 30px}.welcome-card{padding:32px!important;max-width:720px}.welcome-card .rzi{color:#008b9e;font-size:38px}.welcome-card p{line-height:1.7;color:#58708b}.error-page{padding:10vh;color:white}.error-page a{color:#47d5e1}@media(min-width:1600px){.login-shell{min-height:850px}}@media(max-width:950px){.login-shell{grid-template-columns:42% 58%}.brand-content{padding:80px 14px 20px}.dolphin-mark{width:180px;height:150px}.wordmark{font-size:32px}.backoffice-label{font-size:18px}.management-label{font-size:11px}.brand-caption{font-size:15px}.login-card{padding:45px 25px}.form-panel{padding:30px 24px 30px 0}.subtitle{font-size:18px}}@media(max-width:680px){.login-shell{display:block;margin:16px auto;border-radius:22px}.brand-panel{min-height:340px;background-position:center 65%}.brand-content{padding:20px 18px}.dolphin-mark{width:145px;height:105px}.wordmark{font-size:32px}.backoffice-label{font-size:16px}.brand-divider,.management-label,.brand-caption,.brand-footer{display:none}.form-panel{padding:0 14px 18px}.login-card{min-height:0;padding:32px 23px;border-radius:18px}.eyebrow{font-size:12px;margin-bottom:18px}h1{font-size:34px}.restricted{font-size:12px}.input-wrap input{font-size:16px}.workspace-header{gap:20px}.workspace-brand{font-size:18px}}

/* Compact login controls. Brand panel and logo sizes are preserved. */
.login-card #login-form,
.login-card > .eyebrow,
.login-card > h1,
.login-card > .subtitle,
.login-card > .form-error {
    width: 100%;
    max-width: 340px;
    margin-left: auto;
    margin-right: auto;
}
.login-card #login-form label {
    font-size: 14px;
    font-weight: 500;
    margin: 20px 0 8px;
}
.login-card .input-wrap {
    min-height: 40px;
    border-radius: 8px;
}
.login-card .input-wrap input {
    padding: 8px 10px;
    font-size: 14px;
    line-height: 22px;
}
.login-card .field-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
}
.login-card .field-icon svg,
.login-card .password-toggle svg {
    width: 18px;
    height: 18px;
}
.login-card .password-toggle {
    display: flex;
    align-items: center;
    padding: 9px;
}
.login-card .sign-in {
    min-height: 42px;
    margin-top: 24px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    gap: 10px;
}
.login-card .sign-in span { font-size: 24px; }
.login-card .restricted { font-size: 14px; margin-top: 28px; }
/* Refined scale for the narrower login column. */
.login-card > h1 { font-size: 36px; }
.login-card > .subtitle { font-size: 16px; margin-bottom: 26px; }
.login-card > .eyebrow { font-size: 12px; margin-bottom: 20px; }
.login-card #login-form label { font-size: 13px; margin-top: 18px; }
.login-card .restricted { font-size: 12px; gap: 8px; }
/* Compact card around the 340px login form. */
.form-panel {
    justify-content: center;
    padding: 46px 32px;
}
.login-card {
    max-width: 428px;
    min-height: 0;
    padding: 38px 42px;
    border-radius: 22px;
}
@media (max-width: 950px) {
    .form-panel { padding: 30px 20px; }
    .login-card { padding: 32px 24px; }
}
@media (max-width: 680px) {
    .form-panel { padding: 0 14px 18px; }
    .login-card { padding: 30px 23px; border-radius: 18px; }
}
/* Give the laboratory panel the space released by the compact login card. */
@media (min-width: 1100px) {
    .login-shell { grid-template-columns: minmax(0, 1fr) 540px; }
}
@media (min-width: 681px) and (max-width: 1099px) {
    .login-shell { grid-template-columns: minmax(0, 1fr) 460px; }
}
/* Unified navy canvas; desktop laboratory panel is about 800px wide. */
body { background: #061d32; }
.login-shell { background: #061d32; }
.form-panel { background: transparent; }
.brand-divider { width: min(100%, 714px); }
.field-error { display:block; color:#a23333; font-size:12px; margin-top:6px; }
.field-error[hidden] { display:none; }
.input-wrap:has(input[aria-invalid="true"]) { border-color:#b43d3d; }