/* Minification failed. Returning unminified contents.
(9,26): run-time error CSS1039: Token not allowed after unary operator: '-blob1-w'
(9,41): run-time error CSS1039: Token not allowed after unary operator: '-blob1-h'
(9,73): run-time error CSS1039: Token not allowed after unary operator: '-accent-1'
(9,90): run-time error CSS1039: Token not allowed after unary operator: '-blob1-a'
(9,112): run-time error CSS1039: Token not allowed after unary operator: '-app-bg-rgb'
(11,26): run-time error CSS1039: Token not allowed after unary operator: '-blob2-w'
(11,41): run-time error CSS1039: Token not allowed after unary operator: '-blob2-h'
(11,75): run-time error CSS1039: Token not allowed after unary operator: '-accent-2'
(11,92): run-time error CSS1039: Token not allowed after unary operator: '-blob2-a'
(11,114): run-time error CSS1039: Token not allowed after unary operator: '-app-bg-rgb'
(13,108): run-time error CSS1039: Token not allowed after unary operator: '-app-bg-rgb'
(23,55): run-time error CSS1039: Token not allowed after unary operator: '-accent-1'
(23,72): run-time error CSS1039: Token not allowed after unary operator: '-blob-ring-a'
(25,55): run-time error CSS1039: Token not allowed after unary operator: '-accent-1'
(25,77): run-time error CSS1039: Token not allowed after unary operator: '-blob1-a'
(27,55): run-time error CSS1039: Token not allowed after unary operator: '-accent-2'
(27,77): run-time error CSS1039: Token not allowed after unary operator: '-blob2-a'
(36,17): run-time error CSS1039: Token not allowed after unary operator: '-card-bg-rgb'
(37,17): run-time error CSS1039: Token not allowed after unary operator: '-card-bg-rgb'
(38,26): run-time error CSS1039: Token not allowed after unary operator: '-card-stroke'
(44,18): run-time error CSS1039: Token not allowed after unary operator: '-card-stroke'
(59,25): run-time error CSS1039: Token not allowed after unary operator: '-app-bg-rgb'
(60,26): run-time error CSS1039: Token not allowed after unary operator: '-card-stroke'
(61,15): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(68,20): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(71,25): run-time error CSS1039: Token not allowed after unary operator: '-app-bg-rgb'
(75,22): run-time error CSS1039: Token not allowed after unary operator: '-focus-ring'
(85,28): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(86,34): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(100,20): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(105,25): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(106,20): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(132,33): run-time error CSS1039: Token not allowed after unary operator: '-brand-fg'
(140,56): run-time error CSS1039: Token not allowed after unary operator: '-focus-ring'
 */
body {
    padding: 0;
}

/* ---------- canvas ---------- */
.login-shell {
    background:
    /* blob 1 – top left */
    radial-gradient(var(--blob1-w) var(--blob1-h) at 12% -8%, rgba(var(--accent-1), var(--blob1-a)), rgba(var(--app-bg-rgb), 0) 62%),
    /* blob 2 – bottom right */
    radial-gradient(var(--blob2-w) var(--blob2-h) at 108% 108%, rgba(var(--accent-2), var(--blob2-a)), rgba(var(--app-bg-rgb), 0) 64%),
    /* very faint vertical sheen for light mode separation */
    linear-gradient(180deg, rgba(255,255,255,.0), rgba(255,255,255,0) 18%, rgba(0,0,0,.0) 100%), rgba(var(--app-bg-rgb), 1);
    position: relative;
    padding: 24px;
}

.login-accent {
    position: absolute;
    inset: 0;
    background:
    /* subtle ring behind the card center to lift it from bg */
    radial-gradient(34rem 22rem at 50% 42%, rgba(var(--accent-1), var(--blob-ring-a)), transparent 72%),
    /* small top-right puff */
    radial-gradient(28rem 18rem at 72% 14%, rgba(var(--accent-1), calc(var(--blob1-a) * .0)), transparent 70%),
    /* bottom-left puff */
    radial-gradient(26rem 18rem at 18% 86%, rgba(var(--accent-2), calc(var(--blob2-a) * .0)), transparent 72%);
    pointer-events: none;
}

