*{box-sizing:border-box}
:root{
  --ink:#302a22;--muted:#766b5d;--line:#eadfce;--card:rgba(255,255,255,.94);
  --soft:#f8f2e8;--gold:#b99b52;--gold-dark:#7a612b;--green:#3f7d5a;
  --red:#d43f32;--orange:#df8d1f;--blue:#396f8f;
}
body{
  margin:0;min-height:100vh;font-family:Arial,sans-serif;color:var(--ink);
  background:radial-gradient(circle at 0% 100%,rgba(221,190,112,.24),transparent 26%),
  linear-gradient(110deg,#f8f1e7 0%,#f7f4ed 50%,#eef5f2 100%);
  padding-bottom:84px;
}
.users-shell{width:min(1480px,calc(100% - 48px));margin:24px auto 0}
.users-header,.users-band,.users-list,.users-detail,.modal-card{
  border:1px solid var(--line);background:var(--card);box-shadow:0 18px 54px rgba(80,61,30,.1)
}
.users-header{padding:22px;border-radius:26px}
.users-header-top{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:18px}
.users-title h1{margin:0;font-size:clamp(2rem,4vw,3.15rem);line-height:1}
.users-title p{margin:.6rem 0 0;color:var(--muted);font-size:1.05rem}
.users-header-actions{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:flex-end}
.users-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:0 18px;border:0;border-radius:999px;background:var(--gold);color:#fff;font:inherit;font-weight:900;text-decoration:none;cursor:pointer;white-space:nowrap}
.users-btn.secondary{background:#fff;color:var(--gold-dark);border:1px solid var(--line)}
.users-btn.danger{background:#fff3f1;color:var(--red);border:1px solid #f2c8c0}
.users-btn:disabled{opacity:.55;cursor:not-allowed}
.users-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.users-tab{min-height:72px;padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}
.users-tab strong{display:block;font-size:1.02rem}.users-tab span{display:block;margin-top:.25rem;color:var(--muted);font-size:.9rem}
.users-tab.active{border-color:rgba(185,155,82,.7);background:var(--soft);box-shadow:0 12px 34px rgba(80,61,30,.12)}
.users-band{margin-top:18px;padding:16px;border-radius:22px}
.band-row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filter-btn{min-height:38px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-weight:800;cursor:pointer}
.filter-btn.active{background:var(--gold);color:#fff;border-color:var(--gold)}
.search{min-height:42px;min-width:min(320px,100%);padding:0 14px;border:1px solid var(--line);border-radius:999px;font:inherit}
.users-main{display:grid;grid-template-columns:420px minmax(0,1fr);gap:18px;margin-top:18px}
.users-list,.users-detail{border-radius:24px;overflow:hidden}
.list-head,.detail-head{padding:18px;border-bottom:1px solid var(--line)}
.list-head h2,.detail-head h2{margin:0 0 .35rem;font-size:1.35rem}.list-head p,.detail-head p{margin:0;color:var(--muted)}
.user-item{width:100%;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:16px 18px;border:0;border-bottom:1px solid var(--line);background:#fff;text-align:left;cursor:pointer}
.user-item:hover,.user-item.active{background:var(--soft)}
.user-item strong{display:block;color:var(--ink)}.user-item span{display:block;margin-top:.25rem;color:var(--muted);font-size:.92rem}
.badge{display:inline-flex;align-items:center;min-height:30px;padding:0 10px;border-radius:999px;font-weight:900;font-size:.82rem;white-space:nowrap}
.badge.active{background:#eef7f1;color:var(--green)}.badge.pending{background:#fff5df;color:#9b661a}.badge.suspended{background:#fff3f1;color:var(--red)}.badge.info{background:#edf5fa;color:var(--blue)}
.detail-body{padding:18px}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.info-card{min-height:98px;padding:16px;border:1px solid var(--line);border-radius:18px;background:#fff}
.info-card span,.form-field span{display:block;margin-bottom:8px;color:#8a7658;font-size:.82rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.info-card strong{display:block;color:#201b16}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.history{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}.history h3{margin:0 0 10px}.history ul{margin:0;padding-left:18px;color:var(--muted)}
.toast{position:fixed;right:18px;bottom:86px;z-index:40;max-width:360px;padding:14px 16px;border-radius:16px;background:#221d17;color:#fff;font-weight:800;box-shadow:0 16px 42px rgba(0,0,0,.22)}
.toast[hidden],.modal[hidden]{display:none!important}
.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(37,30,22,.42)}
.modal-card{width:min(620px,100%);border-radius:24px;padding:22px}
.modal-card h2{margin:0 0 14px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.form-field.full{grid-column:1/-1}
.form-field input,.form-field select{width:100%;min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:14px;font:inherit;background:#fff}
.users-footer{position:fixed;left:0;right:0;bottom:0;min-height:70px;display:flex;align-items:center;justify-content:center;gap:42px;border-top:1px solid var(--line);background:rgba(255,250,242,.96);backdrop-filter:blur(8px)}
.users-footer a{display:grid;place-items:center;width:42px;height:42px;border-radius:999px;text-decoration:none;font-size:24px}
@media(max-width:980px){.users-shell{width:min(100% - 22px,1480px);margin-top:14px}.users-header-top{flex-direction:column}.users-header-actions{justify-content:flex-start}.users-tabs{grid-template-columns:1fr 1fr}.users-main{grid-template-columns:1fr}.detail-grid,.form-grid{grid-template-columns:1fr}}
@media(max-width:560px){.users-tabs{grid-template-columns:1fr}.band-row{align-items:stretch}.search{width:100%}.filters{width:100%}.filter-btn{flex:1}}

.badge.deleted{background:#eeeeee;color:#555;border:1px solid #d4d4d4}
.users-btn:disabled{opacity:.45;cursor:not-allowed}
.note{margin:14px 0;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fff8ea;color:var(--ink);font-weight:700}