body > main{padding-top:0}
.profile-shell{
  width:min(980px, calc(100% - 24px));
  max-width:100%;
  min-width:0;
  margin:1rem auto 0;
  display:grid;
  gap:1rem;
}
.profile-panel{
  width:100%;
  max-width:100%;
  min-width:0;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:8px;
  padding:1rem;
  box-shadow:0 2px 10px rgba(15,23,42,.06);
}
.profile-panel h1,
.profile-panel h2{
  margin:.1rem 0 .65rem;
  font-size:28px;
  line-height:1.15;
}
.profile-muted{color:var(--muted);line-height:1.5}
.profile-header{
  display:flex;
  gap:1rem;
  align-items:flex-start;
  flex-wrap:wrap;
  padding:clamp(1rem,2.4vw,1.35rem);
  box-sizing:border-box;
}
.profile-identity{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:1.1rem;
}
.profile-avatar{
  width:112px;
  height:112px;
  flex:0 0 112px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:3px solid var(--card);
  border-radius:50%;
  background:linear-gradient(145deg,#0e7490,#2563eb);
  color:#fff;
  box-shadow:0 0 0 1px var(--border),0 8px 22px rgba(15,23,42,.16);
  font-size:2rem;
  font-weight:900;
  letter-spacing:.04em;
}
.profile-avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.profile-avatar [hidden]{display:none}
.profile-identity__copy{min-width:0}
.profile-identity__title{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:.8rem;
  flex-wrap:wrap;
}
.profile-eyebrow{
  margin:0 0 .2rem;
  color:var(--brand);
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.profile-identity__title h1{margin:0}
.profile-identity__copy > .profile-muted{margin:.3rem 0}
.profile-bio{
  width:100%;
  max-width:66ch;
  min-width:0;
  margin:.65rem 0;
  line-height:1.55;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.profile-identity__actions{
  display:flex;
  gap:.55rem;
  flex-wrap:wrap;
  margin-top:.85rem;
}
.profile-identity__actions .button,
.profile-identity__actions .button-outline{
  min-height:38px;
  padding:.55rem .9rem;
  box-sizing:border-box;
}
.profile-primary-cta{font-weight:800}
.profile-avatar-editor{
  display:flex;
  align-items:center;
  gap:1rem;
  margin:1rem 0 1.2rem;
  padding:.85rem;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(148,163,184,.08);
  min-width:0;
  max-width:100%;
  overflow:hidden;
}
.profile-avatar-editor > div:last-child{
  flex:1 1 auto;
  min-width:0;
}
.profile-avatar--editor{
  width:88px;
  height:88px;
  flex-basis:88px;
  font-size:1.5rem;
}
.profile-avatar-editor p{
  margin:.25rem 0 0;
  overflow-wrap:anywhere;
}
.profile-badge{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(34,197,94,.35);
  border-radius:999px;
  padding:.32rem .55rem;
  color:#166534;
  background:rgba(34,197,94,.1);
  font-size:.85rem;
  font-weight:700;
}
[data-theme="dark"] .profile-badge{color:#bbf7d0;background:rgba(34,197,94,.16)}
.profile-form{
  width:100%;
  max-width:100%;
  min-width:0;
}
.profile-form p{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:.35rem;
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  margin:.75rem 0;
}
.profile-form input,
.profile-form select,
.profile-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--border);
  border-radius:8px;
  padding:.68rem .75rem;
  background:var(--bg);
  color:var(--fg);
  font:inherit;
  min-width:0;
  max-width:100%;
}
.profile-form input[type="file"]{overflow:hidden}
.profile-form a{min-width:0;overflow-wrap:anywhere}
.profile-form .errorlist{color:#b91c1c;margin:.2rem 0;padding-left:1.1rem}
.profile-actions{
  display:flex;
  gap:.65rem;
  flex-wrap:wrap;
  align-items:center;
  margin-top:.85rem;
}
.profile-actions .button,
.profile-actions .button-outline{
  min-height:36px;
  padding:.52rem .95rem;
  font-size:.94rem;
}
.profile-secondary-link{
  color:var(--muted);
  font-weight:700;
  text-decoration:none;
}
.profile-secondary-link:hover{
  color:var(--brand);
  text-decoration:underline;
}
.profile-menu{
  display:grid;
  gap:0;
  margin-top:.9rem;
  border:1px solid var(--border);
  border-radius:8px;
  overflow:hidden;
  background:var(--card);
}
.profile-menu__item{
  width:100%;
  min-height:48px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) 20px;
  align-items:center;
  gap:.65rem;
  padding:.7rem .78rem;
  border:0;
  border-bottom:1px solid var(--border);
  background:transparent;
  color:var(--fg);
  font:inherit;
  font-weight:700;
  text-align:left;
  text-decoration:none;
  box-sizing:border-box;
  cursor:pointer;
}
.profile-menu__item:hover,
.profile-menu__item:focus-visible{
  background:rgba(59,130,246,.08);
  outline:none;
}
.profile-menu__form:last-child .profile-menu__item,
.profile-menu__item:last-child{
  border-bottom:0;
}
.profile-menu__icon{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(37,99,235,.12);
  color:var(--brand);
  font-size:1rem;
  line-height:1;
}
.profile-menu__icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.profile-menu__label{
  min-width:0;
  overflow-wrap:anywhere;
}
.profile-menu__chevron{
  color:var(--muted);
  font-size:1.45rem;
  line-height:1;
  text-align:right;
}
.profile-menu__form{
  display:block;
  margin:0;
}
.profile-menu__button{
  appearance:none;
}
.profile-menu__item--danger .profile-menu__label{
  color:#dc2626;
}
.profile-menu__item--danger:hover .profile-menu__label,
.profile-menu__item--danger:focus-visible .profile-menu__label{
  color:#b91c1c;
}
[data-theme="dark"] .profile-menu__icon{
  background:rgba(96,165,250,.16);
  color:#93c5fd;
}
[data-theme="dark"] .profile-menu__item--danger .profile-menu__label{
  color:#f87171;
}
[data-theme="dark"] .profile-menu__item--danger:hover .profile-menu__label,
[data-theme="dark"] .profile-menu__item--danger:focus-visible .profile-menu__label{
  color:#fca5a5;
}
.profile-logout-form:not(.profile-menu__form){
  display:inline-flex;
  margin:0;
}
.profile-logout-form button{
  font:inherit;
}
.profile-stats{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:.65rem;
  margin:1rem 0;
}
.profile-stats div{
  border:1px solid var(--border);
  border-radius:8px;
  padding:.75rem;
  background:rgba(148,163,184,.08);
}
.profile-stats strong{display:block;font-size:1.35rem}
.profile-stats span{display:block;color:var(--muted);font-size:.9rem}
.profile-meta,
.profile-tools{display:flex;gap:.55rem;flex-wrap:wrap}
.profile-tools span,
.profile-meta a{
  border:1px solid var(--border);
  border-radius:999px;
  padding:.35rem .55rem;
  color:inherit;
  text-decoration:none;
}
.profile-report-list{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:1.5rem;
  margin-top:.75rem;
}
.profile-report-card{
  display:grid;
  gap:.75rem;
  border:0;
  border-radius:24px;
  padding:12px;
  background:var(--silk-surface);
  box-shadow:var(--silk-inset);
  overflow:hidden;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.profile-report-card:hover{
  transform:none;
  border-color:transparent;
  box-shadow:var(--silk-inset);
}
[data-theme="dark"] .profile-report-card{
  background:var(--silk-surface);
  border-color:transparent;
}
.profile-report-card__row{
  display:flex;
  align-items:center;
  gap:.5rem;
  min-width:0;
}
.profile-report-card__media{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:4/5;
  margin:0 0 .15rem;
  overflow:hidden;
  border-radius:18px;
  background:var(--silk-background);
  box-shadow:var(--silk-inset);
  color:inherit;
  text-decoration:none;
}
.profile-report-card__media img,
.profile-report-card__media video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.profile-report-card__media-empty{
  width:100%;
  height:100%;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:.35rem;
  color:#1e3a5f;
}
.profile-report-card__media-empty > span{font-size:2rem}
.profile-report-card__media-empty strong{font-size:.82rem}
.profile-report-card__media-label{
  position:absolute;
  right:.55rem;
  bottom:.55rem;
  padding:.25rem .48rem;
  border-radius:999px;
  background:rgba(15,23,42,.82);
  color:#fff;
  font-size:.72rem;
  font-weight:800;
}
.profile-report-card__head h3 a{
  color:inherit;
  text-decoration:none;
}
.profile-report-card__head h3 a:hover{text-decoration:underline}
.profile-report-card__head{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
}
.profile-report-card__head h3{
  margin:0;
  font-size:1.05rem;
  line-height:1.2;
}
.profile-report-card__meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.45rem;
  margin:0;
}
.profile-report-card__meta > div{
  min-width:0;
  min-height:88px;
  display:grid;
  align-content:start;
  padding:.75rem;
  border:0;
  border-radius:14px;
  background:var(--silk-surface);
  box-shadow:var(--silk-inset);
}
.profile-report-card__meta dt{
  display:flex;
  align-items:center;
  gap:.25rem;
  margin:0 0 .2rem;
  color:var(--muted);
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.045em;
  line-height:1.1;
  text-transform:uppercase;
}
.profile-report-card__meta dd{
  margin:0;
  font-size:.8rem;
  font-weight:650;
  line-height:1.3;
  overflow-wrap:anywhere;
}
.profile-report-card__meta time span,
.profile-report-card__meta-sub{
  display:block;
  margin-top:.08rem;
  color:var(--muted);
  font-size:.72rem;
  font-weight:600;
}
.profile-report-card__policy{
  width:100%;
}
.profile-report-card__policy .policy-badge{
  width:100%;
  box-sizing:border-box;
  justify-content:center;
  align-items:center;
  padding:.42rem .55rem;
  min-height:0;
}
.profile-report-card__policy .policy-text{
  align-items:center;
}
.profile-report-card__policy .policy-label{
  font-size:.82rem;
  text-align:center;
}
.profile-report-card__actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.65rem;
  margin-top:auto;
  padding-top:.1rem;
}
.profile-report-card__actions .nearby-action{
  min-height:44px;
  box-sizing:border-box;
  justify-content:center;
  padding:.45rem .7rem;
  border-radius:14px;
  font-weight:700;
  text-align:center;
}
.profile-empty-state{
  display:grid;
  justify-items:center;
  gap:.65rem;
  padding:1.4rem;
  margin-top:.75rem;
  border:1px dashed var(--border);
  border-radius:12px;
  text-align:center;
  background:rgba(148,163,184,.06);
}
.profile-empty-state > span{font-size:2rem}
.profile-empty-state p{margin:0}
.profile-pagination{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:.75rem;
  margin-top:1rem;
  color:var(--muted);
  font-size:.9rem;
  text-align:center;
}
.profile-pagination a:first-child{justify-self:start}
.profile-pagination a:last-child{justify-self:end}
[data-theme="dark"] .profile-report-card__media{
  background:var(--silk-background);
}
[data-theme="dark"] .profile-report-card__media-empty{color:#bfdbfe}

@media (max-width: 640px){
  .profile-shell{width:calc(100% - 16px)}
  .profile-panel{padding:.85rem}
  .profile-avatar-editor{gap:.75rem;padding:.75rem}
  .profile-identity{grid-template-columns:1fr}
  .profile-avatar{width:88px;height:88px;flex-basis:88px;font-size:1.55rem}
  .profile-avatar--editor{width:72px;height:72px;flex-basis:72px}
  .profile-header{padding:1rem}
  .profile-identity__actions .button,
  .profile-identity__actions .button-outline{flex:1 1 100%;text-align:center}
  .profile-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-report-list{grid-template-columns:1fr}
  .profile-pagination{grid-template-columns:1fr 1fr}
  .profile-pagination > span:nth-child(2){grid-column:1/-1;grid-row:1}
}

@media (max-width: 360px){
  .profile-report-card__meta{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  .profile-report-card{transition:none}
}

/* Login */
.login-shell{
  width:min(680px, calc(100% - 24px));
  margin-bottom:2.5rem;
}
.login-card{
  --login-surface:rgba(255,255,255,.94);
  --login-field:#f8fafc;
  --login-field-border:#cbd5e1;
  --login-soft:rgba(37,99,235,.055);
  --login-icon:#64748b;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(1.4rem, 4vw, 3rem);
  border-color:rgba(37,99,235,.22);
  border-radius:20px;
  background:var(--login-surface);
  box-shadow:0 24px 60px rgba(15,23,42,.13);
}
.login-card::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 5%, rgba(59,130,246,.12), transparent 31%),
    radial-gradient(circle at 90% 42%, rgba(14,165,233,.07), transparent 34%);
}
[data-theme="dark"] .login-card{
  --login-surface:rgba(15,23,42,.94);
  --login-field:rgba(2,12,28,.62);
  --login-field-border:#334155;
  --login-soft:rgba(59,130,246,.08);
  --login-icon:#94a3b8;
  border-color:#263b59;
  box-shadow:0 28px 72px rgba(0,0,0,.34);
}
[data-theme="dark"] .login-card::before{
  background:
    radial-gradient(circle at 18% 4%, rgba(37,99,235,.19), transparent 34%),
    radial-gradient(circle at 92% 45%, rgba(14,165,233,.08), transparent 38%);
}
.login-card__header{
  display:grid;
  margin-bottom:2rem;
}
.login-card h1{
  margin:0 0 .7rem;
  font-size:clamp(2rem, 6vw, 2.55rem);
  letter-spacing:-.035em;
  line-height:1.08;
}
.login-card__intro{
  max-width:55ch;
  margin:0;
  font-size:1.04rem;
}
.login-form{
  display:grid;
  gap:1.25rem;
}
.login-field{
  display:grid;
  gap:.5rem;
}
.login-field > label{
  color:var(--fg);
  font-size:.98rem;
  font-weight:700;
}
.login-field__control{
  position:relative;
  display:flex;
  align-items:center;
  min-height:58px;
  border:1px solid var(--login-field-border);
  border-radius:14px;
  background:var(--login-field);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.login-field__control:focus-within{
  border-color:var(--brand);
  box-shadow:0 0 0 4px rgba(37,99,235,.14);
}
.login-field__icon{
  position:absolute;
  left:1rem;
  width:22px;
  height:22px;
  fill:none;
  stroke:var(--login-icon);
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}
.profile-form .login-field__control input{
  height:56px;
  margin:0;
  padding:.8rem 3.2rem .8rem 3.2rem;
  border:0;
  border-radius:14px;
  outline:0;
  background:transparent;
  color:var(--fg);
  font-size:1rem;
}
.profile-form .login-field__control input::placeholder{
  color:var(--muted);
  opacity:.78;
}
.login-field--invalid .login-field__control{
  border-color:#dc2626;
}
.login-field--invalid .login-field__control:focus-within{
  box-shadow:0 0 0 4px rgba(220,38,38,.12);
}
.login-field__errors{
  color:#b91c1c;
  font-size:.88rem;
}
[data-theme="dark"] .login-field__errors{color:#fca5a5}
.login-field__errors .errorlist,
.login-form__alert .errorlist{
  margin:0;
  padding:0;
  list-style:none;
}
.login-password-toggle{
  position:absolute;
  right:.65rem;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--fg);
  cursor:pointer;
}
.login-password-toggle:hover{background:rgba(59,130,246,.1)}
.login-password-toggle:focus-visible{
  outline:2px solid var(--brand);
  outline-offset:1px;
}
.login-password-toggle__icon,
.login-password-toggle__icon svg{
  width:24px;
  height:24px;
  display:block;
}
.login-password-toggle__icon[hidden]{display:none}
.login-password-toggle__icon svg{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.login-form__alert{
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  gap:.7rem;
  align-items:start;
  padding:.85rem 1rem;
  border:1px solid rgba(220,38,38,.35);
  border-radius:12px;
  background:rgba(220,38,38,.08);
  color:#991b1b;
  font-size:.92rem;
}
[data-theme="dark"] .login-form__alert{color:#fecaca;background:rgba(220,38,38,.12)}
.login-form__alert svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.login-form__help{
  display:flex;
  justify-content:flex-end;
  margin-top:-.25rem;
}
.login-form__help a{
  color:var(--brand);
  font-size:.94rem;
  font-weight:700;
  text-decoration:none;
}
.login-form__help a:hover{text-decoration:underline;text-underline-offset:3px}
.login-form__help a:focus-visible,
.login-signup__button:focus-visible{
  outline:2px solid var(--brand);
  outline-offset:3px;
}
.profile-form .login-form__submit{
  width:100%;
  min-height:56px;
  margin-top:.15rem;
  border:0;
  border-radius:14px;
  background:linear-gradient(135deg,#2563eb,#3b82f6 55%,#2388f4);
  box-shadow:0 12px 26px rgba(37,99,235,.25);
  color:#fff;
  font-size:1.06rem;
  font-weight:800;
  cursor:pointer;
}
.profile-form .login-form__submit:hover{
  filter:brightness(1.06);
  box-shadow:0 14px 30px rgba(37,99,235,.32);
}
.profile-form .login-form__submit:focus-visible{
  outline:3px solid rgba(59,130,246,.35);
  outline-offset:3px;
}
.login-signup{
  display:grid;
  justify-items:center;
  gap:1rem;
  margin-top:2rem;
  padding:1.45rem;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--login-soft);
  text-align:center;
}
.login-signup p{margin:0;font-size:1.02rem}
.login-signup__button{
  width:min(100%, 390px);
  min-height:50px;
  border-color:var(--brand);
  border-radius:12px;
  color:var(--brand);
  font-weight:800;
}
.login-signup__button:hover{
  border-color:var(--brand);
  background:rgba(37,99,235,.1);
  color:var(--brand);
}
.login-public-note{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.65rem;
  margin:1.6rem 0 0;
  color:var(--muted);
  font-size:.92rem;
  text-align:center;
}
.login-public-note svg{
  width:22px;
  height:22px;
  flex:0 0 22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.login-story{display:none}

@media (min-width:1024px){
  body:has(.login-shell) main,
  body:has(.signup-shell) main{
    width:100%;
    max-width:1400px;
    min-height:calc(100dvh - 82px);
    padding:0 1.5rem;
  }
  .login-shell{
    width:min(1060px, calc(100% - 48px));
    margin:1rem auto 0;
  }
  .signup-shell{
    width:min(1100px, calc(100% - 48px));
    margin:1rem auto 0;
  }
  .login-card{
    display:grid;
    grid-template-columns:minmax(0, .48fr) minmax(0, .52fr);
    padding:0;
    border-radius:20px;
  }
  .login-card::before{display:none}
  .login-card__main{
    min-width:0;
    padding:2.25rem;
  }
  .login-card__main > *{
    width:100%;
    max-width:430px;
    margin-inline:auto;
  }
  .login-story{
    position:relative;
    isolation:isolate;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    min-width:0;
    min-height:0;
    padding:2.25rem;
    overflow:hidden;
    border-right:1px solid rgba(141,223,255,.12);
    color:#f8fafc;
    background:
      radial-gradient(circle at 76% 20%, rgba(18,78,124,.95) 0%, rgba(17,59,91,.72) 24%, rgba(16,27,36,0) 62%),
      #101b24;
  }
  .login-story::before{
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    pointer-events:none;
    background:
      radial-gradient(circle at 10% 88%, rgba(37,99,235,.2), transparent 42%),
      linear-gradient(145deg, rgba(2,12,27,.08), rgba(2,12,27,.48));
  }
  .login-story__content{
    width:100%;
    max-width:400px;
    margin-inline:auto;
    display:grid;
    justify-items:start;
  }
  .login-story h2{
    max-width:15ch;
    margin:0;
    color:#f8fafc;
    font-size:1.75rem;
    line-height:1.14;
    letter-spacing:-.035em;
  }
  .login-story h2 strong{
    color:#8ebdf9;
    font-weight:inherit;
  }
  .login-story__lead{
    max-width:38ch;
    margin:1.25rem 0 0;
    padding-top:1rem;
    position:relative;
    color:#b8c8dc;
    font-size:.9rem;
    line-height:1.5;
  }
  .login-story__lead::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:36px;
    height:2px;
    border-radius:999px;
    background:#3b82f6;
  }
  .login-story__lead strong{color:#60a5fa}
  .login-story__benefits{
    display:grid;
    gap:.7rem;
    margin:1.25rem 0 0;
    padding:0;
    list-style:none;
  }
  .login-story__benefits li{
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    gap:.75rem;
    align-items:center;
    padding:.45rem 0;
  }
  .login-story__benefit-icon{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border:1px solid transparent;
    border-radius:50%;
    color:#fff;
    background:linear-gradient(135deg,#2563eb,#3b82f6 55%,#2388f4);
    box-shadow:0 8px 18px rgba(37,99,235,.22);
  }
  .login-story__benefit-icon svg{
    width:21px;
    height:21px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .login-story__benefits b,
  .login-story__benefits small{
    display:block;
  }
  .login-story__benefits b{
    margin-bottom:.15rem;
    color:#f8fafc;
    font-size:.88rem;
  }
  .login-story__benefits small{
    color:#aebfd3;
    font-size:.8rem;
    line-height:1.38;
  }
  .login-card__main .login-card__header{margin-bottom:1.5rem}
  .login-card__main .login-card__header h1{font-size:1.7rem}
  .login-card__main .login-card__intro{font-size:.9rem;line-height:1.5}
  .login-card__main .login-form{gap:1rem}
  .login-card__main .login-field{gap:.45rem}
  .login-card__main .login-field > label{font-size:.9rem}
  .login-card__main .login-field__control{min-height:48px}
  .login-card__main .login-field__control input{height:46px;font-size:.94rem}
  .login-card__main .login-form__help a{font-size:.88rem}
  .login-card__main .login-form__submit{min-height:48px;font-size:1rem}
  .login-card__main .login-signup{gap:.8rem;margin-top:1.6rem;padding:1.1rem}
  .login-card__main .login-signup p{font-size:.94rem}
  .login-card__main .login-signup__button{min-height:46px;font-size:.94rem}
  .login-card__main .login-public-note{margin-top:1.25rem;font-size:.82rem}
}

@media (min-width:1024px) and (max-height:800px){
  body:has(.login-shell) main,
  body:has(.signup-shell) main{padding-top:0;padding-bottom:0}
  .login-card__main,
  .login-story{padding-block:1.5rem}
  .login-card__main .login-card__header{margin-bottom:.9rem}
  .login-card__main .login-card__header h1{font-size:1.65rem}
  .login-card__main .login-card__intro{font-size:.86rem;line-height:1.4}
  .login-form{gap:.8rem}
  .login-field{gap:.35rem}
  .login-field__control{min-height:48px}
  .profile-form .login-field__control input{height:46px}
  .profile-form .login-form__submit{min-height:48px}
  .login-signup{gap:.7rem;margin-top:1.1rem;padding:.85rem}
  .login-signup__button{min-height:44px}
  .login-public-note{margin-top:.75rem;font-size:.84rem}
  .login-story h2{font-size:1.65rem;line-height:1.12}
  .login-story__lead{margin-top:.8rem;padding-top:.75rem;font-size:.86rem}
  .login-story__benefits{gap:.35rem;margin-top:.8rem}
  .login-story__benefits li{padding-block:.45rem}
}

/* Profile registration */
.signup-card__main{min-width:0}
.signup-card__header{margin-bottom:1.5rem}
.signup-card__header h1{
  margin:0 0 .55rem;
  font-size:clamp(1.8rem, 6vw, 2.2rem);
  line-height:1.1;
  letter-spacing:-.03em;
}
.signup-card__header p{margin:0;font-size:.94rem}
.signup-form{display:grid;gap:1.25rem}
.signup-form__section{
  min-width:0;
  margin:0;
  padding:1rem;
  border:1px solid var(--border);
  border-radius:14px;
  background:rgba(148,163,184,.045);
}
.signup-form__section h2{
  margin:0 0 .35rem;
  padding:0;
  color:var(--fg);
  font-size:1rem;
  font-weight:800;
  line-height:1.25;
}
.signup-form__section-copy{
  margin:0 0 .9rem;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.4;
}
.signup-form__grid{display:grid;grid-template-columns:1fr;gap:.85rem}
.signup-field{display:grid;gap:.38rem;min-width:0}
.signup-field label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  color:var(--fg);
  font-size:.86rem;
  font-weight:750;
}
.signup-field label span{
  color:var(--muted);
  font-size:.7rem;
  font-weight:650;
  letter-spacing:.02em;
}
.profile-form .signup-field input,
.profile-form .signup-field select,
.profile-form .signup-field textarea{
  width:100%;
  min-height:46px;
  margin:0;
  padding:.65rem .75rem;
  border:1px solid var(--login-field-border, var(--border));
  border-radius:10px;
  background:var(--login-field, var(--bg));
  color:var(--fg);
  font-size:.9rem;
  outline:0;
}
.profile-form .signup-field textarea{min-height:82px;resize:vertical}
.profile-form .signup-field input:focus,
.profile-form .signup-field select:focus,
.profile-form .signup-field textarea:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.signup-field--invalid input,
.signup-field--invalid select,
.signup-field--invalid textarea{border-color:#dc2626 !important}
.signup-field__errors{
  color:#b91c1c;
  font-size:.78rem;
  line-height:1.35;
}
[data-theme="dark"] .signup-field__errors{color:#fca5a5}
.signup-field__errors:empty{display:none}
.signup-field__errors .errorlist{margin:0;padding:0;list-style:none}
.signup-password-control{position:relative;min-width:0}
.profile-form .signup-password-control input{padding-right:2.8rem}
.signup-password-control button{
  position:absolute;
  top:50%;
  right:.35rem;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:9px;
  transform:translateY(-50%);
  background:transparent;
  color:var(--muted);
  cursor:pointer;
}
.signup-password-control button:hover{background:rgba(59,130,246,.1);color:var(--fg)}
.signup-password-control button:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.signup-password-control svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.profile-form .signup-form__submit{
  width:100%;
  min-height:50px;
  border:0;
  border-radius:12px;
  background:linear-gradient(135deg,#2563eb,#3b82f6 55%,#2388f4);
  color:#fff;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(37,99,235,.22);
}
.profile-form .signup-form__submit:hover{filter:brightness(1.06)}
.signup-form__login{margin:-.35rem 0 0;text-align:center;font-size:.88rem}
.signup-form__login a{color:var(--brand);font-weight:800;text-decoration:none}
.signup-form__login a:hover{text-decoration:underline;text-underline-offset:3px}
.signup-form__skip{justify-self:center;font-size:.82rem}
.signup-story__closing{
  margin:1rem 0 0;
  padding-top:1rem;
  border-top:1px solid rgba(141,223,255,.18);
  color:#b8c8dc;
  font-size:.8rem;
  line-height:1.45;
}

@media (min-width:1024px){
  .signup-card{grid-template-columns:minmax(0, .4fr) minmax(0, .6fr)}
  .signup-card__main{padding:2.25rem}
  .signup-card__main > *{width:100%;max-width:540px;margin-inline:auto}
  .signup-card__header h1{font-size:1.8rem}
  .signup-story .login-story__content{max-width:350px}
  .signup-story .login-story__lead{font-size:.84rem}
  .signup-story .login-story__benefits{gap:.35rem;margin-top:1rem}
  .signup-story .login-story__benefits li{grid-template-columns:36px minmax(0,1fr);gap:.65rem;padding:.35rem 0}
  .signup-story .login-story__benefit-icon{width:36px;height:36px}
  .signup-story .login-story__benefit-icon svg{width:19px;height:19px}
  .signup-story .login-story__benefits b{font-size:.84rem}
  .signup-story .login-story__benefits small{font-size:.75rem}
  .signup-form__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .signup-field--wide{grid-column:1/-1}
}

@media (min-width:1024px) and (max-height:800px){
  .signup-card__main{padding-block:1.5rem}
  .signup-card__header{margin-bottom:1rem}
  .signup-form{gap:.9rem}
  .signup-form__section{padding:.8rem}
  .signup-form__section-copy{margin-bottom:.65rem}
  .signup-form__grid{gap:.65rem .8rem}
  .signup-story__closing{margin-top:.7rem;padding-top:.7rem}
  .profile-form .signup-field input,
  .profile-form .signup-field select{min-height:42px}
  .profile-form .signup-field textarea{min-height:68px}
}

@media (max-width:640px){
  .login-shell{width:calc(100% - 16px);margin-bottom:1.5rem}
  .login-card{padding:1.25rem;border-radius:16px}
  .login-card__header{margin-bottom:1.5rem}
  .login-card h1{font-size:clamp(1.85rem, 9vw, 2.25rem)}
  .login-card__intro{font-size:.96rem}
  .login-form{gap:1.05rem}
  .login-field__control{min-height:54px}
  .profile-form .login-field__control input{height:52px}
  .profile-form .login-form__submit{min-height:52px}
  .login-signup{margin-top:1.5rem;padding:1.2rem 1rem}
  .login-public-note{align-items:flex-start;text-align:left}
  .signup-card__header{margin-bottom:1.2rem}
  .signup-card__header h1{font-size:1.85rem}
  .signup-form{gap:1rem}
  .signup-form__section{padding:.85rem}
}

@media (max-width:360px){
  .login-card{padding:1rem}
  .profile-form .login-field__control input{padding-left:2.8rem;padding-right:2.8rem}
  .login-field__icon{left:.85rem}
  .login-password-toggle{right:.35rem}
}
