:root{
  --page: #fffaf8;
  --surface: #ffffff;
  --surface-soft: rgba(255,255,255,.86);
  --text: #201d2f;
  --muted: #656274;
  --border: rgba(32,29,47,.12);
  --shadow: 0 24px 70px rgba(77,64,118,.13);
  --shadow-soft: 0 12px 34px rgba(77,64,118,.09);
  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 15px;
  --accent: #7b2ff7;
  --accent-dark: #5a22c8;
  --pink: #f72f4e;
  --blue: #1e6ff2;
  --teal: #10b8b3;
  --orange: #ff8a16;
  --focus: 0 0 0 4px rgba(123,47,247,.18);
  --max: 1120px;
  color-scheme: light;
}

*{
  box-sizing: border-box;
}

html{
  min-height: 100%;
  -webkit-text-size-adjust: 100%;
}

body{
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color: var(--text);
  background: radial-gradient(circle at 8% -8%,rgba(247,47,78,.16),transparent 20rem),
    radial-gradient(circle at 98% -2%,rgba(30,111,242,.14),transparent 24rem),
    radial-gradient(circle at 0% 100%,rgba(16,184,179,.12),transparent 22rem),
    radial-gradient(circle at 100% 96%,rgba(255,138,22,.13),transparent 22rem),
    linear-gradient(180deg,#fff 0%,#fff8fb 48%,#f9fdff 100%);
  background-attachment: fixed;
}

body:before{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg,rgba(255,255,255,.4),rgba(255,255,255,0));
}

a{
  color: inherit;
}

button,
input,
select,
textarea{
  font: inherit;
}

img{
  max-width: 100%;
  height: auto;
}

.app-shell{
  width: min(var(--max),calc(100% - 32px));
  margin: 0 auto;
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 18px;
  padding: 18px 0;
}

.site-header,
.site-footer,
.page-card{
  border: 1px solid var(--border);
  background: var(--surface-soft);
  backdrop-filter: blur(16px);
  box-shadow: var(--shadow-soft);
}

.site-header{
  border-radius: 26px;
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  position: sticky;
  top: 10px;
  z-index: 10;
}

.brand{
  display: flex;
  align-items: center;
  gap: 11px;
  text-decoration: none;
  min-width: 0;
  max-width: 100%;
}

.brand-logo{
  width: 50px;
  height: 50px;
  border-radius: 16px;
  box-shadow: 0 10px 22px rgba(123,47,247,.16);
  flex: 0 0 auto;
}

.brand-text{
  min-width: 0;
}

.brand-kicker{
  display: block;
  color: var(--muted);
  font-size: .72rem;
  line-height: 1.1;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 850;
}

.brand-name{
  display: block;
  font-size: 1.02rem;
  line-height: 1.18;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nav-toggle{
  display: none;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 9px 13px;
  background: #fff;
  color: var(--text);
  font-weight: 850;
  cursor: pointer;
}

.main-nav{
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.nav-link,
.nav-button{
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 13px;
  border-radius: 999px;
  text-decoration: none;
  background: transparent;
  color: #2f3042;
  font-weight: 850;
  cursor: pointer;
  white-space: nowrap;
}

.nav-link:hover,
.nav-button:hover,
.nav-link.is-active{
  background: rgba(123,47,247,.10);
  color: var(--accent-dark);
}

.nav-form{
  margin: 0;
  display: inline;
}

.site-main{
  display: flex;
  align-items: flex-start;
  min-width: 0;
}

.page-card{
  width: 100%;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow);
}

.page-card:before{
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 7px;
  background: linear-gradient(90deg,var(--pink),var(--accent),var(--blue),var(--teal),var(--orange));
}

.card-inner{
  padding: 34px clamp(22px,4vw,48px) clamp(22px,4vw,48px);
  min-width: 0;
}

.hero-grid{
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(240px,.78fr);
  gap: clamp(22px,4vw,48px);
  align-items: center;
}

.eyebrow{
  color: var(--accent-dark);
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 900;
  margin: 0 0 10px;
}

h1,
h2,
h3{
  letter-spacing: -.035em;
  color: var(--text);
}

h1{
  font-size: clamp(2rem,5.2vw,4.05rem);
  line-height: 1;
  margin: 0 0 16px;
  max-width: 12ch;
}

h2{
  font-size: clamp(1.55rem,3.4vw,2.25rem);
  line-height: 1.08;
  margin: 0 0 13px;
}

h3{
  font-size: 1.12rem;
  margin: 0 0 8px;
}

p{
  color: var(--muted);
  line-height: 1.62;
  margin: 0 0 16px;
}

.lead{
  font-size: clamp(1rem,1.7vw,1.16rem);
  max-width: 64ch;
}

.hero-logo-wrap{
  min-height: 310px;
  border-radius: 26px;
  display: grid;
  place-items: center;
  background: radial-gradient(circle at 18% 14%,rgba(247,47,78,.14),transparent 34%),radial-gradient(circle at 82% 18%,rgba(30,111,242,.15),transparent 34%),radial-gradient(circle at 18% 86%,rgba(16,184,179,.14),transparent 34%),radial-gradient(circle at 86% 82%,rgba(255,138,22,.16),transparent 34%),#fff;
  border: 1px solid var(--border);
}

.hero-logo{
  width: min(74%,285px);
  border-radius: 32px;
  filter: drop-shadow(0 18px 30px rgba(76,46,160,.16));
}

.actions{
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
  margin-top: 22px;
}

.btn,
.btn-secondary,
.btn-ghost,
.btn-danger{
  appearance: none;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 11px 17px;
  border-radius: 999px;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s ease,box-shadow .15s ease,background .15s ease;
}

.btn:hover,
.btn-secondary:hover,
.btn-ghost:hover,
.btn-danger:hover{
  transform: translateY(-1px);
}

.btn{
  color: #fff;
  background: linear-gradient(135deg,var(--pink) 0%,var(--accent) 50%,var(--blue) 100%);
  box-shadow: 0 14px 28px rgba(90,60,210,.20);
}

.btn-secondary{
  color: #2c2840;
  background: #f4f1fb;
}

.btn-ghost{
  color: var(--accent-dark);
  background: transparent;
}

.btn-danger{
  color: #fff;
  background: #d92f50;
}

.feature-grid,
.dashboard-grid{
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 14px;
  margin-top: 22px;
}

.feature-card,
.metric-card,
.info-card{
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 18px;
  background: rgba(255,255,255,.82);
  min-width: 0;
}

.feature-icon,
.metric-icon{
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  color: #fff;
  background: linear-gradient(135deg,var(--pink),var(--accent) 50%,var(--blue));
  font-weight: 950;
  margin-bottom: 13px;
  box-shadow: 0 9px 20px rgba(123,47,247,.15);
}

.metric-value{
  display: block;
  font-size: clamp(1.35rem,4vw,1.9rem);
  font-weight: 950;
  letter-spacing: -.05em;
  overflow-wrap: anywhere;
}

.metric-label{
  color: var(--muted);
  font-weight: 750;
}

.form-wrap{
  max-width: 620px;
}

.form-grid{
  display: grid;
  gap: 15px;
}

.field{
  display: grid;
  gap: 7px;
  min-width: 0;
}

.field label{
  font-weight: 900;
}

.field small{
  color: var(--muted);
  line-height: 1.42;
}

.input-row{
  display: flex;
  gap: 8px;
  align-items: stretch;
  min-width: 0;
}

input,
select,
textarea{
  width: 100%;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  min-height: 49px;
  padding: 12px 14px;
  background: #fff;
  color: var(--text);
  outline: none;
}

textarea{
  min-height: 128px;
  resize: vertical;
}

input:focus,
select:focus,
textarea:focus{
  border-color: rgba(123,47,247,.55);
  box-shadow: var(--focus);
}

.password-toggle{
  flex: 0 0 auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: #f7f4fc;
  padding: 0 12px;
  font-weight: 850;
  cursor: pointer;
}

.form-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
  align-items: center;
  margin-top: 8px;
}


.auth-help-row{
  margin: -4px 0 0;
  font-weight: 850;
}

.auth-help-row a{
  text-decoration: none;
}

.auth-security-note{
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.72);
  font-weight: 750;
}

.flash-stack{
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}

.flash{
  border-radius: 17px;
  padding: 13px 15px;
  font-weight: 800;
  border: 1px solid transparent;
}

.flash.success{
  color: #075c44;
  background: #e6fff6;
  border-color: #b7f3dd;
}

.flash.error{
  color: #842039;
  background: #fff0f3;
  border-color: #ffd0da;
}

.flash.info{
  color: #263c80;
  background: #eef3ff;
  border-color: #cfdbff;
}

.stepper{
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 10px;
  margin: 0 0 26px;
}

.step{
  border: 1px solid var(--border);
  border-radius: 17px;
  padding: 12px;
  background: rgba(255,255,255,.82);
  color: var(--muted);
  font-weight: 900;
  min-width: 0;
}

.step.is-active{
  color: #fff;
  background: linear-gradient(135deg,var(--pink),var(--accent) 58%,var(--blue));
  border-color: transparent;
}

.step small{
  display: block;
  color: inherit;
  opacity: .82;
  font-weight: 700;
}

.status-ok,
.status-bad{
  display: inline-flex;
  border-radius: 999px;
  padding: 6px 10px;
  font-weight: 900;
  white-space: nowrap;
}

.status-ok{
  color: #075c44;
  background: #ddf9ee;
}

.status-bad{
  color: #842039;
  background: #ffe4ea;
}