/* ---------- card ---------- */
.login-card{
  width: min(520px, 92vw);
  background:
    linear-gradient(180deg,
      rgba(var(--card-bg-rgb), 0.96) 0%,
      rgba(var(--card-bg-rgb), 0.92) 100%);
  border: 1px solid var(--card-stroke);
  border-radius: 1.5rem !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    0 20px 40px rgba(0,0,0,.25),
    0 1px 0 var(--card-stroke) inset;
  animation: fadeUp .35s ease both;
}

.login-card .form-floating > label{
    line-height: 1.6;
}

.login-brand { display:flex; align-items:center; gap:12px; }
.login-brand img { height:32px; display:block; }
.brand-dark { display:none !important; }
html.ylem-dark-mode-active .brand-light { display:none; }
html.ylem-dark-mode-active .brand-dark { display:block !important; }

.form-floating > .form-control{
  background: rgba(var(--app-bg-rgb), .04);
  border: 1px solid var(--card-stroke);
  color: var(--brand-fg);
  border-radius: 12px;
  padding-left: 14px;
  padding-right: 14px;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.form-floating > label{
  color: rgba(var(--brand-fg), .6);
}
.form-floating > .form-control:focus{
  background: rgba(var(--app-bg-rgb), .07);
  border-color: transparent;
  outline: 0;
  box-shadow:
    0 0 0 .2rem var(--focus-ring),
    inset 0 0 0 1px rgba(255,255,255,.06);
}

/* error text */
.login-errors span{
  display:block;
  line-height:1.2;
}

a.small { color: rgba(var(--brand-fg), .75); text-decoration:none; }
a.small:hover { color: rgba(var(--brand-fg), .95); text-decoration:underline; }

.pw-field .form-control { padding-right: 44px; }

/* toggle button */
.pw-toggle{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  width:36px; height:36px;
  display:grid; place-items:center;
  border:0; background:transparent;
  border-radius:10px;
  color: rgba(var(--brand-fg), .75);
  transition: background .15s ease, color .15s ease, opacity .15s ease;
}
.pw-toggle:hover,
.pw-toggle:focus-visible{
  background: rgba(var(--brand-fg), .08);
  color: rgba(var(--brand-fg), .95);
  outline: none;
}
.pw-toggle:active { opacity:.85; }

.pw-toggle .eye-closed { display: none; }
.pw-toggle[aria-pressed="true"] .eye-open { display: none; }
.pw-toggle[aria-pressed="true"] .eye-closed { display: inline; }

.pw-toggle .eye-open{ display:block; }
.pw-toggle .eye-closed{ display:none; }
.pw-toggle[aria-pressed="true"] .eye-open{ display:none; }
.pw-toggle[aria-pressed="true"] .eye-closed{ display:block; }


.form-floating > .form-control::placeholder { color: transparent; }


.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:-webkit-autofill ~ label {
  opacity: .65;
  transform: scale(.85) translateY(-.5rem) translateX(.15rem);
}

.form-floating > .form-control:-webkit-autofill {
  -webkit-text-fill-color: var(--brand-fg);
  transition: background-color 9999s ease-out;
}

.form-switch .form-check-input{
  width: 2.75rem; height: 1.5rem;
  cursor: pointer;
}
.form-check-input:focus { box-shadow: 0 0 0 .2rem var(--focus-ring); }

.alert.br-12 { border-radius: 12px; }

.spin { animation: spin 1s linear infinite; transform-origin: 50% 50%; }


@media (max-width: 767px) {

    .login-shell{
        background: none;
    }

    .login-accent{
        background: none;
    }

}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(8px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes spin { to { transform: rotate(360deg); } }