:root {
  color-scheme: light;
  font-family: var(--font-app);
  font-synthesis: none;
  background: #f6f3ed;
  color: #432b34;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: grid; place-items: center; padding: max(24px,env(safe-area-inset-top)) 20px max(24px,env(safe-area-inset-bottom)); background: radial-gradient(ellipse at 90% 0,#e1eee7 0,transparent 48%),#f6f3ed; }
.card { position: relative; overflow: hidden; width: min(100%,520px); padding: 40px 34px; border: 1px solid #dfd2c5; border-radius: 26px; background: #fffefa; box-shadow: 0 25px 80px #57302c0c; text-align: center; }
.card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 6px; background: linear-gradient(to left,#84334b 0 50%,#74ae9f 50% 85%,#d3b482 85%); }
.mark { width: 88px; height: 88px; margin: 0 auto 23px; }
.mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.eyebrow { margin: 0 0 12px; color: #826761; font-family: "Noto Sans",sans-serif; font-size: 10px; font-weight: 500; letter-spacing: .22em; }
h1 { margin: 0 0 15px; font-size: clamp(23px,6vw,29px); font-weight: 600; line-height: 1.8; }
p { margin: 0; color: #7b6967; font-size: 13px; line-height: 2.1; }
.device { margin: 24px 0 0; padding: 13px 15px; border: 1px solid #c8dfd4; border-radius: 13px; background: #e8f1e9; color: #346353; font-weight: 500; }
.message { min-height: 26px; margin: 20px 0 0; color: #7b6967; line-height: 1.9; font-size: 13px; }
.message.error { color: #b33650; }
.message.success { color: #167b66; }
button, .auth-link { display: block; width: 100%; min-height: 52px; margin-top: 20px; padding: 13px 16px; border: 0; border-radius: 12px; background: #84334b; color: #fffaf5; font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; text-decoration: none; -webkit-tap-highlight-color: transparent; transition: background .18s; }
button:hover, .auth-link:hover { background: #63253a; }
button:focus-visible, a:focus-visible { outline: 3px solid #167b78; outline-offset: 4px; }
button:disabled { opacity: .55; cursor: wait; }
button:active { transform: translateY(1px); }
[hidden] { display: none !important; }
hr { margin: 30px 0 24px; border: 0; border-top: 1px solid #e5ddd5; }
.english { font-family: "Noto Sans",sans-serif; }
.english h2 { margin: 0 0 9px; font-size: 15px; font-weight: 600; }
.english p { font-size: 12px; line-height: 1.8; }
@media (max-width: 420px) { .card { padding: 32px 25px; border-radius: 22px; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
