body:not(.authMode) { font-family: "Segoe UI Variable Text", Inter, "Segoe UI", sans-serif; font-weight: 400; letter-spacing: .01em; }
body:not(.authMode) main { gap: 11px; padding: 14px 18px; }
body:not(.authMode) header { min-height: 42px; }
body:not(.authMode) header b { font-size: 17px; font-weight: 550; }

.inventory { padding: 0; border: 0; background: transparent; }
.inventoryHead { min-height: 58px; margin: 0; padding: 5px 2px 10px; border-bottom: 1px solid #273044; }
.inventoryHead b { font-size: 24px; font-weight: 520; letter-spacing: -.02em; }
.inventoryHead small { font-size: 11px; font-weight: 350; }
.inventoryTools input { height: 34px; padding: 7px 10px; border-radius: 5px; font-size: 12px; }
.inventoryTools button { height: 34px; padding: 6px 13px; border-radius: 5px; font-size: 11px; font-weight: 550; }

.groupBlock { margin-top: 9px; border: 0; border-radius: 7px; background: #0b1019b8; }
.groupBlock > summary { min-height: 43px; padding: 7px 10px; border-bottom: 1px solid #222b3b; background: #121925; }
.groupBlock > summary b { font-size: 13px; font-weight: 550; }
.groupBlock > summary small { font-size: 10px; font-weight: 350; }
.groupActions button { padding: 6px 9px; border-radius: 5px; font-size: 10px; font-weight: 500; }

.deviceGrid { grid-template-columns: repeat(auto-fill, minmax(285px, 1fr)); gap: 3px; padding: 6px; }
.deviceTile { border: 0; border-radius: 4px; background: #111824; box-shadow: none; }
.deviceTile.collapsed { padding: 0; }
.deviceToggle { min-height: 59px; padding: 8px 11px; border-left: 2px solid transparent; justify-content: flex-start; gap: 7px; }
.deviceToggle:hover { background: #17202e; border-left-color: #4f8cff; }
.deviceToggle strong { font-size: 13px; font-weight: 450; letter-spacing: 0; }
.deviceToggle small { font-size: 10px; font-weight: 350; }
.computerIcon { transform: scale(.8); margin-inline: -3px 1px; }
.deviceArrow { margin-left: auto; font-size: 18px; }
.deviceDetails { padding: 7px 9px 9px; border-top: 1px solid #222b3b; }
.tileActions { gap: 5px; }
.tileActions button { padding: 6px 7px; border-radius: 5px; font-size: 10px; font-weight: 550; }
.renameDevice input { height: 32px; font-size: 11px; border-radius: 5px; }
.renameDevice button { font-size: 10px; border-radius: 5px; }

.sessionControls { min-height: 43px; padding: 7px 9px; border-radius: 7px; }
.sessionControls b { font-size: 12px; font-weight: 500; }
.sessionControls button { padding: 7px 11px; border-radius: 5px; font-size: 10px; }
.managementPanel { margin-top: 3px; font-size: 11px; }

.userDeviceSection { margin-top: 10px; overflow: hidden; border: 1px solid #293349; border-radius: 8px; background: #0a0f18; }
.userDeviceSection > summary { display: flex; align-items: center; gap: 9px; min-height: 44px; padding: 7px 10px; cursor: pointer; list-style: none; background: #151d2b; }
.userDeviceSection > summary::-webkit-details-marker { display: none; }
.userDeviceSection > summary::after { content: '›'; margin-left: auto; color: #7995c7; font-size: 20px; line-height: 1; transition: transform .16s ease; }
.userDeviceSection[open] > summary::after { transform: rotate(90deg); }
.accountRoleIcon { display: inline-grid; flex: 0 0 28px; width: 28px; height: 28px; place-items: center; color: #fff; border: 1px solid #4d628b; background: #22324f; font-size: 11px; font-weight: 700; }
.accountRoleIcon.admin { border-radius: 8px; border-color: #8173ff; background: #654ff1; }
.accountRoleIcon.user { border-radius: 50%; color: #a9c8ff; background: #172844; }
.accountRoleIcon.suspended { opacity: .48; filter: saturate(.3); }
.userDeviceName { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 550; }
.userDeviceContent { border-top: 1px solid #222b3b; }
.userDeviceMeta { display: grid; grid-template-columns: auto minmax(140px,1fr) auto; align-items: center; gap: 8px 12px; padding: 9px 10px 2px; color: #8fa4ca; font-size: 10px; }
.accountRoleBadge { justify-self: start; padding: 3px 7px; border: 1px solid #34425d; border-radius: 999px; color: #b6c8e8; background: #172033; }
.accountRoleBadge.admin { border-color: #5e52bd; color: #d9d3ff; background: #29204e; }
.userDeviceEmail { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #aab6cc; }
.userDeviceTotals { color: #8fa4ca; white-space: nowrap; }
.userStatusBadge { flex: 0 0 auto; padding: 3px 7px; border: 1px solid #245c4d; border-radius: 999px; color: #68e0b0; background: #102b25; font-size: 9px; line-height: 1.2; }
.userStatusBadge.suspended { border-color: #70404a; color: #ffabb8; background: #351b22; }
.userDeviceAdminActions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; padding: 7px 10px 0; }
.userDeviceAdminActions button { padding: 6px 9px; border-radius: 5px; font-size: 10px; }
.userDeviceGroups { padding: 0 7px 7px; }
.userDeviceGroups > .groupBlock { margin-top: 7px; }
.userDeviceEmpty { display: block; padding: 14px 10px 9px; }

.userAccountRow { display: grid; grid-template-columns: minmax(120px,.7fr) minmax(170px,1fr) auto auto; align-items: center; gap: 9px; padding: 7px 0; border-top: 1px solid #20283a; }
.userAccountRow:first-child { border-top: 0; }
.userAccountRow strong,.userAccountRow span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.userAccountRow button { align-self: center; padding: 7px 10px; border-radius: 5px; font-size: 10px; }
.userAccountActions { display: flex; flex-wrap: wrap; gap: 6px; }
.accountSecurity small { display: block; margin-top: 3px; color: #74809a; }
.brandingSettings small { display: block; margin-top: 3px; color: #74809a; line-height: 1.35; }
.brandingSettings output { max-width: 360px; white-space: normal; }
#userPasswordDialog label { display: block; margin-top: 12px; }
#userPasswordDialog output { max-width: none; margin-top: 10px; white-space: normal; color: #ffb7c2; }
.telegramToggle { display:flex; align-items:center; gap:8px; max-width:none!important; color:#cbd7ed; font-size:11px!important; }
.telegramToggle input { width:18px!important; height:18px!important; margin:0!important; accent-color:#6d5dfc; }

@media (min-width: 1180px) { .deviceGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) {
  body:not(.authMode) main { padding: 10px; }
  .inventoryHead { align-items: stretch; }
  .deviceGrid { grid-template-columns: 1fr; }
  .userDeviceMeta { grid-template-columns: 1fr; gap: 5px; }
  .userDeviceTotals { white-space: normal; }
  .userAccountRow { grid-template-columns: minmax(0, 1fr); }
  .userAccountActions { display: grid; grid-template-columns: 1fr; }
  .userAccountRow button { width: 100%; min-height: 42px; }
}