.osse-access {
  margin:0!important;
  min-height:100vh;
  min-height:100dvh;
  background:var(--brand-deep)!important;
  color:var(--ink);
  font:15px/1.5 Inter,"Segoe UI",sans-serif;
}
.access-backdrop {position:fixed;inset:0;overflow:hidden;isolation:isolate;pointer-events:none}
.access-photo,.access-tint,.access-shine {position:absolute;inset:0}
.access-photo {
  inset:-4%;
  background:url("login-bg-v12.jpg") center 60%/cover no-repeat;
  background-image:image-set(url("login-bg-v12.webp") type("image/webp"),url("login-bg-v12.jpg") type("image/jpeg"));
  animation:access-zoom 30s ease-in-out infinite alternate;
  will-change:transform;
}
.access-tint {background:var(--access-tint)}
.access-fall {
  position:absolute;inset:58% 0 12% 28%;
  background:repeating-linear-gradient(90deg,transparent 0 7px,rgba(var(--white-rgb),.55) 8px,transparent 10px 18px);
  -webkit-mask-image:linear-gradient(transparent,var(--mask-ink) 30% 70%,transparent);
  mask-image:linear-gradient(transparent,var(--mask-ink) 30% 70%,transparent);
  mix-blend-mode:soft-light;opacity:.55;
}
.access-fall::before {
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(100deg,transparent 0 14px,rgba(var(--white-rgb),.25) 18px,transparent 28px),
    repeating-linear-gradient(180deg,transparent 0 25px,rgba(var(--white-rgb),.4) 38px,transparent 52px);
  background-size:auto,100% 104px;
  animation:access-fall 1.6s linear infinite;
}
.access-shine {
  background:linear-gradient(105deg,transparent 35%,rgba(var(--white-rgb),.22) 48%,transparent 60%);
  background-size:250% 100%;
  mix-blend-mode:soft-light;
  animation:access-shine 9s ease-in-out infinite;
}
.access-sparks i {
  position:absolute;width:6px;height:6px;border-radius:50%;background:var(--paper-bg);
  box-shadow:0 0 10px 3px rgba(var(--white-rgb),.8);animation:access-spark 3.6s ease-in-out infinite;
}
.access-sparks i:nth-child(1){left:46%;top:74%}
.access-sparks i:nth-child(2){left:58%;top:80%;animation-delay:1.2s}
.access-sparks i:nth-child(3){left:38%;top:84%;animation-delay:2.1s}
.access-sparks i:nth-child(4){left:52%;top:69%;animation-delay:2.8s}
.access-wave {
  position:absolute;inset:auto auto 0 0;width:200%;height:120px;max-width:none;
  fill:var(--access-wave);animation:osse-wave 12s linear infinite;
}
.access-wave:nth-last-child(2){height:95px;fill:var(--access-wave-alt);animation:osse-wave 18s linear infinite reverse}
.access-wave:last-child{height:70px;fill:none;stroke:var(--accent);stroke-width:6;stroke-linecap:round;animation-duration:24s}
@keyframes access-zoom {from{transform:scale(1.04)}to{transform:scale(1.14) translate(-2.5%,-1.5%)}}
@keyframes access-fall {to{background-position:0 0,0 104px}}
@keyframes access-shine {0%{background-position:150% 0}60%,100%{background-position:-50% 0}}
@keyframes access-spark {0%,100%{opacity:0;transform:scale(.4)}50%{opacity:.9;transform:scale(1)}}
@keyframes access-grow {from{transform:scaleX(0)}to{transform:scaleX(1)}}