.code-box{
  display: block;
  overflow: auto;
  max-height: 420px;
  padding: 16px;
  border-radius: var(--radius-md);
  background: #111323;
  color: #edf0ff;
  font: 0.9rem/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

.site-footer{
  border-radius: 22px;
  padding: 15px 18px;
  color: #5e6072;
  background: rgba(255,255,255,.84);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.site-footer a{
  color: var(--accent-dark);
  text-decoration: none;
  font-weight: 800;
}

.offline-page{
  display: grid;
  place-items: center;
  padding: 18px;
  min-height: 100svh;
}

.offline-card{
  width: min(520px,100%);
  text-align: center;
  padding: 32px;
  border-radius: 26px;
  background: #fff;
  box-shadow: var(--shadow);
}

.offline-card img{
  border-radius: 22px;
}

.admin-grid{
  display: grid;
  grid-template-columns: minmax(0,1.1fr) minmax(260px,.7fr);
  gap: 16px;
  margin: 22px 0;
}

.section-title{
  margin: 28px 0 13px;
}

.danger-note{
  border: 1px solid #ffd0da;
  background: #fff0f3;
  color: #842039;
  border-radius: var(--radius-md);
  padding: 13px 15px;
  line-height: 1.5;
}

.btn-small{
  min-height: 36px;
  padding: 8px 12px;
  font-size: .9rem;
}

input[type=file]{
  padding: 10px;
  background: #fff;
}

.badge{
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 9px;
  background: #f3f0fb;
  color: #5730b7;
  font-weight: 900;
  white-space: nowrap;
}

@media (max-width:980px){
.app-shell{
  width: min(100% - 24px,var(--max));
  gap: 14px;
  padding: 12px 0;
}

.site-header{
  top: 8px;
  align-items: center;
}

.nav-toggle{
  display: inline-flex;
  margin-left: auto;
}

.main-nav{
  display: none;
  flex-basis: 100%;
  width: 100%;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding-top: 8px;
}

.main-nav.is-open{
  display: flex;
}

.nav-link,
.nav-button{
  width: 100%;
  justify-content: center;
  background: #fff;
}

.nav-form{
  width: 100%;
  display: block;
}

.site-header{
  flex-wrap: wrap;
}

.hero-grid{
  grid-template-columns: 1fr;
}

.hero-logo-wrap{
  min-height: 220px;
  order: -1;
}

.hero-logo{
  width: min(58%,240px);
}

.feature-grid,
.dashboard-grid{
  grid-template-columns: 1fr;
}

.admin-grid{
  grid-template-columns: 1fr;
}

.site-main{
  align-items: flex-start;
}

.page-card{
  border-radius: 26px;
}

h1{
  max-width: none;
  font-size: clamp(2rem,8vw,3.2rem);
}
}

@media (max-width:640px){
.app-shell{
  width: 100%;
  padding: 0;
  gap: 0;
}

.site-header{
  position: relative;
  top: auto;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  padding: 10px 12px;
}

.site-footer{
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}

.page-card{
  border-radius: 0;
  border-left: 0;
  border-right: 0;
}

.card-inner{
  padding: 20px 16px 24px;
}

.brand-logo{
  width: 44px;
  height: 44px;
  border-radius: 14px;
}

.brand-kicker{
  font-size: .66rem;
}

.brand-name{
  font-size: .94rem;
}

.hero-logo-wrap{
  min-height: 180px;
  border-radius: 22px;
}

.hero-logo{
  width: min(58%,205px);
  border-radius: 26px;
}

.actions,
.form-actions{
  flex-direction: column;
  align-items: stretch;
}

.btn,
.btn-secondary,
.btn-ghost,
.btn-danger{
  width: 100%;
  min-height: 48px;
}

.input-row{
  flex-direction: column;
}

.password-toggle{
  min-height: 44px;
}

.stepper{
  grid-template-columns: 1fr;
  gap: 8px;
}

.site-footer{
  display: grid;
  justify-content: stretch;
  text-align: center;
  font-size: .92rem;
}

.feature-card,
.metric-card,
.info-card{
  padding: 16px;
}

.offline-card{
  padding: 26px 18px;
}
}

@media (max-width:380px){
.card-inner{
  padding: 18px 14px;
}

.brand-name{
  max-width: 190px;
}

.nav-toggle{
  padding: 8px 11px;
}

h1{
  font-size: 1.9rem;
}

.hero-logo-wrap{
  min-height: 160px;
}

.hero-logo{
  width: 170px;
}
}

html,
body{
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

*,
*::before,
*::after{
  min-width: 0;
}

:where(h1,h2,h3,p,a,span,strong,small,label,td,th,button,input,select,textarea){
  overflow-wrap: anywhere;
  word-break: normal;
}

.app-shell,
.site-header,
.site-main,
.page-card,
.card-inner,
.site-footer,
.form-grid,
.form-wrap,
.admin-grid,
.feature-grid,
.dashboard-grid,
.info-card,
.feature-card,
.metric-card{
  max-width: 100%;
}

.site-header{
  align-items: center;
}

.brand{
  flex: 1 1 auto;
}

.nav-toggle{
  flex: 0 0 auto;
}

.main-nav{
  flex: 0 1 auto;
  justify-content: flex-end;
}

.page-card{
  contain: layout paint;
}

.hero-grid{
  grid-template-columns: minmax(0,1fr) minmax(220px,.74fr);
}

h1{
  max-width: 13ch;
}

.lead{
  max-width: 100%;
}

input[type="file"]{
  max-width: 100%;
  white-space: normal;
}

.code-box{
  white-space: pre-wrap;
  word-break: break-word;
  overflow-x: hidden;
}

.btn-small{
  white-space: normal;
}

@media (max-width: 980px){
.app-shell{
  width: min(100% - 24px,var(--max));
  padding: 12px 0;
  gap: 12px;
}

.site-header{
  position: relative;
  top: auto;
}

.hero-grid{
  grid-template-columns: 1fr;
}

.hero-logo-wrap{
  order: 0;
  min-height: 190px;
}

h1{
  max-width: 100%;
}
}

@media (max-width: 760px){
body{
  background-attachment: scroll;
}

.app-shell{
  width: min(100% - 18px,var(--max));
  padding: 9px 0;
  gap: 9px;
}

.site-header,
.site-footer,
.page-card{
  border-radius: 20px;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
}

.site-header{
  padding: 10px;
}

.brand-logo{
  width: 42px;
  height: 42px;
  border-radius: 13px;
}

.brand-name{
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.nav-toggle{
  display: inline-flex;
  padding: 8px 11px;
}

.main-nav.is-open{
  display: grid;
}

.card-inner{
  padding: 18px 14px 20px;
}

.hero-logo-wrap{
  min-height: 150px;
  border-radius: 18px;
}

.hero-logo{
  width: min(46%,150px);
  border-radius: 22px;
}

h1{
  font-size: clamp(1.78rem,9.8vw,2.35rem);
  line-height: 1.04;
  letter-spacing: -.045em;
}

h2{
  font-size: clamp(1.34rem,7vw,1.78rem);
}

.lead{
  font-size: 1rem;
}

.feature-grid,
.dashboard-grid,
.admin-grid{
  gap: 10px;
}

.feature-card,
.metric-card,
.info-card{
  padding: 14px;
  border-radius: 18px;
}

.feature-icon,
.metric-icon{
  width: 38px;
  height: 38px;
  border-radius: 13px;
  margin-bottom: 9px;
}

.actions,
.form-actions{
  flex-direction: column;
  align-items: stretch;
}

.btn,
.btn-secondary,
.btn-ghost,
.btn-danger{
  width: 100%;
  white-space: normal;
  text-align: center;
  min-height: 46px;
  border-radius: 16px;
}

.nav-link,
.nav-button{
  border-radius: 15px;
}

.input-row{
  flex-direction: column;
}

.password-toggle{
  min-height: 44px;
}

.stepper{
  grid-template-columns: 1fr;
  gap: 8px;
}

.site-footer{
  display: grid;
  text-align: center;
  justify-content: stretch;
  padding: 12px 14px;
}
}

@media (max-width:420px){
.app-shell{
  width: min(100% - 12px,var(--max));
  padding: 6px 0;
  gap: 7px;
}

.site-header,
.site-footer,
.page-card{
  border-radius: 17px;
}

.card-inner{
  padding: 16px 12px 18px;
}

.brand-kicker{
  font-size: .61rem;
  letter-spacing: .06em;
}

.brand-name{
  font-size: .9rem;
}

.nav-toggle{
  font-size: .9rem;
  padding: 7px 9px;
}
}

.section-heading{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: 28px 0 13px;
}

.section-heading .section-title{
  margin: 0;
}

@media (max-width:760px){
.section-heading{
  display: grid;
  align-items: stretch;
}
}

.toast-stack{
  position: fixed;
  left: 50%;
  bottom: calc(18px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  width: min(480px,calc(100% - 24px));
  display: grid;
  gap: 8px;
  z-index: 9999;
  pointer-events: none;
}

.toast{
  border-radius: 16px;
  padding: 12px 14px;
  font-weight: 900;
  box-shadow: 0 16px 36px rgba(32,29,47,.18);
  background: #fff;
  border: 1px solid var(--border);
  transition: opacity .25s ease,transform .25s ease;
}

.toast.success{
  color: #075c44;
  background: #e6fff6;
  border-color: #b7f3dd;
}

.toast.error{
  color: #842039;
  background: #fff0f3;
  border-color: #ffd0da;
}

.toast.is-hiding{
  opacity: 0;
  transform: translateY(8px);
}

button:disabled,
input[type=submit]:disabled{
  opacity: .62;
  cursor: wait;
  transform: none !important;
}

html,
body{
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

*,
*::before,
*::after{
  box-sizing: border-box;
}

.app-shell,
.site-header,
.site-main,
.page-card,
.card-inner,
.info-card,
.feature-card,
.metric-card,
.form-wrap,
.form-grid,
.field,
.input-row,
.admin-grid,
.dashboard-grid,
.hero-grid{
  max-width: 100%;
  min-width: 0;
}

.section-heading,
.danger-note,
.lead,
p,
h1,
h2,
h3,
a,
button,
label,
small,
input,
textarea,
select{
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: normal;
}

input,
textarea,
select,
button{
  max-width: 100%;
}

.site-header{
  overflow: visible;
}

.nav-toggle{
  align-items: center;
  gap: 8px;
  line-height: 1;
  min-height: 42px;
  user-select: none;
}

.nav-toggle-icon{
  width: 18px;
  height: 14px;
  display: grid;
  gap: 4px;
  align-items: center;
  flex: 0 0 auto;
}

.nav-toggle-icon span{
  display: block;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transition: transform .18s ease,opacity .18s ease;
}

.nav-toggle[aria-expanded="true"] .nav-toggle-icon span:nth-child(1){
  transform: translateY(6px) rotate(45deg);
}

.nav-toggle[aria-expanded="true"] .nav-toggle-icon span:nth-child(2){
  opacity: 0;
}

.nav-toggle[aria-expanded="true"] .nav-toggle-icon span:nth-child(3){
  transform: translateY(-6px) rotate(-45deg);
}

.nav-toggle[aria-expanded="true"]{
  background: #f4f1fb;
  color: var(--accent-dark);
  box-shadow: var(--focus);
}

@media (min-width:981px){
.main-nav{
  display: flex !important;
}

.nav-toggle{
  display: none !important;
}
}

@media (max-width:980px){
.site-header{
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  position: sticky;
  top: 8px;
  z-index: 80;
}

.brand{
  grid-column: 1;
  min-width: 0;
}

.nav-toggle{
  grid-column: 2;
  display: inline-flex;
  justify-self: end;
  margin-left: 0;
  border-radius: 16px;
  background: #fff;
  padding: 10px 12px;
  color: var(--text);
}

.main-nav{
  grid-column: 1 / -1;
  display: none;
  width: 100%;
  max-width: 100%;
  padding: 8px;
  margin: 2px 0 0;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 18px 42px rgba(77,64,118,.14);
  backdrop-filter: blur(18px);
  grid-template-columns: 1fr;
  gap: 7px;
  align-items: stretch;
  overflow: hidden;
}

.main-nav.is-open{
  display: grid !important;
  animation: navPanelIn .16s ease-out both;
}

.nav-link,
.nav-button{
  width: 100%;
  min-height: 48px;
  border-radius: 15px;
  justify-content: flex-start;
  text-align: left;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid rgba(32,29,47,.08);
  white-space: normal;
  overflow-wrap: anywhere;
}

.nav-link.is-active{
  background: linear-gradient(135deg,rgba(247,47,78,.10),rgba(123,47,247,.12) 54%,rgba(30,111,242,.10));
  border-color: rgba(123,47,247,.22);
  color: var(--accent-dark);
}

.nav-form{
  display: block;
  width: 100%;
  margin: 0;
}

.nav-button{
  color: #842039;
  background: #fff4f6;
  border-color: #ffd0da;
}
}

@media (max-width:640px){
.site-header{
  top: 0;
  border-radius: 0 0 20px 20px;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  padding: 10px 12px;
  box-shadow: 0 10px 28px rgba(77,64,118,.09);
}

.nav-toggle{
  min-width: 44px;
  min-height: 44px;
  padding: 10px;
  border-radius: 14px;
}

.nav-toggle-text{
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.main-nav{
  margin-top: 4px;
  border-radius: 18px;
  padding: 7px;
  gap: 6px;
}

.nav-link,
.nav-button{
  min-height: 46px;
  border-radius: 14px;
  padding: 11px 12px;
  font-size: .98rem;
}
}

@media (max-width:380px){
.site-header{
  grid-template-columns: minmax(0,1fr) 44px;
  padding: 9px 10px;
}

.brand{
  gap: 8px;
}

.brand-logo{
  width: 40px;
  height: 40px;
}

.brand-name{
  -webkit-line-clamp: 1;
  font-size: .88rem;
}

.brand-kicker{
  font-size: .58rem;
}

.nav-toggle{
  width: 44px;
  height: 42px;
  padding: 9px;
  justify-content: center;
}
}

@keyframes navPanelIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}

:where(h1,h2,h3,p,a,span,small,label,button,input,select,textarea,th,td){
  word-break: normal;
  overflow-wrap: break-word;
  hyphens: auto;
  text-wrap: pretty;
}

.brand{
  gap: 12px;
}

.brand-text{
  display: grid;
  row-gap: 3px;
}

.brand-kicker,
.brand-name,
.nav-link,
.nav-button,
.btn,
.btn-secondary,
.btn-ghost,
.btn-danger,
.metric-value,
.metric-label{
  hyphens: none;
  overflow-wrap: normal;
  word-break: normal;
}

.nav-link,
.nav-button{
  gap: .5rem;
  line-height: 1.25;
  letter-spacing: 0;
}

.main-nav{
  gap: 8px;
}

.code-box,
.flash,
.toast,
.danger-note,
input[type="file"]{
  overflow-wrap: anywhere;
  word-break: normal;
}

@media (max-width:760px){
.nav-link,
.nav-button{
  justify-content: flex-start;
  text-align: left;
  padding-inline: 14px;
}
}

h1,
h2,
h3{
  letter-spacing: -.018em;
}

@media (max-width:760px){
h1{
  letter-spacing: -.02em;
}
}

.nav-group{
  position: relative;
  margin: 0;
  min-width: 0;
}

.nav-group summary{
  list-style: none;
}

.nav-group summary::-webkit-details-marker{
  display: none;
}

.nav-group-summary{
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 34px 9px 13px;
  border-radius: 999px;
  color: #2f3042;
  font-weight: 850;
  cursor: pointer;
  white-space: nowrap;
  position: relative;
  user-select: none;
}

.nav-group-summary::after{
  content: "";
  position: absolute;
  right: 13px;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform .18s ease;
}

.nav-group[open] .nav-group-summary::after{
  transform: translateY(2px) rotate(225deg);
}

.nav-group-summary:hover,
.nav-group.is-active > .nav-group-summary{
  background: rgba(123,47,247,.10);
  color: var(--accent-dark);
}

.nav-submenu{
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: min(300px,calc(100vw - 32px));
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 42px rgba(77,64,118,.16);
  z-index: 25;
}

.nav-sub-link{
  width: 100%;
  justify-content: flex-start;
  border-radius: 14px;
  white-space: normal;
  overflow-wrap: break-word;
}

.version-card{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 18px 0 22px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.82);
}

.version-card span{
  color: var(--muted);
  font-weight: 900;
}

.version-card strong{
  color: var(--accent-dark);
  font-weight: 950;
  overflow-wrap: anywhere;
}

@media (max-width:980px){
.nav-group{
  width: 100%;
}

.nav-group-summary{
  width: 100%;
  min-height: 48px;
  justify-content: flex-start;
  text-align: left;
  padding: 12px 40px 12px 14px;
  border: 1px solid rgba(32,29,47,.08);
  border-radius: 15px;
  background: #fff;
  white-space: normal;
  overflow-wrap: break-word;
}

.nav-group-summary::after{
  right: 16px;
}

.nav-group.is-active > .nav-group-summary{
  background: linear-gradient(135deg,rgba(247,47,78,.10),rgba(123,47,247,.12) 54%,rgba(30,111,242,.10));
  border-color: rgba(123,47,247,.22);
}

.nav-submenu{
  position: static;
  width: 100%;
  margin-top: 7px;
  box-shadow: none;
  background: #fbf9ff;
  border-radius: 15px;
}

.nav-sub-link{
  min-height: 46px;
  padding-left: 18px;
}
}

@media (max-width:520px){
.version-card{
  display: grid;
  gap: 6px;
}
}

.nav-group{
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 0;
  margin: 0;
}

.nav-group-toggle{
  position: relative;
  padding-right: 34px;
  appearance: none;
  -webkit-appearance: none;
}

.nav-group-toggle::after{
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-62%) rotate(45deg);
  transition: transform .18s ease;
}

.nav-group.is-open > .nav-group-toggle::after{
  transform: translateY(-32%) rotate(225deg);
}

.nav-submenu[hidden]{
  display: none !important;
}

.nav-submenu{
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 50;
  width: min(320px,calc(100vw - 32px));
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 42px rgba(77,64,118,.16);
}

.nav-sub-link{
  width: 100%;
  justify-content: flex-start;
  border-radius: 14px;
  white-space: normal;
  overflow-wrap: break-word;
}

@media (max-width:980px){
.nav-group{
  display: grid;
  width: 100%;
  gap: 7px;
}

.nav-group-toggle{
  width: 100%;
  min-height: 48px;
  border-radius: 15px;
  justify-content: flex-start;
  text-align: left;
  padding: 12px 42px 12px 14px;
  background: #fff;
  border: 1px solid rgba(32,29,47,.08);
  white-space: normal;
}

.nav-group-toggle.is-active{
  background: linear-gradient(135deg,rgba(247,47,78,.10),rgba(123,47,247,.12) 54%,rgba(30,111,242,.10));
  border-color: rgba(123,47,247,.22);
  color: var(--accent-dark);
}

.nav-group-toggle::after{
  right: 17px;
}

.nav-submenu{
  position: static;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  gap: 7px;
}

.nav-sub-link{
  min-height: 46px;
  padding: 11px 14px 11px 28px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(32,29,47,.08);
}
}

@media (max-width:640px){
.nav-group{
  gap: 6px;
}

.nav-group-toggle,
.nav-sub-link{
  min-height: 46px;
  border-radius: 14px;
  font-size: .98rem;
}
}

:root{
  --btn-confirm: #0fa66a;
  --btn-confirm-dark: #078452;
  --btn-confirm-shadow: rgba(15,166,106,.22);
  --btn-danger: #dc2f50;
  --btn-danger-dark: #b8203f;
  --btn-danger-shadow: rgba(220,47,80,.22);
  --btn-neutral-bg: #f4f1fb;
  --btn-neutral-bg-hover: #ece6fa;
  --btn-neutral-border: #eadffc;
  --btn-neutral-text: #2c2840;
}

.btn{
  color: #fff !important;
  background: linear-gradient(135deg,var(--btn-confirm) 0%,#13bd7a 100%) !important;
  box-shadow: 0 14px 28px var(--btn-confirm-shadow) !important;
}

.btn:hover{
  background: linear-gradient(135deg,var(--btn-confirm-dark) 0%,var(--btn-confirm) 100%) !important;
}

.btn-secondary,
.btn-ghost,
.password-toggle{
  color: var(--btn-neutral-text) !important;
  background: var(--btn-neutral-bg) !important;
  border-color: var(--btn-neutral-border) !important;
  box-shadow: none !important;
}

.btn-secondary:hover,
.btn-ghost:hover,
.password-toggle:hover{
  background: var(--btn-neutral-bg-hover) !important;
}

.btn-danger{
  color: #fff !important;
  background: linear-gradient(135deg,var(--btn-danger) 0%,#e2365a 100%) !important;
  box-shadow: 0 14px 28px var(--btn-danger-shadow) !important;
}

.btn-danger:hover{
  background: linear-gradient(135deg,var(--btn-danger-dark) 0%,var(--btn-danger) 100%) !important;
}

.nav-button{
  color: #2f3042 !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.nav-button:hover{
  color: var(--accent-dark) !important;
  background: rgba(123,47,247,.10) !important;
}

@media (max-width:980px){
.nav-button{
  color: #2f3042 !important;
  background: #fff !important;
  border: 1px solid rgba(32,29,47,.08) !important;
}

.nav-button:hover{
  color: var(--accent-dark) !important;
  background: var(--btn-neutral-bg) !important;
}
}

.status-ok,
.status-bad{
  max-width: 100%;
}

.status-ok,
.status-bad{
  display: inline-flex !important;
  width: auto !important;
  max-width: max-content !important;
  align-items: center !important;
}

h1,
h2,
h3,
.section-title{
  max-width: 100% !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
  text-wrap: normal !important;
}

:root{
  --btn-shadow-confirm-soft: 0 6px 13px rgba(15,166,106,.17);
  --btn-shadow-danger-soft: 0 6px 13px rgba(220,47,80,.18);
  --btn-shadow-neutral-soft: 0 5px 12px rgba(80,58,150,.13);
}

.btn{
  box-shadow: var(--btn-shadow-confirm-soft) !important;
}

.btn-danger{
  box-shadow: var(--btn-shadow-danger-soft) !important;
}

.btn-secondary,
.btn-ghost,
.password-toggle,
.nav-toggle,
.nav-button{
  box-shadow: var(--btn-shadow-neutral-soft) !important;
}

.btn:hover,
.btn-secondary:hover,
.btn-ghost:hover,
.btn-danger:hover,
.password-toggle:hover,
.nav-toggle:hover,
.nav-button:hover{
  box-shadow: 0 8px 16px rgba(80,58,150,.14) !important;
}

.btn:active,
.btn-secondary:active,
.btn-ghost:active,
.btn-danger:active,
.password-toggle:active,
.nav-toggle:active,
.nav-button:active{
  transform: translateY(0) !important;
  box-shadow: 0 3px 8px rgba(80,58,150,.12) !important;
}

.btn:hover{
  box-shadow: 0 8px 16px rgba(15,166,106,.19) !important;
}

.btn-danger:hover{
  box-shadow: 0 8px 16px rgba(220,47,80,.20) !important;
}

.btn-secondary:hover,
.btn-ghost:hover,
.password-toggle:hover,
.nav-toggle:hover,
.nav-button:hover{
  box-shadow: 0 7px 14px rgba(80,58,150,.14) !important;
}

:root{
  --brand-stripe: linear-gradient(90deg,var(--pink) 0%,var(--accent) 28%,var(--blue) 52%,var(--teal) 76%,var(--orange) 100%);
}

.site-header,
.site-footer,
.flash,
.toast,
.modal-card{
  position: relative;
}

.site-header::before,
.site-footer::before,
.flash::before,
.toast::before,
.modal-card::before{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 7px;
  background: var(--brand-stripe);
  border-radius: inherit;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  pointer-events: none;
}

.site-header{
  padding-top: 18px !important;
}

.site-footer{
  padding-top: 22px !important;
  overflow: hidden;
}

.flash,
.toast{
  overflow: hidden;
  padding-top: 20px !important;
}

.toast-stack{
  top: calc(18px + env(safe-area-inset-top));
  bottom: auto !important;
  z-index: 10010;
}

.toast{
  background: #fff !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  box-shadow: 0 14px 30px rgba(54,42,92,.14) !important;
}

.toast.success{
  border-color: rgba(18,191,122,.24) !important;
}

.toast.error{
  border-color: rgba(220,47,80,.28) !important;
}

.modal-backdrop{
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(32,29,47,.30);
  backdrop-filter: blur(10px);
}

.modal-card{
  width: min(520px,100%);
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(32,29,47,.24);
}

.modal-content{
  padding: 30px 26px 24px;
}

.modal-title{
  margin: 0 0 10px;
  font-size: clamp(1.28rem,3vw,1.72rem);
  line-height: 1.08;
  letter-spacing: -.018em;
  color: var(--text);
}

.modal-message{
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
  font-weight: 720;
}

.modal-actions{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
}

@media (max-width:520px){
.modal-backdrop{
  padding: 14px;
  place-items: end center;
}

.modal-card{
  border-radius: 24px;
}

.modal-content{
  padding: 28px 18px 18px;
}

.modal-actions{
  display: grid;
  grid-template-columns: 1fr;
}

.modal-actions .btn,
.modal-actions .btn-secondary,
.modal-actions .btn-danger{
  width: 100%;
}
}

.toast,
.modal-card{
  cursor: grab;
  touch-action: none;
}

.toast.is-dragging,
.modal-card.is-dragging{
  cursor: grabbing;
  user-select: none;
}

.modal-actions,
.modal-actions *{
  touch-action: auto;
}

.toast{
  pointer-events: auto;
}

@media (max-width:760px){
.app-shell{
  width: min(100% - 18px,var(--max)) !important;
  padding: 9px 0 !important;
  gap: 9px !important;
}

.site-header,
.site-footer{
  border: 1px solid var(--border) !important;
  border-radius: 20px !important;
  background: var(--surface-soft) !important;
}

.site-header{
  top: 8px !important;
  padding-top: 18px !important;
  overflow: visible !important;
}

.site-header::before,
.site-footer::before{
  border-top-left-radius: 20px !important;
  border-top-right-radius: 20px !important;
}
}

@media (max-width:420px){
.app-shell{
  width: min(100% - 12px,var(--max)) !important;
  padding: 6px 0 !important;
  gap: 7px !important;
}

.site-header,
.site-footer{
  border-radius: 18px !important;
}

.site-header::before,
.site-footer::before{
  border-top-left-radius: 18px !important;
  border-top-right-radius: 18px !important;
}
}

:root{
  --shell-radius: 26px;
  --shell-gap: 18px;
}

.app-shell{
  width: min(var(--max),calc(100% - 32px)) !important;
  gap: var(--shell-gap) !important;
  padding: 18px 0 !important;
}

.site-header,
.site-main,
.site-footer{
  width: 100% !important;
  max-width: 100% !important;
}

.site-header,
.page-card,
.site-footer{
  border: 1px solid var(--border) !important;
  border-radius: var(--shell-radius) !important;
}

.page-card{
  overflow: hidden !important;
}

.site-header{
  overflow: visible !important;
}

.site-header::before,
.page-card::before,
.site-footer::before,
.flash::before,
.toast::before,
.modal-card::before{
  border-top-left-radius: var(--shell-radius) !important;
  border-top-right-radius: var(--shell-radius) !important;
}

.site-header::before,
.site-footer::before,
.page-card::before{
  height: 7px !important;
}

@media (max-width:760px){
:root{
  --shell-radius: 20px;
  --shell-gap: 9px;
}

.app-shell{
  width: min(100% - 18px,var(--max)) !important;
  padding: 9px 0 !important;
  gap: var(--shell-gap) !important;
}

.site-header,
.page-card,
.site-footer{
  border-radius: var(--shell-radius) !important;
  border: 1px solid var(--border) !important;
}

.site-header{
  top: 8px !important;
  padding-top: 18px !important;
}
}

@media (max-width:420px){
:root{
  --shell-radius: 18px;
  --shell-gap: 7px;
}

.app-shell{
  width: min(100% - 12px,var(--max)) !important;
  padding: 6px 0 !important;
  gap: var(--shell-gap) !important;
}
}

.site-header,
.site-footer,
.page-card,
.flash,
.toast,
.modal-card{
  overflow: hidden !important;
}

.site-header::before,
.site-footer::before,
.page-card::before,
.flash::before,
.toast::before,
.modal-card::before{
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  height: 7px !important;
  border-radius: 0 !important;
  border-top-left-radius: inherit !important;
  border-top-right-radius: inherit !important;
  transform: none !important;
}

.site-header{
  background: var(--surface-soft) !important;
}

.site-footer{
  background: rgba(255,255,255,.84) !important;
}

@media (max-width:980px){
.site-header{
  overflow: hidden !important;
}

.main-nav{
  box-shadow: none !important;
}
}

.toast-stack{
  top: auto !important;
  bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

@media (max-width:520px){
.toast-stack{
  bottom: calc(14px + env(safe-area-inset-bottom)) !important;
  width: min(520px,calc(100% - 28px)) !important;
}
}

.toast{
  transform: translate(0,0);
}

.toast.is-hiding{
  transform: translateY(8px) !important;
}

:root{
  --shell-gap-final: 18px;
  --shell-page-pad-final: 18px;
  --table-radius-final: 18px;
}

.app-shell{
  min-height: 0 !important;
  height: auto !important;
  display: grid !important;
  grid-template-rows: auto auto auto !important;
  align-content: start !important;
  gap: var(--shell-gap-final) !important;
  padding: var(--shell-page-pad-final) 0 !important;
}

.site-main{
  display: block !important;
  align-items: initial !important;
  min-height: 0 !important;
}

.page-card{
  align-self: start !important;
}

@media (max-width:760px){
:root{
  --shell-gap-final: 9px;
  --shell-page-pad-final: 9px;
  --table-radius-final: 18px;
}

.app-shell{
  gap: var(--shell-gap-final) !important;
  padding: var(--shell-page-pad-final) 0 !important;
}
}

@media (max-width:420px){
:root{
  --shell-gap-final: 7px;
  --shell-page-pad-final: 7px;
  --table-radius-final: 16px;
}
}

:root{
  --brand-strip-height: 7px;
  --brand-strip-depth: 28px;
  --brand-strip-shadow-strong: rgba(42,32,82,.18);
  --brand-strip-shadow-soft: rgba(42,32,82,.075);
}

.site-header,
.page-card,
.site-footer,
.flash,
.toast,
.modal-card{
  isolation: isolate;
}

.page-card,
.site-footer,
.flash,
.toast,
.modal-card{
  overflow: hidden !important;
}

.site-header{
  overflow: visible !important;
}

.site-header::before,
.page-card::before,
.site-footer::before,
.flash::before,
.toast::before,
.modal-card::before{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  width: auto !important;
  height: var(--brand-strip-depth) !important;
  max-width: 100% !important;
  pointer-events: none !important;
  border-radius: 0 !important;
  border-top-left-radius: inherit !important;
  border-top-right-radius: inherit !important;
  transform: none !important;
  background: var(--brand-stripe) top left / 100% var(--brand-strip-height) no-repeat,
    linear-gradient(180deg,
      var(--brand-strip-shadow-strong) 0,
      var(--brand-strip-shadow-soft) 44%,
      rgba(42,32,82,0) 100%) left var(--brand-strip-height) / 100% calc(var(--brand-strip-depth) - var(--brand-strip-height)) no-repeat !important;
  z-index: 0 !important;
}

.site-header > *,
.page-card > *,
.site-footer > *,
.flash > *,
.toast > *,
.modal-card > *{
  position: relative;
  z-index: 1;
}

.site-header{
  padding-top: calc(12px + var(--brand-strip-height)) !important;
}

.page-card .card-inner{
  position: relative;
  z-index: 1;
}

.site-footer{
  padding-top: calc(15px + var(--brand-strip-height)) !important;
}

.flash,
.toast{
  padding-top: calc(13px + var(--brand-strip-height)) !important;
}

.modal-content{
  position: relative;
  z-index: 1;
}

@media (max-width:760px){
.site-header{
  overflow: visible !important;
  padding-top: calc(10px + var(--brand-strip-height)) !important;
}

.site-footer{
  padding-top: calc(12px + var(--brand-strip-height)) !important;
}
}

:root{
  --shell-gap-final: 18px;
  --table-radius-stable: 22px;
}

html,
body{
  min-height: 100%;
}

.app-shell{
  display: flex !important;
  flex-direction: column !important;
  grid-template-rows: none !important;
  min-height: 0 !important;
  width: min(var(--max),calc(100% - 32px)) !important;
  margin-inline: auto !important;
  padding-block: var(--shell-gap-final) !important;
  padding-inline: 0 !important;
  gap: var(--shell-gap-final) !important;
}

.site-main{
  display: block !important;
  align-items: initial !important;
  flex: 0 0 auto !important;
  width: 100% !important;
}

.site-header,
.page-card,
.site-footer{
  margin: 0 !important;
}

@media (max-width:980px){
:root{
  --shell-gap-final: 14px;
}

.app-shell{
  width: min(100% - 24px,var(--max)) !important;
}
}

@media (max-width:760px){
:root{
  --shell-gap-final: 10px;
}

.app-shell{
  width: min(100% - 18px,var(--max)) !important;
}
}

@media (max-width:380px){
:root{
  --shell-gap-final: 8px;
}

.app-shell{
  width: min(100% - 14px,var(--max)) !important;
}
}

:root{
  --brand-strip-depth: 32px;
  --brand-strip-shadow-strong: rgba(42,32,82,.20);
  --brand-strip-shadow-soft: rgba(42,32,82,.08);
}

.site-header::before,
.page-card::before,
.site-footer::before,
.flash::before,
.toast::before,
.modal-card::before{
  background: var(--brand-stripe) top left / 100% var(--brand-strip-height) no-repeat,
    radial-gradient(ellipse 74% 100% at 50% 0%,
      var(--brand-strip-shadow-strong) 0%,
      var(--brand-strip-shadow-soft) 42%,
      rgba(42,32,82,.025) 68%,
      rgba(42,32,82,0) 100%) left var(--brand-strip-height) / 100% calc(var(--brand-strip-depth) - var(--brand-strip-height)) no-repeat !important;
}

:root{
  --shell-gap-final: 24px;
}

.app-shell{
  width: min(var(--max),calc(100% - var(--shell-gap-final) - var(--shell-gap-final))) !important;
  padding-block: var(--shell-gap-final) !important;
  gap: var(--shell-gap-final) !important;
}

.site-header{
  min-height: 76px !important;
  align-items: center !important;
}

.brand{
  flex: 1 1 280px !important;
  overflow: visible !important;
}

.brand-text{
  display: block !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding-block: 3px !important;
}

.brand-kicker{
  line-height: 1.25 !important;
}

.brand-name{
  line-height: 1.34 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  padding-bottom: 1px !important;
}

@media (min-width:981px){
.site-header{
  flex-wrap: nowrap !important;
}

.brand-name{
  white-space: nowrap !important;
}
}

@media (max-width:980px){
:root{
  --shell-gap-final: 18px;
}

.site-header{
  min-height: auto !important;
}
}

@media (max-width:760px){
:root{
  --shell-gap-final: 12px;
}

.brand{
  flex: 1 1 180px !important;
}

.brand-name{
  line-height: 1.3 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
}

@media (max-width:380px){
:root{
  --shell-gap-final: 10px;
}
}

:root{
  --shell-edge-gap-exact: 34px;
  --shell-between-gap-exact: 14px;
}

.app-shell{
  display: flex !important;
  flex-direction: column !important;
  grid-template-rows: none !important;
  align-content: initial !important;
  justify-content: flex-start !important;
  min-height: 0 !important;
  height: auto !important;
  width: min(var(--max),calc(100% - (var(--shell-edge-gap-exact) * 2))) !important;
  max-width: var(--max) !important;
  margin-inline: auto !important;
  padding-block: var(--shell-edge-gap-exact) !important;
  padding-inline: 0 !important;
  gap: var(--shell-between-gap-exact) !important;
}

.site-header,
.site-main,
.page-card,
.site-footer{
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.site-main{
  display: block !important;
  flex: 0 0 auto !important;
  min-height: 0 !important;
  height: auto !important;
  width: 100% !important;
}

.page-card{
  align-self: auto !important;
}

@media (max-width:760px){
:root{
  --shell-edge-gap-exact: 12px;
  --shell-between-gap-exact: 10px;
}

.app-shell{
  width: min(var(--max),calc(100% - (var(--shell-edge-gap-exact) * 2))) !important;
  padding-block: var(--shell-edge-gap-exact) !important;
  gap: var(--shell-between-gap-exact) !important;
}
}

@media (max-width:380px){
:root{
  --shell-edge-gap-exact: 10px;
  --shell-between-gap-exact: 8px;
}
}

:root{
  --shell-edge-gap-final-exact: 34px;
  --shell-between-gap-final-exact: 14px;
}

html,
body{
  margin: 0 !important;
  padding: 0 !important;
  min-height: 100% !important;
}

body{
  overflow-x: hidden !important;
}

.app-shell{
  display: block !important;
  grid-template-rows: none !important;
  gap: 0 !important;
  width: min(var(--max),calc(100% - (var(--shell-edge-gap-final-exact) * 2))) !important;
  max-width: var(--max) !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: var(--shell-edge-gap-final-exact) 0 !important;
}

.site-header{
  position: relative !important;
  top: auto !important;
  margin: 0 !important;
}

.site-main{
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: var(--shell-between-gap-final-exact) 0 !important;
  padding: 0 !important;
}

.page-card{
  margin: 0 !important;
}

.site-footer{
  margin: 0 !important;
}

.site-header,
.page-card,
.site-footer{
  box-shadow: 0 2px 8px rgba(77,64,118,.055) !important;
}

@media (max-width:760px){
:root{
  --shell-edge-gap-final-exact: 12px;
  --shell-between-gap-final-exact: 10px;
}

.app-shell{
  width: min(var(--max),calc(100% - (var(--shell-edge-gap-final-exact) * 2))) !important;
  padding: var(--shell-edge-gap-final-exact) 0 !important;
}

.site-main{
  margin: var(--shell-between-gap-final-exact) 0 !important;
}
}

@media (max-width:380px){
:root{
  --shell-edge-gap-final-exact: 10px;
  --shell-between-gap-final-exact: 8px;
}
}

.modal-card-reload{
  width: min(560px,calc(100vw - 28px)) !important;
}

.modal-card-reload .modal-content{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  padding: 46px 26px 24px !important;
}

.modal-card-reload .modal-title{
  margin: 0 !important;
  line-height: 1.15 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.modal-card-reload .modal-message{
  margin: 0 !important;
  line-height: 1.55 !important;
}

.modal-card-reload .modal-actions{
  margin: 4px 0 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
}

.modal-card-reload .modal-actions .btn{
  min-width: 168px !important;
}

@media (max-width:520px){
.modal-card-reload{
  width: calc(100vw - 28px) !important;
}

.modal-card-reload .modal-content{
  padding: 44px 18px 18px !important;
  gap: 12px !important;
}

.modal-card-reload .modal-actions{
  display: grid !important;
  grid-template-columns: 1fr !important;
}

.modal-card-reload .modal-actions .btn{
  width: 100% !important;
  min-width: 0 !important;
}
}

.modal-backdrop-reload{
  z-index: 10050 !important;
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  padding: max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)) !important;
}

.modal-backdrop-reload .modal-card-reload{
  width: min(560px,calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100svh - 36px) !important;
  overflow: auto !important;
  transform: none !important;
  cursor: default !important;
  touch-action: auto !important;
}

.modal-backdrop-reload .modal-card-reload .modal-content{
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 16px !important;
  min-height: 0 !important;
  padding: calc(24px + var(--brand-strip-height,7px)) 24px 24px !important;
}

.modal-backdrop-reload .modal-card-reload .modal-title,
.modal-backdrop-reload .modal-card-reload .modal-backdrop-reload .modal-card-reload .modal-actions{
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  max-width: 100% !important;
}

.modal-backdrop-reload .modal-card-reload .modal-title{
  margin: 0 !important;
  line-height: 1.18 !important;
  overflow: visible !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

.modal-backdrop-reload .modal-card-reload .modal-message{
  margin: 0 !important;
  line-height: 1.55 !important;
  overflow-wrap: anywhere !important;
}

.modal-backdrop-reload .modal-card-reload .modal-actions{
  margin: 4px 0 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
}

.modal-backdrop-reload .modal-card-reload .modal-actions .btn{
  width: auto !important;
  min-width: 178px !important;
  max-width: 100% !important;
  white-space: normal !important;
  pointer-events: auto !important;
}

@media (max-width:520px){
.modal-backdrop-reload{
  place-items: center !important;
  padding: 14px !important;
}

.modal-backdrop-reload .modal-card-reload{
  width: calc(100vw - 28px) !important;
  max-width: calc(100vw - 28px) !important;
  max-height: calc(100svh - 28px) !important;
}

.modal-backdrop-reload .modal-card-reload .modal-content{
  padding: calc(22px + var(--brand-strip-height,7px)) 18px 18px !important;
  gap: 14px !important;
}

.modal-backdrop-reload .modal-card-reload .modal-actions{
  display: grid !important;
  grid-template-columns: 1fr !important;
}

.modal-backdrop-reload .modal-card-reload .modal-actions .btn{
  width: 100% !important;
  min-width: 0 !important;
}
}

.profile-hero{
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 18px;
}

.avatar{
  width: 76px;
  height: 76px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(135deg,var(--pink),var(--accent) 52%,var(--blue));
  color: #fff;
  font-weight: 950;
  letter-spacing: -.04em;
  box-shadow: 0 14px 30px rgba(90,60,210,.18);
  flex: 0 0 auto;
}

.avatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.avatar span{
  font-size: 1.4rem;
}

.avatar-dashboard{
  width: 88px;
  height: 88px;
}

.avatar-profile{
  width: 96px;
  height: 96px;
}

.profile-image-editor{
  display: grid;
  gap: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 18px;
  background: rgba(255,255,255,.72);
}

.profile-image-head{
  display: flex;
  align-items: center;
  gap: 16px;
}

.profile-image-head h2{
  margin: 0 0 5px;
  font-size: 1.32rem;
}

.profile-image-head p{
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.avatar-upload-card{
  display: grid;
}

.avatar-file-input{
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
  padding: 0;
  margin: -1px;
}

.avatar-dropzone{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1.5px dashed rgba(85,101,214,.38);
  border-radius: 22px;
  background: linear-gradient(135deg,rgba(85,101,214,.08),rgba(255,255,255,.86));
  cursor: pointer;
  transition: border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease;
}

.avatar-dropzone:hover,
.avatar-dropzone.is-dragover{
  border-color: var(--accent);
  box-shadow: 0 14px 32px rgba(85,101,214,.16);
  transform: translateY(-1px);
  background: linear-gradient(135deg,rgba(85,101,214,.13),rgba(255,255,255,.94));
}

.avatar-drop-icon{
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg,var(--pink),var(--accent));
  color: #fff;
  font-weight: 900;
  font-size: 1.35rem;
  box-shadow: 0 10px 22px rgba(85,101,214,.22);
  flex: 0 0 auto;
}

.avatar-dropzone strong{
  display: block;
  color: var(--text);
  font-size: 1rem;
}

.avatar-dropzone small{
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.avatar-cropper{
  display: grid;
  gap: 14px;
}

.avatar-crop-stage{
  position: relative;
  width: min(360px,100%);
  aspect-ratio: 1/1;
  border-radius: 30px;
  overflow: hidden;
  background: linear-gradient(135deg,rgba(255,255,255,.96),rgba(240,243,255,.92));
  box-shadow: 0 18px 40px rgba(32,38,72,.14);
  border: 1px solid rgba(85,101,214,.16);
  touch-action: none;
  user-select: none;
}

.avatar-crop-canvas{
  width: 100%;
  height: 100%;
  display: block;
  cursor: grab;
  touch-action: none;
}

.avatar-crop-canvas.is-dragging{
  cursor: grabbing;
}

.avatar-crop-frame{
  position: absolute;
  inset: 12px;
  border: 2px solid rgba(255,255,255,.95);
  border-radius: 24px;
  box-shadow: 0 0 0 999px rgba(20,24,50,.16),inset 0 0 0 1px rgba(85,101,214,.22);
  pointer-events: none;
}

.avatar-crop-frame:before,
.avatar-crop-frame:after{
  content: "";
  position: absolute;
  left: 33.333%;
  right: 33.333%;
  top: 0;
  bottom: 0;
  border-left: 1px solid rgba(255,255,255,.65);
  border-right: 1px solid rgba(255,255,255,.65);
}

.avatar-crop-frame:after{
  left: 0;
  right: 0;
  top: 33.333%;
  bottom: 33.333%;
  border-left: 0;
  border-right: 0;
  border-top: 1px solid rgba(255,255,255,.65);
  border-bottom: 1px solid rgba(255,255,255,.65);
}

.avatar-crop-toolbar{
  display: grid;
  grid-template-columns: auto minmax(160px,1fr) auto auto;
  align-items: end;
  gap: 10px;
  width: min(560px,100%);
}

.avatar-crop-toolbar .btn-small{
  min-height: 42px;
}

.avatar-zoom-field{
  margin: 0;
}

.avatar-zoom-field input[type=range]{
  padding: 0;
  min-height: 42px;
  accent-color: var(--accent);
}

.avatar-actions{
  margin-top: 0;
}

.form-grid textarea[name="postal_address"]{
  min-height: 112px;
}

.profile-image-editor .field{
  margin: 0;
}

@media (max-width:760px){
.profile-hero,
.profile-image-head{
  align-items: flex-start;
}

.profile-hero{
  gap: 13px;
}

.avatar-dashboard{
  width: 66px;
  height: 66px;
}

.avatar-profile{
  width: 82px;
  height: 82px;
}

.profile-image-editor{
  padding: 14px;
  border-radius: 20px;
}

.avatar-crop-stage{
  width: 100%;
  border-radius: 24px;
}

.avatar-crop-frame{
  inset: 10px;
  border-radius: 20px;
}

.avatar-crop-toolbar{
  grid-template-columns: auto 1fr auto;
}

.avatar-crop-toolbar [data-avatar-center]{
  grid-column: 1/-1;
}
}

@media (max-width:420px){
.profile-hero,
.profile-image-head{
  flex-direction: column;
}

.avatar-dashboard{
  width: 72px;
  height: 72px;
}

.avatar-profile{
  width: 86px;
  height: 86px;
}

.avatar-dropzone{
  align-items: flex-start;
  padding: 14px;
}

.avatar-drop-icon{
  width: 38px;
  height: 38px;
  border-radius: 14px;
}

.avatar-crop-toolbar{
  grid-template-columns: 1fr 1fr;
}

.avatar-zoom-field{
  grid-column: 1/-1;
  grid-row: 1;
}

.avatar-crop-toolbar [data-avatar-center]{
  grid-column: 1/-1;
}
}

.profile-image-compact{
  padding: 16px;
  gap: 0;
}

.profile-image-row{
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.profile-image-row h2{
  margin: 0 0 4px;
  font-size: 1.18rem;
}

.profile-image-row p{
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.avatar-action-wrap{
  position: relative;
  width: max-content;
  flex: 0 0 auto;
}

.avatar-icon-button{
  position: absolute;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 999px;
  display: grid;
  place-items: center;
  cursor: pointer;
  color: #fff;
  box-shadow: 0 10px 22px rgba(54,42,92,.20);
  transition: transform .15s ease,box-shadow .15s ease,opacity .15s ease;
}

.avatar-icon-button:hover{
  transform: translateY(-1px) scale(1.03);
  box-shadow: 0 14px 28px rgba(54,42,92,.24);
}

.avatar-icon-button svg{
  width: 18px;
  height: 18px;
  fill: currentColor;
  display: block;
}

.avatar-icon-upload{
  right: -4px;
  bottom: 4px;
  background: linear-gradient(135deg,var(--pink),var(--accent) 55%,var(--blue));
}

.avatar-icon-delete{
  right: -4px;
  top: 4px;
  background: #d92f50;
}

.avatar-icon-button[hidden]{
  display: none !important;
}

.avatar-modal[hidden]{
  display: none !important;
}

.avatar-modal{
  z-index: 10020;
  overflow: auto;
  align-items: center;
  justify-items: center;
}

body.modal-open{
  overflow: hidden;
}

.avatar-modal-card{
  width: min(640px,calc(100vw - 28px));
  max-height: calc(100svh - 28px);
  overflow: auto !important;
}

.avatar-modal-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.avatar-modal-close{
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: #f4f1fb;
  color: var(--text);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  flex: 0 0 auto;
}

.avatar-modal-close:hover{
  background: #ebe5f8;
}

.avatar-modal .avatar-cropper{
  display: grid;
  gap: 14px;
  justify-items: center;
}

.avatar-modal .avatar-crop-stage{
  width: min(360px,100%);
}

.avatar-modal .avatar-crop-toolbar{
  width: 100%;
  grid-template-columns: auto minmax(160px,1fr) auto auto;
}

.address-grid{
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(110px,.55fr) minmax(0,1fr);
  gap: 15px;
  min-width: 0;
}

@media (max-width:760px){
.profile-image-compact{
  padding: 14px;
  border-radius: 20px;
}

.profile-image-row{
  align-items: flex-start;
  gap: 13px;
}

.avatar-profile{
  width: 82px;
  height: 82px;
}

.avatar-icon-button{
  width: 32px;
  height: 32px;
}

.avatar-icon-button svg{
  width: 17px;
  height: 17px;
}

.avatar-modal{
  padding: 14px;
  place-items: end center;
}

.avatar-modal-card{
  width: 100%;
  max-height: calc(100svh - 28px);
  border-radius: 24px;
}

.avatar-modal .modal-content{
  padding: 24px 16px 16px;
}

.avatar-modal-head{
  gap: 10px;
  margin-bottom: 12px;
}

.avatar-modal .avatar-crop-stage{
  width: min(100%,360px);
  border-radius: 24px;
}

.avatar-modal .avatar-crop-frame{
  inset: 10px;
  border-radius: 20px;
}

.avatar-modal .avatar-crop-toolbar{
  grid-template-columns: auto 1fr auto;
  gap: 9px;
}

.avatar-modal .avatar-crop-toolbar [data-avatar-center]{
  grid-column: 1/-1;
  width: 100%;
}

.avatar-modal-actions{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.avatar-modal-actions .btn,
.avatar-modal-actions .btn-secondary{
  width: 100%;
}

.address-grid{
  grid-template-columns: 1fr 1fr;
}

.address-grid .field:first-child{
  grid-column: 1/-1;
}
}

@media (max-width:460px){
.profile-image-row{
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  align-items: center;
}

.profile-image-row p{
  font-size: .93rem;
}

.avatar-profile{
  width: 76px;
  height: 76px;
}

.avatar-icon-button{
  width: 30px;
  height: 30px;
}

.avatar-modal{
  padding: 10px;
}

.avatar-modal-card{
  max-height: calc(100svh - 20px);
  border-radius: 22px;
}

.avatar-modal .modal-title{
  font-size: 1.28rem;
}

.avatar-modal .modal-message{
  font-size: .94rem;
}

.avatar-modal-close{
  width: 36px;
  height: 36px;
}

.avatar-modal .avatar-crop-toolbar{
  grid-template-columns: 1fr 1fr;
}

.avatar-modal .avatar-zoom-field{
  grid-column: 1/-1;
  grid-row: 1;
}

.avatar-modal .avatar-crop-toolbar [data-avatar-center]{
  grid-column: 1/-1;
}

.address-grid{
  grid-template-columns: 1fr;
}
}

.admin-section-card{
  margin-top: 18px;
}

@media (max-width:760px){
.admin-section-card{
  margin-top: 14px;
}
}

.profile-wrap-modern{
  max-width: 100%;
}

.profile-page-head{
  margin-bottom: 18px;
}

.profile-page-head h1{
  margin-bottom: 0;
  max-width: none;
}

.profile-form-modern{
  display: grid;
  grid-template-columns: minmax(230px,300px) minmax(0,1fr);
  gap: 18px;
  align-items: start;
}

.profile-avatar-panel,
.profile-fields-card{
  border: 1px solid rgba(32,29,47,.10);
  border-radius: 28px;
  background: linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.76));
  box-shadow: 0 18px 42px rgba(77,64,118,.10);
  min-width: 0;
}

.profile-avatar-panel{
  padding: 22px;
  position: relative;
  overflow: visible;
}

.profile-fields-card{
  display: grid;
  gap: 15px;
  padding: 22px;
}

.profile-fields-card h2,
.profile-image-row h2{
  margin: 0;
  font-size: 1.25rem;
  letter-spacing: -.025em;
}

.profile-image-row{
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  text-align: center;
  gap: 14px;
  min-width: 0;
}

.avatar-action-wrap{
  position: relative;
  display: grid;
  justify-items: center;
  width: max-content;
  max-width: 100%;
  padding: 0 0 22px;
  overflow: visible;
}

.avatar-ring{
  position: relative;
  width: max-content;
  border-radius: 999px;
  padding: 5px;
  background: conic-gradient(from 210deg,var(--pink),var(--accent),var(--blue),var(--teal),var(--orange),var(--pink));
  box-shadow: 0 18px 38px rgba(90,60,210,.18);
}

.avatar-ring:after{
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 999px;
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.92);
  pointer-events: none;
}

.avatar-ring .avatar{
  box-shadow: none;
  border: 4px solid #fff;
  background: linear-gradient(135deg,var(--pink),var(--accent) 52%,var(--blue));
}

.avatar-profile{
  width: 116px;
  height: 116px;
}

.avatar-icon-button{
  top: auto !important;
  right: auto !important;
  bottom: 0;
  width: 36px;
  height: 36px;
  background: #d92f50 !important;
  color: #fff;
  box-shadow: 0 11px 24px rgba(217,47,80,.26);
}

.avatar-icon-button:hover{
  box-shadow: 0 15px 30px rgba(217,47,80,.30);
}

.avatar-icon-upload{
  left: calc(50% - 39px);
}

.avatar-icon-delete{
  left: calc(50% + 3px);
}

.avatar-icon-button svg{
  width: 18px;
  height: 18px;
}

.profile-image-row p,
.profile-wrap-modern .lead,
.profile-fields-card small,
.avatar-modal .modal-message{
  display: none !important;
}

.profile-fields-card .field{
  margin: 0;
}

.profile-fields-card .form-actions{
  margin-top: 2px;
}

.profile-fields-card .form-actions .btn{
  min-width: 150px;
}

.avatar-modal .modal-content{
  gap: 14px;
}

.avatar-modal-head{
  align-items: center;
  margin-bottom: 10px;
}

.avatar-modal-head .modal-title{
  margin: 0;
}

@media (max-width:860px){
.profile-form-modern{
  grid-template-columns: 1fr;
  gap: 14px;
}

.profile-avatar-panel,
.profile-fields-card{
  padding: 18px;
  border-radius: 24px;
}

.profile-image-row{
  grid-template-columns: auto 1fr;
  justify-items: start;
  text-align: left;
  align-items: center;
  gap: 16px;
}

.avatar-profile{
  width: 96px;
  height: 96px;
}

.avatar-action-wrap{
  padding-bottom: 21px;
}
}

@media (max-width:520px){
.profile-page-head{
  margin-bottom: 14px;
}

.profile-avatar-panel,
.profile-fields-card{
  padding: 16px;
  border-radius: 22px;
}

.profile-image-row{
  grid-template-columns: 1fr;
  justify-items: center;
  text-align: center;
  gap: 12px;
}

.avatar-profile{
  width: 102px;
  height: 102px;
}

.avatar-icon-button{
  width: 34px;
  height: 34px;
}

.avatar-icon-upload{
  left: calc(50% - 37px);
}

.avatar-icon-delete{
  left: calc(50% + 3px);
}

.profile-fields-card .form-actions .btn{
  width: 100%;
}
}

@media (max-width:360px){
.avatar-profile{
  width: 92px;
  height: 92px;
}

.profile-avatar-panel,
.profile-fields-card{
  padding: 14px;
}

.avatar-modal .modal-content{
  padding: 20px 14px 14px;
}
}

.lead,
.field > small,
.danger-note,
.admin-section-card > p{
  display: none !important;
}

.avatar-edit-area{
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  cursor: pointer !important;
  line-height: 1 !important;
}

.avatar-edit-area:focus-visible{
  outline: 0 !important;
  box-shadow: 0 0 0 4px rgba(123,47,247,.18),0 18px 38px rgba(90,60,210,.18) !important;
}

.avatar-modal-actions{
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
}

@media (max-width:760px){
.avatar-modal-actions{
  grid-template-columns: 1fr !important;
}
}

.avatar-ring-dashboard{
  padding: 5px;
  flex: 0 0 auto;
}

.avatar-ring-dashboard:after{
  inset: 5px;
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.92);
}

.avatar-ring-dashboard .avatar{
  box-shadow: none;
  border: 4px solid #fff;
  background: linear-gradient(135deg,var(--pink),var(--accent) 52%,var(--blue));
}

.dashboard-grid-modern{
  margin-top: 22px;
}

.dashboard-card{
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(77,64,118,.11) !important;
  border-radius: 26px !important;
  box-shadow: 0 18px 38px rgba(77,64,118,.10) !important;
  background: #fff !important;
  isolation: isolate;
}

.dashboard-card:before{
  content: "";
  position: absolute;
  inset: 0;
  opacity: .95;
  z-index: 0;
}

.dashboard-card > *{
  position: relative;
  z-index: 1;
}

.dashboard-card .metric-icon{
  box-shadow: 0 12px 24px rgba(73,58,139,.18);
}

.dashboard-card .metric-value,
.dashboard-card h3{
  color: var(--text);
}

.dashboard-card .metric-label,
.dashboard-card p{
  color: #5f5f73;
}

.dashboard-card-profiles:before{
  background: linear-gradient(135deg,rgba(247,47,78,.12),rgba(123,47,247,.10) 45%,rgba(30,111,242,.11));
}

.dashboard-card-profile:before{
  background: linear-gradient(135deg,rgba(123,47,247,.14),rgba(30,111,242,.11) 55%,rgba(16,184,179,.10));
}

.dashboard-card-secure:before{
  background: linear-gradient(135deg,rgba(16,184,179,.14),rgba(30,111,242,.10) 48%,rgba(123,47,247,.10));
}

.dashboard-card-installation:before{
  background: linear-gradient(135deg,rgba(247,47,78,.10),rgba(123,47,247,.08) 42%,rgba(30,111,242,.08) 70%,rgba(255,138,22,.10));
}

.dashboard-card .metric-icon{
  background: linear-gradient(135deg,var(--pink),var(--accent) 48%,var(--blue),var(--teal),var(--orange));
}

@media (max-width:760px){
.avatar-ring-dashboard{
  padding: 4px;
}

.dashboard-card{
  border-radius: 24px !important;
}
}

.avatar,
.avatar-ring .avatar,
.avatar-ring-dashboard .avatar{
  background: conic-gradient(from 215deg,var(--pink),var(--accent),var(--blue),var(--teal),var(--orange),var(--pink)) !important;
}

.avatar img{
  background: #fff !important;
}

.status-info{
  color: #47377c;
  background: #f0ebff;
  display: inline-flex;
  border-radius: 999px;
  padding: 6px 10px;
  font-weight: 900;
  white-space: nowrap;
}

.avatar-modal .avatar-crop-stage{
  width: min(360px,100%,calc(100svh - 260px)) !important;
  min-width: 220px !important;
  max-height: 360px !important;
}

.avatar-modal .avatar-crop-frame{
  inset: 0 !important;
  border-radius: inherit !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.96),inset 0 0 0 999px rgba(20,24,50,.03) !important;
}

@media (max-width:760px){
.avatar-modal{
  align-items: start !important;
  place-items: start center !important;
  overflow: auto !important;
  padding-top: max(10px,env(safe-area-inset-top)) !important;
  padding-bottom: max(10px,env(safe-area-inset-bottom)) !important;
}

.avatar-modal-card{
  max-height: none !important;
  overflow: visible !important;
}

.avatar-modal .modal-content{
  gap: 10px !important;
}

.avatar-modal .avatar-crop-stage{
  width: min(100%,calc(100svh - 245px),340px) !important;
  min-width: 0 !important;
  margin-inline: auto !important;
}

.avatar-modal .avatar-crop-toolbar{
  gap: 8px !important;
}
}

@media (max-width:380px){
.avatar-modal .avatar-crop-stage{
  width: min(100%,calc(100svh - 230px),300px) !important;
}
}

.toast.info{
  color: #263c80;
  background: #eef3ff;
  border-color: #cfdbff;
}

.switch-field{
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: #fff;
  font-weight: 900;
  cursor: pointer;
  user-select: none;
}

.switch-field input[type="checkbox"]{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.switch-control{
  width: 52px;
  height: 30px;
  border-radius: 999px;
  background: #dadde8;
  position: relative;
  flex: 0 0 auto;
  transition: background .18s ease,box-shadow .18s ease;
}

.switch-control::after{
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  left: 3px;
  top: 3px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 9px rgba(20,20,40,.22);
  transition: transform .18s ease;
}

.switch-field input[type="checkbox"]:checked + .switch-control{
  background: linear-gradient(135deg,var(--pink),var(--accent) 52%,var(--blue));
}

.switch-field input[type="checkbox"]:checked + .switch-control::after{
  transform: translateX(22px);
}

.switch-label{
  color: var(--text);
  line-height: 1.25;
}

.switch-grid{
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}

.user-edit-card{
  margin-bottom: 18px;
}

@media (max-width:760px){
.switch-grid{
  grid-template-columns: 1fr;
}

.user-edit-card{
  margin-bottom: 14px;
}
}

.user-edit-modal[hidden]{
  display: none !important;
}

.user-edit-modal{
  z-index: 10015;
  overflow: auto;
  align-items: center;
  justify-items: center;
  padding: max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
}

.user-edit-modal-card{
  width: min(940px,calc(100vw - 32px));
  max-height: calc(100svh - 36px);
  overflow: auto !important;
}

.user-edit-modal-card .modal-content{
  padding: calc(24px + var(--brand-strip-height,7px)) 22px 22px;
}

.user-modal-head{
  align-items: center;
  margin-bottom: 16px;
}

.user-modal-head .eyebrow{
  margin: 0 0 5px;
}

.user-modal-head .modal-title{
  margin: 0;
}

.admin-user-edit-form{
  max-width: 100%;
}

.admin-user-edit-form .profile-avatar-panel,
.admin-user-edit-form .profile-fields-card{
  box-shadow: 0 12px 30px rgba(77,64,118,.08);
}

.admin-user-control-grid{
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 15px;
}

.admin-user-control-grid .switch-grid{
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
  align-items: stretch;
}

.admin-user-modal-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.admin-user-modal-actions .btn,
.admin-user-modal-actions .btn-secondary{
  min-width: 145px;
}

.user-edit-modal .avatar-modal{
  z-index: 10030;
}

@media (max-width:860px){
.user-edit-modal{
  place-items: end center;
  padding: 12px;
}

.user-edit-modal-card{
  width: 100%;
  max-height: calc(100svh - 24px);
  border-radius: 24px;
}

.user-edit-modal-card .modal-content{
  padding: calc(22px + var(--brand-strip-height,7px)) 16px 16px;
}

.admin-user-edit-form.profile-form-modern{
  grid-template-columns: 1fr;
}

.admin-user-control-grid .switch-grid{
  grid-template-columns: 1fr;
}

.admin-user-modal-actions{
  display: grid;
  grid-template-columns: 1fr;
}

.admin-user-modal-actions .btn,
.admin-user-modal-actions .btn-secondary{
  width: 100%;
  min-width: 0;
}
}

@media (max-width:460px){
.user-edit-modal{
  padding: 8px;
}

.user-edit-modal-card{
  max-height: calc(100svh - 16px);
  border-radius: 22px;
}

.user-modal-head{
  gap: 8px;
  margin-bottom: 12px;
}

.user-modal-head .modal-title{
  font-size: 1.24rem;
}

.admin-user-edit-form .profile-avatar-panel,
.admin-user-edit-form .profile-fields-card{
  padding: 14px;
  border-radius: 20px;
}
}

.page-card{
  overflow: visible !important;
}

.modal-backdrop,
.auth-modal,
.user-edit-modal,
.avatar-modal{
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  min-height: 100dvh !important;
  height: 100dvh !important;
  z-index: 10000 !important;
  display: grid !important;
  place-items: center !important;
  padding: max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)) !important;
  background: rgba(32,29,47,.34) !important;
  backdrop-filter: blur(12px) !important;
}

.modal-backdrop[hidden],
.auth-modal[hidden],
.user-edit-modal[hidden],
.avatar-modal[hidden]{
  display: none !important;
}

.auth-modal{
  z-index: 10020 !important;
}

.user-edit-modal{
  z-index: 10025 !important;
}

.avatar-modal{
  z-index: 10040 !important;
}

.modal-backdrop-reload{
  z-index: 10060 !important;
}

.auth-modal-card{
  width: min(560px,calc(100vw - 32px));
  max-height: calc(100dvh - 36px);
  overflow: auto !important;
}

.auth-modal-card .modal-content{
  display: grid;
  gap: 16px;
  padding: calc(24px + var(--brand-strip-height,7px)) 22px 22px;
}

.auth-modal-head{
  align-items: center;
  margin-bottom: 0;
}

.auth-modal-head .eyebrow{
  margin: 0 0 5px;
}

.auth-modal-head .modal-title{
  margin: 0;
}

.auth-modal-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.auth-login-actions{
  flex-wrap: nowrap;
}

.auth-modal-actions .btn,
.auth-modal-actions .btn-secondary{
  min-width: 132px;
  white-space: nowrap;
}

.auth-login-actions .btn,
.auth-login-actions .btn-secondary{
  flex: 1 1 0;
  min-width: 0;
}

.auth-modal-lead{
  margin-bottom: 0;
}

.admin-email-verification-status{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: #fbf9ff;
}

.admin-email-verification-status strong{
  font-size: .9rem;
}

.admin-email-verification-status small{
  flex-basis: 100%;
  color: var(--muted);
  line-height: 1.35;
}

@media (max-width:760px){
.modal-backdrop,
.auth-modal,
.user-edit-modal,
.avatar-modal{
  place-items: end center !important;
  padding: 12px !important;
}

.auth-modal-card{
  width: 100%;
  max-height: calc(100dvh - 24px);
  border-radius: 24px;
}

.auth-modal-card .modal-content{
  padding: calc(22px + var(--brand-strip-height,7px)) 16px 16px;
}

.auth-modal-actions{
  display: grid;
  grid-template-columns: 1fr;
}

.auth-modal-actions .btn,
.auth-modal-actions .btn-secondary{
  width: 100%;
  min-width: 0;
}
}

@media (max-width:460px){
.modal-backdrop,
.auth-modal,
.user-edit-modal,
.avatar-modal{
  padding: 8px !important;
}

.auth-modal-card{
  max-height: calc(100dvh - 16px);
  border-radius: 22px;
}
}

@media (max-width:760px){
.user-edit-modal{
  align-items: start !important;
  place-items: start center !important;
  overflow: auto !important;
  padding: max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom)) !important;
}

.user-edit-modal-card{
  width: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  border-radius: 24px !important;
}

.user-edit-modal-card .modal-content{
  padding: calc(22px + var(--brand-strip-height,7px)) 16px 16px !important;
}

.admin-user-edit-form.profile-form-modern{
  grid-template-columns: 1fr !important;
}
}

@media (max-width:420px){
.user-modal-head{
  align-items: flex-start !important;
}
}

.user-edit-modal-card,
.user-edit-modal-card *:not(.avatar-crop-canvas){
  touch-action: pan-y !important;
}

.user-edit-modal-card{
  cursor: auto !important;
}

.user-edit-modal-card.is-dragging{
  cursor: auto !important;
  transform: none !important;
}

body.modal-open .user-edit-modal:not([hidden]){
  isolation: isolate !important;
}

@media (max-width:760px){
.user-edit-modal{
  align-items: center !important;
  place-items: center !important;
  overflow: hidden !important;
  padding: max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom)) !important;
}

.user-edit-modal-card{
  width: 100% !important;
  max-width: 100% !important;
  height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  max-height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  border-radius: 24px !important;
  transform: none !important;
}

.user-edit-modal-card > .modal-content{
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  padding: calc(20px + var(--brand-strip-height,7px)) 14px 14px !important;
}

.user-modal-head{
  flex: 0 0 auto !important;
  margin-bottom: 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(32,29,47,.08) !important;
}

.admin-user-edit-form.profile-form-modern{
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  padding: 0 2px calc(16px + env(safe-area-inset-bottom)) 0 !important;
}

.admin-user-edit-form .profile-avatar-panel,
.admin-user-edit-form .profile-fields-card{
  min-height: auto !important;
  overflow: visible !important;
}

.admin-user-edit-form .profile-fields-card{
  gap: 14px !important;
}

.admin-user-modal-actions{
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin: 4px 0 0 !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid rgba(32,29,47,.10) !important;
  background: transparent !important;
  box-shadow: none !important;
  z-index: auto !important;
}

.admin-user-modal-actions .btn,
.admin-user-modal-actions .btn-secondary,
.admin-user-modal-actions .btn-danger{
  width: 100% !important;
  min-width: 0 !important;
}
}

@media (max-width:420px){
.user-edit-modal-card{
  border-radius: 22px !important;
}

.user-edit-modal-card > .modal-content{
  padding: calc(18px + var(--brand-strip-height,7px)) 12px 12px !important;
}

.user-modal-head .modal-title{
  font-size: 1.18rem !important;
}

.admin-user-edit-form .profile-avatar-panel,
.admin-user-edit-form .profile-fields-card{
  padding: 13px !important;
}
}

.user-edit-modal{
  z-index: 10030 !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  overflow: hidden !important;
  padding: max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)) !important;
}

.user-edit-modal-card{
  width: min(1020px,calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100dvh - 36px) !important;
  height: auto !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  cursor: auto !important;
  touch-action: auto !important;
  transform: none !important;
}

.user-edit-modal-card *:not(.avatar-crop-canvas){
  touch-action: auto !important;
}

.admin-user-edit-dialog{
  width: 100% !important;
  min-width: 0 !important;
  max-height: calc(100dvh - 36px) !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}

.user-edit-modal-content{
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 36px) !important;
  padding: calc(24px + var(--brand-strip-height,7px)) 22px 18px !important;
  gap: 0 !important;
}

