/* Security profile: the wide, editorial third concept, adapted to real auth states. */
.profile-panel[data-profile-panel="security"] {
  min-height:calc(100% - 74px);
  grid-template-columns:minmax(0,1fr) minmax(235px,310px);
  grid-template-rows:auto auto;
  align-content:start;
  align-items:center;
  column-gap:30px;
  row-gap:clamp(46px,7vh,82px);
  padding-top:clamp(58px,8vh,100px);
  padding-bottom:60px;
}

.profile-panel[data-profile-panel="security"] .profile-section-title {
  grid-column:1;
  grid-row:1;
  display:block;
  min-width:0;
  margin:0;
  padding:0;
  border:0;
}
.auth-dialog.is-profile .profile-panel[data-profile-panel="security"] .profile-section-title h2 {
  color:#f6f4ee;
  font-size:clamp(58px,6.5vw,96px);
  font-weight:590;
  line-height:.98;
  letter-spacing:-.075em;
  overflow-wrap:anywhere;
}
.profile-security-period { color:#a69cff; }

.profile-panel[data-profile-panel="security"] .profile-auth-method {
  grid-column:2;
  grid-row:1;
  justify-self:end;
  width:min(100%,310px);
  min-height:76px;
  grid-template-columns:42px minmax(0,1fr) 8px;
  gap:13px;
  padding:13px 16px;
  border:1px solid rgba(166,156,255,.32);
  border-radius:13px;
  color:#f5f3ee;
  background:#1b1c24;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.profile-panel[data-profile-panel="security"] .profile-auth-method>span {
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:10px;
  color:#f6f4ee;
  background:#282931;
  box-shadow:none;
}
.profile-panel[data-profile-panel="security"] .profile-auth-method>span svg {
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.profile-panel[data-profile-panel="security"] .profile-auth-method b {
  color:#f5f3ee;
  font-size:13px;
  font-weight:750;
}
.profile-panel[data-profile-panel="security"] .profile-auth-method small {
  color:#a8a9b2;
  font-size:11px;
  line-height:1.35;
}
.profile-panel[data-profile-panel="security"] .profile-auth-method>i {
  width:8px;
  background:#d9ff57;
  box-shadow:0 0 0 5px rgba(217,255,87,.09);
}
.profile-panel[data-profile-panel="security"] .profile-auth-method[data-google-status="unlinked"] {
  border-color:rgba(166,156,255,.22);
}
.profile-panel[data-profile-panel="security"] .profile-auth-method[data-google-status="unlinked"]>i {
  background:#a69cff;
  box-shadow:0 0 0 5px rgba(166,156,255,.08);
}
.profile-panel[data-profile-panel="security"] .profile-auth-method button {
  grid-column:1/-1;
  min-height:35px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:1px;
  padding:10px 2px 0;
  border:0;
  border-top:1px solid rgba(255,255,255,.13);
  color:#d9ff57;
  background:transparent;
  font-size:11px;
  font-weight:760;
  text-align:left;
  cursor:pointer;
}
.profile-panel[data-profile-panel="security"] .profile-auth-method button svg {
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .25s cubic-bezier(.16,1,.3,1);
}
.profile-panel[data-profile-panel="security"] .profile-auth-method button:hover svg { transform:translateX(3px); }
.profile-panel[data-profile-panel="security"] .profile-auth-method button:focus-visible {
  outline:2px solid #d9ff57;
  outline-offset:3px;
}
.profile-panel[data-profile-panel="security"] .profile-auth-method button:disabled {
  color:#888991;
  cursor:not-allowed;
}
[data-profile-google-open][hidden],
[data-profile-google-connect][hidden] { display:none!important; }

.profile-panel[data-profile-panel="security"].is-google-connecting { row-gap:28px; }
.profile-panel[data-profile-panel="security"] .profile-google-connect {
  grid-column:1/-1;
  grid-row:2;
  width:100%;
  display:grid;
  gap:20px;
  padding:clamp(24px,3vw,34px);
  border:1px solid rgba(166,156,255,.38);
  border-radius:12px;
  color:#f6f4ee;
  background:#171820;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  animation:securityGoogleConnectIn .45s cubic-bezier(.16,1,.3,1) both;
}
@keyframes securityGoogleConnectIn {
  from { opacity:0; transform:translate3d(0,12px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}
.profile-google-connect-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.profile-google-connect-head h3 {
  margin:0;
  color:#f6f4ee;
  font-size:clamp(25px,2.6vw,34px);
  font-weight:630;
  letter-spacing:-.05em;
  line-height:1.1;
}
.profile-google-connect-head button {
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:8px;
  color:#a8a9b1;
  background:transparent;
  cursor:pointer;
  transition:color .2s ease,border-color .2s ease;
}
.profile-google-connect-head button:hover { color:#f6f4ee; border-color:rgba(255,255,255,.5); }
.profile-google-connect-head button:focus-visible { outline:2px solid #d9ff57; outline-offset:3px; }
.profile-google-connect-head button svg {
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
}
.profile-google-connect>p:not(.profile-google-connect-error) {
  max-width:72ch;
  margin:0;
  color:#b4b5bc;
  font-size:12px;
  line-height:1.55;
}
.profile-google-connect>p strong { color:#f6f4ee; font-weight:700; overflow-wrap:anywhere; }
.profile-google-connect-fields {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(250px,1fr);
  align-items:end;
  gap:18px;
}
.profile-google-connect .profile-field { min-width:0; gap:9px; }
.profile-google-connect .profile-field label,
.profile-google-provider>span {
  color:#edebe8;
  font-size:13px;
  font-weight:690;
  line-height:1.3;
}
.profile-google-connect .profile-password-wrap.auth-input-wrap {
  min-height:56px;
  grid-template-columns:minmax(0,1fr) 35px;
  gap:7px;
  padding:0 9px 0 15px;
  border:1px solid rgba(255,255,255,.23);
  border-radius:9px;
  color:#f6f4ee;
  background:#15161c;
  box-shadow:none;
}
.profile-google-connect .profile-password-wrap.auth-input-wrap:focus-within {
  border-color:#a69cff;
  box-shadow:0 0 0 3px rgba(166,156,255,.14);
}
.profile-google-connect .profile-password-wrap.auth-input-wrap:has(input[aria-invalid="true"]) {
  border-color:#f17c9e;
}
.profile-google-connect .profile-password-wrap input { color:#f6f4ee; font-size:14px; }
.profile-google-connect .auth-password-toggle { color:#a0a1ac; }
.profile-google-connect .auth-password-toggle:hover { color:#f6f4ee; background:rgba(255,255,255,.08); }
.profile-google-connect .auth-password-toggle:focus-visible { outline:2px solid #d9ff57; outline-offset:2px; }
.profile-google-provider { min-width:0; display:grid; gap:9px; }
[data-profile-google-button] {
  min-height:56px;
  display:grid;
  align-items:center;
  justify-items:start;
  overflow:hidden;
}
[data-profile-google-button] iframe,
[data-profile-google-button]>div { max-width:100%!important; cursor:pointer!important; }
[data-profile-google-button].is-loading { opacity:.55; pointer-events:none; }
.profile-google-retry { min-height:40px; padding:0 22px; border:1px solid rgba(166,156,255,.5); border-radius:8px; color:#e7e2ff; background:#272335; font-size:13px; cursor:pointer; }
.profile-google-retry:focus-visible { outline:2px solid #d9ff57; outline-offset:3px; }
.profile-google-connect-error {
  margin:0;
  padding:11px 13px;
  border-left:2px solid #f17c9e;
  color:#ffc3d0;
  background:rgba(241,124,158,.09);
  font-size:11px;
  line-height:1.45;
}
.profile-google-connect-error[hidden] { display:none!important; }
.profile-panel[data-profile-panel="security"].is-google-connecting .profile-password-form {
  grid-row:3;
}

.profile-panel[data-profile-panel="security"] .profile-password-form {
  grid-column:1/-1;
  grid-row:2;
  justify-self:stretch;
  width:100%;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px 16px;
  padding:clamp(27px,3vw,38px);
  border:1px solid rgba(255,255,255,.23);
  border-radius:12px;
  color:#f5f3ee;
  background:#1b1c23;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.profile-password-heading {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(240px,270px);
  align-items:start;
  gap:20px;
  margin-bottom:4px;
}
.profile-password-heading h3 {
  margin:0;
  color:#f6f4ee;
  font-size:clamp(27px,2.7vw,36px);
  font-weight:630;
  line-height:1.05;
  letter-spacing:-.05em;
}
.profile-password-heading p {
  margin:0;
  color:#b4b5bc;
  font-size:12px;
  line-height:1.55;
}
.profile-panel[data-profile-panel="security"] .profile-password-form .profile-field.auth-field {
  min-width:0;
  align-content:start;
  gap:9px;
}
.profile-panel[data-profile-panel="security"] .profile-password-form .profile-field label {
  color:#edebe8;
  font-size:13px;
  font-weight:690;
  line-height:1.3;
  letter-spacing:-.015em;
  cursor:text;
}
.profile-panel[data-profile-panel="security"] .profile-password-form .profile-password-wrap.auth-input-wrap {
  min-height:56px;
  grid-template-columns:minmax(0,1fr) 35px;
  gap:7px;
  padding:0 9px 0 15px;
  border:1px solid rgba(255,255,255,.23);
  border-radius:9px;
  color:#f6f4ee;
  background:#15161c;
  box-shadow:none;
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap.auth-input-wrap:hover {
  border-color:rgba(255,255,255,.38);
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap.auth-input-wrap:focus-within {
  border-color:#a69cff;
  background:#171820;
  box-shadow:0 0 0 3px rgba(166,156,255,.14);
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap.auth-input-wrap:has(input[aria-invalid="true"]) {
  border-color:#f17c9e;
  box-shadow:0 0 0 3px rgba(241,124,158,.1);
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap input {
  width:100%;
  min-width:0;
  color:#f6f4ee;
  font-size:14px;
  letter-spacing:normal;
  background:transparent;
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap input::placeholder { color:#898a95; }
.profile-panel[data-profile-panel="security"] .profile-password-wrap input:-webkit-autofill {
  -webkit-text-fill-color:#f6f4ee;
  box-shadow:inset 0 0 0 100px #15161c;
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap .auth-password-toggle {
  width:35px;
  height:35px;
  color:#a0a1ac;
  border-radius:7px;
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap .auth-password-toggle:hover {
  color:#f6f4ee;
  background:rgba(255,255,255,.08);
}
.profile-panel[data-profile-panel="security"] .profile-password-wrap .auth-password-toggle:focus-visible {
  outline:2px solid #d9ff57;
  outline-offset:2px;
}
.profile-panel[data-profile-panel="security"] .profile-field small {
  min-height:15px;
  color:#ffa2b8;
  font-size:11px;
  line-height:1.35;
}
.profile-panel[data-profile-panel="security"] .profile-field small:empty {
  display:none;
}
.profile-panel[data-profile-panel="security"] .profile-password-submit {
  grid-column:3;
  grid-row:3;
  align-self:end;
  width:100%;
  min-width:0;
  min-height:58px;
  margin:0;
  padding:0 19px;
  border:1px solid #d9ff57;
  border-radius:9px;
  color:#15161b;
  background:#d9ff57;
  box-shadow:none;
  font-size:13px;
  font-weight:810;
  cursor:pointer;
  transition:background .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.profile-panel[data-profile-panel="security"] .profile-password-submit b {
  width:26px;
  height:26px;
  flex-basis:26px;
  color:inherit;
  background:transparent;
  box-shadow:none;
  transition:transform .25s cubic-bezier(.16,1,.3,1);
}
.profile-panel[data-profile-panel="security"] .profile-password-submit:hover {
  color:#15161b;
  border-color:#e8ff91;
  background:#e8ff91;
  box-shadow:0 0 0 3px rgba(217,255,87,.1);
  transform:none;
}
.profile-panel[data-profile-panel="security"] .profile-password-submit:hover b {
  background:transparent;
  transform:translateX(3px);
}
.profile-panel[data-profile-panel="security"] .profile-password-submit:focus-visible {
  outline:2px solid #a69cff;
  outline-offset:3px;
}
.profile-panel[data-profile-panel="security"] .profile-password-submit:disabled {
  opacity:.55;
  cursor:wait;
}

.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-form {
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-step-up {
  grid-column:1/-1;
  grid-row:2;
  border-color:rgba(166,156,255,.35);
  color:#f5f3ee;
  background:linear-gradient(120deg,rgba(166,156,255,.1),rgba(217,255,87,.025));
}
.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-step-up p { color:#b4b5bc; }
.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-step-up[data-confirmed="true"] { border-color:rgba(217,255,87,.42); }
.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-step-up[data-confirmed="true"] small { color:#d9ff57; }
.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-field:has(input[name="new_password"]) { grid-column:1; grid-row:3; }
.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-field:has(input[name="new_password_confirmation"]) { grid-column:2; grid-row:3; }
.profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-submit {
  grid-column:2;
  grid-row:4;
}

@media (max-width:1050px) {
  .profile-panel[data-profile-panel="security"] {
    grid-template-columns:minmax(0,1fr) minmax(215px,275px);
    column-gap:18px;
    row-gap:48px;
  }
  .auth-dialog.is-profile .profile-panel[data-profile-panel="security"] .profile-section-title h2 {
    font-size:clamp(48px,6vw,72px);
  }
  .profile-panel[data-profile-panel="security"] .profile-password-form {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .profile-panel[data-profile-panel="security"] .profile-password-submit {
    grid-column:2;
    grid-row:auto;
  }
}

@media (max-width:880px) and (min-width:761px) {
  .profile-panel[data-profile-panel="security"] {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto;
    row-gap:22px;
    padding-top:42px;
  }
  .profile-panel[data-profile-panel="security"] .profile-section-title {
    grid-column:1;
  }
  .profile-panel[data-profile-panel="security"] .profile-auth-method {
    grid-column:1;
    grid-row:2;
    justify-self:start;
  }
  .profile-panel[data-profile-panel="security"] .profile-password-form {
    grid-column:1;
    grid-row:3;
  }
  .profile-panel[data-profile-panel="security"] .profile-google-connect { grid-row:3; }
  .profile-panel[data-profile-panel="security"].is-google-connecting .profile-password-form { grid-row:4; }
  .profile-google-connect-fields { grid-template-columns:minmax(0,1fr); }
}

@media (max-width:760px) {
  .profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-step-up { grid-column:1; grid-row:auto; }
  .profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-field:has(input[name="new_password"]),
  .profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-field:has(input[name="new_password_confirmation"]) { grid-column:1; grid-row:auto; }
  .profile-panel[data-profile-panel="security"] {
    min-height:0;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto;
    row-gap:22px;
    padding:36px 0 40px;
  }
  .profile-panel[data-profile-panel="security"] .profile-section-title {
    grid-column:1;
  }
  .auth-dialog.is-profile .profile-panel[data-profile-panel="security"] .profile-section-title h2 {
    font-size:clamp(42px,10vw,68px);
  }
  .profile-panel[data-profile-panel="security"] .profile-auth-method {
    grid-column:1;
    grid-row:2;
    justify-self:start;
    width:min(100%,300px);
  }
  .profile-panel[data-profile-panel="security"] .profile-google-connect {
    grid-column:1;
    grid-row:3;
    padding:23px 19px;
  }
  .profile-google-connect-fields { grid-template-columns:minmax(0,1fr); gap:18px; }
  .profile-panel[data-profile-panel="security"] .profile-password-form,
  .profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-form {
    grid-column:1;
    grid-row:3;
    grid-template-columns:minmax(0,1fr);
    gap:14px;
    padding:24px 20px;
  }
  .profile-panel[data-profile-panel="security"].is-google-connecting .profile-password-form {
    grid-row:4;
  }
  .profile-password-heading {
    grid-template-columns:minmax(0,1fr);
    gap:9px;
    margin-bottom:5px;
  }
  .profile-password-heading h3 { font-size:29px; }
  .profile-panel[data-profile-panel="security"] .profile-password-submit,
  .profile-panel[data-profile-panel="security"][data-password-method="none"] .profile-password-submit {
    grid-column:1;
    grid-row:auto;
  }
}

@media (prefers-reduced-motion:reduce) {
  .profile-panel[data-profile-panel="security"] .profile-google-connect { animation:none; }
  .profile-panel[data-profile-panel="security"] .profile-password-submit,
  .profile-panel[data-profile-panel="security"] .profile-password-submit b,
  .profile-panel[data-profile-panel="security"] .profile-password-wrap.auth-input-wrap {
    transition:none;
  }
}