.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Shared scene geometry with separately rendered night artwork. */
.login-screen{
 --auth-scene:url('/static/brand/opora-v2-scene-wide.webp');--auth-art:url('/static/brand/opora-v2-foreground-wide.webp');--auth-scene-filter:brightness(1) saturate(1) contrast(1);--auth-art-filter:none;--auth-art-blend:multiply;
 --auth-ink:#123e42;--auth-muted:#31595d;--auth-gold:#97722e;--auth-line:#ffffff91;--auth-glass:#edf8f15c;--auth-input:#ffffff42;--auth-active:#ffefc954;--auth-sheen:#ffffff50;--auth-rim:#ffffffa3;
 position:relative;isolation:isolate;display:grid;place-items:center;min-height:100vh;min-height:100svh;padding:0;background:#174f57;color:var(--auth-ink);overflow:clip;
}
html[data-theme=dark] .login-screen{
 --auth-art:url('/static/brand/opora-v3-night-wide.png');--auth-scene-filter:brightness(.42) saturate(.72) contrast(1.12);--auth-art-filter:none;--auth-art-blend:normal;
 --auth-ink:#f8f1dd;--auth-muted:#d1e1dc;--auth-gold:#edcf8d;--auth-line:#e6f9eb52;--auth-glass:#09222b70;--auth-input:#d3f2e817;--auth-active:#ecd4a037;--auth-sheen:#e1fff21c;--auth-rim:#e7fff05c;background:#081d27;
}
.login-screen::before{content:'';position:absolute;z-index:-1;inset:-30px;background-image:var(--auth-scene);background-position:center;background-size:cover;filter:blur(28px) var(--auth-scene-filter);opacity:.85;pointer-events:none}
.login-artboard{position:relative;isolation:isolate;width:min(100%,177.7778svh);aspect-ratio:16/9;container-type:inline-size}
.login-scenery,.login-artwork{position:absolute;inset:0;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none;transition:filter .35s ease}
.login-scenery{background-image:var(--auth-scene);filter:var(--auth-scene-filter)}
.login-artwork{background-image:var(--auth-art);filter:var(--auth-art-filter);mix-blend-mode:var(--auth-art-blend);transition:none}
html[data-theme=dark] .login-artwork{background-size:80% 80%;background-position:50% 17.5%}
html[data-theme=dark] .auth-star-glow{display:none}
.auth-star-glow{position:absolute;left:49.5%;top:13.1%;width:9cqw;height:5cqw;transform:translate(-50%,-50%);background:radial-gradient(ellipse closest-side,#ffe4a981,transparent 70%);mix-blend-mode:screen;pointer-events:none}
.auth-star-glow::after{content:'';position:absolute;left:50%;top:50%;width:1.7cqw;height:1.7cqw;transform:translate(-50%,-50%);background:radial-gradient(circle,#fffdf1 6%,#fff0bcd9 20%,#ffe6a55c 40%,transparent 70%)}
.auth-slogans{position:absolute;top:13%;right:8%;width:26%;display:grid;grid-template-columns:1.12fr 1fr;gap:1.1cqw;color:var(--auth-ink);font-size:.8cqw;line-height:1.85;letter-spacing:.14em;text-transform:uppercase}
.auth-slogans p{margin:0;padding-left:1.7cqw;border-left:1px solid currentColor;font-weight:400;white-space:nowrap}
.auth-slogans p:last-child{font-weight:500}
.auth-values{position:absolute;left:14.9%;top:47.8%;margin:0;color:var(--auth-ink);font-size:.8cqw;line-height:1.75;letter-spacing:.05em;text-transform:uppercase}
.auth-values::after{content:'';display:block;width:2.9cqw;height:1px;margin-top:.8cqw;background:currentColor;opacity:.65}
.auth-footer{position:absolute;bottom:6.3%;right:7.5%;display:flex;align-items:center;gap:1.2cqw;margin:0;color:#f1f4e4;font-size:.7cqw;line-height:1.5;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.auth-footer::before{content:'';width:2.7cqw;height:1px;background:currentColor;opacity:.8}

.appearance-switch{position:absolute;top:22.5%;left:79%;right:auto;transform:translateX(-50%);display:flex;gap:2px;padding:4px;margin:0;min-width:0;border:1px solid var(--auth-line);border-radius:10px;background:linear-gradient(120deg,var(--auth-sheen),transparent 58%),var(--auth-glass);box-shadow:inset 0 1px 0 var(--auth-rim),inset 0 -1px 0 #123e4224,0 8px 28px #062b3221;backdrop-filter:blur(14px) saturate(170%);-webkit-backdrop-filter:blur(14px) saturate(170%)}
.appearance-option{position:relative;display:block;cursor:pointer}
.appearance-option input{position:absolute;width:1px;height:1px;min-height:0;padding:0;margin:0;opacity:0}
.appearance-option span{display:flex;align-items:center;justify-content:center;gap:6px;min-height:32px;padding:6px clamp(6px,.65cqw,12px);border-radius:6px;font-size:clamp(10px,.85cqw,13px);line-height:20px;font-weight:500;color:var(--auth-muted)}
.appearance-option svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.appearance-option:hover span{background:var(--auth-active);color:var(--auth-ink)}
.appearance-option input:checked+span{background:var(--auth-active);color:var(--auth-ink);box-shadow:inset 0 0 0 1px var(--auth-line)}
.appearance-option input:focus-visible+span{outline:2px solid var(--auth-gold);outline-offset:2px}

.login-panel{position:absolute;left:50%;bottom:17%;transform:translateX(-50%);width:70%;max-width:740px;display:flex;flex-direction:column;padding:16px 18px 10px;border:1px solid var(--auth-line);border-radius:16px;background:linear-gradient(115deg,var(--auth-sheen),transparent 52%,#ffffff0d),var(--auth-glass);box-shadow:inset 0 1px 0 var(--auth-rim),inset 1px 0 0 #ffffff32,inset 0 -1px 0 #0a263826,0 18px 50px #051f3438;backdrop-filter:blur(14px) saturate(165%);-webkit-backdrop-filter:blur(14px) saturate(165%)}
.login-panel form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 48px;gap:10px;align-items:start}
.login-panel .login-field{position:relative;min-width:0;display:block}
.login-field>svg{position:absolute;z-index:1;left:14px;top:15px;width:18px;height:18px;fill:none;stroke:var(--auth-muted);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.login-panel input{width:100%;min-height:48px;padding:12px 14px 12px 42px;font-size:14px;line-height:22px;color:var(--auth-ink);background:linear-gradient(115deg,#ffffff19,transparent),var(--auth-input);border:1px solid var(--auth-line);border-radius:9px;caret-color:var(--auth-ink);box-shadow:inset 0 1px 0 #ffffff38,0 2px 8px #0c33400a;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.login-panel input::placeholder{color:var(--auth-muted);opacity:1}
.login-panel input:focus{border-color:var(--auth-gold);box-shadow:0 0 0 3px var(--auth-active)}
.login-panel input:-webkit-autofill{-webkit-text-fill-color:var(--auth-ink);box-shadow:0 0 0 1000px #f2f6ee inset}
html[data-theme=dark] .login-panel input:-webkit-autofill{box-shadow:0 0 0 1000px #102d32 inset}
.login-panel .login-submit{display:grid;place-items:center;width:48px;height:48px;min-height:48px;margin:0;padding:7px;border:0;border-radius:0;color:var(--auth-ink);background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;cursor:pointer}
.login-submit svg{display:block;width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:butt;stroke-linejoin:miter;transition:transform .18s ease}
.login-submit:hover:not(:disabled) svg{transform:translateX(3px)}
.login-submit:active:not(:disabled) svg{transform:translateX(5px)}
.login-submit:focus-visible{outline:2px solid var(--auth-gold);outline-offset:2px}
.login-submit:disabled{cursor:wait;opacity:.45}
.login-panel .error{grid-row:2;grid-column:1/-1;margin:0;font-size:12px;line-height:1.5;color:#9c3028}
html[data-theme=dark] .login-panel .error{color:#ffb5aa}
.login-panel .qr-login-toggle{display:flex;align-items:center;justify-content:center;gap:8px;align-self:center;order:2;margin:6px 0 0;padding:5px 12px;min-height:34px;font-size:12px;line-height:22px;font-weight:500;color:var(--auth-ink);border-radius:7px}
.login-panel .qr-login-toggle::before{content:'';width:16px;height:16px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.7' d='M3 3h6v6H3zM15 3h6v6h-6zM3 15h6v6H3zM15 15h3v3h3v3h-6zM3 12h7m2-9v7m0 3v8m3-9h6'/%3E%3C/svg%3E") center/contain no-repeat}
.login-panel .qr-login-toggle:hover{background:var(--auth-active)}
.login-panel :is(button,a):focus-visible{outline-color:var(--auth-gold)}
.login-panel:has(#qr-login-panel:not([hidden])){width:620px;max-width:calc(100% - 36px);padding:20px 22px 12px;bottom:14.5%}
.login-panel .qr-login-panel{outline:none;color:var(--auth-ink)}
.login-panel .qr-login-content{display:grid;grid-template-columns:170px minmax(0,1fr);align-items:center;gap:24px;text-align:left}
.login-panel .qr-image{display:block;width:170px;height:170px;max-width:100%;border-radius:9px;background:white;padding:5px}
.login-panel .qr-login-copy p{font-size:12px;line-height:1.6;margin:0 0 10px}
.login-panel .qr-login-panel .hint{color:var(--auth-muted);font-size:12px;margin:4px 0}
.login-panel .qr-number{font-size:27px;letter-spacing:.16em;margin:5px 0 6px;color:var(--auth-ink)}
.login-panel .qr-login-panel .secondary{background:var(--auth-input);color:var(--auth-ink);border-color:var(--auth-line)}

@media(max-width:900px) and (orientation:portrait){
 .login-screen{--auth-scene:url('/static/brand/opora-v2-scene-mobile.webp');--auth-art:url('/static/brand/opora-v2-foreground-mobile.webp')}
 .login-screen::before{inset:-30px;filter:blur(20px) var(--auth-scene-filter)}
 .login-artwork{background-size:88% 88%;background-position:60% -3%}
 .auth-star-glow{left:55.8%;top:19.95%;width:22cqw;height:12cqw}.auth-star-glow::after{width:4cqw;height:4cqw}
 .login-artboard{width:min(100%,50svh);aspect-ratio:1/2;min-width:min(100vw,320px)}
 .auth-slogans{top:3.25%;left:50%;transform:translateX(-50%);right:auto;width:62%;gap:3cqw;font-size:1.6cqw;line-height:1.85;letter-spacing:.14em}
 .auth-slogans p{padding-left:0;border:0}.auth-slogans p:last-child{padding-left:3cqw;border-left:1px solid currentColor}
 .auth-values{display:none}.auth-footer{bottom:3.5%;right:5%;gap:2cqw;font-size:1.15cqw}.auth-footer::before{width:6cqw}
 .appearance-switch{top:11%;right:auto;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 28px);padding:3px}
 .appearance-option span{padding:5px 10px;font-size:11px;gap:5px;min-height:36px}
 .login-panel{top:60%;bottom:auto;width:calc(100% - 36px);max-width:470px;padding:14px 14px 8px;border-radius:14px}
 .login-panel form{grid-template-columns:minmax(0,1fr);gap:9px}
 .login-panel input{font-size:16px;min-height:46px;padding-block:11px}
 .login-panel .login-submit{justify-self:center;height:46px;min-height:46px}
 .login-panel .error{grid-row:auto;grid-column:1;margin:0}
 .login-panel .qr-login-toggle{min-height:36px;margin-top:5px}
 .login-panel:has(#qr-login-panel:not([hidden])){top:auto;width:calc(100% - 32px);max-width:470px;padding:16px 14px 8px;bottom:11.5%}
 .login-panel .qr-login-content{grid-template-columns:1fr;gap:10px;text-align:center}
 .login-panel .qr-image{width:150px;height:150px;margin:auto}
 .login-panel .qr-login-copy p{font-size:11px;line-height:1.5;margin-bottom:5px}
 .login-panel .qr-number{font-size:23px;margin:3px 0}
}
@media(orientation:landscape) and (max-height:600px){
 .login-screen{min-height:600px}
 .login-artboard{width:min(100%,900px);min-width:min(100vw,780px)}
 .login-panel{bottom:7%;padding-top:12px}
 .appearance-switch{top:22%}
}
@media(prefers-reduced-transparency:reduce){.login-screen{--auth-glass:#edf8f1;--auth-input:#fff}html[data-theme=dark] .login-screen{--auth-glass:#0b252b;--auth-input:#0b2026}}

@media(prefers-reduced-motion:reduce){.login-scenery,.login-artwork,.login-submit svg{transition:none}}

/* Reflow the very same generated night artwork into three + two categories. */
.auth-night-mobile{display:none}
@media(max-width:900px) and (orientation:portrait){
 html[data-theme=dark] .login-artwork{background-image:none;filter:none;mix-blend-mode:normal}
 html[data-theme=dark] .auth-night-mobile{display:block;position:absolute;inset:0}
 .auth-night-logo{position:absolute;top:16.5%;left:25.8%;width:60%;aspect-ratio:728 / 465;overflow:hidden;background:url('/static/brand/opora-v3-night-wide.png') 50.5297% 7.9832% / 229.6703% 202.3656% no-repeat}
 .auth-night-tagline{position:absolute;top:36.8%;left:20%;width:71.6%;text-align:center;color:#eee4c9;font-size:2.1cqw;line-height:1.9;letter-spacing:.28em;text-transform:uppercase}
 .auth-night-category{position:absolute;width:22%;aspect-ratio:174 / 120;background-image:url('/static/brand/opora-v3-night-wide.png');background-size:960.9195% 784.1667%;background-repeat:no-repeat;top:42%;background-position-y:68.2095%}
 .auth-night-people{left:23%;background-position-x:26.6355%}
 .auth-night-sites{left:44.8%;background-position-x:38.2510%}
 .auth-night-finance{left:66.6%;background-position-x:50%}
 .auth-night-process{left:33.9%;top:49%;background-position-x:61.5487%}
 .auth-night-growth{left:55.7%;top:49%;background-position-x:73.2309%}
}
@media(max-width:380px) and (orientation:portrait){.login-artboard{min-height:720px}}
@media(max-width:900px) and (orientation:portrait){
 .auth-night-process{clip-path:inset(0 0 0 8%)}
 .auth-night-growth{left:54.0563%;width:25.2874%;aspect-ratio:200 / 120;background-size:836% 784.1667%;background-position-x:73.6413%;clip-path:inset(0 0 0 10%)}
}