.user-modal-head{
  flex: 0 0 auto !important;
  margin: 0 0 14px !important;
  padding: 0 0 14px !important;
  border-bottom: 1px solid rgba(32,29,47,.09) !important;
}

.admin-user-edit-body{
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch !important;
  display: grid !important;
  grid-template-columns: minmax(220px,290px) minmax(0,1fr) !important;
  gap: 16px !important;
  padding: 0 4px 2px 0 !important;
}

.admin-user-edit-body .profile-avatar-panel,
.admin-user-edit-body .profile-fields-card{
  min-width: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

.admin-user-avatar-panel{
  align-self: start !important;
  position: sticky !important;
  top: 0 !important;
}

.admin-user-fields-panel{
  display: grid !important;
  gap: 14px !important;
}

.admin-user-main-grid{
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 14px !important;
}

.admin-user-control-grid{
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  gap: 14px !important;
}

.admin-user-control-grid .switch-grid{
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 10px !important;
}

.admin-user-modal-actions{
  flex: 0 0 auto !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  z-index: auto !important;
  margin: 16px 0 0 !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid rgba(32,29,47,.10) !important;
  background: #fff !important;
  box-shadow: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
}

.admin-user-modal-actions .btn,
.admin-user-modal-actions .btn-secondary,
.admin-user-modal-actions .btn-danger{
  min-width: 150px !important;
  width: auto !important;
  white-space: normal !important;
}

.user-edit-modal .avatar-modal{
  z-index: 10050 !important;
}

@media (max-width:860px){
.user-edit-modal{
  padding: max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom)) !important;
}

