/* The portal's document motif. All assets and motion stay on this origin. */
.case-loader { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }
.case-loader__scene { position:relative; aspect-ratio:1 / 1.12; flex:none; perspective:650px; }
.case-loader__volume { position:absolute; inset:9% 19% 14% 16%; transform:rotate(-7deg); transform-style:preserve-3d; }
.case-loader__cover { position:absolute; inset:0 -5% -3% -5%; border-radius:9% 13% 12% 9%; background:#173d3b; box-shadow:0 5px 12px #173d3b1c; }
.case-loader__sheet { position:absolute; inset:5% -2% 5% 8%; border:1px solid #b7cdc5; border-radius:4% 12% 5% 4%; background:#fff; transform-origin:0 50%; overflow:hidden; backface-visibility:hidden; }
.case-loader__sheet::after { content:""; position:absolute; top:0; right:0; width:19%; height:15%; background:#dfebe5; clip-path:polygon(0 0,100% 100%,0 100%); }
.case-loader__sheet--back { transform:translate(6%,3%) rotate(5deg); background:#e6efeb; }
.case-loader__sheet--base { transform:translate(2%,1%) rotate(1deg); }
.case-loader__sheet--turn { animation:case-page-turn 3.6s cubic-bezier(.45,0,.2,1) infinite; }
.case-loader__lines { position:absolute; inset:23% 18% 24% 18%; background:repeating-linear-gradient(to bottom,#a5bfb3 0 3%,transparent 3% 19%); opacity:.8; }
.case-loader__lines::before { content:""; position:absolute; top:-17%; left:0; width:67%; height:5%; background:#236649; border-radius:2px; }
.case-loader__scan { position:absolute; inset:0; background:linear-gradient(transparent 39%,#68bd8b24 48%,#2366495c 50%,transparent 51%); transform:translateY(-65%); animation:case-page-scan 3.6s ease-in-out infinite; }
.case-loader__spine { position:absolute; top:0; bottom:-3%; left:-5%; width:8%; background:#24534b; border-radius:7px 0 0 7px; }
.case-loader__bookmark { position:absolute; top:1%; left:62%; width:10%; height:22%; background:#c6a46c; clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%); }
.case-loader__shadow { position:absolute; bottom:1%; left:14%; width:74%; height:7%; background:#173d3b14; border-radius:50%; }
.case-loader__caption { font-size:13px; line-height:1.5; font-weight:500; font-family:inherit; color:var(--text-secondary,#526a61); letter-spacing:.02em; }
@keyframes case-page-turn {
  0%,42% { transform:rotateY(0deg); opacity:1; }
  72% { transform:rotateY(-155deg); opacity:0; }
  73% { transform:rotateY(0deg) translateX(10%); opacity:0; }
  92%,100% { transform:rotateY(0deg) translateX(0); opacity:1; }
}
@keyframes case-page-scan {
  0%,6% { transform:translateY(-65%); opacity:0; }
  12% { opacity:1; }
  40% { transform:translateY(65%); opacity:1; }
  44%,100% { transform:translateY(65%); opacity:0; }
}

/* Match the native #body utility prefix, scoped only to sign-in forms. */
:is(#body [data-testid="password-login-form"],[data-testid="login-form"]) {
  --case-input-bg:#f1f6f4; --case-input-border:#6f8c83; --case-input-text:#203f35;
  --case-focus:#236649; --case-focus-ring:#dcece3; --case-placeholder:#5a7167;
}
#body [data-testid="password-login-form"] { max-width:380px; padding-inline:26px; gap:22px; }
:is(#body [data-testid="password-login-form"],[data-testid="login-form"]) label {
  font-size:14px; font-weight:600; color:var(--case-input-text); letter-spacing:.01em;
}
#body [data-testid="password-login-form"] [data-slot="input"],
[data-testid="login-form"] :is(input[type="text"],input[type="password"]) {
  min-height:52px; height:52px; border:2px solid var(--case-input-border);
  border-radius:10px; background:var(--case-input-bg); color:var(--case-input-text);
  padding:0 14px; box-shadow:inset 0 1px 2px #173d3b08;
  font-size:16px; line-height:1.5;
  transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease;
}
#body [data-testid="password-login-form"] div[data-slot="input"] input {
  min-width:0; height:100%; background:transparent; color:inherit; font-size:16px; outline:0;
}
[data-testid="login-form"] input[type="password"],
[data-testid="login-form"] #password { padding-right:44px; }
#body [data-testid="password-login-form"] [data-slot="input"]:hover,
[data-testid="login-form"] input:hover { border-color:var(--case-focus); }
#body [data-testid="password-login-form"] [data-slot="input"]:focus-within,
[data-testid="login-form"] input:focus-visible {
  outline:0; border-color:var(--case-focus); box-shadow:0 0 0 4px var(--case-focus-ring);
}
:is(#body [data-testid="password-login-form"],[data-testid="login-form"]) input::placeholder {
  color:var(--case-placeholder); opacity:1;
}
:is(#body [data-testid="password-login-form"],[data-testid="login-form"]) input:disabled,
#body [data-testid="password-login-form"] [aria-disabled="true"] { cursor:wait; opacity:.65; }
#body [data-testid="password-login-form"] [data-testid="password-submit-button"] {
  min-height:48px; border-radius:10px; font-size:15px; font-weight:600;
}
:is(.dark,[data-theme="dark"],[data-dark-mode="true"]) :is(#body [data-testid="password-login-form"],[data-testid="login-form"]) {
  --case-input-bg:#1e302b; --case-input-border:#77958a; --case-input-text:#edf5f0;
  --case-focus:#9ed3b2; --case-focus-ring:#284b3c; --case-placeholder:#b4c6bd;
}
@media(prefers-reduced-motion:reduce) {
  .case-loader__sheet--turn,.case-loader__scan { animation:none; }
  .case-loader__scan { display:none; }
  :is(#body [data-testid="password-login-form"],[data-testid="login-form"]) [data-slot="input"] { transition:none; }
}