.osse-access .access-layout {
  position:relative;display:grid;grid-template-columns:1.15fr 1fr;
  align-items:stretch;min-height:100vh;min-height:100dvh;margin:0;max-width:none;padding:0;
}
.access-hero {display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:44px 0 120px clamp(32px,4vw,64px);min-width:0}
.access-hero-logo {width:auto;height:64px;align-self:flex-start;animation:osse-rise .9s ease both}
.access-message {max-width:560px;text-shadow:0 2px 18px rgba(var(--shadow-rgb),.4)}
.access-bar {width:64px;height:4px;border-radius:4px;background:var(--accent);margin-bottom:18px;transform-origin:left;animation:access-grow 1s ease .35s both}
.access-message h2 {font-size:46px;font-weight:800;line-height:1.08;margin:0;color:var(--paper-bg);animation:osse-rise .9s ease .15s both}
.access-message p {font-size:18px;margin:16px 0 0;color:var(--access-copy);animation:osse-rise .9s ease .3s both}
.access-card-area {display:grid;place-items:center;padding:78px clamp(24px,4vw,64px) 90px;min-width:0}
.access-card {
  width:min(100%,420px);padding:34px;border-radius:22px;border:1px solid var(--access-border);
  background:var(--access-glass);color:var(--ink);box-shadow:var(--access-shadow);
  -webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);
  animation:osse-rise .9s ease .15s both;
}
.access-card-logo {display:block;width:auto;height:56px;max-width:100%;object-fit:contain;margin:0 auto 18px}
.access-card h1 {font-size:25px;line-height:1.2;margin:0;text-align:center;color:var(--access-title)}
.access-card h1 span {font-weight:600}
.access-card h1 strong {font-weight:700}
@supports(background-clip:text) {
  .access-card h1 strong {background:linear-gradient(90deg,var(--access-title),var(--aqua));background-clip:text;color:transparent}
}
.access-lead,.access-card .lead {margin:8px 0 18px;text-align:center;font-size:14px;color:var(--muted)}
.access-card label {margin:10px 0 5px;font-size:13px;font-weight:600;color:var(--muted)}
.access-card .login-v101-field {display:flex;align-items:center;gap:8px;padding:0 10px 0 13px;border:1px solid var(--line-strong);border-radius:12px;background:var(--access-field)}
.access-card .login-v101-field:focus-within,.access-reset input:focus {border-color:var(--aqua);box-shadow:0 0 0 4px rgba(var(--aqua-rgb),.3)}
.login-v101-field .login-v101-icon,.login-v101-field .login-v101-eye {color:var(--muted);display:flex;align-items:center;justify-content:center;flex:none}
.login-v101-field svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.access-card .login-v101-field input {
  min-width:0;flex:1;height:46px;padding:0;margin:0;border:0;background:transparent;color:var(--ink);box-shadow:none;outline:none;
}
.access-card .login-v101-field input::-ms-reveal,.access-card .login-v101-field input::-ms-clear {display:none}
.access-card .login-v101-eye {width:38px;height:38px;margin:0;padding:7px;background:transparent;color:var(--muted);border:0}
.access-card .login-v101-eye:hover {color:var(--ink);background:var(--aqua-soft)}
.access-card button[type=submit] {
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;
  position:relative;overflow:hidden;margin:16px 0 0;padding:12px;border:0;border-radius:12px;
  background:var(--access-button);color:var(--on-brand);font-weight:700;
}
.access-card button[type=submit]::after {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 30%,rgba(var(--white-rgb),.06) 50%,transparent 70%);
  transform:translateX(-100%);transition:transform .65s ease;
}
.access-card button[type=submit]:hover::after {transform:translateX(100%)}
.access-card button[type=submit]:hover {box-shadow:0 12px 26px -10px rgba(var(--brand-rgb),.6)}
.login-v101-submit .arrow {display:inline-block;transition:transform .25s ease}
.login-v101-submit:hover .arrow {transform:translateX(5px)}
.login-v101-recover,.password-reset-back {display:block;text-align:center;font-size:14px;font-weight:600;margin:14px 0 0}
.login-v101-error,.password-reset-error,.password-reset-success,.password-reset-info {padding:10px 12px;border-radius:10px;margin:12px 0;font-size:14px}
.login-v101-error,.password-reset-error {background:var(--danger-soft);color:var(--danger);animation:osse-rise .35s ease both}
.password-reset-success {background:var(--success-soft);color:var(--success)}
.password-reset-info {background:var(--aqua-soft);color:var(--aqua-text)}
.access-reset input {display:block;border-radius:12px;background:var(--access-field);border-color:var(--line-strong)}
.osse-access>.osse-mode {position:absolute;top:24px;right:clamp(16px,4vw,56px);z-index:10}
.osse-access .osse-mode-toggle {background:var(--access-pill);color:var(--ink);border-color:var(--access-border);backdrop-filter:blur(10px)}

@media(max-width:899px) {
  .osse-access .access-layout {display:flex;flex-direction:column}
  .access-hero {padding:20px 16px 12px;gap:20px;background:var(--access-mobile-veil)}
  .access-hero-logo {height:42px}
  .access-bar {margin-bottom:9px}
  .access-message h2 {font-size:28px;max-width:520px}
  .access-message p {font-size:14px;margin-top:7px}
  .access-card-area {padding:16px 16px 64px}
  .access-card {padding:23px}
  .access-fall,.access-sparks {display:none}
  .access-wave {height:64px}
  .access-wave:nth-last-child(2){height:52px}
  .access-wave:last-child {height:38px}
  .osse-access>.osse-mode {top:22px}
}
@media(prefers-reduced-motion:reduce) {
  .osse-access *, .osse-access *::before,.osse-access *::after {animation:none!important;transition:none!important}
  .access-photo {will-change:auto}
}