/* Вход и регистрация (design/auth.html). */
.au-wrap{position:relative;min-height:100vh;display:grid;align-items:center;overflow:hidden;isolation:isolate;padding-block:100px 48px}
.wall{position:absolute;inset:-40px;z-index:-2;display:grid;grid-template-columns:repeat(8,1fr);gap:10px;transform:rotate(-6deg) scale(1.12);opacity:.5}
.wall picture,.wall img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:10px}
.au-wrap::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 80% at 70% 50%,rgba(0,0,0,.55),rgba(0,0,0,.92) 80%),linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.4))}
.au-grid{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:56px;align-items:center}
.why h1{font:800 clamp(2.4rem,5vw,4rem)/1 var(--font-display);letter-spacing:-.045em}
.why p{color:rgba(245,245,247,.85);font-size:1.15rem;margin-top:14px;max-width:44ch}
.why ul{display:grid;gap:14px;margin-top:26px}
.why li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:center;font-size:1rem;color:rgba(245,245,247,.9)}
.why li i{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.12);font-style:normal;font-size:1.1rem}
.au-card{background:rgba(22,22,24,.78);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:28px;display:grid;gap:18px}
.tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:rgba(255,255,255,.08)}
.tabs button{all:unset;cursor:pointer;text-align:center;padding:11px;border-radius:999px;font:600 .95rem/1 var(--font-ui);color:var(--fg-2)}
.tabs button[aria-selected="true"]{background:var(--fg);color:#000}
.tabs button:focus-visible{outline:2px solid var(--fg)}
.prov{display:grid;gap:10px}
.prov button,.prov a{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;height:48px;border-radius:14px;background:rgba(255,255,255,.1);font:600 .95rem/1 var(--font-ui)}
.prov button:hover,.prov a:hover{background:rgba(255,255,255,.18)}
.prov button:focus-visible,.prov a:focus-visible{outline:2px solid var(--fg)}
.prov .dot{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font:800 .72rem/1 var(--font-ui);color:#fff}
.or{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;color:var(--fg-3);font-size:.85rem}
.or::before,.or::after{content:"";height:1px;background:var(--line)}
.au-form{display:grid;gap:12px}
.fld{display:grid;gap:6px}
.fld label{font:600 .85rem/1 var(--font-ui);color:var(--fg-2)}
.fld input{height:50px;padding:0 16px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.35);color:var(--fg);font:500 1rem/1 var(--font-ui);outline:none}
.fld input:focus{border-color:var(--accent)}
.fld input[aria-invalid="true"]{border-color:var(--down)}
.err{font-size:.82rem;color:var(--down)}
.row-l{display:flex;justify-content:space-between;align-items:center;font-size:.88rem;color:var(--fg-2)}
.row-l a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.row-l label,.agree label{display:flex;gap:8px;align-items:flex-start;cursor:pointer}
.row-l input,.agree input{accent-color:var(--accent);margin-top:2px}
.agree{display:grid;gap:8px;font-size:.86rem;line-height:1.4;color:var(--fg-2)}
.agree a,.legal-note a{color:var(--fg);text-decoration:underline;text-underline-offset:2px}
.submit{height:50px;border-radius:14px;width:100%}
.legal-note{font-size:.78rem;color:var(--fg-3);line-height:1.5}
.ok{padding:14px 16px;border-radius:14px;background:rgba(48,209,88,.14);color:var(--up);font-size:.92rem;line-height:1.45}
@media (max-width:960px){.au-grid{grid-template-columns:minmax(0,1fr)}.why ul{display:none}.wall{grid-template-columns:repeat(5,1fr)}}
@media (max-width:480px){.au-card{padding:20px;border-radius:22px}}
.au-card [hidden]{display:none!important}

/* Сообщения сервера над формой */
.au-msg{padding:14px 16px;border-radius:14px;font-size:.92rem;line-height:1.45}
.au-msg.bad{background:rgba(255,69,58,.14);color:#ff8a80}
.au-msg.good{background:rgba(48,209,88,.14);color:var(--up)}
/* Первый вход и профиль */
.au-one{min-height:100vh;display:grid;place-items:center;padding:112px 16px 56px}
@media (max-width:860px){.au-one{padding-top:132px;place-items:start center}}
.au-one .au-card{width:min(480px,100%)}
.who{display:flex;align-items:center;gap:14px}
.who .ava{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none;background:rgba(255,255,255,.1);display:grid;place-items:center;font:800 1.3rem/1 var(--font-display)}
.who b{display:block;font:700 1.15rem/1.2 var(--font-display)}
.who span{color:var(--fg-3);font-size:.88rem}
.au-one h1{font:800 clamp(1.6rem,4vw,2rem)/1.1 var(--font-display);letter-spacing:-.03em;margin:0}
.au-one p{margin:0;color:var(--fg-2);line-height:1.5}
.au-one .agree{display:grid;gap:10px}
.au-one .agree label{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;line-height:1.4;cursor:pointer}
.au-one .agree input{margin-top:2px;accent-color:var(--accent)}
.au-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.au-acts form{margin:0}
.linkish{all:unset;cursor:pointer;color:var(--fg-3);font-size:.88rem;text-decoration:underline;text-underline-offset:2px}
.linkish:hover{color:var(--fg)}
.danger{border-top:1px solid rgba(255,255,255,.1);padding-top:18px;display:grid;gap:10px}
.danger h2{font:700 1rem/1.2 var(--font-ui);margin:0}
.btn-danger{all:unset;cursor:pointer;justify-self:start;padding:10px 16px;border-radius:12px;background:rgba(255,69,58,.16);color:#ff8a80;font:600 .9rem/1 var(--font-ui)}
.btn-danger:hover{background:rgba(255,69,58,.26)}
.soon{display:grid;gap:6px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.06);font-size:.9rem;color:var(--fg-2)}
.soon b{color:var(--fg)}
