:root {
  color-scheme:dark;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  background:#0c1114;
  color:#ecf2f0;
  --line:rgba(194,219,211,.2);
  --muted:#9ba9a5;
  --signal:#7ed9bd;
  --danger:#ffaaa0;
}
* { box-sizing:border-box; }
html,body { min-height:100%; margin:0; }
body {
  min-height:100svh;
  background:
    radial-gradient(circle at 18% 34%,rgba(50,126,106,.17),transparent 34%),
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),#0c1114;
  background-size:auto,42px 42px,42px 42px,auto;
}
.login-shell {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);
  min-height:100svh;
}
.identity {
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:clamp(42px,7vw,110px);
  overflow:hidden;
}
.identity::after {
  content:"";
  position:absolute;
  width:min(52vw,720px);
  aspect-ratio:1;
  left:58%;
  top:50%;
  border:1px solid rgba(126,217,189,.18);
  border-radius:50%;
  box-shadow:0 0 0 80px rgba(126,217,189,.025),0 0 0 160px rgba(126,217,189,.018);
  transform:translate(-18%,-50%);
  pointer-events:none;
}
.signal { display:flex; align-items:center; gap:8px; height:24px; margin-bottom:46px; }
.signal i { display:block; width:5px; height:5px; border-radius:50%; background:var(--signal); box-shadow:0 0 14px var(--signal); }
.signal i:nth-child(2) { opacity:.55; }
.signal i:nth-child(3) { opacity:.2; }
.kicker,.eyebrow { margin:0 0 10px; color:var(--signal); font-size:11px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; }
h1 { position:relative; z-index:1; margin:0; font-size:clamp(58px,9vw,126px); line-height:.88; letter-spacing:-.065em; }
.scope { position:relative; z-index:1; max-width:590px; margin:28px 0 0; color:#c5d0cd; font-size:clamp(16px,1.6vw,21px); line-height:1.65; }
.boundary { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); max-width:680px; margin:70px 0 0; border-top:1px solid var(--line); }
.boundary div { min-width:0; padding:18px 18px 0 0; }
.boundary dt { margin-bottom:7px; color:var(--muted); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.boundary dd { overflow-wrap:anywhere; margin:0; font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; }
.login-panel {
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:34px;
  padding:clamp(32px,5vw,76px);
  border-left:1px solid var(--line);
  background:rgba(13,19,22,.9);
  backdrop-filter:blur(16px);
  animation:panel-in 420ms cubic-bezier(.2,.7,.2,1) both;
}
@keyframes panel-in { from { opacity:0; transform:translateX(18px); } }
.login-panel h2 { margin:0; font-size:34px; letter-spacing:-.035em; }
.hint,.privacy { color:var(--muted); line-height:1.6; }
.hint { margin:10px 0 0; }
.privacy { margin:0; font-size:12px; }
.auth-message { margin:-12px 0; padding:11px 0; border-top:1px solid rgba(255,170,160,.5); border-bottom:1px solid rgba(255,170,160,.5); color:var(--danger); }
.auth-message.quiet { border-color:var(--line); color:#c5d0cd; }
form { display:grid; gap:20px; }
label { display:grid; gap:8px; color:#c5d0cd; font-size:12px; font-weight:650; }
input {
  width:100%; min-height:50px; padding:11px 13px;
  border:1px solid #4a5a56; border-radius:0;
  background:#11191c; color:#f4faf8; font:16px/1.3 inherit;
  transition:border-color 140ms ease,background-color 140ms ease;
}
input[readonly] { color:var(--muted); background:#0f1518; }
input:focus { outline:2px solid transparent; border-color:var(--signal); background:#15201f; }
button {
  min-height:52px; margin-top:5px; border:1px solid var(--signal); border-radius:0;
  background:var(--signal); color:#08110e; font:750 14px/1 inherit; cursor:pointer;
  transition:transform 130ms ease,filter 130ms ease;
}
button:hover { filter:brightness(1.08); transform:translateY(-1px); }
button:active { transform:translateY(0); }
:focus-visible { outline:2px solid var(--signal); outline-offset:3px; }
@media (max-width:820px) {
  .login-shell { display:block; }
  .identity { min-height:42svh; padding:42px 24px 34px; }
  .signal { margin-bottom:28px; }
  .scope { max-width:560px; margin-top:20px; }
  .boundary { margin-top:34px; }
  .login-panel { min-height:58svh; padding:38px 24px 46px; border-top:1px solid var(--line); border-left:0; }
}
@media (max-width:520px) {
  h1 { font-size:57px; }
  .scope { font-size:15px; }
  .boundary { grid-template-columns:1fr; }
  .boundary div { display:grid; grid-template-columns:80px 1fr; gap:8px; padding-top:12px; }
  .login-panel { gap:27px; }
  .login-panel h2 { font-size:29px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; } }