.user-edit-modal-card,
.admin-user-edit-dialog,
.user-edit-modal-content{
  width: 100% !important;
  max-width: 100% !important;
  height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
}

.user-edit-modal-card{
  border-radius: 24px !important;
}

.user-edit-modal-content{
  padding: calc(20px + var(--brand-strip-height,7px)) 14px 14px !important;
}

.admin-user-edit-body{
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  padding: 0 2px 2px 0 !important;
}

.admin-user-avatar-panel{
  position: relative !important;
  top: auto !important;
}

.admin-user-main-grid,
.admin-user-control-grid .switch-grid,
.address-grid{
  grid-template-columns: 1fr !important;
}

.admin-user-modal-actions{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
}

.admin-user-modal-actions .btn,
.admin-user-modal-actions .btn-secondary,
.admin-user-modal-actions .btn-danger{
  width: 100% !important;
  min-width: 0 !important;
}
}

@media (max-width:420px){
.user-edit-modal{
  padding: max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom)) !important;
}

.user-edit-modal-card,
.admin-user-edit-dialog,
.user-edit-modal-content{
  height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  max-height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
}

.user-edit-modal-card{
  border-radius: 22px !important;
}

.user-edit-modal-content{
  padding: calc(18px + var(--brand-strip-height,7px)) 12px 12px !important;
}

