:root { --ink:#25262c; --muted:#787b80; --line:#d8d9dc; --green:#10ad7d; --green-dark:#099c70; }
* { box-sizing:border-box; }
html, body { min-height:100%; }
body { margin:0; color:var(--ink); background:#fdfdfd; font-family:Inter,Arial,sans-serif; font-size:14px; }
button, input { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
.topbar { position:fixed; z-index:10; top:0; right:0; padding:24px 30px; }
.language-picker { position:relative; }
.language-trigger { display:flex; align-items:center; gap:8px; min-width:128px; padding:9px 11px; border:1px solid transparent; border-radius:8px; color:#46484d; background:transparent; cursor:pointer; }
.language-trigger:hover,.language-trigger[aria-expanded="true"] { border-color:#e0e1e2; background:#fff; }
.language-trigger svg { width:17px; fill:none; stroke:currentColor; stroke-width:1.7; }
.language-trigger .chevron { width:15px; margin-left:auto; transition:transform .2s; }
.language-trigger[aria-expanded="true"] .chevron { transform:rotate(180deg); }
.language-menu { position:absolute; top:45px; right:0; display:none; width:170px; padding:6px; border:1px solid #e3e3e3; border-radius:10px; background:white; box-shadow:0 10px 32px rgba(22,24,27,.11); }
.language-menu.open { display:block; animation:menu-in .16s ease-out; }
.language-menu button { display:flex; justify-content:space-between; width:100%; padding:10px 11px; border:0; border-radius:7px; background:transparent; color:#35363a; cursor:pointer; text-align:left; }
.language-menu button:hover,.language-menu button.active { background:#f0faf7; color:#078b65; }
.language-menu small { color:#9a9b9e; }
@keyframes menu-in { from { opacity:0; transform:translateY(-5px); } }
.auth-page { display:grid; min-height:100vh; place-items:center; padding:68px 20px 44px; }
.auth-wrap { width:440px; max-width:100%; text-align:center; transform:translateY(-18px); }
.brand { display:inline-block; margin-bottom:15px; color:#22242b; font-size:43px; font-weight:800; letter-spacing:-3.1px; line-height:1; text-decoration:none; }
.brand span { color:var(--green); }
h1 { margin:0 0 26px; font-size:23px; line-height:1.35; font-weight:700; letter-spacing:-.35px; }
.auth-card { min-height:0; padding:41px 47px 39px; border:1px solid #d5d6d8; border-radius:13px; background:#fff; text-align:left; }
label { display:block; margin:0 0 8px; font-size:13px; font-weight:500; }
input[type="text"],input[type="email"],input[type="password"] { width:100%; height:42px; padding:0 12px; border:1px solid var(--green); border-radius:5px; outline:none; color:#25262a; background:#fff; transition:box-shadow .15s,border-color .15s; }
input::placeholder { color:#96989d; }
input:focus { border-color:#08a977; box-shadow:0 0 0 3px rgba(16,173,125,.12); }
input.invalid { border-color:#dc4e4e; box-shadow:0 0 0 3px rgba(220,78,78,.09); }
.field-error { display:none; margin:6px 0 -2px; color:#c83b3b; font-size:12px; }
.field-error.visible { display:block; }
.primary-button { width:100%; height:44px; margin-top:22px; border:0; border-radius:4px; color:#fff; background:var(--green); font-weight:700; cursor:pointer; transition:background .15s,transform .05s; }
.primary-button:hover { background:var(--green-dark); }
.primary-button:active { transform:translateY(1px); }
.divider { display:flex; align-items:center; gap:13px; margin:28px 0; color:#6f7176; font-size:12px; }
.divider::before,.divider::after { content:""; height:1px; flex:1; background:#d7d7d8; }
.social-button { position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:44px; margin-bottom:12px; border:1px solid #dddfe1; border-radius:5px; color:#303236; background:#fff; cursor:pointer; transition:border-color .15s,background .15s; }
.social-button:hover { border-color:#bfc1c4; background:#fafafa; }
.social-button svg { position:absolute; left:73px; width:18px; height:18px; }
.signup-text { margin:24px 0 0; color:#84868a; text-align:center; }
#social-section { display:none!important; }
a { color:#07966d; text-decoration:none; }
a:hover { text-decoration:underline; }
.back-button { margin:-15px 0 12px; padding:0; border:0; color:#717379; background:none; cursor:pointer; }
.chosen-email { margin-bottom:19px; overflow:hidden; color:#666970; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.password-field { position:relative; }
.password-field input { padding-right:42px; }
.show-password { position:absolute; top:0; right:0; display:grid; width:42px; height:42px; place-items:center; border:0; color:#686b70; background:transparent; cursor:pointer; }
.show-password svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.7; }
.password-meta { display:flex; justify-content:space-between; margin-top:12px; font-size:12px; }
.remember { display:flex; align-items:center; gap:5px; margin:0; color:#6f7175; font-weight:400; }
.remember input { accent-color:var(--green); }
[hidden] { display:none!important; }
.auth-error{margin:-12px 0 18px;padding:10px 12px;border:1px solid #f0c5c5;border-radius:5px;background:#fff3f3;color:#bd3f3f;font-size:12px;text-align:center}
.register-page{padding-top:45px}.register-page .auth-wrap{transform:none}.register-card{padding-top:30px}.register-card label{margin-top:14px}.register-card input[type=text],.register-card input[type=email],.register-card input[type=password]{width:100%;height:42px;padding:0 12px;border:1px solid #d5d8d8;border-radius:5px;outline:none}.register-card input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(16,173,125,.12)}.register-card .primary-button{margin-top:18px}.validation-error{display:block;margin-top:4px;color:#c83b3b;font-size:11px}.validation-summary-valid{display:none}.terms{display:flex!important;align-items:flex-start;gap:7px;color:#6f7175;font-weight:400!important;line-height:1.5}.terms input{margin-top:3px;accent-color:var(--green)}
@media (max-width:600px) {
  .topbar { padding:14px 12px; }
  .current-language { display:none; }
  .language-trigger { min-width:auto; }
  .auth-page { align-items:start; padding:94px 18px 32px; }
  .auth-wrap { transform:none; }
  .brand { font-size:38px; }
  h1 { margin-bottom:22px; font-size:21px; }
  .auth-card { min-height:0; padding:32px 24px; }
  .social-button svg { left:calc(50% - 93px); }
}
