/* Sign-in page. Uses the Command Center green without pulling in the app's
   full stylesheet, so the page stays fast and independent of the workspace. */
:root{
  --signin-ink:#1b3929;
  --signin-ink-soft:#4a6357;
  --signin-green:#32836a;
  --signin-green-dark:#276a55;
  --signin-ground:#eef6f2;
  --signin-card:#ffffff;
  --signin-rule:#d5e3db;
  --signin-error:#a5281c;
  --signin-error-soft:#fdecea;
}
*{box-sizing:border-box}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(1100px 520px at 50% -12%, #dff0e7 0%, rgba(223,240,231,0) 62%),
    var(--signin-ground);
  color:var(--signin-ink);
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:15px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.signin{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 20px;
}
.signin-card{
  width:100%;
  max-width:26rem;
  background:var(--signin-card);
  border:1px solid var(--signin-rule);
  border-radius:14px;
  padding:30px 28px 24px;
  box-shadow:0 1px 2px rgba(27,57,41,.05),0 18px 44px -28px rgba(27,57,41,.45);
  display:flex;
  flex-direction:column;
  gap:22px;
}
.signin-brand{display:flex;align-items:center;gap:13px}
.signin-mark{
  flex:0 0 auto;width:38px;height:38px;border-radius:11px;
  background:var(--signin-ink);
  background-image:linear-gradient(135deg,var(--signin-ink),#25523a);
  position:relative;
}
.signin-mark::after{
  content:"";position:absolute;inset:11px;
  border:3px solid #c6ef76;border-left:0;border-bottom:0;
  transform:rotate(45deg);border-radius:1px;
}
.signin-brand h1{margin:0;font-size:1.06rem;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.signin-sub{margin:1px 0 0;font-size:.8rem;color:var(--signin-ink-soft)}

form{display:flex;flex-direction:column;gap:7px}
label{font-size:.78rem;font-weight:600;letter-spacing:.02em;color:var(--signin-ink-soft)}
label+input{margin-bottom:9px}
input{
  width:100%;
  font:inherit;
  color:var(--signin-ink);
  background:#fbfdfc;
  padding:11px 13px;
  border:1px solid var(--signin-rule);
  border-radius:8px;
  transition:border-color .12s ease, box-shadow .12s ease;
}
input:focus{
  outline:none;
  border-color:var(--signin-green);
  box-shadow:0 0 0 3px rgba(50,131,106,.18);
}
input:focus-visible{outline:2px solid transparent}

.signin-button{
  margin-top:6px;
  font:inherit;
  font-weight:600;
  color:#fff;
  background:var(--signin-green);
  border:1px solid var(--signin-green-dark);
  border-radius:8px;
  padding:11px 16px;
  cursor:pointer;
  transition:background .12s ease;
}
.signin-button:hover:not(:disabled){background:var(--signin-green-dark)}
.signin-button:focus-visible{outline:2px solid var(--signin-ink);outline-offset:2px}
.signin-button:disabled{opacity:.62;cursor:progress}

.signin-error{
  margin:2px 0 0;
  padding:9px 12px;
  font-size:.82rem;
  color:var(--signin-error);
  background:var(--signin-error-soft);
  border:1px solid #f3cec9;
  border-radius:7px;
}
.signin-notice{
  margin:0 0 4px;
  padding:9px 12px;
  font-size:.82rem;
  color:var(--signin-ink);
  background:#eef6f2;
  border:1px solid var(--signin-rule);
  border-radius:7px;
}
.signin-hint{margin:-4px 0 6px;font-size:.76rem;color:var(--signin-ink-soft)}
.signin-foot{
  margin:0;
  padding-top:16px;
  border-top:1px solid var(--signin-rule);
  font-size:.76rem;
  color:var(--signin-ink-soft);
}
[hidden]{display:none!important}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media (max-width:420px){
  .signin{padding:20px 14px}
  .signin-card{padding:24px 20px 20px;border-radius:12px}
}