.user-modal-head{
  margin-bottom: 12px !important;
  padding-bottom: 12px !important;
  align-items: flex-start !important;
}

.user-modal-head .modal-title{
  font-size: 1.18rem !important;
}

.admin-user-edit-body .profile-avatar-panel,
.admin-user-edit-body .profile-fields-card{
  padding: 13px !important;
  border-radius: 20px !important;
}
}

.admin-user-edit-page{
  max-width: 100%;
}

.admin-page-back{
  margin: 0 0 14px;
  display: flex;
  justify-content: flex-start;
}

.admin-user-edit-page h1{
  max-width: none;
  margin-bottom: 18px;
}

.admin-user-edit-page-form{
  align-items: stretch;
}

.admin-user-edit-page-form .profile-avatar-panel,
.admin-user-edit-page-form .admin-user-fields-panel{
  height: 100%;
}

.admin-user-edit-page-actions{
  margin-top: 8px;
  padding-top: 4px;
}

.admin-user-edit-page-actions .btn,
.admin-user-edit-page-actions .btn-secondary{
  min-width: 160px;
}

@media (max-width:860px){
.admin-user-edit-page-form{
  grid-template-columns: 1fr;
}

.admin-user-edit-page-actions{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.admin-user-edit-page-actions .btn,
.admin-user-edit-page-actions .btn-secondary{
  width: 100%;
  min-width: 0;
}
}

.admin-user-edit-page{
  max-width: 100% !important;
}

.admin-user-edit-page .profile-page-head{
  margin-bottom: 18px !important;
}

.admin-user-edit-page-form{
  display: grid !important;
  grid-template-columns: minmax(230px,300px) minmax(0,1fr) !important;
  gap: 18px !important;
  align-items: start !important;
}

.admin-user-edit-page-form .profile-avatar-panel,
.admin-user-edit-page-form .profile-fields-card{
  height: auto !important;
  min-height: 0 !important;
}

.admin-user-edit-page-form .profile-avatar-panel{
  align-self: start !important;
}

.admin-user-settings-section{
  display: grid;
  gap: 14px;
  margin-top: 4px;
  padding-top: 16px;
  border-top: 1px solid rgba(32,29,47,.10);
}

.admin-user-settings-section h2{
  margin: 0;
  font-size: 1.25rem;
  letter-spacing: -.025em;
}

.admin-user-edit-page-actions{
  margin-top: 4px !important;
  padding-top: 2px !important;
}

@media (max-width:860px){
.admin-user-edit-page-form{
  grid-template-columns: 1fr !important;
  gap: 14px !important;
}
}

.avatar-modal.modal-backdrop{
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  padding: max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)) !important;
  overflow: auto !important;
  background: rgba(32,29,47,.34) !important;
  backdrop-filter: blur(12px) !important;
  z-index: 10050 !important;
}

.avatar-modal.modal-backdrop[hidden]{
  display: none !important;
}

.avatar-modal .avatar-modal-card{
  position: relative !important;
  width: min(640px,calc(100vw - 32px)) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 36px) !important;
  overflow: auto !important;
  border: 1px solid var(--border) !important;
  border-radius: 26px !important;
  background: #fff !important;
  box-shadow: 0 28px 80px rgba(32,29,47,.24) !important;
  cursor: default !important;
  touch-action: auto !important;
  transform: none !important;
}

.avatar-modal .avatar-modal-card.is-dragging{
  cursor: default !important;
  user-select: auto !important;
}

.avatar-modal .avatar-modal-card > .modal-content{
  display: grid !important;
  gap: 16px !important;
  padding: calc(24px + var(--brand-strip-height,7px)) 22px 22px !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.avatar-modal .avatar-modal-head{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 !important;
}

.avatar-modal .avatar-modal-head .modal-title{
  margin: 0 !important;
  line-height: 1.12 !important;
}

.avatar-modal .avatar-cropper{
  display: grid !important;
  gap: 14px !important;
  justify-items: center !important;
  width: 100% !important;
}

.avatar-modal .avatar-crop-stage{
  position: relative !important;
  width: min(360px,100%) !important;
  height: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  max-height: none !important;
  aspect-ratio: 1/1 !important;
  border-radius: 30px !important;
  overflow: hidden !important;
  margin: 0 auto !important;
  background: linear-gradient(135deg,rgba(255,255,255,.96),rgba(240,243,255,.92)) !important;
  box-shadow: 0 18px 40px rgba(32,38,72,.14) !important;
  border: 1px solid rgba(85,101,214,.16) !important;
  touch-action: none !important;
}

.avatar-modal .avatar-crop-canvas{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  cursor: grab !important;
  touch-action: none !important;
}

.avatar-modal .avatar-crop-canvas.is-dragging{
  cursor: grabbing !important;
}

.avatar-modal .avatar-crop-frame{
  position: absolute !important;
  inset: 12px !important;
  border: 2px solid rgba(255,255,255,.95) !important;
  border-radius: 24px !important;
  box-shadow: 0 0 0 999px rgba(20,24,50,.16),inset 0 0 0 1px rgba(85,101,214,.22) !important;
  pointer-events: none !important;
}

.avatar-modal .avatar-crop-toolbar{
  display: grid !important;
  grid-template-columns: auto minmax(160px,1fr) auto auto !important;
  align-items: end !important;
  gap: 10px !important;
  width: min(560px,100%) !important;
}

.avatar-modal .avatar-zoom-field{
  margin: 0 !important;
}

.avatar-modal .avatar-zoom-field label{
  display: block !important;
}

.avatar-modal .avatar-zoom-field input[type=range]{
  min-height: 42px !important;
  padding: 0 !important;
}

.avatar-modal .avatar-modal-actions{
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
}

.avatar-modal .avatar-modal-actions .btn,
.avatar-modal .avatar-modal-actions .btn-secondary{
  width: auto !important;
  min-width: 145px !important;
}

@media (max-width:760px){
.avatar-modal.modal-backdrop{
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  padding: max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)) !important;
}

.avatar-modal .avatar-modal-card{
  width: min(640px,calc(100vw - 24px)) !important;
  max-height: calc(100dvh - 24px) !important;
  border-radius: 24px !important;
}

.avatar-modal .avatar-modal-card > .modal-content{
  padding: calc(22px + var(--brand-strip-height,7px)) 16px 16px !important;
  gap: 14px !important;
}

.avatar-modal .avatar-crop-stage{
  width: min(330px,calc(100vw - 64px),calc(100dvh - 285px)) !important;
  border-radius: 24px !important;
}

.avatar-modal .avatar-crop-frame{
  inset: 10px !important;
  border-radius: 20px !important;
}

.avatar-modal .avatar-crop-toolbar{
  grid-template-columns: auto 1fr auto !important;
  gap: 9px !important;
}

.avatar-modal .avatar-crop-toolbar [data-avatar-center]{
  grid-column: 1/-1 !important;
  width: 100% !important;
}

.avatar-modal .avatar-modal-actions{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

.avatar-modal .avatar-modal-actions .btn,
.avatar-modal .avatar-modal-actions .btn-secondary{
  width: 100% !important;
  min-width: 0 !important;
}
}

@media (max-width:420px){
.avatar-modal.modal-backdrop{
  padding: max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)) !important;
}

.avatar-modal .avatar-modal-card{
  width: calc(100vw - 16px) !important;
  max-height: calc(100dvh - 16px) !important;
  border-radius: 22px !important;
}

.avatar-modal .avatar-modal-card > .modal-content{
  padding: calc(20px + var(--brand-strip-height,7px)) 14px 14px !important;
}

.avatar-modal .avatar-modal-head .modal-title{
  font-size: 1.28rem !important;
}

.avatar-modal .avatar-modal-close{
  width: 36px !important;
  height: 36px !important;
}

.avatar-modal .avatar-crop-stage{
  width: min(300px,calc(100vw - 52px),calc(100dvh - 275px)) !important;
}

.avatar-modal .avatar-crop-toolbar{
  grid-template-columns: 1fr 1fr !important;
}

.avatar-modal .avatar-zoom-field{
  grid-column: 1/-1 !important;
  grid-row: 1 !important;
}

.avatar-modal .avatar-crop-toolbar [data-avatar-center]{
  grid-column: 1/-1 !important;
}
}

body > .avatar-modal.modal-backdrop{
  position: fixed !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  transform: none !important;
  display: grid !important;
  place-items: center !important;
  padding: max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)) !important;
  box-sizing: border-box !important;
  overflow: auto !important;
}

body > .avatar-modal.modal-backdrop[hidden]{
  display: none !important;
}

body > .avatar-modal.modal-backdrop .avatar-modal-card{
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  margin: auto !important;
  transform: none !important;
  width: min(640px,calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100dvh - 36px) !important;
  overflow: auto !important;
}

body > .avatar-modal.modal-backdrop .avatar-modal-close{
  position: static !important;
  margin: 0 !important;
  transform: none !important;
}

@media (max-width:760px){
body > .avatar-modal.modal-backdrop{
  place-items: center !important;
  padding: max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)) !important;
}

body > .avatar-modal.modal-backdrop .avatar-modal-card{
  width: calc(100vw - 24px) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
}
}

@media (max-width:420px){
body > .avatar-modal.modal-backdrop{
  padding: 8px !important;
}

body > .avatar-modal.modal-backdrop .avatar-modal-card{
  width: calc(100vw - 16px) !important;
  max-width: calc(100vw - 16px) !important;
  max-height: calc(100dvh - 16px) !important;
}
}

