:root{
  --bg:#050505;
  --panel:#090909;
  --panel2:#0c0c0c;
  --text:#f3f3f3;
  --muted:#858585;
  --soft:#b5b5b5;
  --line:rgba(255,255,255,.09);
  --line2:rgba(255,255,255,.15);
  --white:#f6f6f6;
}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}
body{overflow:hidden}
button,input{font:inherit}
button{color:inherit}
a{color:inherit;text-decoration:none}

.background-grid{
  position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.22;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:72px 72px;
  animation:gridMove 24s linear infinite;
}
.background-noise{
  position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.035;
  background-image:
    radial-gradient(circle at 10% 20%,#fff 0 1px,transparent 1px),
    radial-gradient(circle at 70% 50%,#fff 0 1px,transparent 1px);
  background-size:180px 180px,230px 230px;
}
.ambient{position:fixed;border-radius:50%;filter:blur(130px);background:#fff;pointer-events:none;z-index:0}
.ambient-a{width:520px;height:520px;left:-100px;top:18%;opacity:.025}
.ambient-b{width:460px;height:460px;right:-100px;bottom:-80px;opacity:.022}
@keyframes gridMove{to{transform:translate3d(72px,72px,0)}}

.auth-screen{
  position:relative;z-index:2;height:100vh;min-height:720px;display:grid;
  grid-template-rows:88px 1fr 58px;padding:0 clamp(28px,4.5vw,82px);
}
.brand{display:flex;align-items:center;gap:11px;width:max-content}
.brand img{width:39px;height:39px;object-fit:contain;filter:grayscale(1) brightness(1.08)}
.brand span{font-size:18px;font-weight:900;letter-spacing:-.03em}
.brand small{margin-left:8px;color:#666;font-size:8px;font-weight:900;letter-spacing:.22em}

.auth-layout{
  align-self:center;display:grid;grid-template-columns:minmax(0,1fr) minmax(480px,590px);
  gap:clamp(60px,8vw,160px);align-items:center;max-width:1500px;width:100%;margin:auto;
}
.auth-intro{max-width:690px}
.intro-kicker{
  display:inline-flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid var(--line);
  border-radius:999px;background:rgba(255,255,255,.025);color:#aaa;
  font-size:9px;font-weight:900;letter-spacing:.18em
}
.intro-kicker span{width:7px;height:7px;border-radius:50%;background:#eee;box-shadow:0 0 12px rgba(255,255,255,.4)}
.auth-intro h1{
  margin:26px 0 0;font-family:Oswald,Impact,sans-serif;font-size:clamp(78px,7vw,136px);
  line-height:.79;letter-spacing:-.055em;text-transform:uppercase
}
.auth-intro h1 span{display:block;margin-top:18px;color:#a9a9a9}
.auth-intro>p{max-width:570px;margin:29px 0 0;color:#919191;font-size:14px;line-height:1.75}
.intro-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:30px}
.intro-stats>div{padding:15px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.018)}
.intro-stats span{display:block;color:#646464;font-size:8px;font-weight:900;letter-spacing:.16em}
.intro-stats strong{display:block;margin-top:7px;font-size:16px;font-weight:900}
.intro-stats small{display:block;margin-top:3px;color:#696969;font-size:9px}
.with-dot{display:flex!important;align-items:center;gap:7px}
.with-dot i,.system-badge i{width:7px;height:7px;border-radius:50%;background:#eee;box-shadow:0 0 10px rgba(255,255,255,.35)}

.auth-card{
  position:relative;padding:25px 27px 22px;border:1px solid var(--line2);border-radius:25px;
  background:linear-gradient(180deg,rgba(255,255,255,.042),rgba(255,255,255,.012)),rgba(7,7,7,.92);
  box-shadow:0 34px 90px rgba(0,0,0,.45),inset 0 1px rgba(255,255,255,.04);backdrop-filter:blur(16px)
}
.auth-card-line{position:absolute;top:0;left:25px;right:25px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent)}
.auth-tabs{
  display:grid;grid-template-columns:1fr 1fr;padding:4px;border:1px solid var(--line);
  border-radius:14px;background:#060606;margin-bottom:23px
}
.auth-tab{height:43px;border:0;border-radius:10px;background:transparent;color:#777;cursor:pointer;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;transition:.2s}
.auth-tab.active{background:#eeeeee;color:#090909;box-shadow:0 6px 22px rgba(255,255,255,.06)}
.auth-panel{display:none}
.auth-panel.active{display:block;animation:panelIn .28s ease both}
@keyframes panelIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}

.panel-head>span,.card-head span,.section-kicker{color:#666;font-size:8px;font-weight:900;letter-spacing:.21em}
.panel-head h2{margin:5px 0 0;font-family:Oswald,Impact,sans-serif;font-size:34px;line-height:1;text-transform:uppercase}
.panel-head p{margin:8px 0 0;color:#777;font-size:11px;line-height:1.6}

.auth-form{display:grid;gap:14px;margin-top:21px}
.auth-form label>span{display:block;margin-bottom:7px;color:#d5d5d5;font-size:10px;font-weight:800}
.input-wrap{position:relative}
.input-wrap input{
  width:100%;height:49px;padding:0 14px;border:1px solid var(--line);border-radius:13px;
  outline:none;background:#070707;color:#f5f5f5;font-size:12px;transition:.18s
}
.input-wrap input::placeholder{color:#4f4f4f}
.input-wrap input:focus{border-color:rgba(255,255,255,.27);box-shadow:0 0 0 3px rgba(255,255,255,.025);background:#0a0a0a}
.password-wrap input{padding-right:68px}
.show-password{
  position:absolute;right:12px;top:50%;transform:translateY(-50%);border:0;background:none;
  color:#696969;cursor:pointer;font-size:8px;font-weight:900;letter-spacing:.12em
}
.show-password:hover{color:#ddd}
.register-passwords{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-row{display:flex;justify-content:space-between;align-items:center}
.remember,.terms{display:flex!important;align-items:center;gap:8px;cursor:pointer}
.remember input,.terms input{accent-color:#eee}
.remember span,.terms span{margin:0!important;color:#777!important;font-size:9px!important;font-weight:600!important;line-height:1.45}
.terms a{color:#ddd;text-decoration:underline}
.text-button,.switch-copy button{border:0;background:transparent;color:#9a9a9a;cursor:pointer;font-size:9px;font-weight:800}
.text-button:hover,.switch-copy button:hover{color:#fff}
.form-message{min-height:15px;font-size:9px;font-weight:700;color:#aaa}
.form-message.error{color:#d4d4d4}
.form-message.success{color:#fff}
.primary-button{
  height:52px;border:1px solid rgba(255,255,255,.2);border-radius:14px;background:linear-gradient(180deg,#f7f7f7,#d7d7d7);
  color:#080808;display:flex;align-items:center;justify-content:space-between;padding:0 18px;cursor:pointer;
  font-size:10px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;transition:.18s
}
.primary-button:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(255,255,255,.08)}
.primary-button:disabled{opacity:.5;cursor:wait;transform:none}
.primary-button b{font-size:18px;font-weight:600}
.switch-copy{text-align:center;color:#656565;font-size:9px;margin:16px 0 0}
.switch-copy button{color:#ddd;padding:0 3px}
.security-note{
  margin-top:20px;padding:12px;border-top:1px solid var(--line);display:flex;gap:10px;align-items:flex-start
}
.lock-icon{font-size:9px;color:#777;margin-top:2px}
.security-note strong{font-size:9px}
.security-note p{margin:3px 0 0;color:#575757;font-size:8px;line-height:1.5}

.auth-footer{border-top:1px solid var(--line);display:flex;align-items:center;gap:26px;color:#5f5f5f;font-size:8px;font-weight:700}
.auth-footer a:hover{color:#fff}
.auth-footer span:last-child{margin-left:auto;color:#a0a0a0;font-family:monospace;font-size:10px}

.hidden{display:none!important}

/* Dashboard */
.app-screen{position:relative;z-index:3;height:100vh;display:grid;grid-template-columns:265px 1fr;background:#050505}
.sidebar{border-right:1px solid var(--line);padding:27px 20px;display:flex;flex-direction:column;background:#070707}
.sidebar-brand{display:flex;gap:10px;align-items:center;padding:0 5px}
.sidebar-brand img{width:38px;height:38px;object-fit:contain;filter:grayscale(1)}
.sidebar-brand strong{display:block;font-size:16px;font-weight:900}
.sidebar-brand span{display:block;margin-top:2px;color:#555;font-size:7px;font-weight:900;letter-spacing:.2em}
.side-nav{display:grid;gap:7px;margin-top:54px}
.side-nav button{
  position:relative;height:54px;border:1px solid transparent;border-radius:13px;background:transparent;color:#777;
  display:flex;align-items:center;gap:12px;padding:0 12px;text-align:left
}
.side-nav button.active{border-color:var(--line);background:rgba(255,255,255,.035);color:#f1f1f1}
.side-nav button span{color:#505050;font-size:8px;font-weight:900}
.side-nav button b{font-size:10px;letter-spacing:.04em}
.side-nav button small{margin-left:auto;font-size:6px;letter-spacing:.1em;color:#454545}
.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:19px 5px 0}
.sidebar-bottom a{color:#707070;font-size:8px;font-weight:800}
.sidebar-bottom a:hover{color:#fff}

.dashboard{min-width:0;display:grid;grid-template-rows:82px 1fr 46px;overflow:hidden}
.dashboard-topbar{
  border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;
  background:rgba(8,8,8,.8);backdrop-filter:blur(14px)
}
.dashboard-topbar>div:first-child>span{color:#525252;font-size:7px;font-weight:900;letter-spacing:.2em}
.dashboard-topbar h2{margin:3px 0 0;font-family:Oswald,sans-serif;font-size:22px;text-transform:uppercase}
.account-menu{display:flex;align-items:center;gap:10px}
.account-avatar{
  width:34px;height:34px;border-radius:10px;background:#efefef;color:#090909;display:grid;place-items:center;font-weight:900;font-size:12px
}
.account-menu strong{display:block;font-size:9px}
.account-menu>div:nth-child(2)>span{display:block;margin-top:2px;color:#626262;font-size:7px}
.account-menu button{
  margin-left:9px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:#0b0b0b;color:#999;
  cursor:pointer;font-size:7px;font-weight:900;text-transform:uppercase;letter-spacing:.1em
}
.account-menu button:hover{color:#fff;border-color:var(--line2)}

.dashboard-content{overflow:auto;padding:32px 34px 28px}
.welcome-block{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.welcome-block h1{margin:8px 0 0;font-family:Oswald,sans-serif;font-size:55px;line-height:.95;text-transform:uppercase}
.welcome-block h1 span{color:#a7a7a7}
.welcome-block p{max-width:680px;margin:12px 0 0;color:#747474;font-size:11px;line-height:1.65}
.system-badge{min-width:190px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#090909}
.system-badge>span{display:block;color:#555;font-size:7px;font-weight:900;letter-spacing:.18em}
.system-badge strong{display:flex;align-items:center;gap:7px;margin-top:7px;font-size:11px}
.system-badge small{display:block;margin-top:4px;color:#555;font-size:7px}

.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:28px}
.stat-card,.service-card,.profile-card{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),#080808}
.stat-card{padding:19px}
.stat-card>span{color:#5d5d5d;font-size:7px;font-weight:900;letter-spacing:.16em}
.stat-card strong{display:block;margin-top:10px;font-family:Oswald,sans-serif;font-size:27px}
.stat-card small{display:block;margin-top:5px;color:#5a5a5a;font-size:8px}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(310px,.65fr);gap:13px;margin-top:13px}
.service-card,.profile-card{padding:20px}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:15px}
.card-head h3{margin:5px 0 0;font-family:Oswald,sans-serif;font-size:23px;text-transform:uppercase}
.ghost-code{color:#444;font-family:monospace;font-size:8px}
.empty-state{min-height:245px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:25px}
.empty-icon{width:42px;height:42px;border:1px solid var(--line2);border-radius:13px;display:grid;place-items:center;color:#aaa;font-size:20px}
.empty-state h4{margin:13px 0 0;font-size:11px}
.empty-state p{max-width:390px;margin:7px 0 0;color:#646464;font-size:9px;line-height:1.55}
.empty-state button{margin-top:16px;padding:10px 13px;border:1px solid var(--line);border-radius:10px;background:#0b0b0b;color:#4f4f4f;font-size:7px;font-weight:900;text-transform:uppercase}
.profile-card dl{margin:12px 0 0}
.profile-card dl>div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.055)}
.profile-card dt{color:#585858;font-size:8px}
.profile-card dd{margin:0;color:#c9c9c9;font-size:8px;font-weight:800;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:190px}
.dashboard-footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;color:#4f4f4f;font-size:7px}
.dashboard-footer span:last-child{color:#898989;font-family:monospace;font-size:9px}

@media(max-width:1050px){
  body{overflow:auto}
  .auth-screen{height:auto;min-height:100vh;grid-template-rows:78px 1fr auto;padding:0 24px}
  .auth-layout{grid-template-columns:1fr;gap:36px;padding:35px 0 50px}
  .auth-intro{display:none}
  .auth-card{width:min(100%,560px);margin:auto}
  .auth-footer{padding:18px 0;flex-wrap:wrap}
  .app-screen{grid-template-columns:80px 1fr}
  .sidebar{padding:22px 12px}
  .sidebar-brand div,.side-nav button b,.side-nav button small,.sidebar-bottom{display:none}
  .sidebar-brand{justify-content:center}
  .side-nav button{justify-content:center;padding:0}
  .dashboard-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .app-screen{display:block;height:auto;min-height:100vh}
  .sidebar{display:none}
  .dashboard{min-height:100vh}
  .dashboard-topbar{padding:0 18px}
  .account-menu>div:nth-child(2){display:none}
  .dashboard-content{padding:24px 18px}
  .welcome-block{display:block}
  .system-badge{margin-top:18px}
  .stats-grid{grid-template-columns:1fr}
  .welcome-block h1{font-size:42px}
  .auth-card{padding:20px 18px}
  .register-passwords{grid-template-columns:1fr}
  .auth-footer{gap:13px}
}


/* ===== V2 VISUAL UPGRADE ===== */

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-size: 16px;
  letter-spacing: -0.01em;
}

.auth-intro h1,
.panel-head h2,
.dashboard-topbar h2,
.welcome-block h1,
.card-head h3,
.stat-card strong {
  font-family: Inter, Arial, sans-serif !important;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.brand span {
  font-size: 20px;
}

.brand small {
  font-size: 9px;
}

.auth-card {
  border-radius: 28px;
  padding: 29px 31px 25px;
  border-color: rgba(255,255,255,.13);
  background:
    linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.008)),
    rgba(8,8,8,.95);
}

.auth-tab {
  font-size: 12px;
}

.panel-head > span,
.card-head span,
.section-kicker {
  font-size: 9px;
}

.panel-head h2 {
  font-size: 36px;
  letter-spacing: -0.045em;
}

.panel-head p {
  font-size: 13px;
}

.auth-form label > span {
  font-size: 12px;
}

.input-wrap input {
  height: 54px;
  font-size: 14px;
  border-radius: 14px;
  padding-left: 16px;
}

.primary-button {
  height: 56px;
  font-size: 11px;
}

.security-note strong {
  font-size: 10px;
}

.security-note p {
  font-size: 9px;
}

.sidebar {
  width: auto;
  padding: 28px 20px;
  background: linear-gradient(180deg,#080808,#060606);
}

.sidebar-brand strong {
  font-size: 18px;
}

.sidebar-brand span {
  font-size: 8px;
}

.side-nav button {
  height: 58px;
  border-radius: 15px;
}

.side-nav button b {
  font-size: 12px;
}

.side-nav button span {
  font-size: 9px;
}

.dashboard {
  background:
    radial-gradient(circle at 85% 0%, rgba(255,255,255,.025), transparent 30%),
    #050505;
}

.dashboard-topbar {
  height: 88px;
  padding: 0 38px;
  background: rgba(7,7,7,.88);
}

.dashboard-topbar > div:first-child > span {
  font-size: 8px;
}

.dashboard-topbar h2 {
  font-size: 24px;
  letter-spacing: -0.04em;
}

.dashboard-content {
  padding: 36px 38px 32px;
}

.welcome-block h1 {
  font-size: clamp(44px,4vw,62px);
  letter-spacing: -0.055em;
  text-transform: none;
}

.welcome-block p {
  font-size: 13px;
  max-width: 760px;
}

.system-badge {
  min-width: 210px;
  padding: 16px;
  border-radius: 16px;
}

.system-badge > span {
  font-size: 8px;
}

.system-badge strong {
  font-size: 13px;
}

.stat-card,
.service-card,
.profile-card {
  border-radius: 20px;
  border-color: rgba(255,255,255,.085);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}

.stat-card {
  padding: 22px;
  min-height: 125px;
}

.stat-card > span {
  font-size: 8px;
}

.stat-card strong {
  font-size: 30px;
  letter-spacing: -0.045em;
}

.stat-card small {
  font-size: 9px;
}

.card-head h3 {
  font-size: 25px;
  letter-spacing: -0.04em;
}

.profile-card dt,
.profile-card dd {
  font-size: 10px;
}

.empty-state h4 {
  font-size: 13px;
}

.empty-state p {
  font-size: 10px;
}

.dashboard-footer {
  font-size: 8px;
}

/* Header profile */
.profile-area {
  position: relative;
}

.profile-trigger {
  min-width: 285px;
  height: 58px;
  padding: 7px 11px 7px 8px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.025);
  display: flex;
  align-items: center;
  gap: 11px;
  cursor: pointer;
  text-align: left;
  transition: .18s ease;
}

.profile-trigger:hover,
.profile-trigger[aria-expanded="true"] {
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.15);
}

.account-avatar,
.dropdown-avatar,
.settings-avatar {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg,#f7f7f7,#cfcfcf);
  color: #080808;
  font-size: 14px;
  font-weight: 900;
  box-shadow: 0 8px 22px rgba(0,0,0,.28);
}

.profile-copy {
  min-width: 0;
  flex: 1;
}

.profile-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.profile-name-row strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 800;
}

.profile-copy > span {
  display: block;
  margin-top: 4px;
  color: #707070;
  font-size: 9px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.role-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 20px;
  padding: 0 8px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: #bdbdbd;
  font-size: 7px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .11em;
  white-space: nowrap;
}

.role-badge.admin {
  border-color: rgba(255,255,255,.24);
  background: #ededed;
  color: #0a0a0a;
}

.role-badge.user {
  background: rgba(255,255,255,.035);
  color: #9b9b9b;
}

.profile-card-role {
  height: 23px;
  font-size: 8px;
}

.profile-chevron {
  color: #777;
  font-size: 18px;
  transition: transform .18s ease;
}

.profile-trigger[aria-expanded="true"] .profile-chevron {
  transform: rotate(180deg);
}

.profile-dropdown {
  position: absolute;
  z-index: 80;
  top: calc(100% + 10px);
  right: 0;
  width: 290px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background: rgba(9,9,9,.98);
  box-shadow: 0 26px 80px rgba(0,0,0,.55);
  backdrop-filter: blur(20px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px) scale(.985);
  transform-origin: top right;
  transition: .16s ease;
}

.profile-dropdown.open {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.profile-dropdown-head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 8px;
}

.dropdown-avatar {
  width: 38px;
  height: 38px;
  border-radius: 11px;
}

.profile-dropdown-head strong {
  display: block;
  font-size: 12px;
}

.profile-dropdown-head span {
  display: block;
  max-width: 200px;
  margin-top: 3px;
  color: #656565;
  font-size: 9px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-dropdown-divider {
  height: 1px;
  margin: 8px 4px;
  background: rgba(255,255,255,.07);
}

.dropdown-item {
  width: 100%;
  height: 44px;
  padding: 0 11px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #bcbcbc;
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
  text-align: left;
  transition: .15s ease;
}

.dropdown-item:hover {
  background: rgba(255,255,255,.055);
  color: #fff;
}

.dropdown-item.danger {
  color: #ff5d5d;
}

.dropdown-item.danger:hover {
  background: rgba(255,72,72,.09);
  color: #ff7070;
}

.dropdown-icon {
  width: 20px;
  color: inherit;
  text-align: center;
  font-size: 13px;
}

/* Settings modal */
.settings-overlay {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(0,0,0,.68);
  backdrop-filter: blur(8px);
}

.settings-modal {
  width: min(620px,100%);
  padding: 24px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 24px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),transparent),
    #090909;
  box-shadow: 0 35px 100px rgba(0,0,0,.65);
  animation: settingsIn .2s ease both;
}

@keyframes settingsIn {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: none; }
}

.settings-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.075);
}

.settings-modal-head span {
  color: #626262;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .18em;
}

.settings-modal-head h3 {
  margin: 5px 0 0;
  font-size: 26px;
  font-weight: 900;
  letter-spacing: -.04em;
}

.settings-close {
  width: 37px;
  height: 37px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 11px;
  background: #0c0c0c;
  color: #777;
  cursor: pointer;
  font-size: 23px;
  line-height: 1;
}

.settings-close:hover {
  color: #fff;
  border-color: rgba(255,255,255,.15);
}

.settings-user {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 16px;
  background: rgba(255,255,255,.02);
}

.settings-user > div:nth-child(2) {
  min-width: 0;
  flex: 1;
}

.settings-user strong {
  display: block;
  font-size: 13px;
}

.settings-user span:not(.role-badge) {
  display: block;
  margin-top: 4px;
  color: #6c6c6c;
  font-size: 9px;
}

.settings-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}

.settings-info-grid > div {
  min-width: 0;
  padding: 15px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  background: #080808;
}

.settings-info-grid span {
  display: block;
  color: #595959;
  font-size: 8px;
  font-weight: 800;
}

.settings-info-grid strong {
  display: block;
  margin-top: 7px;
  color: #d0d0d0;
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-note {
  margin-top: 12px;
  padding: 14px;
  border-left: 2px solid #6d6d6d;
  background: rgba(255,255,255,.025);
  color: #6d6d6d;
  font-size: 9px;
  line-height: 1.6;
}

@media(max-width:700px) {
  .profile-trigger {
    min-width: auto;
    width: 54px;
    padding: 6px;
    justify-content: center;
  }

  .profile-copy,
  .profile-chevron {
    display: none;
  }

  .profile-dropdown {
    right: 0;
    width: min(290px, calc(100vw - 36px));
  }

  .settings-info-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== V4 LOGIN ONLY + ADMIN TERMINAL ===== */
.login-only-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  margin-bottom: 22px;
  padding: 9px 12px;
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  color: #777;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
}
.login-only-badge span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #e3e3e3;
  box-shadow: 0 0 12px rgba(255,255,255,.35);
}

.topbar-account-zone {
  display: flex;
  align-items: center;
  gap: 10px;
}

.terminal-launch {
  height: 48px;
  padding: 0 15px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  color: #d0d0d0;
  display: flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
  transition: .16s ease;
}
.terminal-launch span {
  color: #8c8c8c;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
}
.terminal-launch:hover {
  background: #ececec;
  border-color: #ececec;
  color: #090909;
}
.terminal-launch:hover span { color: #090909; }

.terminal-overlay {
  position: fixed;
  z-index: 160;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0,0,0,.76);
  backdrop-filter: blur(10px);
}

.terminal-window {
  width: min(920px, 100%);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 22px;
  overflow: hidden;
  background: #080808;
  box-shadow: 0 35px 120px rgba(0,0,0,.75);
  animation: settingsIn .18s ease both;
}

.terminal-titlebar {
  height: 74px;
  padding: 0 20px;
  border-bottom: 1px solid rgba(255,255,255,.075);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(180deg,rgba(255,255,255,.035),transparent),#0a0a0a;
}
.terminal-title-copy {
  display: flex;
  align-items: center;
  gap: 15px;
}
.terminal-dots { display: flex; gap: 6px; }
.terminal-dots i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #5c5c5c;
}
.terminal-dots i:nth-child(2) { background: #868686; }
.terminal-dots i:nth-child(3) { background: #b5b5b5; }
.terminal-title-copy span {
  color: #5d5d5d;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .18em;
}
.terminal-title-copy h3 {
  margin: 4px 0 0;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -.03em;
}
.terminal-close {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 11px;
  background: #0d0d0d;
  color: #777;
  cursor: pointer;
  font-size: 22px;
}
.terminal-close:hover { color:#fff; border-color:rgba(255,255,255,.15); }

.terminal-meta-bar {
  height: 39px;
  padding: 0 20px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  display: flex;
  align-items: center;
  gap: 24px;
  color: #4d4d4d;
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .08em;
}
.terminal-meta-bar span:first-child { display:flex; align-items:center; gap:7px; }
.terminal-meta-bar i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #bdbdbd;
  box-shadow: 0 0 10px rgba(255,255,255,.3);
}

.terminal-screen {
  height: 410px;
  overflow-y: auto;
  padding: 22px 24px;
  background:
    linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),
    #060606;
  background-size: 100% 26px;
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  font-size: 12px;
  line-height: 1.75;
  color: #bcbcbc;
  scrollbar-width: thin;
  scrollbar-color: #292929 #090909;
}
.terminal-line { white-space: pre-wrap; overflow-wrap:anywhere; }
.terminal-line.system { color:#f0f0f0; font-weight:800; }
.terminal-line.muted { color:#5f5f5f; }
.terminal-line.command-help { color:#a8a8a8; padding-left:12px; }
.terminal-line.spacer { height:10px; }
.terminal-line.input { color:#d8d8d8; }
.terminal-line.input::before { content:"ghostscript@admin:~$ "; color:#777; }
.terminal-line.success { color:#e3e3e3; }
.terminal-line.success::before { content:"[OK] "; color:#9e9e9e; font-weight:900; }
.terminal-line.error { color:#ff7777; }
.terminal-line.error::before { content:"[ERROR] "; font-weight:900; }
.terminal-line.working { color:#777; }
.terminal-line.working::before { content:"[..] "; }

.terminal-input-row {
  min-height: 66px;
  padding: 12px 14px 12px 20px;
  border-top: 1px solid rgba(255,255,255,.07);
  display: flex;
  align-items: center;
  gap: 10px;
  background: #090909;
}
.terminal-prompt {
  flex: 0 0 auto;
  color: #777;
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size: 11px;
  font-weight: 700;
}
.terminal-input-row input {
  min-width: 0;
  flex: 1;
  height: 42px;
  border: 0;
  outline: none;
  background: transparent;
  color: #eee;
  font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size: 12px;
}
.terminal-input-row input::placeholder { color:#393939; }
.terminal-input-row button {
  height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 10px;
  background: #e8e8e8;
  color: #080808;
  cursor: pointer;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .1em;
}
.terminal-input-row button:disabled { opacity:.5; cursor:wait; }
.terminal-security-note {
  padding: 10px 20px 13px;
  color: #454545;
  background: #090909;
  font-size: 8px;
  line-height: 1.5;
}

@media(max-width:700px) {
  .terminal-launch {
    width: 44px;
    padding: 0;
    justify-content: center;
    font-size: 0;
  }
  .terminal-launch span { font-size: 11px; }
  .terminal-window { border-radius: 18px; }
  .terminal-meta-bar { gap:10px; overflow:hidden; white-space:nowrap; }
  .terminal-screen { height: 52vh; padding:18px; font-size:10px; }
  .terminal-prompt { display:none; }
}