.crumb{max-width:var(--wrap);margin:0 auto;padding:var(--s-4) var(--s-5) 0}
.crumb ol{display:flex;flex-wrap:wrap;gap:6px;font-size:var(--t-xs);color:var(--ink-faint);list-style:none;margin:0;padding:0}
.crumb li:not(:last-child)::after{content:'/';margin-left:6px;color:var(--line)}
.crumb li[aria-current]{color:var(--fg);font-weight:600}

.auth{max-width:520px;margin:0 auto;padding:var(--s-6) var(--s-5) var(--s-8)}
.auth__box{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-6);background:var(--paper)}

.auth__tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:var(--s-5)}
.auth__tab{flex:1;padding:12px 4px;font-family:var(--f-head);font-size:var(--t-sm);font-weight:700;letter-spacing:.03em;color:var(--ink-faint);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color var(--d-fast) linear,border-color var(--d-fast) linear}
.auth__tab.is-on{color:var(--fg);border-color:var(--red)}

.auth__form{display:flex;flex-direction:column;gap:var(--s-4)}
.auth__form[hidden]{display:none}

.fld label{display:block;font-size:var(--t-xs);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:6px}
.fld input{width:100%;height:46px;padding:0 .9rem;border:1.5px solid var(--line);border-radius:var(--r-sm);font-size:var(--t-base);background:var(--paper);color:var(--fg);transition:border-color var(--d-fast) linear}
.fld input:focus{outline:none;border-color:var(--ink)}
.fld input[aria-invalid="true"]{border-color:var(--red)}
.fld__hint{font-size:var(--t-xs);color:var(--ink-faint);margin-top:5px}
.fld__err{min-height:1.1rem;font-size:var(--t-xs);color:var(--red);margin-top:5px}
.fld--wide{grid-column:1/-1}

.fld__pass{position:relative}
.fld__pass input{padding-right:44px}
.fld__eye{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:34px;height:34px;display:grid;place-items:center;color:var(--ink-faint);transition:color var(--d-fast) linear}
.fld__eye:hover{color:var(--fg)}
.fld__eye svg{width:19px;height:19px}
.fld__eye.is-on{color:var(--red)}

.chk{display:flex;align-items:flex-start;gap:8px;font-size:var(--t-sm);color:var(--ink-soft);cursor:pointer}
.chk input{margin-top:3px;accent-color:var(--ink);width:16px;height:16px;flex:none}
.chk a{color:var(--red);text-decoration:underline}

.auth__row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.auth__link{font-size:var(--t-sm);font-weight:600;color:var(--red);text-decoration:underline;text-underline-offset:2px}
.auth__switch{text-align:center;font-size:var(--t-sm);color:var(--ink-soft)}

.btn--full{border-radius:var(--r-sm);height:48px}

.fpw[hidden]{display:none}
.fpw{position:fixed;inset:0;z-index:var(--z-srch)}
.fpw__scrim{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity var(--d-mid) linear}
.fpw.in .fpw__scrim{opacity:1}
.fpw__box{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%);opacity:0;width:min(420px,92vw);background:var(--paper);border-radius:var(--r-md);box-shadow:var(--sh-3);padding:var(--s-5);transition:opacity var(--d-mid) linear,transform var(--d-slow) var(--e-out)}
.fpw.in .fpw__box{opacity:1;transform:translate(-50%,-50%)}
.fpw__x{position:absolute;top:10px;right:10px}
.fpw h2{font-size:var(--t-lg);font-weight:800;margin-bottom:var(--s-2);padding-right:36px}
.fpw>p:first-of-type{font-size:var(--t-sm);color:var(--ink-faint);margin-bottom:var(--s-4)}
.fpw .fld{margin-bottom:var(--s-3)}
.fpw__sent{margin-top:var(--s-3);font-size:var(--t-sm);color:var(--ok);font-weight:600}

@media (max-width:1550px){ :root{--wrap:calc(100% - 64px)} }
@media (max-width:720px){
  .crumb{padding-inline:var(--s-3)}
  .auth{padding-inline:var(--s-3)}
  .auth__box{padding:var(--s-4)}
}
@media (max-width:420px){
  .auth__box{padding:var(--s-3);border-radius:var(--r-sm)}
  .auth__tab{font-size:12px}
}
@media (max-width:320px){
  .crumb,.auth{padding-inline:10px}
  .fpw__box{padding:var(--s-3)}
}