body > .avatar-modal.modal-backdrop.is-open{
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body > .avatar-modal.modal-backdrop.is-open .avatar-modal-card{
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.table-scroll{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  margin:0 0 24px!important;
  padding:0!important;
  border:1px solid var(--border)!important;
  border-radius:22px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-shadow:none!important;
  outline:0!important;
}
.table-scroll > table.check-table,
table.check-table{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  border-collapse:collapse!important;
  border-spacing:0!important;
  background:#fff!important;
  table-layout:fixed!important;
  box-shadow:none!important;
  outline:0!important;
}
.table-scroll > table.check-table thead,
table.check-table thead{
  background:linear-gradient(to bottom, rgba(123,47,247,.085) 0, rgba(123,47,247,.085) calc(100% - 1px), var(--border) calc(100% - 1px), var(--border) 100%)!important;
}
.table-scroll > table.check-table thead,
.table-scroll > table.check-table tbody,
.table-scroll > table.check-table tr,
.table-scroll > table.check-table th,
.table-scroll > table.check-table td,
table.check-table thead,
table.check-table tbody,
table.check-table tr,
table.check-table th,
table.check-table td{
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  outline:0!important;
}
.table-scroll > table.check-table th,
.table-scroll > table.check-table td,
table.check-table th,
table.check-table td{
  box-sizing:border-box!important;
  padding:14px 16px!important;
  text-align:left!important;
  vertical-align:middle!important;
  line-height:1.35!important;
  background:transparent!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
.table-scroll > table.check-table th,
table.check-table th{
  color:var(--text)!important;
  font-weight:950!important;
  white-space:nowrap!important;
}
.table-scroll > table.check-table tbody tr,
table.check-table tbody tr{
  background:#fff!important;
}
.table-scroll > table.check-table tbody tr + tr,
table.check-table tbody tr + tr{
  background-image:linear-gradient(var(--border), var(--border))!important;
  background-repeat:no-repeat!important;
  background-size:100% 1px!important;
  background-position:left top!important;
}
.table-scroll > table.check-table th:first-child,
.table-scroll > table.check-table td:first-child,
table.check-table th:first-child,
table.check-table td:first-child{
  padding-left:18px!important;
}
.table-scroll > table.check-table th:last-child,
.table-scroll > table.check-table td:last-child,
table.check-table th:last-child,
table.check-table td:last-child{
  padding-right:22px!important;
}
.table-sort{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  width:auto!important;
  max-width:100%!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:inherit!important;
  box-shadow:none!important;
  font:inherit!important;
  font-weight:950!important;
  cursor:pointer!important;
  text-align:left!important;
}
.table-sort::after{
  content:"↕";
  color:var(--muted);
  font-size:.86em;
  line-height:1;
  opacity:.72;
}
.table-sort[data-sort-direction="asc"]::after{
  content:"↑";
  color:var(--accent-dark);
  opacity:1;
}
.table-sort[data-sort-direction="desc"]::after{
  content:"↓";
  color:var(--accent-dark);
  opacity:1;
}
.table-scroll > table.check-table .table-actions,
table.check-table .table-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  width:100%!important;
  max-width:100%!important;
  padding:4px 0!important;
  overflow:visible!important;
}
.table-scroll > table.check-table .table-actions form,
table.check-table .table-actions form{
  display:inline-flex!important;
  margin:0!important;
}
.table-scroll > table.check-table .btn,
.table-scroll > table.check-table .btn-secondary,
.table-scroll > table.check-table .btn-ghost,
.table-scroll > table.check-table .btn-danger,
table.check-table .btn,
table.check-table .btn-secondary,
table.check-table .btn-ghost,
table.check-table .btn-danger{
  min-width:128px!important;
  justify-content:center!important;
  text-align:center!important;
}
@media (min-width:761px){
  .table-scroll > table.check-table,
  table.check-table{
    display:table!important;
  }
  .table-scroll > table.check-table thead,
  table.check-table thead{
    display:table-header-group!important;
  }
  .table-scroll > table.check-table tbody,
  table.check-table tbody{
    display:table-row-group!important;
  }
  .table-scroll > table.check-table tr,
  table.check-table tr{
    display:table-row!important;
  }
  .table-scroll > table.check-table th,
  .table-scroll > table.check-table td,
  table.check-table th,
  table.check-table td{
    display:table-cell!important;
  }
  table.user-table th:nth-child(1),
  table.user-table td:nth-child(1){width:16%!important;}
  table.user-table th:nth-child(2),
  table.user-table td:nth-child(2){width:17%!important;}
  table.user-table th:nth-child(3),
  table.user-table td:nth-child(3){width:16%!important;}
  table.user-table th:nth-child(4),
  table.user-table td:nth-child(4){width:16%!important;}
  table.user-table th:nth-child(5),
  table.user-table td:nth-child(5){width:16%!important;}
  table.user-table th:nth-child(6),
  table.user-table td:nth-child(6){width:19%!important;}
  table.backup-table th:nth-child(2),
  table.backup-table td:nth-child(2){width:170px!important;white-space:nowrap!important;}
  table.backup-table th:nth-child(3),
  table.backup-table td:nth-child(3){width:110px!important;white-space:nowrap!important;}
  table.backup-table th:nth-child(4),
  table.backup-table td:nth-child(4){width:330px!important;}
  table.history-table th:nth-child(1),
  table.history-table td:nth-child(1){width:170px!important;white-space:nowrap!important;}
  table.history-table th:nth-child(2),
  table.history-table td:nth-child(2){width:170px!important;}
  table.history-table th:nth-child(3),
  table.history-table td:nth-child(3){width:145px!important;}
  table.history-table th:nth-child(4),
  table.history-table td:nth-child(4){width:160px!important;}
  table.installed-updates-table th:nth-child(1),
  table.installed-updates-table td:nth-child(1){width:190px!important;white-space:nowrap!important;}
  table.installed-updates-table th:nth-child(2),
  table.installed-updates-table td:nth-child(2){width:145px!important;white-space:nowrap!important;}
  table.installed-updates-table th:nth-child(3),
  table.installed-updates-table td:nth-child(3){width:130px!important;white-space:nowrap!important;}
  table.installed-updates-table th:nth-child(4),
  table.installed-updates-table td:nth-child(4){width:180px!important;}
}
@media (max-width:760px){
  .table-scroll{
    margin:0 0 22px!important;
    border-radius:22px!important;
    overflow:hidden!important;
  }
  .table-scroll > table.check-table,
  table.check-table,
  .table-scroll > table.check-table tbody,
  table.check-table tbody,
  .table-scroll > table.check-table tr,
  table.check-table tr,
  .table-scroll > table.check-table td,
  table.check-table td{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    border:0!important;
    border-radius:0!important;
  }
  .table-scroll > table.check-table thead,
  table.check-table thead{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
    background:transparent!important;
  }
  .table-scroll > table.check-table tbody tr,
  table.check-table tbody tr{
    margin:0!important;
    padding:0!important;
    background:#fff!important;
  }
  .table-scroll > table.check-table tbody tr + tr,
  table.check-table tbody tr + tr{
    background-image:linear-gradient(rgba(32,29,47,.14), rgba(32,29,47,.14))!important;
  }
  .table-scroll > table.check-table td,
  table.check-table td{
    display:grid!important;
    grid-template-columns:minmax(104px,34%) minmax(0,1fr)!important;
    column-gap:14px!important;
    row-gap:4px!important;
    align-items:start!important;
    padding:10px 14px!important;
    background:#fff!important;
  }
  .table-scroll > table.check-table td:first-child,
  table.check-table td:first-child{
    padding-top:14px!important;
  }
  .table-scroll > table.check-table td:last-child,
  table.check-table td:last-child{
    padding-bottom:14px!important;
  }
  .table-scroll > table.check-table td::before,
  table.check-table td::before{
    content:attr(data-label)!important;
    display:block!important;
    color:var(--muted)!important;
    font-weight:900!important;
    line-height:1.25!important;
  }
  .table-scroll > table.check-table td[colspan],
  table.check-table td[colspan],
  .table-scroll > table.check-table .table-empty td,
  table.check-table .table-empty td{
    display:block!important;
    padding:14px!important;
  }
  .table-scroll > table.check-table td[colspan]::before,
  table.check-table td[colspan]::before,
  .table-scroll > table.check-table .table-empty td::before,
  table.check-table .table-empty td::before{
    content:""!important;
    display:none!important;
  }
  .table-scroll > table.check-table .table-actions,
  table.check-table .table-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding:2px 0!important;
  }
  .table-scroll > table.check-table .table-actions form,
  table.check-table .table-actions form{
    display:grid!important;
    width:100%!important;
  }
  .table-scroll > table.check-table .table-actions .btn-small,
  table.check-table .table-actions .btn-small{
    width:100%!important;
    min-width:0!important;
  }
}
@media (max-width:360px){
  .table-scroll > table.check-table td,
  table.check-table td{
    grid-template-columns:minmax(88px,32%) minmax(0,1fr)!important;
    column-gap:10px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
}


.security-card {
  margin-top: 1rem;
}

.security-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.security-method {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1rem;
  min-height: 100%;
  padding: 1rem;
  border: 1px solid rgba(30, 41, 59, .12);
  border-radius: 18px;
  background: rgba(255, 255, 255, .72);
}

.security-method h3 {
  margin: 0 0 .35rem;
  font-size: 1.05rem;
}

.security-method p {
  margin: 0;
  color: var(--muted);
}

.totp-setup {
  display: grid;
  gap: .9rem;
}

.totp-qr {
  width: min(260px, 100%);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  padding: .75rem;
  border: 1px solid rgba(30, 41, 59, .12);
  border-radius: 18px;
  background: #fff;
}

.totp-qr svg {
  display: block;
  width: 100%;
  height: auto;
}

.security-secret {
  overflow-wrap: anywhere;
}

.security-secret code {
  padding: .18rem .35rem;
  border-radius: .45rem;
  background: rgba(15, 23, 42, .07);
}

.security-form {
  gap: .8rem;
}

.passkey-list {
  display: grid;
  gap: .65rem;
}

.passkey-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .75rem;
  border: 1px solid rgba(30, 41, 59, .1);
  border-radius: 14px;
  background: rgba(248, 250, 252, .76);
}

.passkey-row span {
  display: block;
  margin-top: .15rem;
  color: var(--muted);
  font-size: .9rem;
}

@media (max-width: 820px) {
  .security-grid {
    grid-template-columns: 1fr;
  }

  .passkey-row {
    align-items: stretch;
    flex-direction: column;
  }
}

.status-muted {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: .45rem .75rem;
  border-radius: 999px;
  border: 1px solid rgba(100, 116, 139, .22);
  color: var(--muted);
  background: rgba(100, 116, 139, .08);
  font-weight: 700;
  font-size: .9rem;
}

.admin-security-method {
  min-height: auto;
}


.profile-wrap-modern{
  max-width: 100% !important;
}

.profile-page-head{
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 10px 18px;
  margin: 0 0 18px !important;
}

.profile-page-head h1{
  margin: 0 !important;
  max-width: none !important;
  line-height: 1.05;
}

.profile-dashboard-grid{
  display: grid;
  grid-template-columns: minmax(240px,300px) minmax(0,1fr);
  gap: 18px;
  align-items: start;
}

.profile-identity-form{
  display: contents !important;
}

.profile-dashboard-grid .profile-avatar-panel{
  grid-column: 1;
  grid-row: 1;
}

.profile-dashboard-grid .profile-personal-card{
  grid-column: 2;
  grid-row: 1;
}

.profile-dashboard-grid .security-card{
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 0 !important;
}

.profile-avatar-panel,
.profile-fields-card{
  border: 1px solid rgba(32,29,47,.10) !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.84)) !important;
  box-shadow: 0 16px 36px rgba(77,64,118,.09) !important;
}

.profile-avatar-panel{
  display: grid;
  align-content: start;
  gap: 18px;
  padding: 24px !important;
  position: relative;
  overflow: hidden;
}

.profile-avatar-panel:before,
.profile-fields-card:before{
  content: none !important;
  display: none !important;
}

.profile-fields-card{
  display: grid !important;
  gap: 18px !important;
  padding: 24px !important;
  position: relative;
  overflow: hidden;
}

.profile-image-row{
  gap: 16px !important;
}

.profile-card-title-row{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}

.profile-card-title-row .eyebrow,
.admin-user-settings-section .profile-card-title-row .eyebrow{
  display: block !important;
  margin: 0 0 4px;
}

.profile-card-title-row h2,
.admin-user-settings-section .profile-card-title-row h2{
  margin: 0 !important;
  font-size: 1.28rem;
  line-height: 1.15;
  letter-spacing: -.025em;
}

.profile-personal-card > .field:nth-of-type(1),
.profile-personal-card > .field:nth-of-type(2),
.profile-personal-card > .field:nth-of-type(3){
  margin: 0;
}

.profile-personal-card .address-grid,
.admin-user-fields-panel .address-grid{
  display: grid;
  grid-template-columns: minmax(0,1.4fr) minmax(110px,.55fr) minmax(0,1fr);
  gap: 14px;
}

.security-grid{
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 16px !important;
}

.security-method{
  min-height: 100%;
  padding: 18px !important;
  border: 1px solid rgba(32,29,47,.10) !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.78) !important;
  box-shadow: 0 10px 24px rgba(77,64,118,.06);
}

.security-method-head{
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 12px;
  align-items: start;
}

.security-method h3{
  margin: 0 0 6px !important;
  font-size: 1.08rem !important;
  letter-spacing: -.01em;
}

.security-method p{
  margin: 0 !important;
  color: var(--muted) !important;
  line-height: 1.45;
}

.security-state{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  min-height: 30px;
  padding: .34rem .66rem;
  border-radius: 999px;
  border: 1px solid rgba(32,29,47,.12);
  background: rgba(100,116,139,.08);
  color: var(--muted);
  font-size: .82rem;
  font-weight: 800;
}

.security-state-active{
  border-color: rgba(16,184,179,.32);
  background: rgba(16,184,179,.12);
  color: #087c78;
}

.security-state-inactive{
  border-color: rgba(100,116,139,.20);
  background: rgba(100,116,139,.08);
  color: var(--muted);
}

.security-action-form{
  margin-top: auto;
}

.security-form{
  gap: 12px !important;
}

.security-form .form-actions,
.security-method .form-actions{
  margin-top: auto !important;
}

.totp-setup{
  gap: 14px !important;
}

.totp-qr{
  width: min(232px,100%) !important;
  margin: 0 auto;
  padding: 14px !important;
  border-radius: 20px !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.8), 0 10px 22px rgba(77,64,118,.08);
}

.security-secret{
  margin: 0 !important;
  padding: 10px 12px;
  border: 1px dashed rgba(32,29,47,.16);
  border-radius: 14px;
  background: rgba(255,255,255,.64);
}

.passkey-list{
  gap: 10px !important;
}

.passkey-row{
  border-radius: 16px !important;
  background: rgba(255,255,255,.78) !important;
}

.admin-user-edit-page-form{
  display: grid !important;
  grid-template-columns: minmax(240px,300px) minmax(0,1fr) !important;
  gap: 18px !important;
  align-items: start !important;
}

.admin-user-edit-page-form .profile-avatar-panel{
  grid-column: 1;
  grid-row: 1;
}

.admin-user-edit-page-form .admin-user-fields-panel{
  grid-column: 2;
  grid-row: 1;
}

.admin-user-edit-page-form .admin-user-security-card{
  grid-column: 1;
  grid-row: 2;
}

.admin-user-edit-page-form .admin-user-management-card{
  grid-column: 2;
  grid-row: 2;
}

.admin-user-security-card .security-method{
  min-height: auto;
}

.admin-user-management-card .admin-user-settings-section{
  border-top: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.admin-user-edit-page-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 2px !important;
  padding-top: 0 !important;
}

.admin-user-edit-page-actions .btn,
.admin-user-edit-page-actions .btn-secondary{
  min-width: 160px;
}

@media (max-width:980px){
  .security-grid{
    grid-template-columns: 1fr !important;
  }
}

