@font-face {
  font-family:system-fallback;
  src:local("Microsoft YaHei")
}
:root {
  --navy:#17283e;
  --navy-dark:#102036;
  --blue:#345d87;
  --blue-light:#edf3f9;
  --gold:#b59a68;
  --gold-light:#f6f2e9;
  --bg:#f3f5f8;
  --surface:#fff;
  --text:#233248;
  --muted:#728094;
  --line:#e5eaf0;
  --green:#28765d;
  --green-light:#edf7f1;
  --red:#b6474c;
  --red-light:#fff0f0;
  --amber:#9b6c25;
  --amber-light:#fff7e8;
  --radius:12px;
  --shadow:0 4px 22px #17283e05;
  font-synthesis:none
}
* {
  box-sizing:border-box
}
html {
  font-size:14px;
  scroll-behavior:smooth
}
body {
  margin:0;
  color:var(--text);
  background:var(--bg);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",system-fallback,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
button:disabled {
  cursor:wait;
  opacity:.58
}
a {
  color:var(--blue);
  text-decoration:none
}
a:hover {
  text-decoration:none
}
h1,h2,h3,p {
  margin:0
}
h1 {
  font-size:28px;
  font-weight:650;
  letter-spacing:-.8px;
  line-height:1.4
}
h2 {
  font-size:18px;
  font-weight:650;
  letter-spacing:-.3px
}
h3 {
  font-size:15px;
  font-weight:650
}
strong {
  font-weight:600
}
small {
  font-size:12px
}
.muted {
  color:var(--muted)
}
.mono {
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.2px
}
.nowrap {
  white-space:nowrap
}
.break-all {
  overflow-wrap:anywhere
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
[hidden] {
  display:none!important
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline:3px solid #8eabc6;
  outline-offset:3px
}
.skip-link {
  position:fixed;
  top:-100px;
  left:20px;
  padding:12px 18px;
  background:var(--navy);
  color:white;
  z-index:100
}
.skip-link:focus {
  top:12px
}
::selection {
  background:#dce7f2
}
.icon {
  display:inline-block;
  flex-shrink:0;
  vertical-align:middle
}
.boot-state {
  min-height:100vh;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  color:var(--muted)
}
.spinner {
  display:inline-block;
  width:17px;
  height:17px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation:spin .8s linear infinite;
  flex-shrink:0
}
@keyframes spin {
  to {
    transform:rotate(360deg)
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    transition:none!important
  }
}
.app-shell {
  display:grid;
  grid-template-columns:224px minmax(0,1fr);
  min-height:100vh
}
.sidebar {
  background:var(--navy);
  color:#cbd5e2;
  position:sticky;
  top:0;
  height:100dvh;
  display:flex;
  flex-direction:column;
  padding:30px 18px 22px;
  z-index:40
}
.brand {
  display:flex;
  gap:12px;
  align-items:center;
  padding:0 12px;
  color:white
}
.brand-mark {
  width:38px;
  height:38px;
  flex-shrink:0
}
.brand-name {
  font-size:18px;
  line-height:1.2;
  font-weight:650;
  letter-spacing:1px
}
.brand-subtitle {
  font-size:9px;
  letter-spacing:1.8px;
  margin-top:7px;
  color:#91a1b4
}
.sidebar-label {
  font-size:10px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:#778ba4;
  margin:43px 14px 14px
}
.main-nav {
  display:flex;
  flex-direction:column;
  gap:6px
}
.nav-link {
  display:flex;
  align-items:center;
  gap:13px;
  padding:13px 14px;
  border-radius:8px;
  font-size:13px;
  letter-spacing:.2px;
  color:#aebed0;
  transition:background .15s,color .15s
}
.nav-link:hover {
  background:#ffffff0b;
  color:white
}
.nav-link.active {
  background:#ffffff10;
  color:white;
  box-shadow:inset 3px 0 var(--gold)
}
.nav-link.active .icon {
  color:#d2bc91
}
.nav-link .nav-tag {
  margin-left:auto;
  font-size:9px;
  border:1px solid #536275;
  padding:1px 5px;
  border-radius:4px;
  color:#a0b1c5
}
.sidebar-footer {
  margin-top:auto;
  padding:26px 13px 0;
  border-top:1px solid #ffffff10;
  font-size:11px;
  color:#8da0b8
}
.sidebar-footer .system-dot {
  display:inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#8baa9b;
  margin-right:7px
}
.workspace {
  min-width:0
}
.topbar {
  height:80px;
  background:#ffffffd9;
  border-bottom:1px solid var(--line);
  padding:0 36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px
}
.topbar-context {
  font-size:12px;
  color:var(--muted);
  display:flex;
  align-items:center;
  gap:10px
}
.topbar-context .context-title {
  color:#42546b;
  font-weight:500
}
.context-divider {
  color:#c5cdd8
}
.topbar-actions {
  display:flex;
  gap:16px;
  align-items:center
}
.admin-identity {
  display:flex;
  gap:9px;
  align-items:center
}
.avatar {
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:10px;
  background:var(--gold-light);
  color:#8d7547;
  font-size:11px;
  font-weight:650
}
.identity-meta {
  line-height:1.35
}
.identity-meta strong {
  display:block;
  font-size:12px;
  font-weight:500;
  max-width:140px;
  overflow:hidden;
  text-overflow:ellipsis
}
.identity-meta span {
  font-size:10px;
  color:var(--muted)
}
.header-link {
  font-size:12px;
  color:var(--muted);
  background:none;
  border:0;
  padding:6px 0
}
.header-link:hover {
  color:var(--navy)
}
.header-divider {
  height:22px;
  width:1px;
  background:var(--line)
}
.topbar .menu-button {
  display:none
}
.main-content {
  padding:32px 36px 44px;
  max-width:1740px;
  margin:0 auto
}
.page-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-bottom:26px
}
.eyebrow {
  font-size:9px;
  letter-spacing:1.8px;
  color:var(--gold);
  font-weight:650;
  margin-bottom:7px
}
.page-heading p {
  font-size:12px;
  color:var(--muted);
  margin-top:7px;
  max-width:750px
}
.heading-actions {
  display:flex;
  gap:10px;
  align-items:center;
  flex-shrink:0
}
.page-footer {
  display:flex;
  justify-content:space-between;
  font-size:10px;
  color:#9aa6b5;
  padding:26px 0 0;
  gap:20px
}
.page-footer .footer-brand {
  letter-spacing:1.1px
}
.mobile-backdrop {
  display:none
}
@media(min-width:1600px) {
  .main-content {
    padding:38px 44px 48px
  }
  .topbar {
    padding:0 44px
  }
}
@media(max-width:1180px) {
  .app-shell {
    grid-template-columns:196px minmax(0,1fr)
  }
  .sidebar {
    padding-left:12px;
    padding-right:12px
  }
  .brand {
    gap:9px
  }
  .brand-name {
    font-size:16px
  }
  .brand-subtitle {
    font-size:8px
  }
  .main-content {
    padding:26px 24px 36px
  }
  .topbar {
    padding:0 24px;
    height:72px
  }
  .page-heading {
    align-items:flex-start
  }
  .heading-actions {
    flex-wrap:wrap;
    justify-content:flex-end;
    max-width:280px
  }
  h1 {
    font-size:25px
  }
  .topbar-actions {
    gap:12px
  }
}
@media(max-width:760px) {
  .app-shell {
    display:block
  }
  .sidebar {
    position:fixed;
    left:0;
    top:0;
    width:250px;
    transform:translateX(-100%);
    transition:transform .2s;
    height:100dvh;
    padding:28px 18px
  }
  .sidebar.is-open {
    transform:translateX(0)
  }
  .mobile-backdrop.is-visible {
    display:block;
    position:fixed;
    inset:0;
    background:#10203666;
    z-index:35;
    border:0;
    width:100%;
    height:100%
  }
  .menu-button {
    display:inline-flex!important
  }
  .topbar {
    height:65px;
    padding:0 18px;
    gap:8px
  }
  .topbar-context {
    font-size:12px
  }
  .topbar-context .context-divider,.topbar-context .desktop-context {
    display:none
  }
  .topbar-actions {
    gap:10px
  }
  .identity-meta {
    display:none
  }
  .admin-identity .avatar {
    width:29px;
    height:29px
  }
  .header-link {
    font-size:11px
  }
  .header-divider {
    display:none
  }
  .main-content {
    padding:23px 16px 28px
  }
  .page-heading {
    display:block;
    margin-bottom:21px
  }
  .page-heading p {
    font-size:12px;
    line-height:1.8
  }
  .heading-actions {
    margin-top:18px;
    max-width:none;
    justify-content:flex-start
  }
  .heading-actions .btn {
    flex:1;
    justify-content:center
  }
  h1 {
    font-size:26px;
    letter-spacing:-.6px
  }
  .page-footer {
    font-size:9px;
    line-height:1.7
  }
  .page-footer span:last-child {
    max-width:165px;
    text-align:right
  }
  .eyebrow {
    font-size:8px
  }
  .sidebar-label {
    margin-top:34px
  }
}