:root{
		--accent:#0071e3;
		--accent-hover:#0a65d1;
		--accent-active:#004b9c;
		--text:#1d1d1f;
		--text-soft:#6e6e73;
		--surface:#ffffff;
		--bg:#f5f5f7;
		--radius:14px;
		--duration:.25s;
		font-family:-apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	  }
	  *{box-sizing:border-box;}

	  body{
		margin:0;
		background:var(--bg);
		display:flex;
		align-items:center;
		justify-content:center;
		min-height:100vh;
		padding:24px;
	  }

	  main.card{
		width:100%;
		max-width:420px;
		background:var(--surface);
		border-radius:var(--radius);
		padding:56px 48px 18px;
		box-shadow:0 12px 28px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.06);
	  }

	  h1{
		margin:0 0 40px;
		font-weight:600;
		font-size:26px;
		line-height:1.2;
		text-align:center;
		color:var(--text);
	  }

	  input{
		width:100%;
		font:19px/1.35 "Inter", sans-serif;
		font-weight: 400;
		color:var(--text);
		background:#fff;
		border:1px solid rgba(0,0,0,.15);
		border-radius:var(--radius);
		padding:14px 16px;
		margin:0 0 20px;
		transition:border-color var(--duration), box-shadow var(--duration);
	  }

	  input::placeholder{
		color:var(--text-soft);
	  }

	  input:focus{
		outline:none;
		border-color:var(--accent);
		box-shadow:0 0 0 4px rgba(0,113,227,.12);
	  }

	  button{
		width:100%;
		border:none;
		border-radius:var(--radius);
		padding:16px;
		font:600 17px/1 "Inter", sans-serif;
		background:var(--accent);
		color:#fff;
		cursor:pointer;
		transition:background var(--duration), transform var(--duration);
	  }
	  button:hover{background:var(--accent-hover);}      
	  button:active{
		background:var(--accent-active);
		transform:scale(0.97);
	  }
	  .error{
		display:none;
		color:#bf1111;
		background:#fef1f1;
		border:1px solid #fad2d2;
		border-radius:var(--radius);
		padding:12px 16px;
		font-size:14px;
		margin:0 0 24px;
		text-align:center;
		animation:fade .3s ease;
	  }
	  .error a{
  color: var(--accent);            /* #0071e3 как у кнопки */
  text-decoration: none;
}
.error a:hover{ text-decoration: underline; }
	  @keyframes fade{from{opacity:0}to{opacity:1}}
	  .password-wrap{position:relative}
	  .password-wrap svg{
		position:absolute;
		top:38%;
		right:16px;
		width:20px;height:20px;
		transform:translateY(-50%);
		cursor:pointer;
		color:rgba(0,0,0,.35);
		transition:color var(--duration);
	  }
	  .password-wrap svg:hover{color:var(--accent);}
	  .visually-hidden{
		position:absolute;
		width:1px;height:1px;
		padding:0;margin:-1px;
		overflow:hidden;
		clip:rect(0 0 0 0);
		white-space:nowrap;
		border:0;
	  }

	  footer{
		margin-top:52px;
		text-align:center;
		font-size:11px;
		color:var(--text-soft);
		display:flex;
		flex-direction:column;
		align-items:center;
		gap:5px;
	  }
	  footer img{
		width:90px;
		height:auto;
		opacity:0.8;
	  }

	  @media (prefers-color-scheme: dark){
		:root{
		  --surface:#1c1c1e;
		  --bg:#000000;
		  --text:#f5f5f7;
		  --text-soft:#9f9fa3;
		  --border:#2c2c2e;
		}
		main.card{
		  background:var(--surface);
		  box-shadow:none;
		  border:1px solid var(--border);
		}
		input{
		  background:var(--surface);
		  border:1px solid var(--border);
		}
		input:focus{
		  border-color:var(--accent);
		  box-shadow:0 0 0 4px rgba(0,113,227,.25);
		}
	  }