@media (max-width:860px){
  .profile-dashboard-grid,
  .admin-user-edit-page-form{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .profile-dashboard-grid .profile-avatar-panel,
  .profile-dashboard-grid .profile-personal-card,
  .profile-dashboard-grid .security-card,
  .admin-user-edit-page-form .profile-avatar-panel,
  .admin-user-edit-page-form .admin-user-fields-panel,
  .admin-user-edit-page-form .admin-user-security-card,
  .admin-user-edit-page-form .admin-user-management-card{
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  .profile-avatar-panel,
  .profile-fields-card{
    padding: 18px !important;
    border-radius: 22px !important;
  }

  .profile-personal-card .address-grid,
  .admin-user-fields-panel .address-grid{
    grid-template-columns: 1fr !important;
  }
}

@media (max-width:520px){
  .profile-page-head{
    margin-bottom: 14px !important;
  }

  .profile-card-title-row,
  .security-method-head{
    grid-template-columns: 1fr;
  }

  .profile-fields-card .form-actions,
  .admin-user-edit-page-actions{
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .profile-fields-card .form-actions .btn,
  .profile-fields-card .form-actions .btn-secondary,
  .profile-fields-card .form-actions .btn-danger,
  .admin-user-edit-page-actions .btn,
  .admin-user-edit-page-actions .btn-secondary{
    width: 100% !important;
    min-width: 0 !important;
  }
}


/* Profil-/Benutzer-Sicherheit 20260602.200209: klare Kartenstruktur, Blocksatz und volle Textbreite. */
.security-method-head{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:6px 12px !important;
  align-items:start !important;
}
.security-method-head > div{
  display:contents !important;
}
.security-method-head h3{
  grid-column:1 !important;
  grid-row:1 !important;
}
.security-method-head .security-state{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:end !important;
}
.security-method-head p{
  grid-column:1 / -1 !important;
  grid-row:2 !important;
  width:100% !important;
  max-width:none !important;
  text-align:justify !important;
  text-align-last:left !important;
  hyphens:auto !important;
}
.security-inline-note{
  margin:12px 0 0 !important;
  color:var(--muted) !important;
  line-height:1.45 !important;
  text-align:justify !important;
  text-align-last:left !important;
  hyphens:auto !important;
}
.admin-user-edit-page-form{
  display:grid !important;
  grid-template-columns:minmax(240px,300px) minmax(0,1fr) !important;
  gap:18px !important;
  align-items:start !important;
}
.admin-user-edit-page-form .profile-avatar-panel{
  grid-column:1 !important;
  grid-row:1 !important;
}
.admin-user-edit-page-form .admin-user-fields-panel{
  grid-column:2 !important;
  grid-row:1 !important;
}
.admin-user-edit-page-form .admin-user-security-card{
  grid-column:1 / -1 !important;
  grid-row:2 !important;
}
.admin-user-edit-page-form .admin-user-management-card{
  grid-column:1 / -1 !important;
  grid-row:3 !important;
}
.admin-user-security-card .admin-security-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
.admin-inline-security-form{
  margin-top:14px !important;
}
@media (max-width:980px){
  .admin-user-security-card .admin-security-grid{
    grid-template-columns:1fr !important;
  }
}
@media (max-width:860px){
  .admin-user-edit-page-form{
    grid-template-columns:1fr !important;
  }
  .admin-user-edit-page-form .profile-avatar-panel,
  .admin-user-edit-page-form .admin-user-fields-panel,
  .admin-user-edit-page-form .admin-user-security-card,
  .admin-user-edit-page-form .admin-user-management-card{
    grid-column:1 !important;
    grid-row:auto !important;
  }
}
@media (max-width:520px){
  .security-method-head{
    grid-template-columns:1fr !important;
  }
  .security-method-head .security-state{
    grid-column:1 !important;
    grid-row:2 !important;
    justify-self:start !important;
  }
  .security-method-head p{
    grid-column:1 !important;
    grid-row:3 !important;
  }
}

/* Einheitliche Seitenüberschriften wie in den Einstellungen */
.profile-page-head{
  display:block !important;
  margin:0 0 18px !important;
}
.profile-page-head h1{
  margin:.15rem 0 .5rem !important;
  max-width:none !important;
  line-height:1.08 !important;
}
.profile-wrap-modern > .lead,
.admin-user-edit-page > .lead{
  margin-bottom:18px;
  max-width:860px;
}
.profile-wrap-modern > h1,
.admin-user-edit-page > h1{
  margin-top:.15rem;
  margin-bottom:.5rem;
  max-width:none;
}


.flash-stack[hidden],
.flash-stack[data-flash-source][hidden]{
  display: none !important;
}

.settings-form{
  display: grid;
  gap: 18px;
}

.settings-accordion{
  display: grid;
  gap: 12px;
}

.settings-accordion-item{
  border: 1px solid rgba(32,29,47,.10);
  border-radius: 24px;
  background: linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,255,255,.88));
  box-shadow: 0 16px 36px rgba(77,64,118,.09);
  overflow: hidden;
}

.settings-accordion-summary{
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 22px 24px;
  cursor: pointer;
  list-style: none;
  min-width: 0;
}

.settings-accordion-summary::-webkit-details-marker{
  display: none;
}

.settings-accordion-summary:focus-visible{
  outline: 3px solid rgba(96,70,255,.22);
  outline-offset: -3px;
}

.settings-accordion-title{
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-accordion-title .eyebrow,
.settings-accordion-heading,
.settings-accordion-description{
  margin: 0;
}

.settings-accordion-heading{
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.025em;
}

.settings-accordion-description{
  color: var(--muted);
  font-weight: 700;
  line-height: 1.45;
}

.settings-accordion-icon{
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: inline-grid;
  place-items: center;
  position: relative;
  background: rgba(248,246,255,.94);
  box-shadow: 0 10px 22px rgba(77,64,118,.08);
  color: transparent;
  font-size: 0;
  font-weight: 900;
  overflow: hidden;
}

.settings-accordion-icon::before,
.settings-accordion-icon::after{
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16px;
  height: 3px;
  border-radius: 999px;
  background: var(--ink);
  transform: translate(-50%,-50%);
  transition: opacity .16s ease, transform .16s ease;
}

.settings-accordion-icon::after{
  transform: translate(-50%,-50%) rotate(90deg);
}

.settings-accordion-item[open] .settings-accordion-icon::before{
  transform: translate(-50%,-50%) scaleX(1.15);
}

.settings-accordion-item[open] .settings-accordion-icon::after{
  opacity: 0;
  transform: translate(-50%,-50%) scale(.45) rotate(90deg);
}

.settings-accordion-item[open] .settings-accordion-summary{
  border-bottom: 1px solid rgba(32,29,47,.08);
}

.settings-accordion-panel{
  padding: 20px 24px 24px;
}

.settings-fields-grid{
  display: grid;
  gap: 15px;
}

.settings-timezone-field small{
  display: block;
  margin-top: 2px;
}

.settings-actions{
  margin-top: 0;
  justify-content: flex-end;
}

@media (max-width: 600px){
  .settings-accordion{
    gap: 10px;
  }
  .settings-accordion-item{
    border-radius: 20px;
  }
  .settings-accordion-summary{
    padding: 18px;
    gap: 12px;
  }
  .settings-accordion-heading{
    font-size: 1.18rem;
  }
  .settings-accordion-description{
    font-size: .95rem;
  }
  .settings-accordion-icon{
    width: 36px;
    height: 36px;
    border-radius: 14px;
  }
  .settings-accordion-panel{
    padding: 16px 18px 18px;
  }
  .settings-actions,
  .settings-actions .btn{
    width: 100%;
  }
}

/* Einheitlicher oberer Abstand im Seitenrahmen */
@media (max-width:760px){
  .card-inner{
    padding-top: 24px;
  }
}

/* Einheitliche Abstände für Bereichsüberschriften in Karten */
.info-card > h2:first-child,
.feature-card > h2:first-child,
.metric-card > h2:first-child,
.admin-section-card > h2:first-child,
.info-card > .section-heading:first-child,
.feature-card > .section-heading:first-child,
.metric-card > .section-heading:first-child,
.admin-section-card > .section-heading:first-child{
  margin-top: 0 !important;
}

.info-card > .section-heading:first-child,
.feature-card > .section-heading:first-child,
.metric-card > .section-heading:first-child,
.admin-section-card > .section-heading:first-child{
  margin-bottom: 13px !important;
}

.info-card > .section-heading:first-child .section-title,
.feature-card > .section-heading:first-child .section-title,
.metric-card > .section-heading:first-child .section-title,
.admin-section-card > .section-heading:first-child .section-title{
  margin: 0 !important;
  line-height: 1.08 !important;
}

.info-card > .section-heading:first-child .btn-small,
.feature-card > .section-heading:first-child .btn-small,
.metric-card > .section-heading:first-child .btn-small,
.admin-section-card > .section-heading:first-child .btn-small{
  align-self: center !important;
}

@media (max-width:760px){
  .info-card > .section-heading:first-child,
  .feature-card > .section-heading:first-child,
  .metric-card > .section-heading:first-child,
  .admin-section-card > .section-heading:first-child{
    gap: 10px !important;
  }
}



/* Finaler Fix 20260602.220603: sichtbare Akkordeon-Icons, schlankes Admin-Submenü und stabiles Update-Reload-Modal */
.settings-accordion-heading{
  color: var(--text) !important;
}
.settings-accordion-summary::marker{
  content: '' !important;
}
.settings-accordion-icon{
  flex: 0 0 auto !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 11px !important;
  color: var(--text) !important;
  background: rgba(248,246,255,.96) !important;
  border: 1px solid rgba(32,29,47,.08) !important;
  box-shadow: 0 6px 14px rgba(77,64,118,.07) !important;
}
.settings-accordion-icon::before,
.settings-accordion-icon::after{
  width: 11px !important;
  height: 2px !important;
  background: var(--text) !important;
}
.settings-accordion-summary:hover .settings-accordion-icon,
.settings-accordion-summary:focus-visible .settings-accordion-icon{
  color: var(--accent-dark) !important;
  border-color: rgba(123,47,247,.22) !important;
}
.settings-accordion-summary:hover .settings-accordion-icon::before,
.settings-accordion-summary:hover .settings-accordion-icon::after,
.settings-accordion-summary:focus-visible .settings-accordion-icon::before,
.settings-accordion-summary:focus-visible .settings-accordion-icon::after{
  background: var(--accent-dark) !important;
}


@media (max-width:600px){
  .settings-accordion-icon{
    width: 28px !important;
    height: 28px !important;
    border-radius: 10px !important;
  }
  .settings-accordion-icon::before,
  .settings-accordion-icon::after{
    width: 10px !important;
    height: 2px !important;
  }
}

@media (min-width:981px){
  .nav-group{
    width: auto !important;
  }
  .nav-submenu{
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 32px) !important;
    justify-items: stretch !important;
  }
  .nav-sub-link{
    width: auto !important;
    min-width: 150px !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
  }
}

.modal-backdrop-reload{
  display: grid !important;
  place-items: center !important;
  padding: 18px !important;
  z-index: 9999 !important;
}
.modal-backdrop-reload .modal-card-reload{
  width: min(520px, calc(100vw - 32px)) !important;
  max-width: 520px !important;
}
.modal-backdrop-reload .modal-card-reload .modal-content{
  display: grid !important;
  gap: 16px !important;
  padding: 24px !important;
}
.modal-backdrop-reload .modal-card-reload .modal-title,
.modal-backdrop-reload .modal-card-reload .modal-message{
  margin: 0 !important;
}
.modal-backdrop-reload .modal-card-reload .modal-actions{
  display: flex !important;
  justify-content: flex-end !important;
  margin: 0 !important;
}
@media (max-width:520px){
  .modal-backdrop-reload .modal-card-reload .modal-actions,
  .modal-backdrop-reload .modal-card-reload .modal-actions .btn{
    width: 100% !important;
  }
}

/* Tabellenaktionen 20260602: Aktionsspalte entfernen, Zeilenauswahl und kompakte Werkzeugleiste */
.selectable-table-panel{
  display:grid!important;
  gap:12px!important;
  width:100%!important;
  max-width:100%!important;
  margin:0 0 24px!important;
}
.table-action-toolbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  width:100%!important;
  max-width:100%!important;
  padding:12px 14px!important;
  border:1px solid rgba(123,47,247,.16)!important;
  border-radius:20px!important;
  background:linear-gradient(135deg, rgba(123,47,247,.075), rgba(4,190,254,.045))!important;
  box-shadow:0 12px 30px rgba(54,42,92,.06)!important;
}
.table-selection-status{
  min-width:0!important;
  color:var(--muted)!important;
  font-weight:850!important;
  line-height:1.3!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.table-toolbar-buttons{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  flex:0 0 auto!important;
}
.table-toolbar-buttons form{
  display:inline-flex!important;
  margin:0!important;
}
.table-toolbar-buttons .btn-small,
.table-toolbar-buttons .btn-secondary,
.table-toolbar-buttons .btn-danger{
  min-width:126px!important;
  justify-content:center!important;
}
.table-toolbar-buttons button:disabled,
.table-toolbar-buttons .btn-secondary:disabled,
.table-toolbar-buttons .btn-danger:disabled{
  opacity:1!important;
  cursor:not-allowed!important;
  color:rgba(32,29,47,.42)!important;
  background:rgba(255,255,255,.58)!important;
  border-color:rgba(123,47,247,.08)!important;
  box-shadow:none!important;
  filter:none!important;
}
.selectable-table-panel .table-scroll-selectable{
  margin:0!important;
  max-height:min(62vh, 680px)!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable both-edges!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row],
.selectable-table-panel table.check-table tbody tr[data-selectable-row]{
  cursor:pointer!important;
  transition:background .16s ease, box-shadow .16s ease, transform .16s ease!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:hover,
.selectable-table-panel table.check-table tbody tr[data-selectable-row]:hover,
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:focus-visible,
.selectable-table-panel table.check-table tbody tr[data-selectable-row]:focus-visible{
  background:linear-gradient(90deg, rgba(123,47,247,.08), rgba(4,190,254,.05))!important;
  outline:0!important;
  box-shadow:inset 4px 0 0 rgba(123,47,247,.28)!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row].is-selected,
.selectable-table-panel table.check-table tbody tr[data-selectable-row].is-selected{
  background:linear-gradient(90deg, rgba(123,47,247,.18), rgba(4,190,254,.10))!important;
  box-shadow:inset 5px 0 0 var(--accent)!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row].is-selected + tr,
.selectable-table-panel table.check-table tbody tr[data-selectable-row].is-selected + tr{
  background-position:left top!important;
}
@media (min-width:761px){
  .selectable-table-panel .table-scroll-selectable > table.check-table thead th,
  .selectable-table-panel table.check-table thead th{
    position:sticky!important;
    top:0!important;
    z-index:3!important;
    background:linear-gradient(to bottom, #f7f2ff 0, #f7f2ff calc(100% - 1px), var(--border) calc(100% - 1px), var(--border) 100%)!important;
  }
  table.user-table th:nth-child(1),
  table.user-table td:nth-child(1){width:24%!important;}
  table.user-table th:nth-child(2),
  table.user-table td:nth-child(2){width:26%!important;}
  table.user-table th:nth-child(3),
  table.user-table td:nth-child(3){width:18%!important;}
  table.user-table th:nth-child(4),
  table.user-table td:nth-child(4){width:16%!important;}
  table.user-table th:nth-child(5),
  table.user-table td:nth-child(5){width:16%!important;}
  table.backup-table th:nth-child(1),
  table.backup-table td:nth-child(1){width:auto!important;}
  table.backup-table th:nth-child(2),
  table.backup-table td:nth-child(2){width:190px!important;white-space:nowrap!important;}
  table.backup-table th:nth-child(3),
  table.backup-table td:nth-child(3){width:120px!important;white-space:nowrap!important;}
}
@media (max-width:760px){
  .selectable-table-panel{
    gap:10px!important;
  }
  .table-action-toolbar{
    display:grid!important;
    grid-template-columns:1fr!important;
    padding:12px!important;
    border-radius:18px!important;
  }
  .table-selection-status{
    white-space:normal!important;
  }
  .table-toolbar-buttons{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    width:100%!important;
    gap:8px!important;
  }
  .table-toolbar-buttons form,
  .table-toolbar-buttons .btn-small,
  .table-toolbar-buttons .btn-secondary,
  .table-toolbar-buttons .btn-danger{
    width:100%!important;
    min-width:0!important;
  }
  .selectable-table-panel .table-scroll-selectable{
    max-height:min(70vh, 560px)!important;
  }
  .selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row].is-selected,
  .selectable-table-panel table.check-table tbody tr[data-selectable-row].is-selected{
    box-shadow:inset 4px 0 0 var(--accent)!important;
  }
}
@media (max-width:420px){
  .table-toolbar-buttons{
    grid-template-columns:1fr!important;
  }
}

.selectable-table-panel .table-scroll-selectable{
  width:100%!important;
  max-height:none!important;
  overflow:hidden!important;
  scrollbar-gutter:auto!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table,
.selectable-table-panel table.check-table{
  width:100%!important;
  max-width:100%!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table thead,
.selectable-table-panel table.check-table thead{
  background:linear-gradient(to bottom, rgba(123,47,247,.085) 0, rgba(123,47,247,.085) calc(100% - 1px), var(--border) calc(100% - 1px), var(--border) 100%)!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row],
.selectable-table-panel table.check-table tbody tr[data-selectable-row]{
  background:#fff!important;
  box-shadow:none!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row] > td,
.selectable-table-panel table.check-table tbody tr[data-selectable-row] > td{
  background:transparent!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:hover,
.selectable-table-panel table.check-table tbody tr[data-selectable-row]:hover,
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:focus-visible,
.selectable-table-panel table.check-table tbody tr[data-selectable-row]:focus-visible{
  background:linear-gradient(90deg, rgba(123,47,247,.055), rgba(4,190,254,.038))!important;
  box-shadow:none!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:hover > td,
.selectable-table-panel table.check-table tbody tr[data-selectable-row]:hover > td,
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:focus-visible > td,
.selectable-table-panel table.check-table tbody tr[data-selectable-row]:focus-visible > td{
  background:transparent!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row].is-selected,
.selectable-table-panel table.check-table tbody tr[data-selectable-row].is-selected{
  background:linear-gradient(90deg, rgba(123,47,247,.105), rgba(4,190,254,.058))!important;
  box-shadow:none!important;
}
.selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row].is-selected > td,
.selectable-table-panel table.check-table tbody tr[data-selectable-row].is-selected > td{
  background:transparent!important;
}
@media (min-width:761px){
  .selectable-table-panel .table-scroll-selectable > table.check-table thead th,
  .selectable-table-panel table.check-table thead th{
    position:static!important;
    top:auto!important;
    z-index:auto!important;
    background:transparent!important;
  }
}
@media (max-width:760px){
  .selectable-table-panel .table-scroll-selectable{
    max-height:none!important;
    overflow:hidden!important;
  }
  .selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row].is-selected > td,
  .selectable-table-panel table.check-table tbody tr[data-selectable-row].is-selected > td{
    background:linear-gradient(90deg, rgba(123,47,247,.105), rgba(4,190,254,.058))!important;
  }
  .selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:hover > td,
  .selectable-table-panel table.check-table tbody tr[data-selectable-row]:hover > td,
  .selectable-table-panel .table-scroll-selectable > table.check-table tbody tr[data-selectable-row]:focus-visible > td,
  .selectable-table-panel table.check-table tbody tr[data-selectable-row]:focus-visible > td{
    background:linear-gradient(90deg, rgba(123,47,247,.05), rgba(4,190,254,.035))!important;
  }
}

/* Navigation und Tabellen-Scroll: robuste Bedienung nach Updates */
.nav-group:focus-within > .nav-submenu[hidden]{
  display:grid!important;
}
.table-scroll,
.selectable-table-panel .table-scroll-selectable{
  max-height:none!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  overscroll-behavior:auto!important;
  overscroll-behavior-x:auto!important;
  overscroll-behavior-y:auto!important;
  touch-action:pan-x pan-y!important;
}

/* Sicherungstabelle: Desktop-Spalten sauber verteilen, keine überlappenden Zellinhalte */
.backup-create-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  align-items:center!important;
}
.backup-create-actions form{
  margin:0!important;
}
@media (min-width:761px){
  table.backup-table{
    table-layout:auto!important;
  }
  table.backup-table th:nth-child(1),
  table.backup-table td:nth-child(1){
    width:auto!important;
    min-width:0!important;
  }
  table.backup-table td:nth-child(1) strong{
    display:block!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
  table.backup-table th:nth-child(2),
  table.backup-table td:nth-child(2){
    width:150px!important;
    white-space:nowrap!important;
  }
  table.backup-table th:nth-child(3),
  table.backup-table td:nth-child(3){
    width:170px!important;
    white-space:nowrap!important;
  }
  table.backup-table th:nth-child(4),
  table.backup-table td:nth-child(4){
    width:115px!important;
    white-space:nowrap!important;
    text-align:right!important;
  }
}
@media (max-width:760px){
  .backup-create-actions,
  .backup-create-actions form,
  .backup-create-actions .btn,
  .backup-create-actions .btn-secondary{
    width:100%!important;
  }
  .backup-create-actions .btn,
  .backup-create-actions .btn-secondary{
    justify-content:center!important;
  }
}

/* Passkey-Zeilen: Text und Entfernen-Button sauber untereinander darstellen */
.passkey-row{
  display:grid!important;
  grid-template-columns:1fr!important;
  align-items:start!important;
  justify-content:start!important;
  gap:10px!important;
}
.passkey-row-text{
  min-width:0!important;
}
.passkey-row form{
  display:flex!important;
  justify-content:flex-start!important;
  margin:0!important;
}
.passkey-row .btn-danger,
.passkey-row .btn-small{
  width:auto!important;
  min-width:118px!important;
}


/* Sicherungstabelle final: Buttons kurz, Spalten ohne Überlappung und ohne Umbruch im Typ */
@media (min-width:761px){
  .table-scroll > table.backup-table,
  table.backup-table{
    table-layout:fixed!important;
    width:100%!important;
    min-width:0!important;
  }
  table.backup-table col.backup-col-name{width:42%!important;}
  table.backup-table col.backup-col-type{width:18%!important;}
  table.backup-table col.backup-col-created{width:24%!important;}
  table.backup-table col.backup-col-size{width:16%!important;}
  .table-scroll > table.backup-table th,
  .table-scroll > table.backup-table td,
  table.backup-table th,
  table.backup-table td{
    overflow:hidden!important;
    vertical-align:middle!important;
  }
  table.backup-table th:nth-child(1),
  table.backup-table td:nth-child(1){
    width:42%!important;
    min-width:0!important;
  }
  table.backup-table th:nth-child(2),
  table.backup-table td:nth-child(2){
    width:18%!important;
    min-width:130px!important;
    white-space:nowrap!important;
  }
  table.backup-table th:nth-child(3),
  table.backup-table td:nth-child(3){
    width:24%!important;
    min-width:175px!important;
    white-space:nowrap!important;
  }
  table.backup-table th:nth-child(4),
  table.backup-table td:nth-child(4){
    width:16%!important;
    min-width:110px!important;
    white-space:nowrap!important;
    text-align:right!important;
  }
  table.backup-table td:nth-child(1) strong{
    display:block!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
  table.backup-table td:nth-child(2) .status-muted{
    display:inline-flex!important;
    width:auto!important;
    max-width:100%!important;
    white-space:nowrap!important;
    word-break:keep-all!important;
    overflow-wrap:normal!important;
  }
}
@media (max-width:760px){
  table.backup-table td:nth-child(2),
  table.backup-table td:nth-child(2) .status-muted{
    white-space:nowrap!important;
    word-break:keep-all!important;
    overflow-wrap:normal!important;
  }
}


/* Passkey-Auswahl 20260602.224955: ein gemeinsamer Entfernen-Button, keine Reload-Bedienung */
.passkey-selection-panel{
  display:grid!important;
  gap:12px!important;
  width:100%!important;
}
.passkey-selection-status{
  padding:10px 12px!important;
  border:1px solid rgba(123,47,247,.12)!important;
  border-radius:16px!important;
  background:linear-gradient(135deg, rgba(123,47,247,.055), rgba(4,190,254,.035))!important;
}
.passkey-list{
  display:grid!important;
  gap:10px!important;
  width:100%!important;
}
.passkey-row{
  display:block!important;
  width:100%!important;
  padding:12px 12px!important;
  border:1px solid var(--border)!important;
  border-radius:18px!important;
  background:#fff!important;
  color:var(--text)!important;
  cursor:pointer!important;
  text-align:left!important;
  transition:background .16s ease, border-color .16s ease, box-shadow .16s ease!important;
}
.passkey-row:hover,
.passkey-row:focus-visible{
  outline:0!important;
  border-color:rgba(123,47,247,.20)!important;
  background:linear-gradient(90deg, rgba(123,47,247,.055), rgba(4,190,254,.038))!important;
}
.passkey-row.is-selected{
  border-color:rgba(123,47,247,.22)!important;
  background:linear-gradient(90deg, rgba(123,47,247,.105), rgba(4,190,254,.058))!important;
  box-shadow:0 12px 26px rgba(54,42,92,.07)!important;
}
.passkey-row-text{
  display:grid!important;
  gap:4px!important;
  width:100%!important;
  min-width:0!important;
}
.passkey-row-text strong{
  display:block!important;
  width:100%!important;
  line-height:1.15!important;
  overflow-wrap:anywhere!important;
}
.passkey-last-used{
  display:grid!important;
  gap:1px!important;
  width:100%!important;
  color:var(--muted)!important;
  line-height:1.2!important;
}
.passkey-last-used-label,
.passkey-last-used-value{
  display:block!important;
}
.passkey-remove-form{
  margin-top:0!important;
  justify-content:flex-start!important;
}
.passkey-remove-form .btn-danger{
  min-width:0!important;
  width:auto!important;
  justify-content:center!important;
}
.passkey-remove-form .btn-danger:disabled{
  opacity:1!important;
  cursor:not-allowed!important;
  color:rgba(32,29,47,.50)!important;
  background:#f4f1fb!important;
  border:1px solid rgba(123,47,247,.12)!important;
  box-shadow:0 10px 22px rgba(54,42,92,.06)!important;
  filter:none!important;
}
.passkey-empty{
  margin:0!important;
  color:var(--muted)!important;
}
@media (max-width:520px){
  .passkey-remove-form,
  .passkey-remove-form .btn-danger{
    width:100%!important;
  }
}


/* Sicherungsbutton 20260602.225057: Datensicherung in Logo-Orange */
.backup-create-actions .backup-data-btn{
  color:#fff!important;
  border-color:rgba(255,138,22,.45)!important;
  background:linear-gradient(135deg, var(--orange), #ffb347)!important;
  box-shadow:0 14px 34px rgba(255,138,22,.22)!important;
}
.backup-create-actions .backup-data-btn:hover,
.backup-create-actions .backup-data-btn:focus-visible{
  color:#fff!important;
  border-color:rgba(255,138,22,.65)!important;
  background:linear-gradient(135deg, #ff7a00, var(--orange))!important;
}

/* Version 20260602.225222: Backup-Dateinamen werden serverseitig atomar reserviert. */


/* Passkey-Entfernen-Button 20260602.230110: deaktiviert sichtbar als Button anzeigen */
.passkey-remove-form .btn-danger:disabled,
.passkey-remove-form .btn-danger[disabled]{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:46px!important;
  padding:11px 17px!important;
  border-radius:999px!important;
  color:rgba(32,29,47,.50)!important;
  background:#f4f1fb!important;
  border:1px solid rgba(123,47,247,.12)!important;
  box-shadow:0 10px 22px rgba(54,42,92,.06)!important;
}
.passkey-remove-form .btn-danger:not(:disabled){
  color:#fff!important;
  background:linear-gradient(135deg,var(--btn-danger) 0%,#e2365a 100%)!important;
  border:1px solid transparent!important;
  box-shadow:var(--btn-shadow-danger-soft)!important;
}

.btn-danger:not(:disabled):not([disabled]){
  color:#fff!important;
  background:linear-gradient(135deg,var(--btn-danger) 0%,#e2365a 100%)!important;
  border:1px solid transparent!important;
  box-shadow:var(--btn-shadow-danger-soft)!important;
}
.btn-danger:not(:disabled):not([disabled]):hover,
.btn-danger:not(:disabled):not([disabled]):focus-visible{
  color:#fff!important;
  background:linear-gradient(135deg,var(--btn-danger-dark) 0%,var(--btn-danger) 100%)!important;
  border-color:transparent!important;
  box-shadow:0 8px 16px rgba(220,47,80,.20)!important;
}

@media (max-width:760px){
  .auth-login-actions{
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
  }

  .auth-login-actions .btn,
  .auth-login-actions .btn-secondary{
    width: auto;
    min-width: 0;
    flex: 1 1 0;
    padding-left: 8px;
    padding-right: 8px;
    font-size: .82rem;
  }
}


/* Popups 20260602.2332: alle Dialoge über den Kopfbereich verschiebbar machen */
.modal-card[data-draggable-ready="1"],
.auth-modal-card[data-draggable-ready="1"],
.user-edit-modal-card[data-draggable-ready="1"],
.avatar-modal .avatar-modal-card[data-draggable-ready="1"]{
  transform: translate(var(--drag-x,0px),var(--drag-y,0px)) !important;
  cursor: default !important;
  touch-action: auto !important;
}
.modal-drag-handle{
  cursor: grab !important;
  touch-action: none !important;
  user-select: none !important;
}
.modal-card.is-dragging,
.auth-modal-card.is-dragging,
.user-edit-modal-card.is-dragging,
.avatar-modal .avatar-modal-card.is-dragging{
  cursor: grabbing !important;
  user-select: none !important;
}
.modal-card.is-dragging .modal-drag-handle,
.auth-modal-card.is-dragging .modal-drag-handle,
.user-edit-modal-card.is-dragging .modal-drag-handle,
.avatar-modal .avatar-modal-card.is-dragging .modal-drag-handle{
  cursor: grabbing !important;
}
.modal-card.is-dragging *,
.auth-modal-card.is-dragging *,
.user-edit-modal-card.is-dragging *,
.avatar-modal .avatar-modal-card.is-dragging *{
  user-select: none !important;
}

/* Login-Popup 20260602.2332: Buttons nicht quetschen, sondern sauber verteilen */
.auth-modal-card{
  width: min(660px,calc(100vw - 32px)) !important;
}
.auth-login-actions{
  display: grid !important;
  grid-template-columns: repeat(auto-fit,minmax(145px,1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
  justify-content: stretch !important;
}
.auth-login-actions .btn,
.auth-login-actions .btn-secondary{
  width: 100% !important;
  min-width: 0 !important;
  flex: none !important;
  padding: 11px 14px !important;
  font-size: .93rem !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  justify-content: center !important;
}
@media (max-width:520px){
  .auth-modal-card{
    width: min(100%,calc(100vw - 28px)) !important;
  }
  .auth-login-actions{
    grid-template-columns: 1fr !important;
  }
  .auth-login-actions .btn,
  .auth-login-actions .btn-secondary{
    white-space: normal !important;
    font-size: .95rem !important;
    padding: 12px 14px !important;
  }
}

/* Button-Text 20260602.2339: in der gesamten PWA keine Button-Zeilenumbrüche */
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.btn,
.btn-secondary,
.btn-danger,
.btn-small,
.button,
[role="button"]{
  white-space: nowrap !important;
  text-wrap: nowrap !important;
}
.auth-modal-card{
  width: min(760px,calc(100vw - 32px)) !important;
}
.auth-login-actions{
  grid-template-columns: repeat(auto-fit,minmax(175px,1fr)) !important;
}
.auth-login-actions .btn,
.auth-login-actions .btn-secondary{
  white-space: nowrap !important;
  min-height: 44px !important;
  font-size: .95rem !important;
}
@media (max-width:520px){
  .auth-login-actions .btn,
  .auth-login-actions .btn-secondary{
    white-space: nowrap !important;
    font-size: .9rem !important;
  }
}


/* Modal-Kopfbereiche: der Drag-/Kopfbereich beginnt bündig am oberen Popup-Rand. */
.modal-card > .modal-content > .avatar-modal-head,
.user-edit-modal-card > .user-edit-modal-content > .user-modal-head{
  margin-top: calc(-1 * (24px + var(--brand-strip-height,7px))) !important;
  margin-right: -22px !important;
  margin-bottom: 16px !important;
  margin-left: -22px !important;
  padding: calc(16px + var(--brand-strip-height,7px)) 22px 14px !important;
  min-height: calc(58px + var(--brand-strip-height,7px)) !important;
  border-bottom: 1px solid rgba(32,29,47,.09) !important;
  border-top-left-radius: inherit !important;
  border-top-right-radius: inherit !important;
  cursor: grab !important;
  touch-action: none !important;
}

.modal-card.is-dragging > .modal-content > .avatar-modal-head,
.user-edit-modal-card.is-dragging > .user-edit-modal-content > .user-modal-head{
  cursor: grabbing !important;
}

.modal-card > .modal-content > .avatar-modal-head .avatar-modal-close,
.user-edit-modal-card > .user-edit-modal-content > .user-modal-head .avatar-modal-close{
  align-self: flex-start !important;
}

@media (max-width:760px){
  .auth-modal-card > .modal-content > .auth-modal-head{
    margin-top: calc(-1 * (22px + var(--brand-strip-height,7px))) !important;
    margin-right: -16px !important;
    margin-left: -16px !important;
    margin-bottom: 14px !important;
    padding: calc(14px + var(--brand-strip-height,7px)) 16px 12px !important;
    min-height: calc(54px + var(--brand-strip-height,7px)) !important;
  }

  .avatar-modal .avatar-modal-card > .modal-content > .avatar-modal-head{
    margin-top: calc(-1 * (20px + var(--brand-strip-height,7px))) !important;
    margin-right: -14px !important;
    margin-left: -14px !important;
    margin-bottom: 14px !important;
    padding: calc(14px + var(--brand-strip-height,7px)) 14px 12px !important;
    min-height: calc(52px + var(--brand-strip-height,7px)) !important;
  }

  .user-edit-modal-card > .user-edit-modal-content > .user-modal-head{
    margin-top: calc(-1 * (20px + var(--brand-strip-height,7px))) !important;
    margin-right: -14px !important;
    margin-left: -14px !important;
    margin-bottom: 12px !important;
    padding: calc(14px + var(--brand-strip-height,7px)) 14px 12px !important;
    min-height: calc(52px + var(--brand-strip-height,7px)) !important;
  }
}

@media (max-width:420px){
  .auth-modal-card > .modal-content > .auth-modal-head,
  .avatar-modal .avatar-modal-card > .modal-content > .avatar-modal-head,
  .user-edit-modal-card > .user-edit-modal-content > .user-modal-head{
    margin-right: -12px !important;
    margin-left: -12px !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
  }
}

/* Popups ohne eigene Headerzeile: Titel als bündiger Kopfbereich. */
.modal-card > .modal-content > .modal-title:first-child{
  display: block !important;
  margin-top: calc(-1 * (24px + var(--brand-strip-height,7px))) !important;
  margin-right: -22px !important;
  margin-bottom: 16px !important;
  margin-left: -22px !important;
  padding: calc(16px + var(--brand-strip-height,7px)) 22px 14px !important;
  min-height: calc(58px + var(--brand-strip-height,7px)) !important;
  border-bottom: 1px solid rgba(32,29,47,.09) !important;
  border-top-left-radius: inherit !important;
  border-top-right-radius: inherit !important;
  cursor: grab !important;
  touch-action: none !important;
}

.modal-card.is-dragging > .modal-content > .modal-title:first-child{
  cursor: grabbing !important;
}

@media (max-width:760px){
  .modal-card > .modal-content > .modal-title:first-child{
    margin-top: calc(-1 * (22px + var(--brand-strip-height,7px))) !important;
    margin-right: -16px !important;
    margin-left: -16px !important;
    margin-bottom: 14px !important;
    padding: calc(14px + var(--brand-strip-height,7px)) 16px 12px !important;
    min-height: calc(54px + var(--brand-strip-height,7px)) !important;
  }
}

@media (max-width:420px){
  .modal-card > .modal-content > .modal-title:first-child{
    margin-right: -12px !important;
    margin-left: -12px !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
  }
}


/* Toasts müssen auch bei geöffneten PopUPs lesbar bleiben. */
.toast-stack{
  z-index: 10120 !important;
}

body.modal-open .toast-stack{
  z-index: 10120 !important;
  pointer-events: none;
}

body.modal-open .toast{
  position: relative;
  z-index: 10121 !important;
  box-shadow: 0 20px 46px rgba(32,29,47,.28) !important;
}

@media (max-width:860px){
  body > .modal-backdrop:not([hidden]),
  body > .auth-modal:not([hidden]),
  body > .user-edit-modal:not([hidden]),
  body > .avatar-modal:not([hidden]),
  body > .modal-backdrop-reload:not([hidden]){
    display:grid !important;
    place-items:center !important;
    align-items:center !important;
    justify-items:center !important;
    width:100vw !important;
    height:100dvh !important;
    min-height:100dvh !important;
    margin:0 !important;
    padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)) !important;
    overflow:auto !important;
    box-sizing:border-box !important;
  }

  body > .modal-backdrop:not([hidden]) > .modal-card,
  body > .auth-modal:not([hidden]) > .auth-modal-card,
  body > .user-edit-modal:not([hidden]) > .user-edit-modal-card,
  body > .avatar-modal:not([hidden]) > .avatar-modal-card,
  body > .modal-backdrop-reload:not([hidden]) > .modal-card-reload{
    align-self:center !important;
    justify-self:center !important;
    margin:auto !important;
    transform:translate(0px,0px) !important;
  }
}

@media (max-width:420px){
  body > .modal-backdrop:not([hidden]),
  body > .auth-modal:not([hidden]),
  body > .user-edit-modal:not([hidden]),
  body > .avatar-modal:not([hidden]),
  body > .modal-backdrop-reload:not([hidden]){
    place-items:center !important;
    align-items:center !important;
    justify-items:center !important;
    padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)) !important;
  }
}

@media (max-width:760px){
  .actions,
  .form-actions,
  .section-heading,
  .modal-actions,
  .auth-modal-actions,
  .auth-login-actions,
  .avatar-modal-actions,
  .admin-user-modal-actions,
  .table-actions,
  .table-toolbar-buttons,
  .backup-create-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    align-items:stretch!important;
    justify-items:stretch!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
  }

  .actions > *,
  .form-actions > *,
  .section-heading > form,
  .modal-actions > *,
  .auth-modal-actions > *,
  .auth-login-actions > *,
  .avatar-modal-actions > *,
  .admin-user-modal-actions > *,
  .table-actions > *,
  .table-actions form,
  .table-toolbar-buttons > *,
  .table-toolbar-buttons form,
  .backup-create-actions > *,
  .backup-create-actions form{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  .btn,
  .btn-secondary,
  .btn-ghost,
  .btn-danger{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:1 1 auto!important;
    justify-content:center!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }

  .btn-small.btn,
  .btn-small.btn-secondary,
  .btn-small.btn-ghost,
  .btn-small.btn-danger,
  .btn.btn-small,
  .btn-secondary.btn-small,
  .btn-ghost.btn-small,
  .btn-danger.btn-small{
    min-height:44px!important;
    padding-left:14px!important;
    padding-right:14px!important;
    align-self:stretch!important;
    font-size:clamp(.9rem,3.6vw,1rem)!important;
  }

  .nav-button,
  .nav-link,
  .nav-group-summary,
  .nav-sub-link,
  .table-sort,
  .avatar-ring,
  .avatar-edit-area,
  .avatar-icon-button,
  .avatar-modal-close,
  .password-toggle{
    width:auto!important;
  }

  .section-heading .btn-small{
    align-self:stretch!important;
  }

  .table-scroll > table.check-table td,
  table.check-table td{
    padding-left:14px!important;
    padding-right:14px!important;
  }

  .table-scroll > table.check-table td:first-child,
  table.check-table td:first-child{
    padding-left:14px!important;
    padding-right:14px!important;
  }
}

@media (max-width:360px){
  .table-scroll > table.check-table td,
  table.check-table td,
  .table-scroll > table.check-table td:first-child,
  table.check-table td:first-child{
    padding-left:12px!important;
    padding-right:12px!important;
  }
}

@media (max-width:760px){
  .main-nav .nav-form,
  .main-nav .nav-group,
  .main-nav .nav-submenu,
  .main-nav .nav-link,
  .main-nav .nav-button,
  .main-nav .nav-group-toggle,
  .main-nav .nav-sub-link{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  .main-nav .nav-link,
  .main-nav .nav-button,
  .main-nav .nav-group-toggle,
  .main-nav .nav-sub-link{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    text-align:left!important;
  }

}

@media (max-width:760px){
  .table-scroll > table.check-table tbody,
  table.check-table tbody{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
    gap:0!important;
    background:#fff!important;
  }

  .table-scroll > table.check-table tbody tr,
  table.check-table tbody tr{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
    background:#fff!important;
    background-image:none!important;
    box-shadow:none!important;
  }

  .table-scroll > table.check-table tbody tr:not(:last-child),
  table.check-table tbody tr:not(:last-child){
    border-bottom:1px solid var(--border)!important;
  }

  .table-scroll > table.check-table tbody tr + tr,
  table.check-table tbody tr + tr{
    border-top:0!important;
    background-image:none!important;
  }

  .table-scroll > table.check-table td,
  table.check-table td,
  .table-scroll > table.check-table td + td,
  table.check-table td + td{
    border-top:0!important;
    border-bottom:0!important;
  }

  .table-scroll > table.check-table .table-empty,
  table.check-table .table-empty{
    border-bottom:0!important;
  }

  .table-scroll > table.check-table .table-empty td,
  table.check-table .table-empty td,
  .table-scroll > table.check-table td[colspan],
  table.check-table td[colspan]{
    border-top:0!important;
    border-bottom:0!important;
  }
}