:root {
  --mc-brand: #2b6cef;
  --mc-brand-dark: #1d4ed8;
  --mc-brand-soft: #e8f0fe;
  --mc-topbar: #ffffff;
  --mc-bg: #f5f7fb;
  --mc-sidebar: #ffffff;
  --mc-surface: #ffffff;
  --mc-text: #1a2332;
  --mc-muted: #6b7a90;
  --mc-line: #e4e9f2;
  --mc-card-line: #d5deea;
  --mc-hover: #f4f7fc;
  --mc-active: #e8f0fe;
  --mc-card-tint: #f8fafd;
  --mc-role-admin: #5b4fc4;
  --mc-role-sup: #2b6cef;
  --mc-role-user: #16794c;
  --mc-role-guest: #a16207;
  --mc-folder: #3b82f6;
  --mc-file: #6b7c8f;
  --mc-danger: #b42318;
  --mc-ok: #16794c;
  --mc-warn: #a16207;
  --mc-radius: 14px;
  --mc-radius-sm: 10px;
  --mc-shadow: 0 8px 28px rgba(28, 40, 64, 0.06);
  --mc-shadow-sm: 0 2px 10px rgba(28, 40, 64, 0.04);
  --mc-topbar-h: 64px;
  --mc-impersonate-h: 0px;
  --mc-chrome-h: calc(var(--mc-topbar-h) + var(--mc-impersonate-h));
  --mc-sidebar-w: 268px;
  --mc-detail-w: 340px;
  --mc-font: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body.mc-body {
  background: var(--mc-bg);
  color: var(--mc-text);
  font-family: var(--mc-font);
  line-height: 1.45;
}
a { color: var(--mc-brand); }
button, input, select { font: inherit; }

body.mc-is-impersonating { --mc-impersonate-h: 2.25rem; }
.mc-impersonate-bar {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 35;
  height: var(--mc-impersonate-h);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  background: #7a2e0e;
  color: #fff;
  font-size: 0.88rem;
  padding: 0 0.75rem;
}
.mc-btn-ghost-light {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.55);
  color: #fff;
  border-radius: 6px;
}
.mc-btn-ghost-light:hover { background: rgba(255, 255, 255, 0.12); color: #fff; border-color: #fff; }

.mc-topbar {
  position: fixed;
  inset: var(--mc-impersonate-h) 0 auto 0;
  z-index: 60;
  height: var(--mc-topbar-h);
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0 1.15rem 0 1rem;
  background: var(--mc-topbar);
  color: var(--mc-text);
  border-bottom: 1px solid var(--mc-line);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
  overflow: visible;
}
.mc-brand {
  display: inline-flex;
  align-items: center;
  color: inherit;
  text-decoration: none;
  flex-shrink: 0;
  min-width: 0;
  width: calc(var(--mc-sidebar-w) - 1.15rem);
}
.mc-brand img,
.mc-brand .logo-img-light,
.mc-brand .logo-img-dark {
  display: block;
  height: 48px;
  width: auto;
  max-height: 52px;
  max-width: 12rem;
  background: transparent;
}
html:not([data-theme="light"]) .logo-img-light,
html[data-theme="light"] .logo-img-dark {
  display: none;
}
.mc-search {
  flex: 1;
  max-width: 44rem;
  margin: 0 auto;
  position: relative;
}
.mc-search input,
.mc-filter-pill input {
  width: 100%;
  border: 1px solid var(--mc-line);
  border-radius: 999px;
  background: var(--mc-bg);
  color: var(--mc-text);
  padding: 0.58rem 3.4rem 0.58rem 2.35rem;
  outline: none;
}
.mc-search input::placeholder,
.mc-filter-pill input::placeholder { color: #8a96a6; }
.mc-search input:focus,
.mc-filter-pill input:focus {
  background: #fff;
  border-color: var(--mc-brand);
  box-shadow: 0 0 0 4px rgba(43, 108, 239, 0.14);
}
.mc-search-ico {
  position: absolute;
  left: 0.85rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.05rem;
  height: 1.05rem;
  color: #7b8796;
  pointer-events: none;
}
.mc-search-ico svg { width: 100%; height: 100%; display: block; }
.mc-search-kbd {
  position: absolute;
  right: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--mc-muted);
  background: #fff;
  border: 1px solid var(--mc-line);
  border-radius: 6px;
  padding: 0.12rem 0.38rem;
  pointer-events: none;
}
.mc-top-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-shrink: 0;
  overflow: visible;
}
.mc-theme-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.38rem;
  box-sizing: border-box;
  min-width: 5.6rem;
  min-height: 44px;
  height: 44px;
  padding: 0 0.5rem;
  border: 1px solid var(--mc-line);
  border-radius: 999px;
  background: var(--mc-bg);
  cursor: pointer;
  color: var(--mc-text);
}
.mc-theme-switch:hover { background: var(--mc-active); border-color: #c5d4f5; }
.mc-theme-switch-sun,
.mc-theme-switch-moon {
  width: 1.35rem;
  height: 1.35rem;
  display: inline-flex;
  opacity: 0.38;
}
.mc-theme-switch-sun svg,
.mc-theme-switch-moon svg { width: 100%; height: 100%; display: block; }
.mc-theme-switch-track {
  position: relative;
  width: 2.15rem;
  height: 1.2rem;
  border-radius: 999px;
  background: #c9d3e0;
}
.mc-theme-switch-track i {
  position: absolute;
  top: 0.14rem;
  left: 0.14rem;
  width: 0.92rem;
  height: 0.92rem;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(20, 30, 45, 0.2);
  transition: transform 0.16s ease;
}
html:not(.mc-theme-dark) .mc-theme-switch-sun,
.mc-theme-switch:not(.is-dark) .mc-theme-switch-sun { opacity: 1; color: #d97706; }
html.mc-theme-dark .mc-theme-switch-moon,
.mc-theme-switch.is-dark .mc-theme-switch-moon { opacity: 1; color: #93c5fd; }
html.mc-theme-dark .mc-theme-switch-track i,
.mc-theme-switch.is-dark .mc-theme-switch-track i { transform: translateX(0.95rem); }
.mc-usermenu { position: relative; overflow: visible; z-index: 2; }
.mc-userbtn {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  border: 0;
  background: transparent;
  padding: 0.2rem 0.45rem 0.2rem 0.15rem;
  cursor: pointer;
  border-radius: 999px;
}
.mc-userbtn:hover { background: var(--mc-hover); }
.mc-user-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  line-height: 1.15;
}
.mc-user-name {
  color: var(--mc-text);
  font-weight: 650;
  font-size: 0.9rem;
  max-width: 11rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mc-user-org {
  color: var(--mc-muted);
  font-size: 0.72rem;
  max-width: 11rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mc-user-caret {
  width: 1rem;
  height: 1rem;
  color: var(--mc-muted);
}
.mc-user-caret svg { width: 100%; height: 100%; display: block; }
.mc-avatar {
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 50%;
  background: #f4c542;
  color: #3a2c00;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.92rem;
  flex-shrink: 0;
}
.mc-userdrop {
  position: absolute;
  right: 0;
  top: calc(100% + 0.55rem);
  min-width: 17.5rem;
  background: #fff;
  color: var(--mc-text);
  border: 1px solid var(--mc-line);
  border-radius: var(--mc-radius);
  box-shadow: 0 14px 36px rgba(20, 30, 45, 0.14);
  padding: 0.2rem 0 0.35rem;
  z-index: 80;
}
.mc-userdrop[hidden] { display: none !important; }
.mc-userdrop::before {
  content: "";
  position: absolute;
  top: -6px;
  right: 1.15rem;
  width: 11px;
  height: 11px;
  background: #fff;
  border-left: 1px solid var(--mc-line);
  border-top: 1px solid var(--mc-line);
  transform: rotate(45deg);
}
.mc-userdrop-head {
  display: block;
  padding: 0.75rem 1rem 0.7rem;
  color: var(--mc-text);
  text-decoration: none;
  border-bottom: 1px solid var(--mc-line);
  margin-bottom: 0.25rem;
}
.mc-userdrop-head strong { display: block; font-size: 0.98rem; }
.mc-userdrop-head span { font-size: 0.82rem; color: var(--mc-muted); }
.mc-userdrop-head:hover { background: var(--mc-hover); }
.mc-userdrop-item {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  width: 100%;
  padding: 0.5rem 0.95rem;
  border: 0;
  background: none;
  color: var(--mc-text);
  text-decoration: none;
  font-size: 0.92rem;
  cursor: pointer;
  text-align: left;
}
.mc-userdrop-item svg { width: 1.15rem; height: 1.15rem; flex-shrink: 0; color: #526274; }
.mc-userdrop-item:hover,
.mc-userdrop-item.is-on { background: var(--mc-active); }

.mc-frame {
  display: flex;
  min-height: 100vh;
  padding-top: var(--mc-chrome-h);
}
.mc-sidebar {
  width: var(--mc-sidebar-w);
  flex-shrink: 0;
  background: var(--mc-sidebar);
  border-right: 1px solid var(--mc-line);
  display: flex;
  flex-direction: column;
  padding: 1rem 0.85rem 0.75rem;
  position: sticky;
  top: var(--mc-chrome-h);
  height: calc(100vh - var(--mc-chrome-h));
  overflow: auto;
}
.mc-side-new { margin: 0 0.1rem 0.95rem; }
.mc-btn-new {
  width: 100%;
  justify-content: center;
  padding: 0.72rem 1rem;
  border-radius: 12px;
  font-size: 0.96rem;
  box-shadow: 0 8px 18px rgba(43, 108, 239, 0.28);
}
.mc-btn-new svg { width: 1.15rem; height: 1.15rem; }
.mc-sidenav { display: flex; flex-direction: column; gap: 0.12rem; }
.mc-nav-item,
.mc-side-admin,
.mc-space-item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.52rem 0.75rem;
  border-radius: 10px;
  color: var(--mc-text);
  text-decoration: none;
  font-size: 0.92rem;
  border-left: 3px solid transparent;
}
.mc-nav-item svg,
.mc-side-admin svg {
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
  color: #64748b;
}
.mc-nav-item:hover,
.mc-side-admin:hover,
.mc-space-item:hover { background: var(--mc-hover); }
.mc-nav-item.is-active,
.mc-side-admin.is-active,
.mc-space-item.is-active {
  background: var(--mc-active);
  border-left-color: var(--mc-brand);
  font-weight: 600;
  color: var(--mc-brand-dark);
}
.mc-nav-item.is-active svg,
.mc-side-admin.is-active svg { color: var(--mc-brand); }
.mc-spaces { margin: 1.05rem 0 0.35rem; }
.mc-side-label {
  margin: 0.55rem 0.75rem 0.35rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}
.mc-spaces-list { display: flex; flex-direction: column; gap: 0.08rem; }
.mc-space-dot {
  width: 0.85rem;
  height: 0.85rem;
  border-radius: 5px;
  flex-shrink: 0;
  display: inline-block;
}
.mc-spaces-empty { margin: 0.2rem 0.75rem; font-size: 0.8rem; color: var(--mc-muted); }
.mc-sidefoot { margin-top: auto; padding: 0.85rem 0.1rem 0.1rem; }
.mc-tenant-label {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 0.78rem;
  color: var(--mc-muted);
  margin: 0 0.2rem 0.7rem;
}
.mc-tenant-label select {
  background: var(--mc-bg);
  color: var(--mc-text);
  border: 1px solid var(--mc-line);
  border-radius: 8px;
  padding: 0.38rem 0.5rem;
}
.mc-quota-card {
  background: var(--mc-card-tint);
  border: 1px solid var(--mc-line);
  border-radius: 12px;
  padding: 0.8rem 0.85rem 0.85rem;
  margin-bottom: 0.75rem;
  box-shadow: var(--mc-shadow-sm);
}
.mc-quota-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: var(--mc-muted);
  margin-bottom: 0.2rem;
}
.mc-quota-head strong { color: var(--mc-text); font-size: 0.82rem; }
.mc-quota-text, .mc-quota { margin: 0 0 0.4rem; font-size: 0.8rem; color: var(--mc-muted); }
.mc-quota-link {
  display: inline-block;
  margin-top: 0.55rem;
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none;
}
.mc-bar {
  display: block;
  height: 7px;
  background: #dce3ee;
  border-radius: 99px;
  overflow: hidden;
}
.mc-bar > i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #60a5fa, var(--mc-brand)); }
.mc-sidebar-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 0.55rem;
  border: 0;
  background: transparent;
  color: var(--mc-muted);
  cursor: pointer;
  border-radius: 8px;
  padding: 0.35rem;
}
.mc-sidebar-toggle svg { width: 1.15rem; height: 1.15rem; }
.mc-sidebar-toggle:hover { background: var(--mc-hover); color: var(--mc-text); }

html.mc-sidebar-collapsed { --mc-sidebar-w: 84px; }
html.mc-sidebar-collapsed .mc-brand { width: auto; }
html.mc-sidebar-collapsed .mc-nav-item span,
html.mc-sidebar-collapsed .mc-side-admin span,
html.mc-sidebar-collapsed .mc-space-item span,
html.mc-sidebar-collapsed .mc-side-label,
html.mc-sidebar-collapsed .mc-tenant-label,
html.mc-sidebar-collapsed .mc-quota-card,
html.mc-sidebar-collapsed .mc-btn-new span,
html.mc-sidebar-collapsed .mc-spaces-empty { display: none; }
html.mc-sidebar-collapsed .mc-nav-item,
html.mc-sidebar-collapsed .mc-side-admin,
html.mc-sidebar-collapsed .mc-space-item { justify-content: center; padding: 0.6rem; }
html.mc-sidebar-collapsed .mc-btn-new { padding: 0.7rem; }

.mc-main {
  flex: 1;
  min-width: 0;
  background: var(--mc-bg);
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - var(--mc-chrome-h));
}
.mc-main-guest {
  min-height: calc(100vh - var(--mc-chrome-h));
  margin-top: var(--mc-chrome-h);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  background: var(--mc-bg);
}
.mc-shell { padding: 0; flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mc-explorer {
  padding: 1.15rem 1.25rem 1.2rem;
  gap: 0.85rem;
}
.mc-explorer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.mc-explorer-titles h1 {
  margin: 0;
  font-size: 1.55rem;
  letter-spacing: -0.02em;
}
.mc-explorer-titles .mc-lead { margin: 0.2rem 0 0; }
.mc-explorer-tools {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
.mc-filter-pill {
  position: relative;
  display: block;
  min-width: 11rem;
}
.mc-filter-pill .mc-search-ico { left: 0.7rem; }
.mc-filter-pill input { padding: 0.45rem 0.85rem 0.45rem 2.05rem; background: #fff; }
.mc-view-toggle {
  display: inline-flex;
  background: #fff;
  border: 1px solid var(--mc-line);
  border-radius: 10px;
  padding: 0.18rem;
  box-shadow: var(--mc-shadow-sm);
}
.mc-view-toggle button {
  border: 0;
  background: transparent;
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 8px;
  color: var(--mc-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.mc-view-toggle button svg { width: 1.1rem; height: 1.1rem; }
.mc-view-toggle button.is-on,
.mc-view-toggle button:hover { background: var(--mc-active); color: var(--mc-brand); }

.mc-quick {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}
.mc-quick-card {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  background: #fff;
  border: 1px solid var(--mc-line);
  border-radius: 14px;
  padding: 0.9rem 1rem 1rem;
  text-decoration: none;
  color: inherit;
  box-shadow: var(--mc-shadow-sm);
  min-height: 6.1rem;
}
.mc-quick-card:hover { border-color: #c5d4f5; box-shadow: var(--mc-shadow); }
.mc-quick-card strong { font-size: 0.95rem; }
.mc-quick-card > span:last-child { color: var(--mc-muted); font-size: 0.78rem; }
.mc-quick-ico {
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.45rem;
}
.mc-quick-ico svg { width: 1.15rem; height: 1.15rem; }
.mc-quick-ico.is-blue { background: #e8f0fe; color: #2b6cef; }
.mc-quick-ico.is-teal { background: #d5f5f0; color: #0f766e; }
.mc-quick-ico.is-violet { background: #eee7ff; color: #6d28d9; }
.mc-quick-ico.is-amber { background: #fef3c7; color: #b45309; }

.mc-workspace {
  display: flex;
  gap: 1rem;
  flex: 1;
  min-height: 0;
  align-items: stretch;
}
.mc-list-card,
.mc-detail {
  background: #fff;
  border: 1px solid var(--mc-line);
  border-radius: 16px;
  box-shadow: var(--mc-shadow);
  min-width: 0;
}
.mc-list-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.mc-detail {
  width: var(--mc-detail-w);
  flex-shrink: 0;
  padding: 1.05rem 1.1rem 1.2rem;
  position: relative;
  overflow: auto;
}
.mc-detail-close {
  position: absolute;
  top: 0.7rem;
  right: 0.7rem;
  width: 1.85rem;
  height: 1.85rem;
  border: 0;
  background: transparent;
  border-radius: 50%;
  color: var(--mc-muted);
  font-size: 1.35rem;
  cursor: pointer;
  line-height: 1;
}
.mc-detail-close:hover { background: var(--mc-hover); color: var(--mc-text); }
.mc-detail-hero { text-align: center; padding: 0.4rem 0.4rem 0.85rem; }
.mc-detail-ico { display: flex; justify-content: center; margin-bottom: 0.45rem; }
.mc-ico-xl { width: 3.4rem; height: 3.4rem; }
.mc-detail-hero h2 { margin: 0 0 0.7rem; font-size: 1.12rem; word-break: break-word; }
.mc-detail-hero-actions { display: flex; gap: 0.4rem; justify-content: center; flex-wrap: wrap; }
.mc-detail-tabs {
  display: flex;
  gap: 0.15rem;
  border-bottom: 1px solid var(--mc-line);
  margin-bottom: 0.85rem;
}
.mc-detail-tabs button {
  border: 0;
  background: none;
  padding: 0.45rem 0.4rem;
  color: var(--mc-muted);
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 600;
  border-bottom: 2px solid transparent;
}
.mc-detail-tabs button.is-on { color: var(--mc-brand); border-bottom-color: var(--mc-brand); }
.mc-detail-body { font-size: 0.9rem; }
.mc-path { word-break: break-all; }
.mc-activity, .mc-share-now { list-style: none; margin: 0; padding: 0; }
.mc-activity li, .mc-share-now li {
  display: flex;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--mc-line);
}
.mc-activity li span, .mc-activity small { color: var(--mc-muted); font-size: 0.8rem; font-weight: 500; }
.mc-tags { margin-top: 1rem; }
.mc-tag-list { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; }
.mc-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border-radius: 99px;
  padding: 0.15rem 0.45rem 0.15rem 0.55rem;
  font-size: 0.75rem;
  font-weight: 600;
}
.mc-tag button { border: 0; background: none; cursor: pointer; color: inherit; }
.mc-tag.is-red { background: #fee2e2; color: #b91c1c; }
.mc-tag.is-blue { background: #dbeafe; color: #1d4ed8; }
.mc-tag-add {
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 50%;
  border: 1px dashed var(--mc-line);
  background: #fff;
  cursor: pointer;
  color: var(--mc-muted);
}
.mc-owner {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}
.mc-fav-mark { color: #d97706; margin-left: 0.25rem; font-size: 0.78rem; }

.mc-dropzone {
  margin: 0.75rem 0.9rem 0.85rem;
  border: 1.5px dashed #b7c9f3;
  background: #f3f7ff;
  border-radius: 14px;
  min-height: 4.6rem;
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.75rem 1rem;
  cursor: pointer;
}
.mc-dropzone.is-over { background: #e8f0fe; border-color: var(--mc-brand); }
.mc-dropzone-ico {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 12px;
  background: #fff;
  color: var(--mc-brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--mc-shadow-sm);
  flex-shrink: 0;
}
.mc-dropzone-ico svg { width: 1.35rem; height: 1.35rem; }
.mc-dropzone-copy { flex: 1; min-width: 0; }
.mc-dropzone-copy strong { display: block; font-size: 0.92rem; }
.mc-dropzone-copy span { color: var(--mc-muted); font-size: 0.8rem; }

.mc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr));
  gap: 0.75rem;
  padding: 1rem;
}
.mc-grid-item {
  border: 1px solid var(--mc-line);
  background: #fff;
  border-radius: 12px;
  padding: 0.9rem 0.7rem 0.75rem;
  text-align: center;
  cursor: pointer;
  color: inherit;
}
.mc-grid-item:hover, .mc-grid-item.is-selected { border-color: var(--mc-brand); background: var(--mc-active); }
.mc-grid-name {
  display: block;
  margin-top: 0.45rem;
  font-size: 0.82rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mc-grid-meta { color: var(--mc-muted); font-size: 0.72rem; }
.mc-ico-lg { width: 2.4rem; height: 2.4rem; }

.mc-toolbar {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
  padding: 0.7rem 1.1rem;
  border-bottom: 1px solid var(--mc-line);
  min-height: 3.15rem;
}
.mc-toolbar-left { display: flex; align-items: center; gap: 0.75rem; flex: 1; min-width: 0; }
.mc-toolbar h1 { margin: 0; font-size: 1.05rem; }
.mc-lead { margin: 0; color: var(--mc-muted); font-size: 0.86rem; }
.mc-toolbar-right { display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem; }

.mc-new { position: relative; }
.mc-new-menu,
.mc-more-menu {
  position: absolute;
  top: calc(100% + 0.3rem);
  left: 0;
  min-width: 13.5rem;
  background: #fff;
  border: 1px solid var(--mc-line);
  border-radius: var(--mc-radius-sm);
  box-shadow: 0 10px 28px rgba(20, 30, 45, 0.12);
  padding: 0.3rem 0;
  z-index: 12;
}
.mc-new-menu button,
.mc-new-menu label,
.mc-more-menu button,
.mc-more-menu a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  padding: 0.5rem 0.85rem;
  color: var(--mc-text);
  cursor: pointer;
  text-decoration: none;
  font-size: 0.9rem;
}
.mc-new-menu svg { width: 1.05rem; height: 1.05rem; color: var(--mc-muted); }
.mc-new-menu button:hover,
.mc-new-menu label:hover,
.mc-more-menu button:hover,
.mc-more-menu a:hover { background: var(--mc-hover); }

.mc-crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem 0.35rem;
  font-size: 0.9rem;
  min-width: 0;
}
.mc-crumbs a { color: var(--mc-text); text-decoration: none; font-weight: 600; }
.mc-crumbs a:hover { color: var(--mc-brand); }
.mc-crumbs span { color: #98a2b3; }

.mc-btn, .mc-btn-primary, .mc-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.42rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--mc-line);
  background: #fff;
  color: var(--mc-text);
  font-weight: 600;
  font-size: 0.88rem;
  cursor: pointer;
  text-decoration: none;
}
.mc-btn svg { width: 1rem; height: 1rem; }
.mc-btn-primary {
  background: var(--mc-brand);
  color: #fff;
  border-color: transparent;
}
.mc-btn-primary:hover { background: var(--mc-brand-dark); }
.mc-btn-ghost { background: transparent; }
.mc-btn:hover, .mc-btn-ghost:hover { border-color: var(--mc-brand); color: var(--mc-brand); }
.mc-btn-primary:hover { color: #fff; }

.mc-table-wrap { overflow-x: auto; flex: 1; }
.mc-table { width: 100%; border-collapse: collapse; }
.mc-table th, .mc-table td {
  padding: 0.62rem 0.85rem;
  text-align: left;
  border-bottom: 1px solid #eef1f6;
  vertical-align: middle;
}
.mc-filelist th, .mc-filelist td {
  padding: 0.48rem 0.8rem;
  line-height: 1.3;
}
.mc-filelist .mc-ico { width: 1.35rem; height: 1.35rem; }
.mc-filelist .mc-name { gap: 0.5rem; }
.mc-filelist .mc-more-btn { width: 1.6rem; height: 1.6rem; }
.mc-table th {
  color: var(--mc-muted);
  font-weight: 600;
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: #fff;
  position: sticky;
  top: 0;
}
.mc-table tbody tr { user-select: none; }
.mc-table tbody tr:hover { background: var(--mc-hover); }
.mc-table tbody tr.is-selected,
.mc-table tbody tr.is-checked { background: var(--mc-active); }
.mc-table .mc-col-check { width: 2.2rem; }
.mc-table .mc-col-owner { width: 10.5rem; }
.mc-table .mc-col-size, .mc-table .mc-col-date { width: 8.5rem; color: var(--mc-muted); white-space: nowrap; }
.mc-table .mc-col-act { width: 3rem; text-align: right; }
.mc-name { display: flex; align-items: center; gap: 0.55rem; min-width: 0; cursor: pointer; }
.mc-name button, .mc-name a {
  background: none; border: 0; padding: 0; color: inherit;
  font: inherit; cursor: pointer; text-align: left;
}
.mc-name button:hover, .mc-name a:hover { color: var(--mc-brand); }
.mc-ico { width: 1.45rem; height: 1.45rem; flex-shrink: 0; }
.mc-ico-folder { color: var(--mc-folder); }
.mc-ico-file { color: var(--mc-file); }
.mc-ico-pdf { color: #c0392b; }
.mc-ico-img { color: #1a8f6a; }
.mc-ico-vid { color: #5b4fc4; }
.mc-badge {
  display: inline-block;
  margin-left: 0.4rem;
  font-size: 0.72rem;
  color: var(--mc-brand);
  background: var(--mc-active);
  border-radius: 99px;
  padding: 0.05rem 0.45rem;
  font-weight: 600;
}
.mc-more { position: relative; display: inline-block; }
.mc-more-btn {
  border: 0;
  background: transparent;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 50%;
  cursor: pointer;
  color: var(--mc-muted);
  font-size: 1.15rem;
  line-height: 1;
}
.mc-more-btn:hover { background: #e8eef3; color: var(--mc-text); }
.mc-more-menu { left: auto; right: 0; min-width: 11.5rem; }
.mc-more-menu .is-danger { color: var(--mc-danger); }

.mc-empty { color: var(--mc-muted); text-align: center; padding: 3rem 1rem !important; }
.mc-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 1.05rem 0.65rem;
  border-top: 1px solid var(--mc-line);
  color: var(--mc-muted);
  font-size: 0.82rem;
  background: transparent;
}
.mc-pager { display: flex; gap: 0.4rem; }
.mc-progress { margin: 0; padding: 0.55rem 0.2rem; font-size: 0.86rem; color: var(--mc-muted); }
.mc-msg { margin: 0; padding: 0.5rem 0.2rem; color: var(--mc-ok); }
.mc-msg.is-err { color: var(--mc-danger); }

.mc-drop-overlay {
  position: fixed;
  inset: var(--mc-chrome-h) 0 0 0;
  z-index: 25;
  background: rgba(43, 108, 239, 0.1);
  border: 3px dashed var(--mc-brand);
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--mc-brand);
  pointer-events: none;
}
.mc-drop-overlay.is-on { display: flex; }
.mc-drop-overlay[hidden] { display: none !important; }

.mc-auth { width: 100%; max-width: 24rem; }
.mc-auth-box, .mc-share {
  width: 100%;
  max-width: 24rem;
  background: #fff;
  border: 1px solid var(--mc-line);
  border-radius: 16px;
  padding: 1.6rem 1.5rem 1.5rem;
  box-shadow: var(--mc-shadow);
}
.mc-share { max-width: 28rem; }
.mc-auth-brand { margin: 0 0 0.2rem; font-weight: 700; color: var(--mc-brand); letter-spacing: 0.03em; }
.mc-auth-box h1, .mc-share h1 { margin: 0 0 0.35rem; font-size: 1.35rem; }
.mc-auth-form label, .mc-share-form label { display: block; margin: 0.75rem 0 0.25rem; font-size: 0.9rem; }
.mc-auth-form input, .mc-share-form input {
  width: 100%;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--mc-line);
  border-radius: 8px;
  background: #fff;
  color: var(--mc-text);
}
.mc-auth-form .mc-btn { width: 100%; justify-content: center; margin-top: 1rem; border-radius: 8px; }

.mc-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 0.75rem; margin: 1rem 0 0.4rem; }
.mc-kpi {
  background: #fff;
  border: 1px solid var(--mc-line);
  border-top: 3px solid var(--mc-brand);
  border-radius: var(--mc-radius);
  padding: 1rem 1.1rem;
  box-shadow: var(--mc-shadow-sm);
}
.mc-kpi:nth-child(2) { border-top-color: #16794c; }
.mc-kpi:nth-child(3) { border-top-color: #a16207; }
.mc-kpi:nth-child(4) { border-top-color: #5b4fc4; }
.mc-kpi strong { display: block; font-size: 1.45rem; color: var(--mc-brand-dark); }
.mc-kpi:nth-child(2) strong { color: #16794c; }
.mc-kpi:nth-child(3) strong { color: #a16207; }
.mc-kpi:nth-child(4) strong { color: #5b4fc4; }
.mc-kpi span { color: var(--mc-muted); font-size: 0.88rem; }
.mc-admin h2 { margin: 1.5rem 0 0.5rem; font-size: 1.05rem; }
.mc-admin .mc-table-wrap { margin: 0 0 1.2rem; border: 1px solid var(--mc-line); border-radius: var(--mc-radius); }
.mc-alerts { margin: 0.75rem 0; }
.mc-alert { padding: 0.65rem 0.85rem; border-radius: var(--mc-radius); margin: 0 0 0.5rem; }
.mc-alert-70 { background: #fff6d6; }
.mc-alert-85 { background: #ffead2; }
.mc-alert-95 { background: #fde4e2; }
.mc-share-list { padding-left: 1.2rem; }
.mc-muted { color: var(--mc-muted); }

.mc-modal-back {
  position: fixed; inset: 0; background: rgba(20, 30, 45, 0.4); z-index: 40;
  display: flex; align-items: center; justify-content: center; padding: 1rem;
}
.mc-modal {
  background: #fff; border: 1px solid var(--mc-line); border-radius: 16px;
  padding: 1.25rem; max-width: 32rem; width: 100%;
  box-shadow: 0 16px 40px rgba(20, 30, 45, 0.18);
}
.mc-modal h2 { margin: 0 0 0.75rem; font-size: 1.1rem; }
.mc-modal label { display: block; margin: 0.5rem 0; font-size: 0.9rem; }
.mc-modal-back[hidden] { display: none !important; }
.mc-modal input[type="text"], .mc-modal input[type="password"],
.mc-modal input[type="datetime-local"], .mc-modal input[type="email"],
.mc-modal input[type="number"],
.mc-modal select {
  width: 100%; padding: 0.45rem 0.55rem; border-radius: 8px;
  border: 1.5px solid var(--mc-card-line); background: #fff; color: var(--mc-text);
}
.mc-modal-actions { display: flex; gap: 0.5rem; justify-content: flex-end; margin-top: 1rem; flex-wrap: wrap; }
.mc-modal .mc-form .mc-btn { margin-top: 0; }
.mc-modal .mc-lead { margin-bottom: 0.65rem; }
.mc-vers { list-style: none; padding: 0; margin: 0; }
.mc-vers li { display: flex; justify-content: space-between; gap: 0.75rem; padding: 0.45rem 0; border-bottom: 1px solid var(--mc-line); font-size: 0.88rem; }

.mc-selbar {
  display: none;
  align-items: center;
  gap: 0.6rem;
  padding: 0.45rem 0.85rem;
  background: var(--mc-active);
  border: 1px solid #c5d4f5;
  border-radius: 12px;
  font-size: 0.86rem;
}
.mc-selbar.is-on { display: flex; }

.mc-body-guest .mc-topbar { justify-content: flex-start; }
.mc-body-guest .mc-brand { min-width: 0; width: auto; }

.mc-page-kicker {
  display: inline-block;
  margin: 0 0 0.15rem;
  padding: 0.12rem 0.55rem;
  border-radius: 99px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mc-brand-dark);
  background: var(--mc-active);
}
.mc-page .mc-toolbar-left { flex-wrap: wrap; }
.mc-page { background: var(--mc-bg); }
.mc-page .mc-toolbar {
  background: transparent;
  border-bottom: 0;
  padding: 1.2rem 1.35rem 0.35rem;
}
.mc-page .mc-toolbar h1 { font-size: 1.5rem; letter-spacing: -0.02em; }
.mc-page-body { padding: 1rem 1.35rem 2.2rem; max-width: 44rem; }
.mc-page-body.is-wide { max-width: none; }
.mc-form input[type="text"],
.mc-form input[type="email"],
.mc-form input[type="password"],
.mc-form input[type="number"],
.mc-form select {
  border-width: 1.5px;
  border-color: var(--mc-card-line);
}
.mc-page-body > .mc-msg,
.mc-users-page > .mc-msg {
  background: #e7f4ec;
  border: 1.5px solid #8fcdab;
  border-radius: 10px;
  padding: 0.65rem 0.9rem;
  margin: 0 0 1rem;
}
.mc-page-body > .mc-msg.is-err,
.mc-users-page > .mc-msg.is-err {
  background: #fde8e6;
  border-color: #f3c0bb;
}
.mc-grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1rem; }
.mc-inline { display: inline-flex; align-items: center; gap: 0.35rem; margin: 0; }
.mc-inline .mc-btn { margin: 0; }
.mc-btn-sm { padding: 0.28rem 0.7rem; font-size: 0.8rem; }
.mc-btn-danger {
  background: #fff;
  color: var(--mc-danger);
  border-color: #f3c0bb;
}
.mc-btn-danger:hover {
  background: #fde8e6;
  border-color: var(--mc-danger);
  color: var(--mc-danger);
}
.mc-form-row { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; align-items: flex-end; }
.mc-form-row label { margin: 0; min-width: 10rem; flex: 1; }
.mc-form-row .mc-btn { margin: 0; }
.mc-pill {
  display: inline-block;
  font-size: 0.75rem;
  padding: 0.12rem 0.45rem;
  border-radius: 99px;
  background: #e7f4ec;
  color: var(--mc-ok);
}
.mc-pill.is-off { background: #fde8e6; color: var(--mc-danger); }
.mc-col-act-wide { white-space: nowrap; }
.mc-chart {
  border: 1px solid #c5d4f5;
  border-radius: var(--mc-radius);
  background: linear-gradient(180deg, #eef3fc 0%, #fff 55%);
  padding: 0.55rem 0.65rem 0.25rem;
  margin: 0 0 0.5rem;
}
.mc-admin .mc-chart { margin: 0 0 1.2rem; }
.mc-chart-svg { width: 100%; height: 11rem; display: block; }
.mc-chart-line { stroke: #2b6cef; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.mc-chart-area { fill: url(#mcChartFill); }
.mc-chart-grid { stroke: #d5e0f0; stroke-width: 1; }
.mc-chart-axis { fill: #5b6b7c; font-size: 11px; }
.mc-chart-dot { fill: #2b6cef; stroke: #fff; stroke-width: 1.5; }
.mc-chart-head { display: flex; justify-content: flex-end; margin: 0 0 0.45rem; }
.mc-admin .mc-chart-head { margin: 0 0 0.45rem; }
.mc-range { display: flex; gap: 0.35rem; margin: 0; }
.mc-range-btn {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: 99px;
  border: 1px solid var(--mc-line);
  color: var(--mc-text);
  text-decoration: none;
  font-size: 0.82rem;
  background: #fff;
}
.mc-range-btn.is-on { background: var(--mc-active); border-color: var(--mc-brand); color: var(--mc-brand-dark); font-weight: 600; }
.mc-card {
  background: #fff;
  border: 1px solid var(--mc-line);
  border-left: 4px solid var(--mc-brand);
  border-radius: 16px;
  padding: 1.25rem 1.35rem;
  box-shadow: var(--mc-shadow);
}
.mc-card.is-security { border-left-color: var(--mc-role-guest); }
.mc-card.is-ok { border-left-color: var(--mc-role-user); }
.mc-card.is-about { border-left-color: var(--mc-role-admin); }
.mc-card .mc-table-wrap {
  border: 1px solid var(--mc-line);
  border-radius: 10px;
  background: #fff;
}
.mc-card-spaced { margin-top: 1rem; }
.mc-card .mc-kpis { margin: 0 0 0.85rem; }
.mc-card .mc-chart-head { margin: 0 0 0.45rem; }
.mc-card h2 { margin: 0 0 0.75rem; font-size: 1.05rem; }
.mc-section-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  font-size: 1.05rem;
}
.mc-section-title::before {
  content: "";
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--mc-brand);
  box-shadow: 0 0 0 3px rgba(43, 108, 239, 0.18);
  flex-shrink: 0;
}
.mc-card.is-security .mc-section-title::before {
  background: var(--mc-role-guest);
  box-shadow: 0 0 0 3px rgba(161, 98, 7, 0.2);
}
.mc-card.is-ok .mc-section-title::before {
  background: var(--mc-role-user);
  box-shadow: 0 0 0 3px rgba(22, 121, 76, 0.2);
}
.mc-card.is-about .mc-section-title::before {
  background: var(--mc-role-admin);
  box-shadow: 0 0 0 3px rgba(91, 79, 196, 0.2);
}
.mc-form-block {
  background: rgba(43, 108, 239, 0.045);
  border: 1.5px solid #d5deea;
  border-radius: 12px;
  padding: 0.85rem 1rem 1.05rem;
}
.mc-form-block.is-security {
  background: rgba(161, 98, 7, 0.07);
  border-color: #e0d0a8;
}
.mc-form-block .mc-form label:first-of-type,
.mc-form-block > label:first-of-type { margin-top: 0.15rem; }
.mc-form-submit {
  display: flex;
  justify-content: flex-end;
  margin-top: 1.1rem;
}
.mc-form-submit .mc-btn,
.mc-form .mc-form-submit .mc-btn { margin-top: 0; }
.mc-btn-save {
  padding: 0.62rem 1.55rem;
  font-size: 0.96rem;
  box-shadow: 0 4px 12px rgba(43, 108, 239, 0.24);
}
.mc-btn-save:hover { box-shadow: 0 5px 16px rgba(29, 78, 216, 0.28); }
.mc-btn-sup {
  background: var(--mc-role-sup);
  color: #fff;
  border-color: transparent;
}
.mc-btn-sup:hover { background: var(--mc-brand-dark); color: #fff; }
.mc-btn-user {
  background: var(--mc-role-user);
  color: #fff;
  border-color: transparent;
}
.mc-btn-user:hover { background: #11633e; color: #fff; }
.mc-role {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0.14rem 0.5rem;
  border-radius: 99px;
  line-height: 1.2;
  white-space: nowrap;
}
.mc-role-admin { background: #ede9fe; color: #4c3dba; }
.mc-role-sup { background: #e8f0fe; color: #1d4ed8; }
.mc-role-user { background: #d8f3e6; color: #11633e; }
.mc-role-guest { background: #f8edd2; color: #8a5406; }
.mc-role-none { background: #e8edf2; color: #526274; }
.mc-avatar.mc-role-admin { background: #5b4fc4; color: #fff; }
.mc-avatar.mc-role-sup { background: #2b6cef; color: #fff; }
.mc-avatar.mc-role-user { background: #16794c; color: #fff; }
.mc-avatar.mc-role-guest { background: #a16207; color: #fff; }
.mc-avatar-sm {
  width: 1.55rem;
  height: 1.55rem;
  font-size: 0.72rem;
}
.mc-avatar-lg {
  width: 3.1rem;
  height: 3.1rem;
  font-size: 1.25rem;
}
.mc-profile-head {
  display: flex;
  align-items: center;
  gap: 0.95rem;
}
.mc-profile-card .mc-lead { margin: 0.15rem 0 0.4rem; }
.mc-users-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  margin: 0 0 0.85rem;
}
.mc-users-count { margin: 0; font-weight: 600; color: var(--mc-muted); font-size: 0.9rem; }
.mc-users-actions { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.mc-users {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}
.mc-users.has-detail {
  grid-template-columns: minmax(0, 1fr) minmax(17.5rem, 22.5rem);
}
.mc-users-list { padding: 0; overflow: hidden; }
.mc-users-list .mc-table-wrap { border: 0; border-radius: 0; }
.mc-users-table th, .mc-users-table td {
  padding: 0.48rem 0.8rem;
  font-size: 0.86rem;
}
.mc-users-table tbody tr:nth-child(even) { background: #f6f8fc; }
.mc-users-table tbody tr.mc-user-row { cursor: pointer; }
.mc-users-table tbody tr.mc-user-row:hover { background: #eef3fb; }
.mc-users-table tbody tr.is-selected { background: var(--mc-active); }
.mc-users-table tbody tr.is-disabled { opacity: 0.72; }
.mc-user-cell {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}
.mc-user-detail { position: sticky; top: calc(var(--mc-chrome-h) + 0.75rem); }
.mc-user-detail-head {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
.mc-user-detail-head .mc-profile-name { margin: 0 0 0.35rem; }
.mc-user-detail-close {
  margin-left: auto;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 50%;
  text-decoration: none;
  color: var(--mc-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  line-height: 1;
}
.mc-user-detail-close:hover { background: var(--mc-hover); color: var(--mc-text); }
.mc-dl { margin: 0; }
.mc-dl > div {
  display: grid;
  grid-template-columns: 7.2rem 1fr;
  gap: 0.35rem 0.6rem;
  padding: 0.42rem 0;
  border-bottom: 1px dashed var(--mc-line);
  font-size: 0.88rem;
}
.mc-dl dt { margin: 0; color: var(--mc-muted); font-weight: 600; }
.mc-dl dd { margin: 0; }
.mc-user-detail-actions {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-top: 1rem;
}
.mc-user-detail-actions .mc-btn { width: 100%; justify-content: center; }
.mc-user-assign {
  margin-top: 1.1rem;
  padding-top: 0.85rem;
  border-top: 1.5px solid var(--mc-line);
}
.mc-user-assign h3 { font-size: 0.95rem; }
.mc-user-assign .mc-btn { margin-top: 0.75rem; }
.mc-profile-name { margin: 0 0 0.25rem; font-size: 1.25rem; font-weight: 700; }
.mc-page-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; }
.mc-form label { display: block; margin: 0.75rem 0 0.25rem; font-size: 0.9rem; }
.mc-field-help {
  margin: 0.28rem 0 0;
  font-size: 0.82rem;
  color: var(--mc-muted);
  line-height: 1.35;
  max-width: 36rem;
}
.mc-form label.mc-check { display: flex; align-items: center; gap: 0.45rem; margin-top: 1rem; }
.mc-form label.mc-check input { width: auto; }
.mc-form input[type="text"],
.mc-form input[type="email"],
.mc-form input[type="password"],
.mc-form input[type="number"],
.mc-form select {
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: 1.5px solid var(--mc-card-line);
  border-radius: 8px;
  background: #fff;
  color: var(--mc-text);
}
.mc-inline input[type="number"],
.mc-inline select {
  width: auto;
  min-width: 4.5rem;
  padding: 0.25rem 0.4rem;
  border: 1px solid var(--mc-line);
  border-radius: 8px;
  background: #fff;
  color: var(--mc-text);
}
.mc-form .mc-btn { margin-top: 1rem; }
.mc-prose ul { padding-left: 1.2rem; }
.mc-prose li { margin: 0.35rem 0; }
.mc-app-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
  gap: 0.75rem;
}
.mc-app-tile {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.1rem;
  border: 1px solid var(--mc-line);
  border-radius: 14px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  box-shadow: var(--mc-shadow-sm);
}
.mc-app-tile:hover { border-color: var(--mc-brand); background: var(--mc-hover); }
.mc-app-tile-ico { color: var(--mc-brand); }
.mc-app-tile-ico svg { width: 1.5rem; height: 1.5rem; display: block; }
.mc-app-tile span { color: var(--mc-muted); font-size: 0.86rem; }
.mc-theme-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 1rem; }
.mc-theme-choice {
  text-align: left;
  padding: 1rem;
  border: 1px solid var(--mc-line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  color: inherit;
}
.mc-theme-choice strong { display: block; margin-bottom: 0.2rem; }
.mc-theme-choice span { color: var(--mc-muted); font-size: 0.86rem; }
.mc-theme-choice:hover,
.mc-theme-choice.is-on { border-color: var(--mc-brand); background: var(--mc-active); }

.mc-preview-back {
  position: fixed;
  inset: 0;
  z-index: 50;
  background: rgba(20, 30, 45, 0.52);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.1rem;
}
.mc-preview {
  position: relative;
  background: #fff;
  border: 1px solid var(--mc-line);
  border-radius: 16px;
  width: min(96vw, 74rem);
  height: min(92vh, 56rem);
  display: flex;
  flex-direction: column;
  box-shadow: 0 18px 48px rgba(20, 30, 45, 0.22);
}
.mc-preview-head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid var(--mc-line);
}
.mc-preview-title {
  flex: 1;
  min-width: 0;
  font-weight: 600;
  font-size: 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mc-preview-meta {
  display: inline-block;
  margin-left: 0.5rem;
  font-weight: 500;
  font-size: 0.8rem;
  color: var(--mc-muted);
}
.mc-preview-close {
  border: 0;
  background: transparent;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  cursor: pointer;
  color: var(--mc-muted);
  font-size: 1.45rem;
  line-height: 1;
}
.mc-preview-close:hover { background: var(--mc-hover); color: var(--mc-text); }
.mc-preview-nav {
  border: 1px solid var(--mc-line);
  background: #fff;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  cursor: pointer;
  color: var(--mc-text);
  font-size: 1.2rem;
  line-height: 1;
}
.mc-preview-nav:hover:not(:disabled) { border-color: var(--mc-brand); color: var(--mc-brand); }
.mc-preview-nav:disabled { opacity: 0.35; cursor: default; }
.mc-preview-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f6f8fa;
  position: relative;
}
.mc-preview-img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.mc-preview-frame {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}
.mc-preview-text {
  margin: 0;
  padding: 1rem 1.2rem;
  width: 100%;
  height: 100%;
  overflow: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.82rem;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--mc-text);
  background: #fff;
  align-self: stretch;
}
.mc-preview-empty {
  text-align: center;
  color: var(--mc-muted);
  padding: 2rem 1.2rem;
}
.mc-preview-empty .mc-btn { margin-top: 0.75rem; }

html.mc-theme-dark {
  --mc-bg: #12171e;
  --mc-sidebar: #171d25;
  --mc-surface: #1c242e;
  --mc-text: #e6edf3;
  --mc-muted: #9aa7b5;
  --mc-line: #2a3440;
  --mc-card-line: #3a4654;
  --mc-card-tint: #1a222b;
  --mc-hover: #24303c;
  --mc-active: #1c3348;
  --mc-topbar: #171d25;
  --mc-brand-soft: #1c3348;
  --mc-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  --mc-shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.18);
}
html.mc-theme-dark body.mc-body { background: var(--mc-bg); color: var(--mc-text); }
html.mc-theme-dark .mc-userdrop,
html.mc-theme-dark .mc-userdrop::before,
html.mc-theme-dark .mc-modal,
html.mc-theme-dark .mc-preview,
html.mc-theme-dark .mc-card,
html.mc-theme-dark .mc-app-tile,
html.mc-theme-dark .mc-theme-choice,
html.mc-theme-dark .mc-new-menu,
html.mc-theme-dark .mc-more-menu,
html.mc-theme-dark .mc-auth-box,
html.mc-theme-dark .mc-share,
html.mc-theme-dark .mc-kpi,
html.mc-theme-dark .mc-preview-nav,
html.mc-theme-dark .mc-list-card,
html.mc-theme-dark .mc-detail,
html.mc-theme-dark .mc-quick-card,
html.mc-theme-dark .mc-view-toggle,
html.mc-theme-dark .mc-grid-item,
html.mc-theme-dark .mc-dropzone-ico { background: var(--mc-surface); }
html.mc-theme-dark .mc-table th,
html.mc-theme-dark .mc-preview-text,
html.mc-theme-dark .mc-preview-frame,
html.mc-theme-dark .mc-search input,
html.mc-theme-dark .mc-filter-pill input,
html.mc-theme-dark .mc-tenant-label select,
html.mc-theme-dark .mc-btn,
html.mc-theme-dark .mc-form input[type="text"],
html.mc-theme-dark .mc-form input[type="email"],
html.mc-theme-dark .mc-form input[type="password"],
html.mc-theme-dark .mc-form input[type="number"],
html.mc-theme-dark .mc-form select,
html.mc-theme-dark .mc-inline input[type="number"],
html.mc-theme-dark .mc-inline select,
html.mc-theme-dark .mc-modal input[type="text"],
html.mc-theme-dark .mc-modal input[type="password"],
html.mc-theme-dark .mc-modal input[type="datetime-local"],
html.mc-theme-dark .mc-modal input[type="email"],
html.mc-theme-dark .mc-modal input[type="number"],
html.mc-theme-dark .mc-modal select,
html.mc-theme-dark .mc-chart,
html.mc-theme-dark .mc-range-btn,
html.mc-theme-dark .mc-theme-switch,
html.mc-theme-dark .mc-search-kbd {
  background: var(--mc-surface);
  color: var(--mc-text);
}
html.mc-theme-dark .mc-search input,
html.mc-theme-dark .mc-filter-pill input,
html.mc-theme-dark .mc-theme-switch { background: #12171e; }
html.mc-theme-dark .mc-preview-body,
html.mc-theme-dark .mc-foot { background: transparent; }
html.mc-theme-dark .mc-page { background: var(--mc-bg); }
html.mc-theme-dark .mc-page .mc-toolbar { background: transparent; }
html.mc-theme-dark .mc-btn-primary { background: var(--mc-brand); color: #fff; }
html.mc-theme-dark .mc-btn-danger { background: var(--mc-surface); }
html.mc-theme-dark .mc-btn-sup { background: var(--mc-role-sup); color: #fff; }
html.mc-theme-dark .mc-btn-user { background: var(--mc-role-user); color: #fff; }
html.mc-theme-dark .mc-selbar { background: #1c3348; border-color: #2a5a72; }
html.mc-theme-dark .mc-card {
  background: linear-gradient(180deg, #24303a 0%, #1a222a 100%);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.24);
}
html.mc-theme-dark .mc-card .mc-table-wrap { background: var(--mc-surface); }
html.mc-theme-dark .mc-form-block {
  background: rgba(43, 108, 239, 0.12);
  border-color: #3a5366;
}
html.mc-theme-dark .mc-form-block.is-security {
  background: rgba(161, 98, 7, 0.14);
  border-color: #5a4a28;
}
html.mc-theme-dark .mc-role-admin { background: #2c2658; color: #d4ceff; }
html.mc-theme-dark .mc-role-sup { background: #1b3d4f; color: #9fd4ef; }
html.mc-theme-dark .mc-role-user { background: #163d2c; color: #9ee0bc; }
html.mc-theme-dark .mc-role-guest { background: #3d3016; color: #f0d08a; }
html.mc-theme-dark .mc-role-none { background: #2a333c; color: #9aa7b5; }
html.mc-theme-dark .mc-users-table tbody tr:nth-child(even) { background: #1a222a; }
html.mc-theme-dark .mc-users-table tbody tr.mc-user-row:hover,
html.mc-theme-dark .mc-users-table tbody tr.is-selected { background: #1b3d4f; }
html.mc-theme-dark .mc-page-body > .mc-msg,
html.mc-theme-dark .mc-users-page > .mc-msg {
  background: #163d2c;
  border-color: #2a6b4a;
}
html.mc-theme-dark .mc-page-body > .mc-msg.is-err,
html.mc-theme-dark .mc-users-page > .mc-msg.is-err {
  background: #3d1c1a;
  border-color: #7a3530;
}
html.mc-theme-dark .mc-dropzone { background: #1c3348; border-color: #3a5a82; }
html.mc-theme-dark .mc-quick-ico.is-blue { background: #1c3348; color: #93c5fd; }
html.mc-theme-dark .mc-quick-ico.is-teal { background: #163d38; color: #5eead4; }
html.mc-theme-dark .mc-quick-ico.is-violet { background: #2c2658; color: #c4b5fd; }
html.mc-theme-dark .mc-quick-ico.is-amber { background: #3d3016; color: #fbbf24; }
html.mc-theme-dark .mc-tag.is-red { background: #3d1c1a; color: #fca5a5; }
html.mc-theme-dark .mc-tag.is-blue { background: #1c3348; color: #93c5fd; }
html.mc-theme-dark .mc-bar { background: #2a3440; }
html.mc-theme-dark .mc-theme-switch-track { background: #3a4654; }

@media (max-width: 1180px) {
  .mc-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mc-detail { width: 18.5rem; }
}
@media (max-width: 980px) {
  .mc-users.has-detail { grid-template-columns: 1fr; }
  .mc-user-detail { position: static; }
  .mc-workspace { flex-direction: column; }
  .mc-detail { width: 100%; }
}
@media (max-width: 820px) {
  .mc-sidebar { display: none; }
  .mc-search { max-width: none; }
  .mc-user-name, .mc-user-org { max-width: 7rem; }
  .mc-brand { min-width: 0; width: auto; }
  .mc-brand img { height: 32px; }
  .mc-theme-choices { grid-template-columns: 1fr; }
  .mc-preview { height: min(94vh, 56rem); }
  .mc-search-kbd { display: none; }
  .mc-quick { grid-template-columns: 1fr 1fr; }
  .mc-explorer { padding: 0.9rem 0.75rem 1rem; }
}
@media (max-width: 560px) {
  .mc-user-meta { display: none; }
  .mc-quick { grid-template-columns: 1fr; }
  .mc-theme-switch { min-width: 4.6rem; height: 38px; min-height: 38px; }
}