:root {
  color-scheme: dark;
  --bg: #191919;
  --sidebar: #1d1d1d;
  --surface: #202020;
  --surface-2: #282828;
  --surface-3: #303030;
  --text: #f5f5f5;
  --muted: #a7a7a7;
  --line: #383838;
  --accent: #4c91ff;
  --success: #20c875;
  --warning: #f59e0b;
  --content-width: 920px;
}
html[data-theme="light"] {
  color-scheme: light;
  --bg: #f5f7fb;
  --sidebar: #eef1f6;
  --surface: #ffffff;
  --surface-2: #f1f4f8;
  --surface-3: #e7ebf1;
  --text: #18202b;
  --muted: #667181;
  --line: #d7dde6;
  --accent: #286fdb;
  --success: #168657;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.68 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: #8ab4ff; }
html[data-theme="light"] a { color: #286fdb; }
.topbar {
  position: fixed; inset: 0 0 auto 0; z-index: 50; height: 62px; display: grid;
  grid-template-columns: max-content minmax(190px, 1fr) auto auto auto auto auto;
  align-items: center; gap: 9px; padding: 0 18px; border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 96%, transparent); backdrop-filter: blur(14px);
}
.brand { display: inline-flex; align-items: center; gap: 10px; width: max-content; color: var(--text); text-decoration: none; }
.brand-mark { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border: 1px solid #485260; border-radius: 9px; background: #222a35; color: #8ab4ff; font-size: 11px; font-weight: 900; }
.brand-copy { line-height: 1.08; }
.brand-copy strong { display: block; font-size: 15px; }
.brand-copy small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
.menu-button { display: none; border: 0; background: transparent; color: var(--text); font-size: 23px; cursor: pointer; }
.search-wrap { position: relative; width: 100%; }
.search-icon { position: absolute; left: 15px; top: 50%; width: 14px; height: 14px; transform: translateY(-58%); border: 2px solid #9299a2; border-radius: 50%; pointer-events: none; }
.search-icon::after { content: ""; position: absolute; right: -6px; bottom: -4px; width: 7px; height: 2px; transform: rotate(45deg); border-radius: 2px; background: #9299a2; }
.search-wrap input { width: 100%; height: 42px; padding: 0 68px 0 42px; border: 1px solid #454545; border-radius: 11px; outline: 0; background: var(--surface); color: var(--text); font: inherit; }
.search-wrap input:focus { border-color: #687890; box-shadow: 0 0 0 3px rgba(76,145,255,.13); }
.search-wrap input::placeholder { color: #858b94; }
.search-wrap kbd { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); padding: 2px 7px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); color: var(--muted); font: 11px/1.3 ui-monospace, SFMono-Regular, Consolas, monospace; pointer-events: none; }
.search-results { position: absolute; z-index: 80; top: 48px; left: 0; right: 0; max-height: 390px; overflow: auto; padding: 7px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: 0 20px 55px rgba(0,0,0,.38); }
.search-results[hidden] { display: none; }
.search-result { display: block; padding: 10px 12px; border-radius: 8px; color: var(--text); text-decoration: none; }
.search-result:hover { background: var(--surface-2); }
.search-result strong { display: block; font-size: 13px; }
.search-result span { display: block; overflow: hidden; margin-top: 2px; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.search-empty { padding: 15px; color: var(--muted); text-align: center; font-size: 13px; }
.community-badge { display: flex; align-items: center; gap: 9px; min-width: 150px; height: 42px; padding: 0 10px; border: 1px solid transparent; border-radius: 12px; color: #f7f7fb; text-decoration: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); transition: transform .15s ease, border-color .15s ease, background .15s ease; }
.community-badge:hover { transform: translateY(-1px); color: #fff; }
.community-icon { display: grid; width: 23px; height: 23px; flex: 0 0 23px; place-items: center; border-radius: 7px; font-size: 9px; font-weight: 900; }
.community-copy { display: flex; min-width: 0; flex-direction: column; gap: 2px; line-height: 1; }
.community-copy strong { font-size: 12px; font-weight: 850; white-space: nowrap; }
.community-copy small { display: flex; align-items: center; gap: 4px; color: #b8bccd; font-size: 9px; font-weight: 650; white-space: nowrap; }
.community-divider { color: #697083; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: #23d18b; box-shadow: 0 0 0 3px rgba(35,209,139,.12); }
.bisecthosting-badge { min-width: 172px; border-color: rgba(45,217,238,.38); background: linear-gradient(180deg,rgba(25,202,228,.16),rgba(8,29,53,.24)); }
.bisecthosting-badge:hover { border-color: rgba(69,225,244,.72); background: linear-gradient(180deg,rgba(25,202,228,.24),rgba(8,29,53,.32)); }
.bisecthosting-icon { border: 1px solid rgba(69,225,244,.34); background: #0b1730; color: #51e1f1; }
.bisecthosting-badge b { color: #51e1f1; }
.discord-badge { border-color: rgba(130,142,255,.34); background: linear-gradient(180deg,rgba(88,101,242,.20),rgba(88,101,242,.11)); }
.discord-badge:hover { border-color: rgba(142,153,255,.68); background: linear-gradient(180deg,rgba(88,101,242,.30),rgba(88,101,242,.18)); }
.discord-icon { color: #8d98ff; }
.curseforge-badge { border-color: rgba(241,100,54,.35); background: linear-gradient(180deg,rgba(241,100,54,.19),rgba(241,100,54,.10)); }
.curseforge-badge:hover { border-color: rgba(255,126,82,.70); background: linear-gradient(180deg,rgba(241,100,54,.29),rgba(241,100,54,.17)); }
.curseforge-icon { border: 1px solid rgba(255,255,255,.7); background: #fff; color: #f16436; }
.modrinth-badge { border-color: rgba(27,217,106,.34); background: linear-gradient(180deg,rgba(27,217,106,.16),rgba(12,82,43,.12)); }
.modrinth-badge:hover { border-color: rgba(70,233,136,.68); background: linear-gradient(180deg,rgba(27,217,106,.25),rgba(12,82,43,.20)); }
.modrinth-icon { border: 1px solid rgba(27,217,106,.45); background: #102b1b; color: #1bd96a; }
html[data-theme="light"] .community-badge { color: #253043; box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 3px 10px rgba(31,48,73,.07); }
html[data-theme="light"] .community-copy small { color: #657184; }
html[data-theme="light"] .bisecthosting-badge { background: linear-gradient(180deg,#effcff,#ddf8fb); }
html[data-theme="light"] .discord-badge { background: linear-gradient(180deg,#f1f2ff,#e7e9ff); }
html[data-theme="light"] .curseforge-badge { background: linear-gradient(180deg,#fff5f1,#ffe9e1); }
html[data-theme="light"] .modrinth-badge { background: linear-gradient(180deg,#effbf4,#e1f7ea); }
.theme-toggle { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid #454545; border-radius: 10px; background: var(--surface); color: var(--text); cursor: pointer; }
.theme-icon-moon { display: none; }
html[data-theme="light"] .theme-icon-sun { display: none; }
html[data-theme="light"] .theme-icon-moon { display: inline; }
.layout { display: grid; grid-template-columns: 280px minmax(0,1fr); min-height: 100vh; padding-top: 62px; }
#sidebar { position: fixed; top: 62px; bottom: 0; width: 280px; display: flex; flex-direction: column; overflow: auto; padding: 22px 12px; border-right: 1px solid var(--line); background: var(--sidebar); }
.sidebar-title { margin: 0 10px 8px; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .055em; text-transform: uppercase; }
.sidebar-navigation { display: grid; gap: 2px; }
.sidebar-navigation a, .sidebar-link { display: block; padding: 8px 11px; border-radius: 7px; color: var(--muted); font-size: 14px; text-decoration: none; }
.sidebar-navigation a:hover, .sidebar-link:hover { background: var(--surface-2); color: var(--text); }
.sidebar-navigation a.active { background: #252a31; color: #66a5ff; box-shadow: inset 2px 0 0 var(--accent); }
html[data-theme="light"] .sidebar-navigation a.active { background: #e1ebf8; color: #1f66c2; }
.sidebar-section { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); }
.sidebar-footer { display: grid; gap: 2px; margin-top: auto; padding: 18px 11px 2px; border-top: 1px solid var(--line); }
.sidebar-footer strong { font-size: 12px; }
.sidebar-footer span { color: var(--muted); font-size: 11px; }
main { grid-column: 2; min-width: 0; padding: 28px 42px 90px; }
.tabs { position: sticky; z-index: 20; top: 62px; display: flex; gap: 2px; max-width: var(--content-width); margin: 0 auto 40px; padding: 8px 0; overflow-x: auto; border-bottom: 1px solid var(--line); background: var(--bg); }
.tab { padding: 9px 13px; border: 0; border-radius: 7px; background: transparent; color: var(--muted); font: inherit; font-size: 13px; font-weight: 650; white-space: nowrap; cursor: pointer; }
.tab:hover { background: var(--surface-2); color: var(--text); }
.tab.active { background: var(--surface-2); color: var(--text); }
article { max-width: var(--content-width); margin: 0 auto; }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
.page-heading { margin-bottom: 38px; }
.page-kicker { display: block; margin-bottom: 8px; color: #7aaeff; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.22; }
h1 { margin: 0 0 12px; font-size: 2.6rem; font-weight: 800; letter-spacing: -.035em; }
.page-description { max-width: 760px; margin: 0; color: var(--muted); font-size: 1.08rem; }
h2 { margin: 2.8rem 0 1rem; padding-bottom: .45rem; border-bottom: 1px solid var(--line); font-size: 1.65rem; }
h3 { margin: 2rem 0 .8rem; font-size: 1.25rem; }
p { margin: 1rem 0; }
ul, ol { padding-left: 1.45rem; }
li { margin: .35rem 0; }
pre { overflow: auto; padding: 16px; border: 1px solid var(--line); border-radius: 9px; background: #101010; }
html[data-theme="light"] pre { background: #eef1f5; }
code { font-family: "SFMono-Regular", Consolas, monospace; }
p code, li code, td code { padding: .15rem .35rem; border-radius: 5px; background: var(--surface-2); }
table { display: table; width: 100%; max-width: 100%; overflow: auto; border-collapse: collapse; margin: 1.2rem 0 1.7rem; }
th, td { padding: 9px 12px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
th { background: var(--surface); color: var(--text); font-size: 13px; }
td { color: color-mix(in srgb, var(--text) 88%, var(--muted)); }
.hint { margin: 1.45rem 0; padding: 15px 17px; border: 1px solid var(--line); border-left: 3px solid #8b5cf6; border-radius: 8px; background: var(--surface); }
.hint strong { display: block; margin-bottom: 4px; }
.hint p { margin: 0; color: var(--muted); }
.hint-info { border-left-color: #4c91ff; }
.hint-success { border-left-color: var(--success); }
.hint-warning { border-left-color: var(--warning); }
.process-list { list-style: none; padding: 0; }
.process-list li { display: grid; grid-template-columns: 90px 1fr; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.process-list strong { color: var(--text); }
.process-list span { color: var(--muted); }
.command { padding: 16px 0; border-bottom: 1px solid var(--line); }
.command:first-of-type { border-top: 1px solid var(--line); }
.command > code { display: inline-block; padding: .42rem .6rem; border-radius: 6px; background: var(--surface-2); color: #c9dcff; font-size: .93rem; }
html[data-theme="light"] .command > code { color: #194f9b; }
.command p { margin: 8px 0 0; color: var(--muted); }
@media (max-width: 1500px) {
  .community-badge { min-width: 118px; padding: 0 8px; }
  .bisecthosting-badge { min-width: 130px; }
  .community-copy strong { font-size: 11px; }
  .community-copy small { font-size: 8.5px; }
}
@media (max-width: 1180px) {
  .topbar { grid-template-columns: max-content minmax(170px,1fr) auto auto auto auto auto; }
  .community-badge { width: 42px; min-width: 42px; padding: 0; justify-content: center; }
  .community-copy { display: none; }
}
@media (max-width: 820px) {
  .topbar { grid-template-columns: auto minmax(0,1fr) auto auto auto auto auto; gap: 8px; padding: 0 10px; }
  .brand { display: none; }
  .menu-button { display: block; }
  .search-wrap kbd { display: none; }
  .search-wrap input { padding-right: 14px; }
  .layout { display: block; }
  #sidebar { z-index: 45; transform: translateX(-105%); transition: transform .2s ease; box-shadow: 12px 0 30px rgba(0,0,0,.35); }
  body.menu-open #sidebar { transform: translateX(0); }
  main { padding: 20px 18px 70px; }
  .tabs { top: 62px; margin-bottom: 30px; }
  h1 { font-size: 2.15rem; }
}
@media (max-width: 680px) {
  .community-badge { display: none; }
  .topbar { grid-template-columns: auto minmax(0,1fr) auto; }
}
@media (max-width: 580px) {
  table { display: block; }
  .process-list li { grid-template-columns: 1fr; gap: 2px; }
}