@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700;800&display=swap");
:root {
  color-scheme: dark;
  --bg: #050b1b;
  --panel: #0d1730;
  --panel2: color-mix(in srgb, var(--panel) 85%, #fff);
  --line: color-mix(in srgb, var(--panel) 76%, #fff);
  --text: #f2efe8;
  --muted: #a3a8b7;
  --blue: #2f6cff; /* Primary NexoriaCraft blue; configurable in Administration. */
  --blue2: #7c4dff;
  --accent-text: color-mix(in srgb, var(--blue) 75%, var(--text));
  --accent-ink: #111118;
  --success: #3fd7c2;
  --danger: #ff5470;
  --green: var(--success);
  --red: var(--danger);
  --neon: #b07bff;
  --neon2: var(--blue2);
  --shadow: 0 18px 48px #00000038;
  --radius: 18px;
  --focus-ring: 0 0 0 3px color-mix(in srgb, var(--blue) 28%, transparent);
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: radial-gradient(circle at 15% -10%,#153d9a55 0,transparent 34%),radial-gradient(circle at 92% 10%,#5b36b844 0,transparent 34%),var(--bg);
  color: var(--text);
  font: 15px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;
  min-height: 100vh;
}
h1,h2,h3,.brand b,.eyebrow {
  font-family: "Space Grotesk",Inter,ui-sans-serif,system-ui,sans-serif;
}
.bg-glow {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(120deg,transparent 45%,color-mix(in srgb,var(--blue) 3.53%,transparent) 50%,transparent 55%);
}
a {
  color: inherit;
  text-decoration: none;
}
.topbar {
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 max(24px,calc((100vw - 1240px)/2));
  border-bottom: 1px solid color-mix(in srgb,var(--line) 50.20%,transparent);
  background: color-mix(in srgb,var(--bg) 85.88%,transparent);
  backdrop-filter: blur(18px);
  position: sticky;
  top: 0;
  z-index: 10;
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  letter-spacing: .2px;
}
.brand.big {
  font-size: 25px;
}
.brand-mark {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  clip-path: polygon(22% 0,100% 0,100% 78%,78% 100%,0 100%,0 22%);
  background: linear-gradient(145deg,var(--blue),var(--blue2));
  box-shadow: 0 0 24px color-mix(in srgb,var(--blue) 33.33%,transparent);
  font-family: "Space Grotesk",sans-serif;
  font-weight: 700;
}
.topbar nav {
  display: flex;
  align-items: center;
  gap: 22px;
  color: var(--muted);
}
.page {
  max-width: 1240px;
  margin: auto;
  padding: 36px 24px 80px;
}
.glass {
  background: linear-gradient(180deg,color-mix(in srgb,var(--panel) 86.67%,transparent),color-mix(in srgb,var(--bg) 86.67%,transparent));
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(14px);
}
.hero {
  padding: 42px 4px 28px;
}
.hero h1,.page-head h1 {
  font-weight: 600;
  font-size: clamp(32px,5vw,54px);
  line-height: 1.05;
  margin: 9px 0 12px;
  letter-spacing: -1.2px;
}
.hero p,.page-head p {
  max-width: 780px;
  color: var(--muted);
  font-size: 17px;
}
.eyebrow {
  color: var(--green);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1.2px;
}
.bot-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 24px;
}
.bot-card {
  overflow: hidden;
  position: relative;
}
.bot-card:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 46px;
  height: 3px;
  background: var(--blue);
  z-index: 2;
}
.bot-cover {
  height: 180px;
  border-bottom: 1px solid var(--line);
  background-size: cover;
  background-position: center;
}
.gta-cover {
  background-image: linear-gradient(180deg,transparent 20%,color-mix(in srgb,var(--panel) 91.76%,transparent)),url("/static/gta-hero.jpg");
  background-position: center 43%;
}
.mc-cover {
  display: grid;
  place-items: center;
  background: radial-gradient(circle at 50% 30%,var(--blue2) 0,#2a2313 40%,#12100a 75%);
}
.mc-cover span {
  font-size: 72px;
  filter: drop-shadow(0 12px 24px #0008);
}
.bot-body {
  padding: 22px;
}
.row {
  display: flex;
  gap: 14px;
  align-items: center;
}
.between {
  justify-content: space-between;
}
.bot-body h2 {
  margin: 7px 0 0;
  font-size: 24px;
  font-weight: 600;
}
.pill,.tag {
  display: inline-block;
  border: 1px solid var(--line);
  background: var(--panel);
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  color: var(--muted);
  font-weight: 700;
}
.status {
  font-size: 12px;
  font-weight: 700;
  padding: 6px 9px;
  border-radius: 999px;
  border: 1px solid;
}
.status.online {
  color: #7fe9d4;
  background: var(--panel);
  border-color: #1f7364;
}
.status.offline {
  color: #ff9fb0;
  background: #3a1620;
  border-color: #742a3c;
}
.muted,small {
  color: var(--muted);
}
.actions {
  margin: 18px 0;
}
.button,.primary,.secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 10px;
  padding: 11px 15px;
  font-weight: 700;
  cursor: pointer;
}
.primary {
  background: linear-gradient(135deg,var(--blue),var(--blue2));
  color: #15100a;
  box-shadow: 0 8px 24px color-mix(in srgb,var(--blue) 23.92%,transparent);
}
.secondary {
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--line);
}
.guild-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}
.guild-row {
  display: grid;
  grid-template-columns: 42px 1fr 20px;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  transition: .15s;
}
.guild-row:hover {
  border-color: color-mix(in srgb,var(--blue) 50.20%,transparent);
  transform: translateY(-1px);
}
.guild-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--panel);
  display: grid;
  place-items: center;
  font-weight: 700;
  overflow: hidden;
}
.guild-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.guild-row b,.guild-row small {
  display: block;
}
.chev {
  font-size: 25px;
  color: #6b7280;
}
.empty {
  padding: 18px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
}
.login-wrap {
  min-height: 80vh;
  display: grid;
  place-items: center;
}
.login-card {
  width: min(430px,100%);
  padding: 34px;
}
.stack {
  display: grid;
  gap: 16px;
}
.stack label,.panel label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-weight: 600;
}
input,select,textarea {
  width: 100%;
  background: var(--panel);
  border: 1px solid var(--line);
  color: #f2efe8;
  border-radius: 10px;
  padding: 11px 12px;
  outline: none;
  font: inherit;
}
input:focus,select:focus,textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--blue) 13.33%,transparent);
}
textarea {
  resize: vertical;
}
.alert {
  padding: 12px 14px;
  border-radius: 10px;
  margin: 14px 0;
}
.alert.error {
  background: #3a1620;
  border: 1px solid #74304a;
  color: #ffc0cb;
}
.alert.success {
  background: var(--panel);
  border: 1px solid #1f7364;
  color: #b7f8ea;
}
.inline {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  margin: 0;
}
.linkbtn {
  border: 0;
  background: none;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
}
.page-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin: 8px 0 26px;
}
.page-head h1 {
  font-size: 42px;
}
.back {
  display: block;
  color: var(--blue2);
  margin-bottom: 10px;
}
.tabs {
  display: flex;
  gap: 8px;
  overflow: auto;
  margin-bottom: 18px;
}
.tabs button {
  background: var(--panel);
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 14px;
  cursor: pointer;
  white-space: nowrap;
  font-weight: 700;
}
.tabs button.active {
  background: linear-gradient(135deg,var(--blue),var(--blue));
  color: #15100a;
  border-color: transparent;
}
.tab-panel {
  display: none;
}
.tab-panel.active {
  display: block;
}
.form-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 18px;
}
.panel {
  padding: 20px;
}
.panel.full {
  grid-column: 1/-1;
}
.panel h3 {
  margin: 0 0 16px;
  font-size: 19px;
  font-weight: 600;
}
.panel label {
  margin: 12px 0;
}
.check {
  display: flex !important;
  align-items: center;
  grid-template-columns: auto 1fr !important;
  gap: 9px !important;
}
.check input {
  width: auto;
}
.code {
  font: 13px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  tab-size: 2;
}
.savebar {
  position: sticky;
  bottom: 14px;
  margin-top: 20px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  z-index: 6;
}
.access-grid {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  max-height: 240px;
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.bot-access {
  font-weight: 700 !important;
  color: var(--blue2) !important;
}
.table-wrap {
  overflow: auto;
}
table {
  width: 100%;
  border-collapse: collapse;
  min-width: 850px;
}
th,td {
  text-align: left;
  padding: 12px 10px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
td small {
  display: block;
}
.reset input {
  width: 160px;
  padding: 8px;
}
.tag {
  margin: 2px;
}
@media (max-width:850px) {
  .bot-grid,.form-grid {
    grid-template-columns: 1fr;
  }
  .panel.full {
    grid-column: auto;
  }
  .page-head {
    align-items: start;
    flex-direction: column;
  }
  .savebar {
    align-items: stretch;
    flex-direction: column;
  }
  .topbar {
    padding: 0 14px;
  }
  .topbar .brand span:last-child {
    display: none;
  }
  .page {
    padding: 24px 14px 80px;
  }
}
/* v2 control center */
body {
  background: var(--bg);
  min-height: 100vh;
}
.bg-glow {
  background: radial-gradient(circle at 18% -10%,color-mix(in srgb,var(--blue) 28%,transparent),transparent 34%),radial-gradient(circle at 85% 14%,color-mix(in srgb,var(--blue2) 18%,transparent),transparent 30%);
}
.glass {
  background: linear-gradient(180deg,color-mix(in srgb,var(--panel) 92%,transparent),color-mix(in srgb,var(--bg) 78%,var(--panel)));
  border-color: color-mix(in srgb,var(--blue) 34%,var(--line));
}
.user-chip {
  font-size: 12px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--accent-text);
}
.footer {
  max-width: 1240px;
  margin: -52px auto 0;
  padding: 0 24px 28px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.server-id {
  text-align: right;
  color: var(--muted);
  font-size: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}
.server-id code {
  color: var(--text);
}
.section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  margin: 8px 0 18px;
}
.section-head h2 {
  font-size: 28px;
  margin: 0 0 4px;
}
.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.panel small {
  display: block;
  margin-top: 5px;
}
.panel select[multiple] {
  min-height: 148px;
}
.command-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.command-grid code {
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel);
}
.type-editor {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}
.type-card {
  border: 1px solid var(--line);
  background: color-mix(in srgb,var(--panel) 72.16%,transparent);
  border-radius: 14px;
  padding: 16px;
}
.type-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 14px;
}
.type-card-head>div:first-child {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 8px;
  align-items: center;
}
.type-card-head small {
  grid-column: 2;
  color: var(--muted);
}
.type-emoji {
  font-size: 22px;
  grid-row: 1/3;
}
.editor-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}
.editor-grid label {
  margin: 0;
}
.editor-grid .span2 {
  grid-column: 1/-1;
}
.iconbtn {
  border: 1px solid var(--line);
  background: var(--panel2);
  color: var(--text);
  border-radius: 8px;
  min-width: 32px;
  height: 32px;
  cursor: pointer;
}
.smallbtn {
  padding: 7px 10px !important;
  font-size: 12px;
}
.danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #8c3150;
  background: #49172a;
  color: #ffd5de;
  border-radius: 9px;
  padding: 10px 12px;
  font-weight: 800;
  cursor: pointer;
}
.danger:hover {
  background: #641e36;
}
.questions {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.question-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.question-row {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 8px;
  align-items: center;
}
.question-row>span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--panel2);
  color: var(--accent-text);
  font-weight: 800;
}
.question-row textarea {
  min-height: 54px;
}
.question-row>div {
  display: flex;
  gap: 5px;
}
.raw-editor {
  margin-top: 18px;
  border-top: 1px dashed var(--line);
  padding-top: 14px;
}
.raw-editor summary {
  cursor: pointer;
  color: var(--accent-text);
  font-weight: 800;
  margin-bottom: 12px;
}
.raw-editor button {
  margin-top: 8px;
}
.permission-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}
.owner-lock {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 14px 0;
}
.owner-badge {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
  padding: 6px 9px;
  border-radius: 8px;
  background: linear-gradient(135deg,var(--blue),var(--blue));
  color: var(--text);
}
.account-list {
  margin-top: 20px;
}
.account-card {
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--panel);
  margin-top: 10px;
  overflow: hidden;
}
.account-card summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  cursor: pointer;
}
.account-card summary::-webkit-details-marker {
  display: none;
}
.account-card summary>span:first-child {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.account-summary-right {
  margin-left: auto;
}
.account-body {
  padding: 0 16px 16px;
  border-top: 1px solid var(--line);
}
.account-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  color: var(--muted);
  font-size: 12px;
  margin: 13px 0;
}
.danger-zone {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-top: 14px;
  margin-top: 14px;
  border-top: 1px dashed var(--line);
}
.alert.info {
  background: var(--panel2);
  border: 1px solid var(--line);
  color: var(--text);
}
.audit-json {
  white-space: pre-wrap;
  max-width: 460px;
  max-height: 180px;
  overflow: auto;
  background: var(--panel);
  border: 1px solid var(--line);
  padding: 10px;
  border-radius: 8px;
  color: var(--accent-text);
}
.color-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
}
.color-grid input[type=color] {
  height: 46px;
  padding: 4px;
}
.theme-preview {
  margin-top: 18px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: linear-gradient(145deg,var(--panel),var(--bg));
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 10px;
  align-items: center;
}
.theme-preview .brand-mark {
  grid-row: 1/3;
}
.theme-preview small {
  grid-column: 2;
}
.compact .page {
  padding-top: 22px;
}
.compact .panel {
  padding: 15px;
}
.compact .bot-cover {
  height: 120px;
}
.compact .type-card {
  padding: 12px;
}
@media (max-width:850px) {
  .two-col,.editor-grid,.permission-grid,.color-grid {
    grid-template-columns: 1fr;
  }
  .editor-grid .span2 {
    grid-column: auto;
  }
  .type-card-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .question-row {
    grid-template-columns: 24px 1fr;
  }
  .question-row>div {
    grid-column: 2;
  }
  .server-id {
    text-align: left;
  }
  .topbar nav {
    gap: 10px;
  }
  .user-chip {
    display: none;
  }
  .section-head {
    align-items: flex-start;
    flex-direction: column;
  }
}
/* v3: granular website + team center */
html {
  font-size: var(--font-scale,100%);
}
.page,.footer {
  max-width: var(--content-width,1240px);
}
.glass,.panel,.bot-card,.login-card,.type-card,.account-card,.team-entry,.content-card,.task-card,.resource-card,.member-card {
  border-radius: var(--radius,18px);
}
.brand-logo {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  object-fit: cover;
  border: 1px solid color-mix(in srgb,var(--blue) 45%,#fff0);
}
.alert.info {
  background: var(--panel2);
  border: 1px solid var(--line);
  color: var(--text);
}
.fullbtn {
  width: 100%;
  margin-top: 12px;
}
.compact-hero {
  padding-bottom: 20px;
}
.static {
  cursor: default;
}
.team-card-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 18px;
}
.team-entry {
  --team-accent: var(--blue);
  position: relative;
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 20px;
  border-color: color-mix(in srgb,var(--team-accent) 44%,var(--line));
  overflow: hidden;
  transition: .18s;
  background: linear-gradient(145deg,color-mix(in srgb,var(--team-accent) 9%,color-mix(in srgb,var(--panel) 86.67%,transparent)),color-mix(in srgb,var(--panel) 86.67%,transparent));
}
a.team-entry:hover {
  transform: translateY(-2px);
  border-color: var(--team-accent);
  box-shadow: 0 20px 60px color-mix(in srgb,var(--team-accent) 18%,transparent);
}
.team-entry-top {
  grid-column: 1/-1;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.team-game {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.4px;
  color: var(--team-accent);
}
.team-entry-icon {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background: var(--panel2);
  display: grid;
  place-items: center;
  font-size: 24px;
  font-weight: 900;
  overflow: hidden;
  border: 1px solid color-mix(in srgb,var(--team-accent) 38%,#fff0);
}
.team-entry-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.team-entry h2 {
  margin: 0 0 3px;
}
.team-entry p {
  margin: 0;
  color: var(--text);
}
.team-entry small {
  display: block;
  margin-top: 4px;
}
.rank-chip {
  display: inline-flex;
  align-items: center;
  width: max-content;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
  color: color-mix(in srgb,var(--rank,#3b82f6) 35%,var(--text));
  background: color-mix(in srgb,var(--rank,#3b82f6) 18%,var(--panel));
  border: 1px solid color-mix(in srgb,var(--rank,#3b82f6) 55%,#fff0);
}
.team-shell {
  display: grid;
  grid-template-columns: 255px minmax(0,1fr);
  gap: 20px;
  align-items: start;
  --team-accent: var(--blue);
}
.team-sidebar {
  position: sticky;
  top: 92px;
  padding: 16px;
}
.team-panel-brand {
  display: flex;
  gap: 11px;
  align-items: center;
  padding: 10px 0 18px;
  border-bottom: 1px solid var(--line);
}
.team-panel-brand>img,.team-panel-brand>span {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  object-fit: cover;
  display: grid;
  place-items: center;
  background: color-mix(in srgb,var(--team-accent) 24%,var(--panel));
  font-weight: 900;
}
.team-panel-brand b,.team-panel-brand small {
  display: block;
}
.team-nav {
  display: grid;
  gap: 5px;
  padding: 16px 0;
}
.team-nav button {
  border: 0;
  background: transparent;
  color: var(--muted);
  text-align: left;
  padding: 10px 11px;
  border-radius: 9px;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.team-nav button:hover,.team-nav button.active {
  background: color-mix(in srgb,var(--team-accent) 20%,var(--panel));
  color: var(--text);
}
.team-me {
  display: grid;
  gap: 2px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.team-me span {
  font-size: 12px;
  color: var(--team-accent);
}
.team-content {
  min-width: 0;
}
.team-tab {
  display: none;
}
.team-tab.active {
  display: block;
}
.team-hero {
  min-height: 250px;
  padding: 34px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  background-size: cover;
  background-position: center;
  border-color: color-mix(in srgb,var(--team-accent) 45%,var(--line));
}
.team-hero h1 {
  font-size: clamp(31px,5vw,50px);
  margin: 5px 0 9px;
}
.team-hero p {
  max-width: 760px;
  font-size: 16px;
  color: var(--accent-text);
  white-space: pre-wrap;
}
.emergency-banner {
  margin-bottom: 15px;
  padding: 13px 15px;
  border: 1px solid #a96a22;
  background: #4b2d0d;
  color: var(--accent-text);
  border-radius: 11px;
  font-weight: 800;
}
.metric-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 12px;
  margin: 14px 0;
}
.metric {
  padding: 18px;
}
.metric b {
  display: block;
  font-size: 28px;
  color: var(--team-accent);
}
.metric span {
  color: var(--muted);
  font-size: 12px;
}
.team-content>.team-tab>.panel {
  margin-top: 14px;
}
.section-title h2 {
  margin-top: 0;
}
.content-list {
  display: grid;
  gap: 12px;
}
.content-card {
  padding: 18px;
  background: var(--panel);
  border: 1px solid var(--line);
}
.content-card.glass {
  box-shadow: 0 10px 35px #0003;
}
.content-card.pinned {
  border-color: color-mix(in srgb,var(--team-accent) 55%,var(--line));
}
.content-card summary {
  cursor: pointer;
  list-style: none;
}
.content-card summary h3 {
  display: inline-block;
  margin: 8px 0;
}
.content-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: var(--muted);
  font-size: 11px;
}
.richtext {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--text);
}
.small-rich {
  font-size: 13px;
  color: var(--muted);
}
.edit-content {
  border-top: 1px solid var(--line);
  margin-top: 15px;
  padding-top: 15px;
}
.create-box {
  margin-bottom: 18px;
}
.create-box[hidden] {
  display: none;
}
.sub-editor {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
}
.sub-editor summary {
  cursor: pointer;
  color: var(--accent-text);
  font-weight: 800;
  margin-bottom: 12px;
}
.task-board {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}
.task-card {
  padding: 17px;
  border-left: 3px solid var(--line);
}
.task-card.priority-high {
  border-left-color: var(--blue);
}
.task-card.priority-urgent {
  border-left-color: #ef4444;
}
.task-card.priority-low {
  border-left-color: var(--blue2);
}
.task-card h3 {
  margin: 12px 0 7px;
}
.task-card form select {
  min-width: 130px;
}
.status-dot {
  font-size: 11px;
  font-weight: 800;
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--panel2);
}
.status-dot.done {
  color: #85efba;
}
.status-dot.progress {
  color: #ffd98a;
}
.resource-grid,.roster-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}
.resource-card {
  padding: 17px;
}
.resource-card h3 {
  margin: 10px 0 4px;
}
.resource-card p {
  color: var(--muted);
  min-height: 42px;
}
.resource-card form {
  margin-top: 9px;
}
.member-card {
  padding: 15px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.member-avatar {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb,var(--team-accent) 25%,var(--panel2));
  font-weight: 900;
}
.member-card h3 {
  margin: 0 0 5px;
}
.member-card p {
  margin: 6px 0 0;
  color: var(--muted);
}
.team-assignment-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
  margin-top: 10px;
}
.account-editor details {
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 10px;
}
.account-editor details summary {
  cursor: pointer;
  color: var(--text);
}
.rank-list {
  margin-top: 18px;
}
.rank-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  margin: 10px 0;
}
.rank-card>summary {
  padding: 13px;
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  align-items: center;
  cursor: pointer;
}
.rank-edit {
  padding: 14px;
  border-top: 1px solid var(--line);
}
@media (max-width:1000px) {
  .team-shell {
    grid-template-columns: 1fr;
  }
  .team-sidebar {
    position: static;
  }
  .team-nav {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
  .team-nav button {
    text-align: center;
  }
  .metric-grid {
    grid-template-columns: repeat(2,1fr);
  }
}
@media (max-width:760px) {
  .team-card-grid,.task-board,.resource-grid,.roster-grid,.team-assignment-grid {
    grid-template-columns: 1fr;
  }
  .team-entry {
    grid-template-columns: 54px 1fr auto;
  }
  .team-entry-icon {
    width: 54px;
    height: 54px;
  }
  .team-nav {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .metric-grid {
    grid-template-columns: 1fr 1fr;
  }
  .topbar nav {
    gap: 10px;
  }
  .topbar nav>a {
    display: none;
  }
  .user-chip {
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
.member-admin-grid {
  display: grid;
  gap: 12px;
}
.member-admin-card {
  padding: 16px;
  border: 1px solid var(--line);
  background: var(--panel);
}
.member-admin-card .muted {
  display: block;
}
.member-admin-card .editor-grid {
  grid-template-columns: repeat(3,minmax(0,1fr));
}
.member-admin-card .row:last-child {
  flex-wrap: wrap;
}
@media (max-width:850px) {
  .member-admin-card .editor-grid {
    grid-template-columns: 1fr;
  }
}
/* v5: full Discord panel builder */
.panel-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 14px;
}
.panel-builder-list {
  display: grid;
  gap: 18px;
}
.panel-builder-card {
  padding: 18px;
}
.panel-builder-grid {
  display: grid;
  grid-template-columns: minmax(0,1.6fr) minmax(300px,.8fr);
  gap: 18px;
  align-items: start;
}
.panel-builder-controls {
  min-width: 0;
}
.builder-section {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.builder-section h4 {
  margin: 0;
}
.builder-item {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px;
  align-items: end;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--panel);
}
.builder-item>.row {
  align-self: center;
}
.panel-preview-wrap {
  position: sticky;
  top: 92px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--bg);
}
.discord-preview {
  margin-top: 9px;
  background: #313338;
  color: var(--text);
  padding: 14px;
  border-radius: 9px;
  min-height: 160px;
  font-family: gg sans,Inter,system-ui,sans-serif;
}
.preview-content {
  white-space: pre-wrap;
  margin-bottom: 10px;
}
.discord-embed {
  --embed-color: #5865f2;
  position: relative;
  background: #2b2d31;
  border-radius: 4px;
  padding: 12px 12px 12px 16px;
  margin: 6px 0;
  overflow: hidden;
}
.discord-embed:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--embed-color);
}
.discord-embed>b {
  display: block;
  color: var(--text);
  font-size: 16px;
  margin: 4px 0;
}
.discord-embed>p {
  white-space: pre-wrap;
  margin: 6px 0;
  color: var(--text);
}
.discord-embed small {
  display: block;
  color: #b5bac1;
  margin-top: 7px;
  overflow-wrap: anywhere;
}
.preview-fields {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.preview-field {
  display: grid;
}
.preview-field.inline {
  display: inline-grid;
  width: 48%;
  margin-right: 1%;
}
.preview-field b {
  font-size: 13px;
  color: var(--text);
}
.preview-field span {
  font-size: 13px;
  white-space: pre-wrap;
  color: var(--text);
}
.preview-buttons {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.preview-button {
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 4px;
  background: var(--blue);
  color: var(--text);
}
.preview-button.secondary {
  background: #4e5058;
}
.preview-button.success {
  background: #248046;
}
.preview-button.danger {
  background: #da373c;
  border: 0;
}
.preview-button.link {
  background: #4e5058;
}
.panel-publish-actions {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.panel-publish-actions button {
  width: 100%;
}
.button-builder-item {
  border-left: 3px solid var(--blue);
}
@media (max-width:1000px) {
  .panel-builder-grid {
    grid-template-columns: 1fr;
  }
  .panel-preview-wrap {
    position: static;
  }
}
@media (max-width:760px) {
  .builder-item {
    grid-template-columns: 1fr;
  }
  .builder-item>.row {
    justify-content: flex-end;
  }
  .preview-field.inline {
    display: grid;
    width: 100%;
    margin-right: 0;
  }
}
/* v6: premium control center, drawer navigation, account center and light theme */
.premium-topbar {
  z-index: 40;
}
.topbar-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.nav-toggle {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--text);
  font-size: 20px;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.nav-toggle:hover {
  border-color: var(--blue);
  background: var(--panel2);
}
.top-account {
  font-weight: 750;
}
.nav-scrim {
  position: fixed;
  inset: 0;
  background: color-mix(in srgb,var(--bg) 76.08%,transparent);
  backdrop-filter: blur(3px);
  opacity: 0;
  pointer-events: none;
  transition: .2s;
  z-index: 48;
}
.app-drawer {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  width: min(360px,88vw);
  padding: 18px;
  background: linear-gradient(180deg,var(--panel),var(--bg));
  border-right: 1px solid var(--line);
  box-shadow: 30px 0 90px #000b;
  transform: translateX(-104%);
  transition: .22s ease;
  z-index: 49;
  overflow: auto;
}
.nav-open .nav-scrim {
  opacity: 1;
  pointer-events: auto;
}
.nav-open .app-drawer {
  transform: translateX(0);
}
.drawer-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 11px;
  align-items: center;
  padding: 4px 2px 18px;
  border-bottom: 1px solid var(--line);
}
.drawer-head b,.drawer-head small {
  display: block;
}
.drawer-section {
  display: grid;
  gap: 6px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.drawer-label {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.6px;
  color: var(--accent-text);
  padding: 0 10px 5px;
}
.drawer-section>a,.drawer-section>button {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--text);
  padding: 11px 12px;
  border-radius: 10px;
  font: inherit;
  font-weight: 760;
  cursor: pointer;
}
.drawer-section>a:hover,.drawer-section>button:hover {
  background: var(--panel2);
  color: var(--text);
}
.drawer-footer {
  display: grid;
  gap: 3px;
  padding: 18px 10px;
  color: var(--text);
}
.drawer-footer small {
  font-size: 11px;
}
.premium-head {
  padding-top: 10px;
}
.account-badge {
  border: 1px solid var(--line);
  background: linear-gradient(135deg,var(--panel2),var(--panel));
  padding: 10px 13px;
  border-radius: 12px;
  color: var(--accent-text);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.2px;
  white-space: nowrap;
}
.control-hero {
  display: grid;
  grid-template-columns: minmax(0,1fr) 250px;
  gap: 24px;
  align-items: end;
  padding: 45px 0;
}
.hero-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 22px;
}
.hero-status {
  padding: 20px;
  display: grid;
  gap: 4px;
}
.hero-status span {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.hero-status b {
  font-size: 21px;
}
.home-actions {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin: 0 0 36px;
}
.home-action {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 13px;
  align-items: center;
  padding: 16px;
  transition: .15s;
}
.home-action:hover {
  border-color: var(--blue);
  transform: translateY(-1px);
}
.home-action-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: var(--panel2);
  font-size: 21px;
}
.home-action b,.home-action small {
  display: block;
}
.home-action>span:last-child {
  font-size: 24px;
  color: var(--accent-text);
}
.bot-card {
  padding: 20px;
}
.bot-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bot-card-top>div {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
}
.bot-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #7d3142;
  box-shadow: 0 0 0 4px #7d314226;
}
.bot-dot.online {
  background: #31d58b;
  box-shadow: 0 0 0 4px #31d58b25;
}
.guild-link {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 11px;
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 12px;
}
.guild-link:hover {
  border-color: var(--blue);
}
.guild-link>span {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--panel2);
  font-weight: 900;
  overflow: hidden;
}
.guild-link img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.guild-link b,.guild-link small {
  display: block;
}
.guild-link i {
  font-style: normal;
  font-size: 24px;
  color: var(--accent-text);
}
.empty-state {
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  color: var(--muted);
}
.admin-metric-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 12px;
  margin-bottom: 18px;
}
.metric-card {
  padding: 17px;
  display: flex;
  align-items: center;
  gap: 13px;
}
.metric-card>span {
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: var(--panel2);
  display: grid;
  place-items: center;
  font-size: 20px;
}
.metric-card b,.metric-card small {
  display: block;
}
.metric-card b {
  font-size: 25px;
}
.admin-overview-grid {
  align-items: start;
}
.quick-action-grid {
  display: grid;
  gap: 9px;
  margin-top: 15px;
}
.quick-action {
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--text);
  border-radius: 12px;
  padding: 13px;
  text-align: left;
  cursor: pointer;
}
.quick-action:hover {
  border-color: var(--blue);
  background: var(--panel2);
}
.quick-action b,.quick-action small {
  display: block;
}
.quick-action small {
  margin-top: 3px;
}
.role-explainer {
  display: grid;
  gap: 15px;
}
.role-explainer>div {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 12px;
}
.role-explainer p {
  margin: 3px 0;
  color: var(--muted);
}
.role-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-weight: 900;
}
.role-icon.admin {
  background: var(--blue);
  color: var(--accent-text);
}
.role-icon.normal {
  background: #163d31;
  color: #9cf0c6;
}
.create-user-panel {
  margin-bottom: 18px;
}
.access-builder {
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 13px;
  padding: 14px;
}
.access-builder small {
  display: block;
}
.team-assignment-grid label>span {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
}
.modern-account-list {
  display: grid;
  gap: 12px;
}
.modern-account-list .account-card {
  padding: 0;
  overflow: hidden;
}
.modern-account-list .account-card>summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 16px 18px;
  cursor: pointer;
  list-style: none;
}
.account-summary-main {
  display: flex;
  align-items: center;
  gap: 11px;
}
.account-summary-main b,.account-summary-main small {
  display: block;
}
.account-summary-meta {
  text-align: right;
}
.account-summary-meta small {
  margin-top: 4px;
}
.account-body {
  padding: 0 18px 18px;
  border-top: 1px solid var(--line);
}
.read-only-info {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}
.read-only-info span {
  font-size: 11px;
  color: var(--muted);
}
.account-actions {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.bot-control-grid {
  display: grid;
  gap: 16px;
}
.bot-control-card {
  padding: 20px;
}
.online-dot {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  color: #f59cab;
}
.online-dot.on {
  color: #77eab1;
}
.guild-control-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  padding: 13px 0;
  border-top: 1px solid var(--line);
}
.guild-control-row>div:first-child {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.guild-control-row img,.guild-control-row>div:first-child>span {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: var(--panel2);
  object-fit: cover;
  font-weight: 900;
}
.guild-control-row b,.guild-control-row small {
  display: block;
}
.guild-shortcuts {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.guild-shortcuts a {
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 800;
  color: var(--accent-text);
}
.guild-shortcuts a:hover {
  border-color: var(--blue);
  color: var(--text);
}
.account-settings-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 18px;
}
.account-settings-grid .full {
  grid-column: 1/-1;
}
.section-icon {
  font-size: 27px;
  margin-bottom: 7px;
}
.security-divider {
  height: 1px;
  background: var(--blue);
  margin: 20px 0;
}
.danger-panel {
  border-color: #7b3047 !important;
  background: linear-gradient(180deg,#2a101a,#150b13) !important;
}
.danger-delete-form {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 10px;
  align-items: end;
}
.maintenance-card {
  max-width: 680px;
  margin: 12vh auto;
  padding: 48px;
  text-align: center;
}
.maintenance-icon {
  display: block;
  font-size: 48px;
  margin-bottom: 12px;
}
.maintenance-card h1 {
  font-size: 42px;
  margin: 8px;
}
.maintenance-card p {
  color: var(--muted);
  font-size: 17px;
  margin-bottom: 24px;
}
/* Light / White mode. User preference can override the global default. */
@media (max-width:900px) {
  .admin-metric-grid {
    grid-template-columns: repeat(2,1fr);
  }
  .control-hero {
    grid-template-columns: 1fr;
  }
  .hero-status {
    display: none;
  }
  .home-actions,.account-settings-grid {
    grid-template-columns: 1fr;
  }
  .account-settings-grid .full {
    grid-column: auto;
  }
  .danger-delete-form {
    grid-template-columns: 1fr;
  }
  .guild-control-row {
    align-items: flex-start;
    flex-direction: column;
  }
  .guild-shortcuts {
    justify-content: flex-start;
  }
  .top-account {
    display: none;
  }
}
@media (max-width:650px) {
  .admin-metric-grid {
    grid-template-columns: 1fr 1fr;
  }
  .modern-account-list .account-card>summary {
    align-items: flex-start;
    flex-direction: column;
  }
  .account-summary-meta {
    text-align: left;
  }
  .home-actions {
    grid-template-columns: 1fr;
  }
  .premium-topbar nav .user-chip {
    display: none;
  }
  .nav-toggle {
    width: 38px;
    height: 38px;
  }
  .maintenance-card {
    padding: 28px 20px;
  }
  .maintenance-card h1 {
    font-size: 32px;
  }
}
/* v8 Team Center + Moderation polish */
.row.wrap {
  flex-wrap: wrap;
}
.compact-table {
  min-width: 760px;
}
.compact-table th,.compact-table td {
  padding: 10px 9px;
  font-size: 12px;
}
.member-card .status-dot {
  margin-left: 2px;
}
.team-nav button[data-team-tab="handbook"],.team-nav button[data-team-tab="training"] {
  border-color: color-mix(in srgb,var(--team-accent) 35%,var(--line));
}
/* ========================================================================== */
/* v11 Production Social UI                                                   */
/* ========================================================================== */
.noise-layer {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: .16;
  background-image: radial-gradient(#fff 0.45px,transparent .55px);
  background-size: 5px 5px;
  mask-image: linear-gradient(to bottom,#0007,transparent 80%);
}
.premium-topbar {
  height: 74px;
  padding: 0 max(20px,calc((100vw - var(--content-width))/2));
  box-shadow: 0 12px 45px #0007;
}
.brand>span:last-child {
  display: flex;
  flex-direction: column;
  line-height: 1.05;
}
.brand b {
  font-size: 15px;
}
.brand small {
  font-size: 9px;
  letter-spacing: .9px;
  color: var(--muted);
  margin-top: 4px;
}
.nav-toggle {
  display: flex !important;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  justify-content: center;
}
.nav-toggle span {
  width: 17px;
  height: 2px;
  border-radius: 99px;
  background: currentColor;
}
.topbar-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.top-icon-link {
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: var(--panel);
  font-size: 18px;
}
.nav-badge {
  position: absolute;
  right: -5px;
  top: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 99px;
  background: #f43f5e;
  color: var(--text);
  display: grid;
  place-items: center;
  font-size: 9px;
  font-weight: 900;
}
.top-profile {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 10px 6px 6px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}
.top-profile b,.top-profile small {
  display: block;
}
.top-profile b {
  font-size: 12px;
}
.top-profile small {
  font-size: 9px;
  color: var(--muted);
}
.mini-avatar,.profile-avatar {
  --avatar-color: var(--blue);
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(135deg,var(--avatar-color),color-mix(in srgb,var(--avatar-color) 55%,var(--bg)));
  color: var(--text);
  font-weight: 950;
  text-transform: uppercase;
  border: 2px solid color-mix(in srgb,var(--avatar-color) 50%,#fff0);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--avatar-color) 18%,transparent);
}
.mini-avatar {
  width: 34px;
  height: 34px;
  font-size: 13px;
}
.profile-avatar img,.mini-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.drawer-avatar {
  width: 48px;
  height: 48px;
}
.drawer-count {
  margin-left: auto;
  background: #ef4565;
  color: var(--text);
  border-radius: 99px;
  padding: 1px 7px;
  font-size: 9px;
}
.app-drawer {
  width: min(360px,92vw);
  padding: 18px;
}
.drawer-head {
  grid-template-columns: auto 1fr auto;
}
.drawer-section>a,.drawer-section>button {
  min-height: 44px;
  border-radius: 11px;
}
.drawer-section>a:hover,.drawer-section>button:hover {
  transform: translateX(2px);
}
/* Login */
.login-shell {
  min-height: calc(100vh - 70px);
  display: grid;
  grid-template-columns: minmax(0,1.08fr) minmax(380px,.72fr);
  gap: 0;
  max-width: 1440px;
  margin: -20px auto 0;
  border: 1px solid var(--line);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 40px 100px #000a;
  position: relative;
  background: var(--panel);
}
.login-shell:before {
  content: "";
  position: absolute;
  inset: 0 42% 0 0;
  background: radial-gradient(circle at 25% 30%,color-mix(in srgb,var(--blue) 33.33%,transparent),transparent 35%),radial-gradient(circle at 70% 80%,color-mix(in srgb,var(--blue) 26.67%,transparent),transparent 32%),linear-gradient(150deg,var(--panel),var(--bg));
  z-index: 0;
}
.login-showcase,.premium-login-card {
  position: relative;
  z-index: 1;
}
.login-showcase {
  min-height: 720px;
  padding: 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.login-brand-row {
  position: absolute;
  top: 34px;
  left: 42px;
  display: flex;
  gap: 12px;
  align-items: center;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1.6px;
}
.login-logo {
  width: 40px;
  height: 40px;
  border-radius: 13px;
  object-fit: cover;
}
.login-logo.fallback {
  display: grid;
  place-items: center;
  background: linear-gradient(135deg,var(--blue),var(--blue2));
  font-size: 20px;
}
.login-copy {
  max-width: 650px;
}
.login-copy h1 {
  font-size: clamp(46px,6vw,82px);
  line-height: .96;
  letter-spacing: -4px;
  margin: 14px 0 22px;
}
.login-copy h1 span {
  background: linear-gradient(90deg,#fff,var(--blue2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.login-copy p {
  max-width: 620px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.7;
}
.login-features {
  display: grid;
  gap: 13px;
  margin-top: 34px;
}
.login-features>div {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text);
}
.login-features i {
  font-style: normal;
  width: 26px;
  height: 26px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: #1b6b4c55;
  color: #58e6aa;
  border: 1px solid #3fe09a44;
}
.login-security {
  margin-top: 42px;
  color: var(--muted);
  font-size: 12px;
}
.premium-login-card {
  align-self: stretch;
  border-radius: 0;
  border: 0;
  border-left: 1px solid var(--line);
  background: linear-gradient(180deg,color-mix(in srgb,var(--panel) 95.69%,transparent),color-mix(in srgb,var(--panel) 98.04%,transparent));
  padding: 70px 54px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.login-card-head {
  display: flex;
  gap: 14px;
  align-items: center;
}
.login-card-head h2 {
  font-size: 34px;
  margin: 2px 0;
}
.login-orb {
  width: 52px;
  height: 52px;
  border-radius: 17px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg,var(--blue),var(--blue));
  box-shadow: 0 12px 35px color-mix(in srgb,var(--blue) 33.33%,transparent);
  font-size: 24px;
}
.login-form {
  margin-top: 24px;
}
.login-form label>span {
  display: block;
  margin-bottom: 7px;
  font-size: 12px;
  color: var(--accent-text);
}
.input-icon {
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--panel);
  overflow: hidden;
}
.input-icon:focus-within {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--blue) 17%,transparent);
}
.input-icon i {
  font-style: normal;
  text-align: center;
  color: var(--accent-text);
}
.input-icon input {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
}
.login-submit {
  height: 52px;
  margin-top: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  font-size: 14px;
}
.login-foot {
  border-top: 1px solid var(--line);
  margin-top: 26px;
  padding-top: 20px;
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 10px;
}
/* Main dashboard */
.control-hero-v11 {
  position: relative;
  overflow: hidden;
  padding: 42px;
  margin-bottom: 18px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 32px;
  background: radial-gradient(circle at 75% 30%,color-mix(in srgb,var(--blue) 28%,transparent),transparent 24%),linear-gradient(135deg,color-mix(in srgb,var(--panel) 93.33%,transparent),color-mix(in srgb,var(--panel) 95.69%,transparent));
}
.control-hero-v11:after {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  border: 1px solid #ffffff12;
  border-radius: 50%;
  right: -60px;
  top: -130px;
  box-shadow: 0 0 0 36px #ffffff08,0 0 0 72px #ffffff05;
}
.control-hero-copy {
  position: relative;
  z-index: 1;
}
.control-hero-copy h1 {
  font-size: clamp(36px,5vw,64px);
  letter-spacing: -2.5px;
  max-width: 780px;
  margin: 7px 0 12px;
}
.control-hero-copy p {
  max-width: 760px;
  color: var(--muted);
  font-size: 16px;
}
.hero-profile-card {
  position: relative;
  z-index: 2;
  min-width: 270px;
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  background: color-mix(in srgb,var(--panel) 85.10%,transparent);
  border-radius: 18px;
  backdrop-filter: blur(18px);
}
.hero-avatar {
  width: 58px;
  height: 58px;
  font-size: 19px;
}
.hero-profile-card small,.hero-profile-card b,.hero-profile-card span {
  display: block;
}
.hero-profile-card small {
  font-size: 9px;
  color: var(--muted);
  letter-spacing: 1px;
}
.hero-profile-card b {
  font-size: 18px;
  margin: 3px 0;
}
.hero-profile-card span {
  font-size: 11px;
  color: var(--muted);
}
.production-shortcuts {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  gap: 10px;
  margin: 0 0 34px;
}
.production-shortcut {
  padding: 14px;
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 10px;
  align-items: center;
  transition: .18s;
}
.production-shortcut:hover {
  transform: translateY(-2px);
  border-color: var(--line);
}
.production-shortcut>span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: var(--panel2);
  font-size: 19px;
}
.production-shortcut b,.production-shortcut small {
  display: block;
}
.production-shortcut b {
  font-size: 12px;
}
.production-shortcut small {
  font-size: 9px;
  color: var(--muted);
  margin-top: 3px;
}
.production-bot-grid {
  grid-template-columns: repeat(2,minmax(0,1fr));
}
.production-bot-card {
  padding: 0;
  overflow: hidden;
}
.bot-cover {
  height: 140px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--blue) 33.33%,transparent),transparent 40%),linear-gradient(135deg,var(--panel2),var(--panel));
}
.bot-cover.minecraft {
  background: radial-gradient(circle at 50% 50%,#22c55e40,transparent 40%),linear-gradient(135deg,#0d3a2a,var(--bg));
}
.bot-big-icon {
  font-size: 54px;
  filter: drop-shadow(0 12px 18px #0008);
}
.bot-status-pill {
  position: absolute;
  left: 14px;
  top: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 99px;
  background: color-mix(in srgb,var(--bg) 66.67%,transparent);
  border: 1px solid #ffffff18;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1px;
}
.bot-card-body {
  padding: 20px;
}
.premium-guild {
  margin: 16px 0;
}
.bot-card-actions {
  display: flex;
  gap: 8px;
}
.bot-card-actions>* {
  flex: 1;
}
/* Team landing */
.team-landing-hero {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
  margin-bottom: 24px;
}
.team-landing-hero h1 {
  font-size: clamp(36px,5vw,58px);
  letter-spacing: -2px;
  margin: 6px 0;
}
.team-landing-hero p {
  color: var(--muted);
  max-width: 760px;
}
.team-landing-actions {
  display: flex;
  gap: 8px;
}
.production-team-grid {
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 18px;
}
.production-team-card {
  min-height: 260px;
  padding: 24px;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 90px 1fr auto;
  grid-template-rows: auto 1fr auto;
  column-gap: 18px;
}
.team-card-glow {
  position: absolute;
  inset: auto -90px -120px auto;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: color-mix(in srgb,var(--team-accent) 25%,transparent);
  filter: blur(45px);
}
.production-team-card .team-entry-top {
  grid-column: 1/-1;
  position: relative;
  z-index: 1;
}
.team-entry-icon.large {
  width: 84px;
  height: 84px;
  font-size: 30px;
  position: relative;
  z-index: 1;
}
.team-entry-copy {
  align-self: center;
  position: relative;
  z-index: 1;
}
.team-entry-copy h2 {
  font-size: 25px;
  margin: 0 0 5px;
}
.team-modules {
  grid-column: 1/-1;
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.team-modules span {
  padding: 5px 9px;
  border-radius: 99px;
  background: #ffffff0b;
  border: 1px solid #ffffff11;
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .7px;
}
.empty-premium {
  text-align: center;
  padding: 50px;
}
.empty-premium>span {
  font-size: 40px;
}
/* Profiles */
.profile-editor {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 28px;
}
.profile-editor-preview {
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: radial-gradient(circle at 50% 0,color-mix(in srgb,var(--blue) 20%,transparent),transparent 45%),var(--panel);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 330px;
}
.profile-avatar.xl {
  width: 112px;
  height: 112px;
  font-size: 36px;
  margin-bottom: 18px;
}
.profile-editor-preview h2 {
  margin: 7px 0 3px;
}
.profile-editor-preview p {
  margin: 0;
  color: var(--accent-text);
}
.profile-editor-preview small {
  display: block;
  color: var(--muted);
  margin-top: 14px;
}
.presence {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--blue);
}
.presence.online {
  background: #32d98d;
  box-shadow: 0 0 0 4px #32d98d20;
}
.check.boxed {
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 11px;
  background: var(--panel);
}
.profile-hero {
  overflow: hidden;
  padding: 0;
  margin-bottom: 18px;
}
.profile-cover {
  height: 150px;
  background: radial-gradient(circle at 30% 40%,color-mix(in srgb,var(--profile-accent) 55%,transparent),transparent 30%),linear-gradient(120deg,var(--panel),var(--panel));
}
.profile-main {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 22px;
  align-items: end;
  padding: 0 28px 28px;
  margin-top: -52px;
}
.profile-avatar.huge {
  width: 112px;
  height: 112px;
  font-size: 36px;
  border-width: 4px;
  border-color: var(--line);
}
.profile-main h1 {
  font-size: 34px;
  margin: 4px 0;
}
.profile-main p {
  color: var(--muted);
  margin: 0;
}
.profile-status {
  margin-top: 9px;
  color: var(--accent-text);
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.profile-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.profile-bio {
  white-space: pre-wrap;
  color: var(--accent-text);
  line-height: 1.65;
}
.profile-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 18px;
}
.profile-meta>div {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--panel);
}
.profile-meta span,.profile-meta b {
  display: block;
}
.profile-meta span {
  font-size: 9px;
  color: var(--muted);
  text-transform: uppercase;
}
.profile-rank-row {
  display: grid;
  grid-template-columns: 10px 1fr;
  gap: 11px;
  align-items: center;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}
.rank-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--rank);
  box-shadow: 0 0 0 4px color-mix(in srgb,var(--rank) 18%,transparent);
}
.profile-rank-row b,.profile-rank-row small {
  display: block;
}
.profile-rank-row small {
  color: var(--muted);
  margin-top: 3px;
}
/* Rank assignment */
.rank-panel-switch {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.rank-panel-switch>a {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 15px;
}
.rank-panel-switch>a.active {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--blue) 13%,transparent);
}
.rank-panel-switch>a>span {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--panel2);
  display: grid;
  place-items: center;
  font-size: 22px;
}
.rank-panel-switch b,.rank-panel-switch small {
  display: block;
}
.rank-panel-switch small {
  color: var(--muted);
  margin-top: 3px;
}
.rank-assignment-grid {
  display: grid;
  grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr);
  gap: 18px;
}
.mapping-list {
  display: grid;
  gap: 7px;
  margin: 15px 0;
}
.mapping-list>div {
  display: grid;
  grid-template-columns: 12px minmax(140px,1fr) minmax(90px,.7fr) minmax(120px,.8fr);
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}
.mapping-list span,.mapping-list em {
  font-size: 10px;
  color: var(--muted);
}
.mapping-list em {
  font-style: normal;
  text-align: right;
}
/* Chat */
.chat-shell {
  height: calc(100vh - 118px);
  min-height: 620px;
  display: grid;
  grid-template-columns: 290px minmax(0,1fr);
  gap: 12px;
}
.chat-sidebar {
  overflow: auto;
  padding: 13px;
  display: flex;
  flex-direction: column;
}
.chat-sidebar-head {
  padding: 9px 9px 15px;
}
.chat-sidebar-head h2 {
  margin: 3px 0;
}
.chat-section-label {
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--muted);
  padding: 13px 9px 7px;
}
.chat-room-list,.chat-dm-list {
  display: grid;
  gap: 4px;
}
.chat-room-list a,.chat-dm-list a {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 9px;
  align-items: center;
  padding: 8px;
  border-radius: 11px;
  color: var(--accent-text);
}
.chat-room-list a:hover,.chat-dm-list a:hover,.chat-room-list a.active,.chat-dm-list a.active {
  background: var(--panel2);
  color: var(--text);
}
.chat-room-list a>span:first-child {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: var(--panel);
  display: grid;
  place-items: center;
}
.chat-room-list b,.chat-room-list small,.chat-dm-list b,.chat-dm-list small {
  display: block;
}
.chat-room-list small,.chat-dm-list small {
  font-size: 9px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chat-create {
  margin: 8px 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px;
}
.chat-create summary {
  cursor: pointer;
  color: var(--accent-text);
  font-size: 11px;
}
.chat-create form {
  margin-top: 10px;
}
.chat-main {
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-width: 0;
  overflow: hidden;
}
.chat-header {
  height: 72px;
  padding: 0 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.chat-header>div {
  display: flex;
  align-items: center;
  gap: 11px;
}
.chat-header h2 {
  margin: 0;
  font-size: 17px;
}
.chat-header p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 10px;
}
.chat-hash {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: var(--panel2);
  display: grid;
  place-items: center;
}
.chat-messages {
  overflow: auto;
  padding: 22px 22px 12px;
  scroll-behavior: smooth;
}
.chat-message {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 10px;
  padding: 7px 0;
}
.chat-message:hover {
  background: #ffffff03;
}
.chat-message-meta {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.chat-message-meta b {
  font-size: 12px;
}
.chat-message-meta time {
  font-size: 9px;
  color: var(--muted);
}
.chat-message p {
  margin: 3px 0 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--text);
  font-size: 13px;
  line-height: 1.55;
}
.chat-empty {
  height: 100%;
  min-height: 240px;
  display: grid;
  place-items: center;
  color: var(--muted);
}
.chat-composer {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 9px;
  padding: 12px 16px 16px;
  border-top: 1px solid var(--line);
}
.chat-composer textarea {
  resize: none;
  min-height: 46px;
  max-height: 160px;
}
.chat-composer button {
  min-width: 92px;
}
/* Extra production polish */
.production-card {
  border-color: var(--line) !important;
  background: radial-gradient(circle at 90% 0,color-mix(in srgb,var(--blue) 16.86%,transparent),transparent 24%),linear-gradient(180deg,var(--panel),var(--panel)) !important;
}
.panel,.glass,.bot-card,.team-entry,.account-card {
  transition: border-color .18s,box-shadow .18s,transform .18s;
}
.panel:hover,.glass:hover {
  box-shadow: 0 18px 50px #00000026;
}
.button,.primary,.secondary,.danger {
  font-weight: 800;
  letter-spacing: .1px;
}
.page-head.premium-head {
  align-items: center;
}
.fullbtn {
  width: 100%;
  justify-content: center;
}
.stack.compact {
  gap: 8px;
}
@media (max-width:1050px) {
  .production-shortcuts {
    grid-template-columns: repeat(3,1fr);
  }
  .profile-editor {
    grid-template-columns: 1fr;
  }
  .profile-editor-preview {
    min-height: 240px;
  }
  .chat-shell {
    grid-template-columns: 240px 1fr;
  }
  .rank-assignment-grid {
    grid-template-columns: 1fr;
  }
  .mapping-list>div {
    grid-template-columns: 12px 1fr 1fr;
  }
  .mapping-list em {
    grid-column: 2/-1;
    text-align: left;
  }
  .control-hero-v11 {
    grid-template-columns: 1fr;
  }
  .hero-profile-card {
    max-width: 390px;
  }
  .production-team-card {
    grid-template-columns: 74px 1fr auto;
  }
  .team-entry-icon.large {
    width: 70px;
    height: 70px;
  }
}
@media (max-width:780px) {
  .login-shell {
    grid-template-columns: 1fr;
    margin: -10px 0 0;
    border-radius: 22px;
  }
  .login-shell:before {
    inset: 0;
  }
  .login-showcase {
    min-height: auto;
    padding: 42px 26px 30px;
  }
  .login-brand-row {
    position: static;
    margin-bottom: 45px;
  }
  .login-copy h1 {
    font-size: 44px;
    letter-spacing: -2px;
  }
  .login-features {
    display: none;
  }
  .login-security {
    margin-top: 24px;
  }
  .premium-login-card {
    padding: 36px 26px;
    border: 0;
    border-top: 1px solid var(--line);
  }
  .production-bot-grid,.production-team-grid,.profile-grid {
    grid-template-columns: 1fr;
  }
  .production-shortcuts {
    grid-template-columns: repeat(2,1fr);
  }
  .chat-shell {
    height: auto;
    min-height: 0;
    grid-template-columns: 1fr;
  }
  .chat-sidebar {
    max-height: 360px;
  }
  .chat-main {
    min-height: 620px;
  }
  .profile-main {
    grid-template-columns: auto 1fr;
    align-items: center;
  }
  .profile-main>.button {
    grid-column: 1/-1;
  }
  .team-landing-hero {
    align-items: flex-start;
    flex-direction: column;
  }
  .top-profile>span:last-child {
    display: none;
  }
  .brand small {
    display: none;
  }
}
@media (max-width:520px) {
  .page {
    padding-left: 12px;
    padding-right: 12px;
  }
  .control-hero-v11 {
    padding: 26px 20px;
  }
  .control-hero-copy h1 {
    font-size: 38px;
  }
  .production-shortcuts {
    grid-template-columns: 1fr;
  }
  .production-team-card {
    grid-template-columns: 62px 1fr;
    padding: 18px;
  }
  .production-team-card>.chev {
    display: none;
  }
  .team-entry-icon.large {
    width: 58px;
    height: 58px;
  }
  .rank-panel-switch {
    grid-template-columns: 1fr;
  }
  .profile-main {
    padding: 0 18px 22px;
  }
  .profile-avatar.huge {
    width: 88px;
    height: 88px;
  }
  .chat-composer {
    grid-template-columns: 1fr;
  }
  .chat-composer button {
    width: 100%;
  }
  .premium-login-card {
    padding: 30px 20px;
  }
  .login-showcase {
    padding: 30px 20px;
  }
  .login-copy h1 {
    font-size: 38px;
  }
}
/* v11 People directory */
.people-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(270px,1fr));
  gap: 18px;
}
.people-card {
  position: relative;
  overflow: hidden;
  padding: 0;
  border: 1px solid color-mix(in srgb,var(--profile-accent) 24%,rgba(255,255,255,.08));
}
.people-card-cover {
  height: 76px;
  background: radial-gradient(circle at 15% 10%,color-mix(in srgb,var(--profile-accent) 42%,transparent),transparent 65%),linear-gradient(110deg,rgba(255,255,255,.035),transparent);
}
.people-avatar {
  margin: -34px 0 0 22px;
  position: relative;
  width: 74px;
  height: 74px;
  border: 5px solid color-mix(in srgb,var(--panel) 88%,var(--line));
}
.people-card-body {
  padding: 14px 22px 22px;
}
.people-card-body h3 {
  margin: 0;
  font-size: 1.08rem;
}
.people-card-body small,.people-card-body p {
  color: var(--muted);
}
.people-card-body p {
  min-height: 42px;
}
.people-actions {
  display: flex;
  gap: 10px;
}
.people-actions .button {
  flex: 1;
  text-align: center;
}
/* =========================================================
   v12 — Production Social / Motion / Music System
   ========================================================= */
:root {
  --fx-purple: #8b5cf6;
  --fx-cyan: #22d3ee;
  --fx-pink: #ec4899;
  --glass-line: color-mix(in srgb,var(--blue) 22%,#ffffff0d);
}
body {
  overflow-x: hidden;
}
.page-enter {
  animation: pageEnter .38s cubic-bezier(.2,.8,.2,1);
}
@keyframes pageEnter {
  from {
    opacity: 0;
    transform: translateY(8px) scale(.995);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fx-field {
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: -1;
}
.fx-particle {
  position: absolute;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  background: radial-gradient(circle,#ffffffaa,color-mix(in srgb,var(--blue) 65%,transparent) 35%,transparent 72%);
  filter: blur(.2px);
  opacity: .25;
  animation: floatParticle var(--duration) linear infinite;
  left: var(--left);
  top: 110vh;
}
.fx-particle:nth-child(3n) {
  background: radial-gradient(circle,#fff8,color-mix(in srgb,var(--fx-purple) 60%,transparent),transparent 70%);
}
@keyframes floatParticle {
  to {
    transform: translate3d(var(--drift),-130vh,0) rotate(1turn);
  }
}
.glass {
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.glass,.panel,.production-shortcut,.bot-card {
  position: relative;
  isolation: isolate;
}
.glass:before,.panel:before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(125deg,#ffffff0b,transparent 20%,transparent 75%,color-mix(in srgb,var(--blue) 8%,transparent));
  opacity: .8;
  z-index: -1;
}
.glass:hover {
  border-color: color-mix(in srgb,var(--blue) 38%,#ffffff18) !important;
}
.button,.primary,.secondary,.danger,button {
  position: relative;
  overflow: hidden;
}
.ui-ripple {
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  background: #ffffff40;
  transform: scale(0);
  animation: ripple .48s ease-out;
  z-index: 20;
}
@keyframes ripple {
  to {
    transform: scale(4);
    opacity: 0;
  }
}
.topbar.premium-topbar {
  box-shadow: 0 14px 40px #0005;
  border-bottom: 1px solid var(--glass-line);
}
.app-drawer {
  box-shadow: 28px 0 80px #0008;
}
.brand-mark,.login-orb {
  box-shadow: 0 0 40px color-mix(in srgb,var(--blue) 45%,transparent);
}
.command-palette {
  position: fixed;
  inset: 0;
  background: color-mix(in srgb,var(--bg) 72.94%,transparent);
  backdrop-filter: blur(12px);
  z-index: 9999;
  display: grid;
  place-items: start center;
  padding-top: 12vh;
}
.command-palette[hidden] {
  display: none;
}
.command-dialog {
  width: min(680px,calc(100vw - 28px));
  padding: 14px;
  border-radius: 22px;
  border: 1px solid #ffffff1c;
  box-shadow: 0 40px 120px #000b;
}
.command-search {
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 15px;
  padding: 4px 9px;
}
.command-search>span {
  font-weight: 900;
  color: var(--accent-text);
}
.command-search input {
  border: 0 !important;
  background: transparent !important;
  font-size: 16px;
  padding: 13px 4px !important;
}
.command-results {
  display: grid;
  gap: 5px;
  max-height: 420px;
  overflow: auto;
  margin: 10px 0;
}
.command-item {
  display: grid;
  grid-template-columns: 38px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-radius: 12px;
  color: var(--text);
  border: 1px solid transparent;
}
.command-item:hover,.command-item.active {
  background: var(--panel2);
  border-color: var(--line);
}
.command-item small {
  color: var(--muted);
}
.toast-stack {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 10000;
  display: grid;
  gap: 8px;
}
.ui-toast {
  min-width: 260px;
  max-width: 430px;
  padding: 12px 14px;
  border-radius: 13px;
  background: color-mix(in srgb,var(--panel) 93.73%,transparent);
  border: 1px solid var(--line);
  box-shadow: 0 18px 60px #0008;
  animation: toastIn .24s ease-out;
  color: var(--text);
}
.ui-toast.success {
  border-color: #2c9e6b;
}
.ui-toast.error {
  border-color: #b94457;
}
@keyframes toastIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.98);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
/* Login v12 */
.login-shell {
  min-height: min(760px,calc(100vh - 60px));
  box-shadow: 0 45px 140px #000a;
}
.login-shell:after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(130deg,color-mix(in srgb,var(--blue) 55%,transparent),transparent 32%,transparent 70%,color-mix(in srgb,var(--fx-purple) 55%,transparent));
  -webkit-mask: linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.login-showcase:after {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  right: -180px;
  bottom: -190px;
  background: radial-gradient(circle,color-mix(in srgb,var(--fx-purple) 30%,transparent),transparent 66%);
  animation: orbBreath 5s ease-in-out infinite;
}
@keyframes orbBreath {
  50% {
    transform: scale(1.18);
    opacity: .7;
  }
}
.premium-login-card {
  position: relative;
}
.premium-login-card:after {
  content: "SECURE · TEAM ONLY · ENCRYPTED SESSION";
  position: absolute;
  right: 28px;
  top: 20px;
  font-size: 7px;
  letter-spacing: 1.2px;
  color: var(--muted);
}
.login-submit {
  box-shadow: 0 14px 45px color-mix(in srgb,var(--blue) 26%,transparent);
}
.login-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 55px color-mix(in srgb,var(--blue) 38%,transparent);
}
/* Profile enhancements */
.profile-cover {
  min-height: 170px;
  background-size: cover;
  background-position: center;
}
.profile-badge {
  display: inline-flex;
  padding: 2px 7px;
  margin-left: 5px;
  border-radius: 99px;
  background: color-mix(in srgb,var(--profile-accent) 22%,var(--panel));
  border: 1px solid color-mix(in srgb,var(--profile-accent) 40%,transparent);
  font-size: 9px;
  color: var(--text);
  vertical-align: middle;
}
.profile-avatar img,.mini-avatar img,.member-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.profile-avatar {
  overflow: hidden;
}
/* Team roster */
.production-roster {
  grid-template-columns: repeat(auto-fit,minmax(340px,1fr));
}
.premium-member {
  grid-template-columns: 66px 1fr !important;
  align-items: center;
  overflow: hidden;
  padding: 16px !important;
  border-color: color-mix(in srgb,var(--member-rank) 24%,#ffffff10) !important;
}
.premium-member:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--member-rank);
  box-shadow: 0 0 22px var(--member-rank);
}
.rich-avatar {
  width: 58px !important;
  height: 58px !important;
  border-radius: 18px !important;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg,color-mix(in srgb,var(--avatar-color) 45%,var(--panel)),var(--panel));
  border: 1px solid color-mix(in srgb,var(--avatar-color) 45%,#ffffff22);
  overflow: hidden;
  color: var(--text);
  font-weight: 900;
}
.member-main {
  min-width: 0;
}
.member-main h3 {
  margin: 0;
}
.member-main small {
  color: var(--muted);
}
.member-priority {
  font-size: 10px;
  font-weight: 900;
  color: color-mix(in srgb,var(--member-rank) 82%,var(--text));
  background: color-mix(in srgb,var(--member-rank) 12%,var(--panel));
  border: 1px solid color-mix(in srgb,var(--member-rank) 27%,transparent);
  padding: 5px 8px;
  border-radius: 9px;
}
.member-actions {
  display: flex;
  gap: 7px;
  margin-top: 11px;
}
/* Music Center */
.music-shortcut {
  background: radial-gradient(circle at 90% 10%,color-mix(in srgb,var(--blue) 20.00%,transparent),transparent 35%),linear-gradient(150deg,var(--panel),var(--panel)) !important;
}
.music-hero {
  min-height: 250px;
  padding: 34px;
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  align-items: center;
  overflow: hidden;
  background: radial-gradient(circle at 75% 25%,color-mix(in srgb,var(--blue) 21.57%,transparent),transparent 28%),radial-gradient(circle at 88% 75%,color-mix(in srgb,var(--blue2) 13.33%,transparent),transparent 22%),linear-gradient(120deg,var(--panel),var(--panel));
}
.music-hero h1 {
  font-size: clamp(36px,5vw,64px);
  margin: 7px 0 10px;
  letter-spacing: -2px;
}
.music-hero p {
  max-width: 700px;
  color: var(--accent-text);
  line-height: 1.65;
}
.equalizer,.mini-eq {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 6px;
  height: 150px;
}
.equalizer i,.mini-eq i {
  width: 8px;
  height: calc(18px + (var(--i) * 5px));
  max-height: 135px;
  border-radius: 10px;
  background: linear-gradient(var(--blue2),var(--blue),#ec4899);
  box-shadow: 0 0 20px color-mix(in srgb,var(--blue) 33.33%,transparent);
  animation: eqPulse calc(.65s + (var(--i) * .035s)) ease-in-out infinite alternate;
  transform-origin: bottom;
}
@keyframes eqPulse {
  to {
    height: calc(20px + ((18 - var(--i)) * 6px));
    filter: hue-rotate(35deg);
  }
}
.service-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 99px;
  background: var(--panel);
  border: 1px solid var(--line);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .7px;
}
.service-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #6b7280;
}
.service-status.online i {
  background: #2de38c;
  box-shadow: 0 0 13px #2de38c;
}
.service-status.offline i {
  background: #ef5773;
}
.music-guild-switch {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin: 16px 0;
}
.music-guild-switch>a {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 11px;
  padding: 13px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 15px;
}
.music-guild-switch>a.active {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--blue) 9.41%,transparent);
}
.music-guild-switch>a>span {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  background: var(--panel2);
  display: grid;
  place-items: center;
  font-size: 22px;
}
.music-console {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 30px;
  padding: 28px;
  align-items: center;
  background: radial-gradient(circle at 15% 40%,color-mix(in srgb,var(--blue) 14.51%,transparent),transparent 22%),linear-gradient(135deg,var(--panel),var(--panel));
}
.vinyl-wrap {
  display: grid;
  place-items: center;
}
.vinyl {
  width: 170px;
  height: 170px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: repeating-radial-gradient(circle,var(--bg) 0 5px,var(--panel) 6px 9px);
  border: 5px solid var(--line);
  box-shadow: 0 25px 50px #0009,0 0 50px color-mix(in srgb,var(--blue) 13.33%,transparent);
}
.vinyl:before {
  content: "";
  position: absolute;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: linear-gradient(135deg,var(--blue),#db2777);
  box-shadow: 0 0 22px #a855f766;
}
.vinyl span {
  z-index: 2;
  font-weight: 1000;
  letter-spacing: 2px;
}
.vinyl.spinning {
  animation: spin 3.2s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(1turn);
  }
}
.music-now h2 {
  font-size: 30px;
  margin: 5px 0;
}
.music-play-form {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 10px;
  align-items: end;
  margin-top: 18px;
}
.player-controls {
  display: flex;
  gap: 8px;
  margin-top: 11px;
}
.two-pane-production {
  display: grid;
  grid-template-columns: 1.3fr .7fr;
  gap: 16px;
  margin-top: 16px;
}
.radio-search-box {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  margin: 14px 0;
}
.radio-results {
  display: grid;
  gap: 7px;
}
.radio-result {
  display: grid;
  grid-template-columns: 42px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}
.radio-result img,.station-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.radio-result>span {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--panel2);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.radio-result b,.radio-result small {
  display: block;
}
.radio-result small {
  color: var(--muted);
}
.station-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
  gap: 10px;
  margin-top: 14px;
}
.station-card {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}
.station-cover {
  width: 52px;
  height: 52px;
  border-radius: 13px;
  background: var(--panel2);
  display: grid;
  place-items: center;
  font-size: 24px;
  overflow: hidden;
}
.station-card h3 {
  margin: 2px 0;
}
.station-card p {
  margin: 3px 0;
  color: var(--muted);
  font-size: 10px;
}
.station-card details {
  grid-column: 1/-1;
}
.command-cheatsheet {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 18px;
}
.command-cheatsheet h3 {
  width: 100%;
}
.command-cheatsheet code {
  padding: 7px 9px;
  border-radius: 9px;
  background: var(--panel);
  border: 1px solid var(--line);
  color: var(--accent-text);
}
.music-service-card {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 26px;
  padding: 24px;
  margin-top: 22px;
  align-items: center;
  overflow: hidden;
}
.music-service-art {
  height: 170px;
  border-radius: 20px;
  background: radial-gradient(circle at 50% 100%,color-mix(in srgb,var(--blue) 36.08%,transparent),transparent 60%),linear-gradient(140deg,var(--panel),var(--panel));
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
}
.music-service-art .mini-eq {
  height: 110px;
  gap: 4px;
}
.mini-eq i {
  width: 5px;
  max-height: 90px;
}
.music-service-art>span {
  position: absolute;
  bottom: 14px;
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: 2px;
  color: var(--accent-text);
}
/* richer micro-interactions */
.production-shortcut:hover,.bot-card:hover,.people-card:hover,.premium-member:hover,.station-card:hover {
  transform: translateY(-3px);
}
.production-shortcut:hover span:first-child {
  transform: rotate(-4deg) scale(1.08);
}
.production-shortcut span:first-child {
  transition: transform .2s;
}
.top-icon-link {
  transition: transform .15s,background .15s;
}
.top-icon-link:hover {
  transform: translateY(-2px) rotate(-2deg);
}
body.reduce-motion *,body.reduce-motion *:before,body.reduce-motion *:after {
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
  transition-duration: .001ms !important;
}
.reduce-motion .fx-field {
  display: none;
}
@media (max-width:900px) {
  .music-hero,.music-console,.two-pane-production,.music-service-card {
    grid-template-columns: 1fr;
  }
  .equalizer {
    height: 90px;
  }
  .music-play-form {
    grid-template-columns: 1fr;
  }
  .music-service-art {
    height: 130px;
  }
  .production-roster {
    grid-template-columns: 1fr;
  }
}
@media (max-width:560px) {
  .music-guild-switch {
    grid-template-columns: 1fr;
  }
  .music-console {
    padding: 18px;
  }
  .vinyl {
    width: 130px;
    height: 130px;
  }
  .production-roster {
    grid-template-columns: 1fr;
  }
  .premium-member {
    grid-template-columns: 52px 1fr !important;
  }
  .rich-avatar {
    width: 48px !important;
    height: 48px !important;
  }
  .player-controls {
    display: grid;
    grid-template-columns: repeat(3,1fr);
  }
  .player-controls .danger {
    grid-column: 1/-1;
  }
}
/* v12 chat message controls */
.chat-message {
  position: relative;
  border-radius: 10px;
  padding: 8px 6px;
}
.chat-message:hover {
  background: #ffffff05;
}
.chat-message-body {
  min-width: 0;
  position: relative;
}
.message-reactions {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: 7px;
}
.message-reactions form {
  margin: 0;
}
.reaction {
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--accent-text);
  border-radius: 9px;
  padding: 3px 7px;
  font-size: 11px;
  min-height: 28px;
}
.reaction.mine {
  border-color: var(--blue);
  background: var(--blue);
}
.reaction span {
  font-size: 9px;
  color: var(--accent-text);
}
.reaction-add {
  position: relative;
}
.reaction-add>summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  border: 1px dashed var(--line);
  color: var(--muted);
}
.reaction-add>div {
  position: absolute;
  z-index: 30;
  left: 0;
  bottom: 34px;
  display: flex;
  gap: 3px;
  padding: 7px;
  border-radius: 11px;
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: 0 12px 45px #0008;
}
.reaction-add button {
  background: transparent;
  border: 0;
  padding: 5px;
  font-size: 16px;
}
.message-tools {
  position: absolute;
  right: 3px;
  top: -2px;
}
.message-tools>summary {
  list-style: none;
  cursor: pointer;
  opacity: 0;
  padding: 3px 7px;
  color: var(--muted);
}
.chat-message:hover .message-tools>summary,.message-tools[open]>summary {
  opacity: 1;
}
.message-toolbox {
  position: absolute;
  right: 0;
  top: 24px;
  width: 270px;
  z-index: 32;
  padding: 10px;
  border-radius: 12px;
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: 0 18px 55px #000a;
}
.message-toolbox textarea {
  font-size: 11px;
}
.message-toolbox form+form {
  margin-top: 6px;
}
/* v13 Growth Center + Production polish */
.growth-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 28px;
  margin-bottom: 18px;
  background: linear-gradient(135deg,color-mix(in srgb,var(--blue) 18.00%,transparent),color-mix(in srgb,var(--blue2) 8.00%,transparent) 45%,color-mix(in srgb,var(--blue) 15.00%,transparent));
  border: 1px solid color-mix(in srgb,var(--blue) 22.00%,transparent);
  box-shadow: 0 24px 80px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.05);
}
.growth-hero:after {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  right: -160px;
  top: -190px;
  background: radial-gradient(circle,color-mix(in srgb,var(--blue) 23.00%,transparent),transparent 68%);
  pointer-events: none;
}
.growth-hero h2 {
  margin: .25rem 0 .55rem;
  font-size: clamp(1.55rem,3vw,2.3rem);
}
.growth-hero p {
  max-width: 840px;
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}
.growth-orbit {
  width: 86px;
  height: 86px;
  border-radius: 28px;
  display: grid;
  place-items: center;
  position: relative;
  background: linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.025));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 0 55px color-mix(in srgb,var(--blue) 28.00%,transparent);
}
.growth-orbit>span {
  font-size: 36px;
  filter: drop-shadow(0 0 16px color-mix(in srgb,var(--blue) 80.00%,transparent));
  animation: growthFloat 3s ease-in-out infinite;
}
.growth-orbit i {
  position: absolute;
  inset: 9px;
  border: 1px solid color-mix(in srgb,var(--blue) 30.00%,transparent);
  border-radius: 50%;
  animation: growthOrbit 7s linear infinite;
}
.growth-orbit i:nth-child(2) {
  inset: 18px;
  animation-duration: 5s;
  animation-direction: reverse;
}
.growth-orbit i:nth-child(3) {
  inset: -8px;
  border-style: dashed;
  animation-duration: 11s;
}
.growth-live {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  z-index: 1;
}
.growth-live b {
  letter-spacing: .12em;
}
.growth-live small {
  color: var(--muted);
}
.growth-metrics {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.growth-metric {
  min-height: 94px;
}
.growth-metric>span {
  font-size: 25px;
}
.growth-metric b {
  font-size: 1.2rem;
}
.growth-grid {
  align-items: stretch;
}
.growth-config-card,.growth-status-card {
  position: relative;
  overflow: hidden;
}
.growth-config-card:before,.growth-status-card:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg,var(--blue),var(--blue2),transparent);
}
.featured-check {
  padding: 14px;
  border: 1px solid color-mix(in srgb,var(--blue) 20.00%,transparent);
  border-radius: 14px;
  background: color-mix(in srgb,var(--blue) 7.00%,transparent);
  align-items: flex-start !important;
}
.featured-check span {
  display: grid;
  gap: 2px;
}
.featured-check small {
  color: var(--muted);
}
.command-note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 9px 12px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(0,0,0,.13);
}
.command-note b {
  grid-column: 1/-1;
}
.command-note code {
  color: var(--accent-text);
}
.command-note span {
  color: var(--muted);
  font-size: .9rem;
}
.countdown-orb {
  width: 180px;
  height: 180px;
  margin: 18px auto;
  display: grid;
  place-content: center;
  text-align: center;
  border-radius: 50%;
  position: relative;
  background: radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--blue) 22.00%,transparent),color-mix(in srgb,var(--bg) 65.00%,transparent) 62%);
  border: 1px solid color-mix(in srgb,var(--blue) 35.00%,transparent);
  box-shadow: 0 0 0 10px color-mix(in srgb,var(--blue) 3.50%,transparent),0 0 60px color-mix(in srgb,var(--blue) 20.00%,transparent);
}
.countdown-orb:before {
  content: "";
  position: absolute;
  inset: -7px;
  border-radius: 50%;
  border: 2px dashed color-mix(in srgb,var(--blue) 35.00%,transparent);
  animation: growthOrbit 13s linear infinite;
}
.countdown-orb span {
  font-weight: 900;
  font-size: 1.25rem;
  letter-spacing: .03em;
}
.countdown-orb small {
  color: var(--muted);
  font-size: .7rem;
  letter-spacing: .15em;
  margin-top: 5px;
}
.status-list {
  display: grid;
  gap: 8px;
}
.status-list>div {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.035);
}
.status-list span {
  color: var(--muted);
}
.growth-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-top: 14px;
}
.danger-soft {
  border-color: rgba(255,92,117,.25) !important;
  color: #ff8fa1 !important;
}
.epic-empty {
  min-height: 220px;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  gap: 8px;
}
.epic-empty>span {
  font-size: 42px;
  filter: drop-shadow(0 0 20px color-mix(in srgb,var(--blue) 65.00%,transparent));
}
.settings-tabs {
  position: sticky;
  top: 78px;
  z-index: 8;
  backdrop-filter: blur(18px);
  background: color-mix(in srgb,var(--bg) 72%,transparent);
  padding: 7px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(0,0,0,.16);
}
.settings-tabs button {
  position: relative;
  overflow: hidden;
}
.settings-tabs button.active:after {
  content: "";
  position: absolute;
  left: 20%;
  right: 20%;
  bottom: 2px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg,var(--blue),var(--blue2));
  box-shadow: 0 0 15px var(--blue);
}
.glass {
  transition: border-color .22s ease,transform .22s ease,box-shadow .22s ease;
}
.panel.glass:hover {
  border-color: color-mix(in srgb,var(--blue) 22.00%,transparent);
  box-shadow: 0 18px 55px rgba(0,0,0,.18);
}
.premium-topbar {
  box-shadow: 0 10px 45px rgba(0,0,0,.18);
}
.primary,.button.primary {
  box-shadow: 0 8px 26px color-mix(in srgb,var(--blue) 28%,transparent);
}
@keyframes growthOrbit {
  to {
    transform: rotate(360deg);
  }
}
@keyframes growthFloat {
  0%,100% {
    transform: translateY(-2px) rotate(-4deg);
  }
  50% {
    transform: translateY(5px) rotate(4deg);
  }
}
@media (max-width:900px) {
  .growth-hero {
    grid-template-columns: auto 1fr;
  }
  .growth-live {
    grid-column: 1/-1;
    align-items: flex-start;
    flex-direction: row;
  }
  .growth-metrics {
    grid-template-columns: 1fr 1fr;
  }
  .settings-tabs {
    top: 70px;
  }
  .growth-actions {
    grid-template-columns: 1fr;
  }
}
@media (max-width:560px) {
  .growth-hero {
    grid-template-columns: 1fr;
    padding: 20px;
  }
  .growth-orbit {
    width: 72px;
    height: 72px;
  }
  .growth-metrics {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .growth-metric {
    padding: 12px;
  }
  .countdown-orb {
    width: 150px;
    height: 150px;
  }
  .settings-tabs {
    position: relative;
    top: auto;
  }
}
.goal-card {
  margin-top: 12px;
  padding: 13px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.07);
}
.goal-card .row {
  margin-bottom: 9px;
}
.goal-track {
  height: 9px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.07);
  box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
}
.goal-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg,var(--blue),var(--blue2));
  box-shadow: 0 0 20px color-mix(in srgb,var(--blue2) 55%,transparent);
  transition: width .5s ease;
}
.countdown-orb.ready {
  border-color: rgba(39,209,127,.5);
  box-shadow: 0 0 0 10px rgba(39,209,127,.04),0 0 60px rgba(39,209,127,.2);
}
.countdown-orb.ready span {
  color: var(--success);
}
/* v14 Cinematic Production OS */
.site-video-bg {
  position: fixed;
  inset: 0;
  z-index: -6;
  overflow: hidden;
  pointer-events: none;
}
.site-video-bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.15) contrast(1.08);
  opacity: .23;
}
.site-video-bg i {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,color-mix(in srgb,var(--bg) 62.00%,transparent),color-mix(in srgb,var(--bg) 94.00%,transparent)),radial-gradient(circle at 50% 10%,transparent,color-mix(in srgb,var(--bg) 78.00%,transparent) 75%);
}
.mouse-glow {
  position: fixed;
  left: -190px;
  top: -190px;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(circle,color-mix(in srgb,var(--blue2) 18%,transparent),transparent 68%);
  filter: blur(10px);
  will-change: transform;
}
.scanline-layer {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  background: repeating-linear-gradient(180deg,transparent 0 3px,color-mix(in srgb,var(--blue) 2.40%,transparent) 4px 5px);
  mix-blend-mode: screen;
}
.scanlines-on .scanline-layer {
  display: block;
}
.fx-aurora .bg-glow {
  background: radial-gradient(circle at 16% 12%,color-mix(in srgb,var(--blue) 29.02%,transparent),transparent 30%),radial-gradient(circle at 83% 18%,color-mix(in srgb,var(--blue2) 29.02%,transparent),transparent 32%),radial-gradient(circle at 52% 88%,color-mix(in srgb,var(--blue) 23.92%,transparent),transparent 34%);
}
.fx-cyber .bg-glow {
  background: radial-gradient(circle at 15% 15%,color-mix(in srgb,var(--blue2) 20.00%,transparent),transparent 28%),radial-gradient(circle at 80% 15%,#ff2bd633,transparent 30%),linear-gradient(110deg,transparent 48%,color-mix(in srgb,var(--blue2) 6.27%,transparent) 49%,transparent 50%);
}
.fx-clean .bg-glow,.fx-clean .noise-layer {
  opacity: .18;
}
.cursor-spark {
  position: fixed;
  width: 7px;
  height: 7px;
  margin: -3px;
  z-index: 10000;
  pointer-events: none;
  border-radius: 50%;
  background: var(--blue2);
  box-shadow: 0 0 8px var(--blue2),0 0 24px color-mix(in srgb,var(--blue) 72%,transparent);
  transform: scale(var(--spark-scale));
  animation: cursorSpark .7s ease-out forwards;
}
@keyframes cursorSpark {
  to {
    opacity: 0;
    transform: translate3d(0,22px,0) scale(.05);
  }
}
[data-tilt],.production-shortcut,.station-card,.people-card {
  transform-style: preserve-3d;
  transform: perspective(950px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));
  will-change: transform;
}
.card-shine-enabled [data-tilt]:after,.card-shine-enabled .production-shortcut:after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(circle at var(--shine-x,50%) var(--shine-y,50%),rgba(255,255,255,.14),transparent 36%);
  transition: opacity .22s;
}
.card-shine-enabled [data-tilt]:hover:after,.card-shine-enabled .production-shortcut:hover:after {
  opacity: 1;
}
.cinematic-login {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.login-bg-video {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -5;
  filter: saturate(1.25) contrast(1.08);
  opacity: .55;
}
.login-video-overlay {
  position: fixed;
  inset: 0;
  z-index: -4;
  background: linear-gradient(110deg,color-mix(in srgb,var(--bg) 96.00%,transparent) 0 42%,color-mix(in srgb,var(--bg) 56.00%,transparent) 72%,color-mix(in srgb,var(--bg) 88.00%,transparent)),radial-gradient(circle at 75% 20%,color-mix(in srgb,var(--blue) 24%,transparent),transparent 38%);
}
.login-live-strip {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 16px;
}
.login-live-strip span {
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb,var(--blue) 16.00%,transparent);
  border-radius: 999px;
  background: color-mix(in srgb,var(--panel) 55.00%,transparent);
  font-size: 10px;
  color: var(--accent-text);
  backdrop-filter: blur(12px);
}
.login-live-strip i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #34e58a;
  box-shadow: 0 0 12px #34e58a;
  margin-right: 5px;
}
.control-hero-v14 {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0,1.45fr) minmax(260px,.55fr);
  gap: 28px;
  padding: 36px;
  min-height: 310px;
  background: linear-gradient(130deg,color-mix(in srgb,var(--panel) 92.00%,transparent),color-mix(in srgb,var(--panel) 62.00%,transparent)),radial-gradient(circle at 75% 20%,color-mix(in srgb,var(--blue) 22.00%,transparent),transparent 38%);
  border: 1px solid color-mix(in srgb,var(--blue) 18.00%,transparent);
}
.hero-mesh {
  position: absolute;
  inset: -30%;
  pointer-events: none;
  background-image: linear-gradient(color-mix(in srgb,var(--blue) 4.50%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--blue) 4.50%,transparent) 1px,transparent 1px);
  background-size: 44px 44px;
  transform: perspective(700px) rotateX(58deg) translateY(25%);
  mask-image: linear-gradient(to bottom,transparent,#000 20%,#000 70%,transparent);
}
.control-hero-v14 .control-hero-copy,.control-hero-v14 .hero-profile-card {
  position: relative;
  z-index: 2;
}
.control-hero-v14 h1 {
  font-size: clamp(2.3rem,5vw,4.7rem);
  line-height: .97;
  max-width: 900px;
  letter-spacing: -.055em;
  margin: .35rem 0 1rem;
}
.control-hero-v14 p {
  max-width: 800px;
  font-size: 1.02rem;
  line-height: 1.7;
}
.hero-kpis {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 24px;
}
.hero-kpis span {
  display: grid;
  min-width: 110px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.08);
}
.hero-kpis b {
  font-size: 1.35rem;
}
.hero-kpis small {
  color: var(--muted);
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.premium-profile-orbit {
  position: relative;
  align-self: center;
  justify-self: stretch;
  min-height: 165px;
  background: color-mix(in srgb,var(--panel) 58.00%,transparent);
  backdrop-filter: blur(22px);
  border: 1px solid color-mix(in srgb,var(--blue) 18.00%,transparent);
  box-shadow: 0 24px 75px #0005;
}
.profile-ring {
  position: absolute;
  width: 150px;
  height: 150px;
  right: -45px;
  top: -45px;
  border: 1px dashed color-mix(in srgb,var(--blue) 28.00%,transparent);
  border-radius: 50%;
  animation: growthOrbit 20s linear infinite;
}
.fleet-section {
  margin-top: 28px;
}
.fleet-live {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid rgba(43,222,132,.22);
  background: rgba(39,209,127,.06);
  font-size: 10px;
  letter-spacing: .11em;
  color: #a9f5cf;
}
.fleet-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2be08a;
  box-shadow: 0 0 14px #2be08a;
}
.v14-fleet {
  grid-template-columns: repeat(3,minmax(0,1fr));
  align-items: stretch;
}
.fleet-card {
  position: relative;
  overflow: hidden;
  padding: 0;
  min-width: 0;
}
.fleet-art {
  height: 210px;
  position: relative;
  overflow: hidden;
  background: var(--panel);
}
.fleet-art>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
  transition: transform .55s cubic-bezier(.2,.8,.2,1),filter .4s;
}
.fleet-card:hover .fleet-art>img {
  transform: scale(1.075);
  filter: saturate(1.18);
}
.fleet-art-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 15%,color-mix(in srgb,var(--bg) 18.00%,transparent) 55%,color-mix(in srgb,var(--bg) 96.00%,transparent)),linear-gradient(110deg,color-mix(in srgb,var(--blue) 15%,transparent),transparent 50%);
}
.fleet-art .bot-status-pill {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
}
.fleet-card .bot-card-body {
  padding: 20px;
}
.fleet-card h2 {
  font-size: 1.45rem;
  margin: .2rem 0;
}
.tiny {
  font-size: 10px;
}
.fleet-stats {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 7px;
  margin: 15px 0;
}
.fleet-stats span {
  display: grid;
  text-align: center;
  padding: 9px 6px;
  border-radius: 11px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.06);
}
.fleet-stats b {
  font-size: .92rem;
}
.fleet-stats small {
  font-size: 8px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.music-fleet-card .fleet-art {
  background: radial-gradient(circle at 50% 100%,color-mix(in srgb,var(--blue) 35.69%,transparent),transparent 58%),var(--panel);
}
.art-eq {
  position: absolute;
  bottom: 13px;
  right: 14px;
  display: flex;
  align-items: end;
  gap: 3px;
  height: 38px;
}
.art-eq i {
  width: 3px;
  border-radius: 3px;
  background: var(--blue);
  animation: eqBounce calc(.55s + var(--i)*.035s) ease-in-out infinite alternate;
  height: calc(9px + (var(--i) % 6)*4px);
}
@keyframes eqBounce {
  to {
    height: 35px;
    opacity: .45;
  }
}
.music-guild-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  min-height: 28px;
  margin-bottom: 11px;
}
.experience-strip {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 0;
  margin-top: 22px;
  overflow: hidden;
}
.experience-strip>div {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 3px 10px;
  padding: 18px;
  border-right: 1px solid rgba(255,255,255,.065);
}
.experience-strip>div:last-child {
  border-right: 0;
}
.experience-strip>div>span {
  grid-row: 1/3;
  font-size: 22px;
  color: var(--accent-text);
}
.experience-strip b {
  font-size: .86rem;
}
.experience-strip small {
  font-size: 9px;
  color: var(--muted);
}
.bot-brand-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 14px;
}
.bot-brand-editor {
  padding: 15px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 16px;
  background: rgba(255,255,255,.025);
}
.bot-brand-preview {
  height: 145px;
  position: relative;
  border-radius: 13px;
  overflow: hidden;
  margin-bottom: 12px;
  background: var(--panel);
}
.bot-brand-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.bot-brand-preview span {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 9px;
  padding: 7px 9px;
  border-radius: 9px;
  background: color-mix(in srgb,var(--bg) 72.00%,transparent);
  backdrop-filter: blur(10px);
  font-weight: 800;
  font-size: 11px;
}
.media-studio,.fx-studio,.bot-brand-studio {
  position: relative;
  overflow: hidden;
}
.media-studio:before,.fx-studio:before,.bot-brand-studio:before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: linear-gradient(var(--blue),var(--blue2),transparent);
}
.check-grid {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  gap: 9px;
  margin-top: 12px;
}
@media (max-width:1100px) {
  .v14-fleet {
    grid-template-columns: 1fr 1fr;
  }
  .music-fleet-card {
    grid-column: 1/-1;
  }
  .bot-brand-grid {
    grid-template-columns: 1fr 1fr;
  }
  .check-grid {
    grid-template-columns: repeat(3,1fr);
  }
}
@media (max-width:760px) {
  .control-hero-v14 {
    grid-template-columns: 1fr;
    padding: 24px;
  }
  .premium-profile-orbit {
    min-height: 110px;
  }
  .v14-fleet {
    grid-template-columns: 1fr;
  }
  .music-fleet-card {
    grid-column: auto;
  }
  .experience-strip {
    grid-template-columns: 1fr 1fr;
  }
  .bot-brand-grid,.check-grid {
    grid-template-columns: 1fr;
  }
  .fleet-art {
    height: 185px;
  }
}
@media (max-width:480px) {
  .experience-strip {
    grid-template-columns: 1fr;
  }
  .control-hero-v14 h1 {
    font-size: 2.25rem;
  }
  .hero-kpis span {
    min-width: 90px;
    flex: 1;
  }
}
body [data-tilt] {
  transform: perspective(950px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) !important;
}
.fleet-admin-card {
  position: relative;
  overflow: hidden;
  padding-top: 150px;
}
.fleet-admin-art {
  position: absolute;
  inset: 0 0 auto 0;
  width: 100%;
  height: 132px;
  object-fit: cover;
  opacity: .88;
  mask-image: linear-gradient(to bottom,#000 55%,transparent);
}
/* v15 Operations Center */
.ops-shell {
  --ops-red: #ff5c7a;
  --ops-amber: #ffb454;
  --ops-green: #36df96;
}
.ops-sidebar {
  position: sticky;
  top: 88px;
  max-height: calc(100vh - 106px);
  overflow: auto;
}
.ops-live-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 0 6px;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb,var(--team-accent) 28%,transparent);
  background: color-mix(in srgb,var(--team-accent) 8%,var(--panel));
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--accent-text);
}
.ops-live-badge i,.live-pill i,.status-pulse,.live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ops-green);
  box-shadow: 0 0 14px var(--ops-green);
  display: inline-block;
  animation: opsPulse 1.6s ease-in-out infinite;
}
.ops-live-badge small {
  margin-left: auto;
  color: var(--ops-green);
  font-weight: 900;
}
.team-nav .nav-mini-count {
  margin-left: auto;
  min-width: 22px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb,var(--team-accent) 18%,transparent);
  font-size: 9px;
}
.ops-hero {
  position: relative;
  overflow: hidden;
  min-height: 275px;
  display: grid;
  grid-template-columns: 1fr 220px;
  align-items: center;
  padding: 34px;
}
.ops-hero:after {
  content: "";
  position: absolute;
  inset: auto -10% -60% 30%;
  height: 220px;
  background: linear-gradient(90deg,transparent,color-mix(in srgb,var(--team-accent) 20%,transparent),transparent);
  filter: blur(35px);
  transform: rotate(-8deg);
}
.ops-hero-copy {
  position: relative;
  z-index: 2;
}
.ops-hero h1 {
  font-size: clamp(2.1rem,4vw,4rem);
  letter-spacing: -.045em;
  margin: .25rem 0 .8rem;
}
.hero-status-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 20px;
}
.hero-status-row span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.075);
  background: rgba(255,255,255,.035);
  font-size: 10px;
  color: var(--accent-text);
}
.ops-hero-orbit {
  width: 170px;
  height: 170px;
  justify-self: end;
  position: relative;
  border: 1px solid color-mix(in srgb,var(--team-accent) 30%,transparent);
  border-radius: 50%;
  display: grid;
  place-items: center;
  box-shadow: 0 0 70px color-mix(in srgb,var(--team-accent) 18%,transparent),inset 0 0 40px color-mix(in srgb,var(--team-accent) 9%,transparent);
  z-index: 2;
}
.ops-hero-orbit:before,.ops-hero-orbit:after {
  content: "";
  position: absolute;
  border: 1px dashed color-mix(in srgb,var(--team-accent) 25%,transparent);
  border-radius: 50%;
  animation: opsSpin 14s linear infinite;
}
.ops-hero-orbit:before {
  inset: -16px;
}
.ops-hero-orbit:after {
  inset: 18px;
  animation-direction: reverse;
  animation-duration: 9s;
}
.ops-hero-orbit strong {
  font-size: 34px;
  letter-spacing: .06em;
  text-shadow: 0 0 24px color-mix(in srgb,var(--team-accent) 70%,transparent);
}
.ops-hero-orbit i {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--team-accent);
  box-shadow: 0 0 18px var(--team-accent);
}
.ops-hero-orbit i:nth-child(1) {
  top: 8px;
}
.ops-hero-orbit i:nth-child(2) {
  bottom: 21px;
  left: 12px;
}
.ops-hero-orbit i:nth-child(3) {
  right: 10px;
  top: 48%;
}
.ops-metrics .metric {
  position: relative;
  overflow: hidden;
  min-height: 125px;
}
.ops-metrics .metric:before {
  content: "";
  position: absolute;
  width: 90px;
  height: 90px;
  right: -35px;
  top: -35px;
  border-radius: 50%;
  background: color-mix(in srgb,var(--team-accent) 13%,transparent);
  filter: blur(8px);
}
.ops-metrics .metric-icon {
  font-size: 20px;
  margin-bottom: 10px;
  display: block;
}
.ops-metrics .metric small {
  display: block;
  color: var(--muted);
  font-size: 9px;
  margin-top: 3px;
}
.danger-soft {
  border-color: rgba(255,92,122,.2) !important;
  background: linear-gradient(145deg,rgba(255,92,122,.055),rgba(255,255,255,.018)) !important;
}
.ops-overview-grid {
  display: grid;
  grid-template-columns: minmax(0,1.45fr) minmax(280px,.55fr);
  gap: 18px;
  margin-top: 18px;
}
.ops-command-card {
  align-self: start;
}
.quick-action-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin: 16px 0;
}
.quick-action-grid button {
  min-height: 82px;
  border: 1px solid rgba(255,255,255,.075);
  background: rgba(255,255,255,.025);
  border-radius: 14px;
  color: inherit;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 6px;
  padding: 14px;
  cursor: pointer;
  font-weight: 800;
  transition: .2s;
}
.quick-action-grid button:hover {
  border-color: var(--team-accent);
  transform: translateY(-2px);
  background: color-mix(in srgb,var(--team-accent) 8%,transparent);
}
.quick-action-grid button:first-line {
  font-size: 20px;
}
.ops-contact {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.07);
}
.clamp-4 {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.live-pill {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
}
.shift-control {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 20px;
  margin-bottom: 16px;
  border-color: color-mix(in srgb,var(--team-accent) 24%,transparent);
}
.shift-control h3 {
  margin: .2rem 0;
}
.shift-control p {
  margin: 0;
  color: var(--muted);
}
.shift-control form.row {
  min-width: min(500px,48%);
}
.active-shift-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.active-shift {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
}
.active-shift b,.active-shift small {
  display: block;
}
.active-shift small {
  color: var(--muted);
  font-size: 9px;
  margin-top: 2px;
}
.active-shift p {
  margin: 5px 0 0;
  color: var(--accent-text);
  font-size: 10px;
}
.active-shift strong {
  font-size: 12px;
}
.ops-table {
  overflow: auto;
}
.ops-table table {
  width: 100%;
  border-collapse: collapse;
}
.ops-table th,.ops-table td {
  padding: 11px 10px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  text-align: left;
  vertical-align: top;
  font-size: 11px;
}
.ops-table th {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted);
}
.ops-table tbody tr:hover {
  background: rgba(255,255,255,.022);
}
.security-stat-grid {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.security-stat {
  padding: 15px;
  min-height: 110px;
  position: relative;
  overflow: hidden;
}
.security-stat>span {
  font-size: 20px;
}
.security-stat b,.security-stat small {
  display: block;
}
.security-stat b {
  font-size: 28px;
  margin-top: 8px;
}
.security-stat small {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.security-stat.accent {
  border-color: color-mix(in srgb,var(--team-accent) 28%,transparent);
  background: color-mix(in srgb,var(--team-accent) 7%,var(--panel));
}
.ops-filter {
  max-width: 280px;
}
.moderation-timeline {
  display: grid;
  gap: 9px;
}
.moderation-event {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 13px;
  background: rgba(255,255,255,.018);
  transition: .18s;
}
.moderation-event:hover {
  transform: translateX(3px);
  border-color: color-mix(in srgb,var(--team-accent) 25%,transparent);
  background: rgba(255,255,255,.028);
}
.mod-event-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--panel2);
  border: 1px solid var(--line);
}
.mod-event-main p {
  margin: 6px 0;
  color: var(--accent-text);
}
.mod-event-main time {
  font-size: 9px;
  color: var(--muted);
}
.mod-event-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 9px;
}
.team-tag {
  border-color: color-mix(in srgb,var(--team-accent) 30%,transparent) !important;
  color: var(--text) !important;
}
.danger-chip {
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(255,92,122,.09);
  border: 1px solid rgba(255,92,122,.25);
  color: #ff93a8 !important;
}
.member-ops-list {
  display: grid;
  gap: 6px;
}
.member-ops-row {
  display: grid;
  grid-template-columns: auto minmax(170px,1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-radius: 12px;
  color: inherit;
  border: 1px solid transparent;
}
.member-ops-row:hover {
  background: rgba(255,255,255,.025);
  border-color: rgba(255,255,255,.06);
}
.member-ops-row b,.member-ops-row small {
  display: block;
}
.member-ops-row small {
  color: var(--muted);
  font-size: 9px;
}
.ops-mini-stats {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ops-mini-stats span {
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  font-size: 9px;
  color: var(--muted);
}
.ops-member {
  position: relative;
  overflow: hidden;
}
.member-live-strip {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--blue);
}
.member-live-strip.online {
  background: var(--ops-green);
  box-shadow: 0 0 18px var(--ops-green);
}
.member-security-strip {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 8px 0;
}
.member-security-strip span {
  font-size: 9px;
  color: var(--muted);
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
}
.member-detail-shell {
  max-width: var(--content-width);
  margin: 0 auto;
}
.ops-profile-hero {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 26px;
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb,var(--member-accent) 25%,transparent);
}
.ops-profile-hero:after {
  content: "";
  position: absolute;
  right: -90px;
  top: -100px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: color-mix(in srgb,var(--member-accent) 18%,transparent);
  filter: blur(50px);
}
.ops-profile-avatar {
  width: 116px;
  height: 116px;
  border-radius: 28px;
  overflow: hidden;
  display: grid;
  place-items: center;
  font-size: 36px;
  font-weight: 900;
  background: linear-gradient(145deg,var(--avatar-color,#244a91),var(--panel));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 15px 50px color-mix(in srgb,var(--member-accent) 18%,transparent);
  z-index: 1;
}
.ops-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ops-profile-copy,.ops-profile-state {
  z-index: 1;
}
.ops-profile-copy h2 {
  font-size: 32px;
  margin: 8px 0 4px;
}
.ops-profile-copy p {
  color: var(--muted);
  margin: 0;
}
.ops-profile-meta {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.ops-profile-meta span {
  font-size: 9px;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.055);
  color: var(--muted);
}
.ops-profile-state {
  display: grid;
  gap: 7px;
  justify-items: end;
}
.state-online,.state-offline,.state-danger {
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 800;
}
.state-online {
  background: rgba(54,223,150,.08);
  border: 1px solid rgba(54,223,150,.25);
  color: #72eeb5;
}
.state-offline {
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.08);
  color: var(--muted);
}
.state-danger {
  background: rgba(255,92,122,.08);
  border: 1px solid rgba(255,92,122,.25);
  color: #ff93a8;
}
.ops-detail-grid {
  margin-top: 18px;
}
.compact-history,.notes-stack {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}
.compact-history>div,.notes-stack article {
  padding: 11px;
  border-radius: 11px;
  border: 1px solid rgba(255,255,255,.055);
  background: rgba(255,255,255,.018);
}
.compact-history b,.compact-history small {
  display: block;
}
.compact-history small {
  color: var(--muted);
  margin-top: 4px;
}
.notes-stack p {
  white-space: pre-wrap;
  color: var(--accent-text);
}
.member-detail-metrics {
  margin: 18px 0;
}
.nav-mini-count {
  pointer-events: none;
}
@keyframes opsPulse {
  50% {
    opacity: .4;
    transform: scale(.8);
  }
}
@keyframes opsSpin {
  to {
    transform: rotate(360deg);
  }
}
@media (max-width:1200px) {
  .security-stat-grid {
    grid-template-columns: repeat(3,1fr);
  }
  .active-shift-grid {
    grid-template-columns: 1fr 1fr;
  }
  .ops-overview-grid {
    grid-template-columns: 1fr;
  }
  .ops-hero {
    grid-template-columns: 1fr 150px;
  }
  .ops-hero-orbit {
    width: 130px;
    height: 130px;
  }
  .member-ops-row {
    grid-template-columns: auto 1fr auto;
  }
  .ops-mini-stats {
    grid-column: 2/3;
  }
}
@media (max-width:760px) {
  .ops-sidebar {
    position: relative;
    top: auto;
    max-height: none;
  }
  .ops-hero {
    grid-template-columns: 1fr;
    padding: 22px;
  }
  .ops-hero-orbit {
    display: none;
  }
  .security-stat-grid {
    grid-template-columns: 1fr 1fr;
  }
  .active-shift-grid {
    grid-template-columns: 1fr;
  }
  .shift-control {
    align-items: stretch;
    flex-direction: column;
  }
  .shift-control form.row {
    min-width: 0;
    width: 100%;
  }
  .member-ops-row {
    grid-template-columns: auto 1fr auto;
  }
  .ops-mini-stats {
    grid-column: 1/-1;
  }
  .ops-profile-hero {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .ops-profile-avatar {
    margin: auto;
  }
  .ops-profile-state {
    justify-items: center;
  }
  .ops-profile-meta {
    justify-content: center;
  }
}
body:not(.reduce-motion) .ops-reveal {
  animation: opsReveal .38s cubic-bezier(.2,.8,.2,1) both;
  animation-delay: var(--ops-delay,0ms);
}
@keyframes opsReveal {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
/* v15 Login Command Network */
.v15-login {
  min-height: min(820px,calc(100vh - 80px));
  grid-template-columns: minmax(0,1.25fr) minmax(360px,.75fr);
  position: relative;
}
.login-gridlines {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: linear-gradient(color-mix(in srgb,var(--blue) 3.50%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--blue) 3.50%,transparent) 1px,transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at 50% 45%,#000,transparent 78%);
}
.login-orbit-field {
  position: absolute;
  right: 28%;
  top: 18%;
  width: 330px;
  height: 330px;
  border: 1px solid color-mix(in srgb,var(--blue) 8.00%,transparent);
  border-radius: 50%;
  z-index: -1;
  animation: opsSpin 34s linear infinite;
}
.login-orbit-field:before,.login-orbit-field:after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px dashed color-mix(in srgb,var(--blue) 8.00%,transparent);
}
.login-orbit-field:before {
  inset: 42px;
}
.login-orbit-field:after {
  inset: 96px;
}
.login-orbit-field i {
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--blue2);
  box-shadow: 0 0 16px var(--blue2);
}
.login-orbit-field i:nth-child(1) {
  left: 12%;
  top: 22%;
}
.login-orbit-field i:nth-child(2) {
  right: 5%;
  top: 55%;
}
.login-orbit-field i:nth-child(3) {
  left: 42%;
  bottom: -3px;
}
.v15-login-showcase {
  padding-right: 36px;
}
.login-service-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 9px;
  margin: 20px 0;
}
.login-service-grid>div {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 9px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 13px;
  background: color-mix(in srgb,var(--bg) 50.00%,transparent);
  backdrop-filter: blur(12px);
}
.service-glyph {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg,var(--blue),var(--panel));
  font-size: 17px;
}
.service-glyph.gta {
  background: linear-gradient(145deg,#563145,#1c1325);
}
.service-glyph.music {
  background: linear-gradient(145deg,var(--blue),var(--panel));
}
.login-service-grid p {
  margin: 0;
}
.login-service-grid b,.login-service-grid small {
  display: block;
}
.login-service-grid b {
  font-size: 11px;
}
.login-service-grid small {
  color: var(--muted);
  font-size: 8px;
  margin-top: 3px;
}
.login-service-grid small i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--blue);
  margin-right: 5px;
}
.login-service-grid small i.online {
  background: #34e58a;
  box-shadow: 0 0 10px #34e58a;
}
.v15-login .login-security {
  display: flex;
  gap: 10px;
  align-items: center;
}
.v15-login .login-security span {
  font-size: 20px;
}
.v15-login .login-security b,.v15-login .login-security small {
  display: block;
}
.v15-login .login-security small {
  margin-top: 2px;
}
.v15-auth-card {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb,var(--blue) 22.00%,transparent);
  box-shadow: 0 35px 110px rgba(0,0,0,.42),0 0 80px color-mix(in srgb,var(--blue) 8.00%,transparent);
}
.auth-scan {
  position: absolute;
  inset: -30% 0 auto;
  height: 140px;
  background: linear-gradient(180deg,transparent,color-mix(in srgb,var(--blue) 5.50%,transparent),transparent);
  animation: authScan 7s ease-in-out infinite;
  pointer-events: none;
}
.auth-trust-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 14px 0;
}
.auth-trust-row span {
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 5px 7px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 999px;
  color: var(--muted);
}
.v15-auth-card .login-submit {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.v15-auth-card .login-submit b {
  font-size: 20px;
}
@keyframes authScan {
  0%,20% {
    transform: translateY(-120%);
  }
  65%,100% {
    transform: translateY(620%);
  }
}
@media (max-width:900px) {
  .v15-login {
    grid-template-columns: 1fr;
  }
  .v15-login-showcase {
    padding-right: 0;
  }
  .login-orbit-field {
    display: none;
  }
}
@media (max-width:620px) {
  .login-service-grid {
    grid-template-columns: 1fr;
  }
  .v15-login {
    min-height: auto;
  }
}
.active-punishment-panel {
  border-color: rgba(255,92,122,.16) !important;
}
.danger-pill {
  border-color: rgba(255,92,122,.25) !important;
  color: #ff9aad !important;
  background: rgba(255,92,122,.07) !important;
}
.active-punishment-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 9px;
}
.active-punishment-grid article {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 11px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(255,92,122,.12);
  border-radius: 13px;
  background: linear-gradient(145deg,rgba(255,92,122,.04),rgba(255,255,255,.015));
}
.punishment-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: rgba(255,92,122,.08);
  border: 1px solid rgba(255,92,122,.15);
}
.active-punishment-grid b,.active-punishment-grid small {
  display: block;
}
.active-punishment-grid small {
  color: var(--muted);
  font-size: 9px;
}
.active-punishment-grid p {
  margin: 5px 0;
  color: var(--accent-text);
  font-size: 10px;
}
.active-punishment-grid code {
  font-size: 9px;
  color: var(--muted);
}
@media (max-width:760px) {
  .active-punishment-grid {
    grid-template-columns: 1fr;
  }
}
.network-pulse-section {
  margin: 30px 0;
}
.network-pulse-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 14px;
}
.network-pulse-card {
  padding: 18px;
  color: inherit;
  position: relative;
  overflow: hidden;
}
.network-pulse-card:before {
  content: "";
  position: absolute;
  inset: auto -80px -100px auto;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: color-mix(in srgb,var(--blue) 10%,transparent);
  filter: blur(40px);
}
.pulse-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  z-index: 1;
}
.pulse-card-head>span {
  font-size: 9px;
  letter-spacing: .09em;
  font-weight: 900;
  color: var(--accent-text);
}
.pulse-card-head b {
  font-size: 15px;
}
.pulse-numbers {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 8px;
  margin: 17px 0;
  position: relative;
  z-index: 1;
}
.pulse-numbers span {
  padding: 10px;
  border-radius: 11px;
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.055);
}
.pulse-numbers b,.pulse-numbers small {
  display: block;
}
.pulse-numbers b {
  font-size: 22px;
}
.pulse-numbers small {
  font-size: 8px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 3px;
}
.pulse-card-foot {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 9px;
  position: relative;
  z-index: 1;
}
.pulse-card-foot i {
  font-style: normal;
  color: var(--accent-text);
}
@media (max-width:850px) {
  .network-pulse-grid {
    grid-template-columns: 1fr;
  }
  .pulse-numbers {
    grid-template-columns: 1fr 1fr;
  }
}
/* ===== v16 JAVIS / Music production polish ===== */
.javis-nav-link {
  position: relative;
}
.javis-mini-live {
  margin-left: auto;
  font-size: .58rem;
  letter-spacing: .12em;
  padding: .18rem .36rem;
  border: 1px solid color-mix(in srgb,var(--success),transparent 45%);
  border-radius: 999px;
  color: var(--success);
  box-shadow: 0 0 14px color-mix(in srgb,var(--success),transparent 65%);
}
.music-mini-diagnostic {
  display: grid;
  gap: .25rem;
  margin: .8rem 0;
  padding: .75rem .85rem;
  border: 1px solid color-mix(in srgb,var(--danger),transparent 65%);
  background: color-mix(in srgb,var(--danger),transparent 92%);
  border-radius: 12px;
  font-size: .78rem;
}
.music-mini-diagnostic b {
  color: var(--text);
}
.music-mini-diagnostic span {
  color: var(--muted);
}
.button.disabled {
  pointer-events: none;
  opacity: .45;
  filter: grayscale(.4);
}
.music-diagnostics {
  display: grid;
  grid-template-columns: minmax(240px,1.1fr) minmax(320px,1.6fr);
  gap: 1.1rem;
  align-items: center;
  padding: 1.15rem;
  margin: 1rem 0;
}
.music-diagnostics h2 {
  margin: .1rem 0;
}
.music-diagnostics p {
  color: var(--muted);
  margin: .35rem 0 0;
}
.diag-grid {
  display: grid;
  grid-template-columns: repeat(5,minmax(80px,1fr));
  gap: .55rem;
}
.diag-grid span {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  padding: .7rem;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
  font-size: .65rem;
  letter-spacing: .12em;
  color: var(--muted);
}
.diag-grid span b {
  font-size: .78rem;
  letter-spacing: .04em;
}
.diag-grid .ok b {
  color: var(--success);
}
.diag-grid .bad b {
  color: var(--danger);
}
.diag-issues,.diag-ready {
  grid-column: 1/-1;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .55rem;
}
.diag-issues span {
  padding: .45rem .65rem;
  border-radius: 999px;
  background: rgba(255,92,117,.08);
  border: 1px solid rgba(255,92,117,.18);
  color: #ff9eae;
  font-size: .76rem;
}
.diag-ready {
  color: var(--success);
  font-size: .82rem;
}
.javis-stage {
  position: relative;
  min-height: calc(100vh - 120px);
  padding: clamp(.8rem,2vw,1.5rem);
  overflow: hidden;
  isolation: isolate;
}
.javis-stage:before {
  content: "";
  position: absolute;
  inset: -30%;
  z-index: -3;
  background: radial-gradient(circle at 18% 10%,color-mix(in srgb,var(--blue),transparent 78%),transparent 28%),radial-gradient(circle at 82% 34%,color-mix(in srgb,var(--blue2),transparent 82%),transparent 30%),linear-gradient(140deg,color-mix(in srgb,var(--bg) 96.00%,transparent),color-mix(in srgb,var(--panel) 82.00%,transparent));
  animation: javisDrift 14s ease-in-out infinite alternate;
}
.javis-grid {
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .14;
  background-image: linear-gradient(color-mix(in srgb,var(--blue2) 22.00%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--blue2) 22.00%,transparent) 1px,transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom,#000,transparent 94%);
  perspective: 600px;
  transform: rotateX(54deg) scale(1.35) translateY(25%);
  transform-origin: center bottom;
}
.javis-scan {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 5;
  background: linear-gradient(to bottom,transparent 0%,color-mix(in srgb,var(--blue2) 4.00%,transparent) 48%,color-mix(in srgb,var(--blue2) 12.00%,transparent) 50%,color-mix(in srgb,var(--blue2) 4.00%,transparent) 52%,transparent 100%);
  background-size: 100% 130px;
  animation: javisScan 5s linear infinite;
  mix-blend-mode: screen;
}
.javis-topline {
  display: flex;
  justify-content: space-between;
  gap: 1.25rem;
  align-items: flex-start;
  margin-bottom: 1.25rem;
}
.javis-topline h1 {
  font-size: clamp(2rem,5vw,4.4rem);
  line-height: .9;
  letter-spacing: .08em;
  margin: .2rem 0;
  text-shadow: 0 0 30px color-mix(in srgb,var(--blue2),transparent 60%);
}
.javis-topline h1 small {
  display: block;
  font-size: .25em;
  letter-spacing: .28em;
  color: var(--muted);
  margin-top: .6rem;
}
.javis-topline p {
  max-width: 780px;
  color: var(--muted);
}
.javis-provider-badge {
  min-width: 150px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: .15rem .5rem;
  padding: .7rem .9rem;
  border: 1px solid color-mix(in srgb,var(--blue2) 20.00%,transparent);
  border-radius: 14px;
  background: color-mix(in srgb,var(--panel) 68.00%,transparent);
  backdrop-filter: blur(14px);
  box-shadow: inset 0 0 22px color-mix(in srgb,var(--blue2) 4.00%,transparent);
}
.javis-provider-badge small {
  grid-column: 2;
  color: var(--muted);
  font-size: .65rem;
}
.pulse-dot {
  width: 9px;
  height: 9px;
  border-radius: 99px;
  background: #6b7280;
  box-shadow: 0 0 0 0 rgba(34,197,94,0);
}
.pulse-dot.online {
  background: var(--success);
  animation: javisPulse 1.8s infinite;
}
.javis-layout {
  display: grid;
  grid-template-columns: minmax(310px,.78fr) minmax(440px,1.55fr);
  gap: 1rem;
}
.javis-reactor-panel,.javis-terminal {
  min-height: 620px;
  border: 1px solid color-mix(in srgb,var(--blue2) 16.00%,transparent) !important;
  background: linear-gradient(160deg,color-mix(in srgb,var(--panel) 72.00%,transparent),color-mix(in srgb,var(--bg) 86.00%,transparent)) !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.32),inset 0 0 55px color-mix(in srgb,var(--blue2) 2.50%,transparent);
}
.javis-reactor-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.2rem;
  position: relative;
  overflow: hidden;
}
.javis-reactor-panel:before,.javis-reactor-panel:after {
  content: "";
  position: absolute;
  width: 140px;
  height: 1px;
  background: linear-gradient(90deg,transparent,var(--blue2),transparent);
  opacity: .5;
}
.javis-reactor-panel:before {
  left: -25px;
  top: 68px;
  transform: rotate(45deg);
}
.javis-reactor-panel:after {
  right: -25px;
  bottom: 68px;
  transform: rotate(-45deg);
}
.reactor-shell {
  position: relative;
  width: min(310px,78vw);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
}
.reactor-ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb,var(--blue2) 30.00%,transparent);
  box-shadow: 0 0 28px color-mix(in srgb,var(--blue2) 10.00%,transparent),inset 0 0 20px color-mix(in srgb,var(--blue2) 6.00%,transparent);
}
.ring-a {
  inset: 2%;
  border-style: dashed;
  animation: reactorSpin 18s linear infinite;
}
.ring-b {
  inset: 12%;
  border-width: 2px;
  border-color: color-mix(in srgb,var(--blue2) 26.00%,transparent);
  animation: reactorSpin 12s linear infinite reverse;
}
.ring-c {
  inset: 23%;
  border-style: dotted;
  animation: reactorSpin 8s linear infinite;
}
.reactor-core {
  position: relative;
  width: 43%;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb,var(--blue2) 45.00%,transparent);
  background: radial-gradient(circle,var(--blue2) 0 3%,var(--blue2) 4% 7%,var(--blue2) 8% 20%,var(--panel) 21% 54%,color-mix(in srgb,var(--panel) 90.00%,transparent) 55%);
  color: var(--text);
  box-shadow: 0 0 25px var(--blue2),0 0 65px color-mix(in srgb,var(--blue2) 42.00%,transparent),inset 0 0 40px color-mix(in srgb,var(--blue2) 26.00%,transparent);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: .25s transform,.25s box-shadow;
}
.reactor-core:hover {
  transform: scale(1.05);
  box-shadow: 0 0 35px var(--blue2),0 0 90px color-mix(in srgb,var(--blue2) 55.00%,transparent),inset 0 0 45px color-mix(in srgb,var(--blue2) 35.00%,transparent);
}
.reactor-core b {
  font-size: 2rem;
  text-shadow: 0 0 12px #fff;
}
.reactor-core small {
  font-size: .52rem;
  letter-spacing: .16em;
  color: var(--accent-text);
}
.reactor-dot {
  position: absolute;
  inset: 10%;
  border-radius: 50%;
  border: 1px dashed color-mix(in srgb,var(--blue2) 44.00%,transparent);
  animation: reactorSpin 6s linear infinite;
}
.reactor-wave {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  opacity: .55;
}
.reactor-wave i {
  display: block;
  width: 2px;
  height: calc(7% + (var(--i) % 6)*2.1%);
  background: linear-gradient(var(--blue2),var(--blue));
  box-shadow: 0 0 7px var(--blue2);
  animation: javisBar 1.5s ease-in-out infinite;
  animation-delay: calc(var(--i)*-55ms);
}
.javis-thinking .reactor-shell,.javis-listening .reactor-shell,.reactor-shell.speaking {
  filter: drop-shadow(0 0 18px color-mix(in srgb,var(--blue2) 38.00%,transparent));
}
.javis-listening .reactor-core {
  animation: reactorListen 1s ease-in-out infinite alternate;
}
.reactor-shell.speaking .reactor-wave i {
  animation-duration: .45s;
}
.javis-call-active .reactor-ring {
  border-color: rgba(98,255,197,.42);
}
.javis-call-state {
  text-align: center;
  margin: .55rem 0 1rem;
}
.javis-call-state span {
  display: block;
  font-size: .9rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.javis-call-state small {
  display: block;
  max-width: 420px;
  margin: .35rem auto;
  color: var(--muted);
}
.javis-quick-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  width: 100%;
  max-width: 470px;
}
.holo-chip {
  padding: .72rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb,var(--blue2) 14.00%,transparent);
  background: color-mix(in srgb,var(--panel) 45.00%,transparent);
  color: var(--text);
  text-align: left;
  cursor: pointer;
  transition: .2s;
}
.holo-chip:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb,var(--blue2) 40.00%,transparent);
  background: color-mix(in srgb,var(--panel2) 56.00%,transparent);
  box-shadow: 0 10px 25px rgba(0,0,0,.18);
}
.javis-security-note {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  margin-top: 1rem;
  padding: .75rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb,var(--blue2) 10.00%,transparent);
  background: color-mix(in srgb,var(--bg) 52.00%,transparent);
  font-size: .72rem;
  color: var(--muted);
}
.javis-security-note p {
  margin: 0;
}
.javis-security-note b {
  color: var(--text);
}
.javis-terminal {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.javis-terminal-head {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 .9rem;
  border-bottom: 1px solid color-mix(in srgb,var(--blue2) 10.00%,transparent);
  font-size: .68rem;
  letter-spacing: .12em;
  color: var(--accent-text);
}
.javis-terminal-head>div:first-child {
  display: flex;
  gap: .45rem;
  align-items: center;
}
.javis-terminal-head i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 10px var(--success);
}
.javis-signal {
  display: flex;
  gap: 3px;
  align-items: flex-end;
  height: 15px;
}
.javis-signal b {
  width: 3px;
  background: var(--blue2);
  border-radius: 3px;
}
.javis-signal b:nth-child(1) {
  height: 25%;
}
.javis-signal b:nth-child(2) {
  height: 48%;
}
.javis-signal b:nth-child(3) {
  height: 72%;
}
.javis-signal b:nth-child(4) {
  height: 100%;
}
.javis-messages {
  flex: 1;
  min-height: 0;
  max-height: 650px;
  overflow: auto;
  padding: 1rem;
  scrollbar-width: thin;
}
.javis-message {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  margin: .55rem 0;
  animation: javisMessageIn .28s ease both;
}
.javis-message.owner {
  flex-direction: row-reverse;
}
.javis-message>div:last-child {
  max-width: min(86%,820px);
  padding: .72rem .82rem;
  border: 1px solid color-mix(in srgb,var(--blue2) 11.00%,transparent);
  border-radius: 5px 14px 14px 14px;
  background: color-mix(in srgb,var(--panel) 58.00%,transparent);
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.javis-message.owner>div:last-child {
  border-radius: 14px 5px 14px 14px;
  background: linear-gradient(135deg,color-mix(in srgb,var(--blue) 28.00%,transparent),color-mix(in srgb,var(--panel2) 55.00%,transparent));
}
.javis-avatar {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb,var(--blue2) 28.00%,transparent);
  background: var(--panel);
  color: var(--accent-text);
  font-weight: 900;
  box-shadow: 0 0 16px color-mix(in srgb,var(--blue2) 10.00%,transparent);
}
.javis-message.owner .javis-avatar {
  color: var(--text);
  border-color: color-mix(in srgb,var(--blue) 35.00%,transparent);
}
.javis-message span {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .13em;
  color: var(--accent-text);
}
.javis-message span small {
  font-size: .55rem;
  color: var(--muted);
  letter-spacing: .04em;
}
.javis-message p {
  white-space: pre-wrap;
  line-height: 1.55;
  margin: .3rem 0 0;
  color: var(--text);
}
.thinking-message {
  opacity: .55;
}
.thinking-message p:after {
  content: "";
  display: inline-block;
  width: 1.6em;
  height: .8em;
  margin-left: .35rem;
  background: radial-gradient(circle,var(--blue2) 35%,transparent 38%) 0 50%/33% 100% repeat-x;
  animation: javisDots 1s steps(4,end) infinite;
}
.javis-compose {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .5rem;
  padding: .75rem;
  border-top: 1px solid color-mix(in srgb,var(--blue2) 10.00%,transparent);
  background: color-mix(in srgb,var(--bg) 74.00%,transparent);
}
.javis-compose textarea {
  resize: none;
  max-height: 150px;
  min-height: 44px;
  padding: .72rem .8rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb,var(--blue2) 14.00%,transparent);
  background: color-mix(in srgb,var(--panel) 60.00%,transparent);
  color: var(--text);
  outline: none;
}
.javis-compose textarea:focus {
  border-color: color-mix(in srgb,var(--blue2) 55.00%,transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--blue2) 8.00%,transparent);
}
.javis-mic-btn,.javis-send {
  border-radius: 12px;
  border: 1px solid color-mix(in srgb,var(--blue2) 20.00%,transparent);
  cursor: pointer;
}
.javis-mic-btn {
  width: 44px;
  background: color-mix(in srgb,var(--panel) 70.00%,transparent);
  color: var(--accent-text);
}
.javis-send {
  padding: 0 1rem;
  background: linear-gradient(135deg,var(--blue2),var(--blue));
  color: var(--text);
  font-weight: 900;
  letter-spacing: .08em;
}
.javis-send:disabled {
  opacity: .45;
}
.javis-hints {
  display: flex;
  gap: .8rem;
  padding: .3rem .8rem .6rem;
  color: var(--muted);
  font-size: .58rem;
  letter-spacing: .04em;
}
.javis-bottom-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 1rem;
}
.javis-action-list {
  display: grid;
  gap: .45rem;
}
.javis-action-list article {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .6rem;
  align-items: center;
  padding: .65rem;
  border-radius: 11px;
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.06);
}
.javis-action-list small {
  display: block;
  color: var(--muted);
  font-size: .68rem;
}
.status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--blue);
}
.status-dot.ok {
  background: var(--success);
  box-shadow: 0 0 12px color-mix(in srgb,var(--success),transparent 35%);
}
.tiny-button {
  font-size: .68rem;
  padding: .42rem .55rem;
}
.provider-status-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: .5rem;
  margin: .8rem 0;
}
.provider-status-grid span {
  padding: .65rem;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  color: var(--muted);
  font-size: .7rem;
}
.provider-status-grid span b {
  display: block;
  color: #ff8292;
  font-size: .62rem;
}
.provider-status-grid span.ready b {
  color: var(--success);
}
.inline-danger {
  margin-top: .8rem;
}
@keyframes javisDrift {
  to {
    transform: translate3d(2.5%,1%,0) scale(1.03);
  }
}
@keyframes javisScan {
  from {
    background-position: 0 -130px;
  }
  to {
    background-position: 0 130px;
  }
}
@keyframes reactorSpin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes reactorListen {
  from {
    transform: scale(.98);
  }
  to {
    transform: scale(1.06);
  }
}
@keyframes javisPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(34,197,94,.45);
  }
  70% {
    box-shadow: 0 0 0 9px rgba(34,197,94,0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(34,197,94,0);
  }
}
@keyframes javisBar {
  0%,100% {
    transform: scaleY(.55);
    opacity: .35;
  }
  50% {
    transform: scaleY(1.8);
    opacity: 1;
  }
}
@keyframes javisMessageIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes javisDots {
  from {
    background-position: 0 50%;
  }
  to {
    background-position: 1.6em 50%;
  }
}
@media (max-width:980px) {
  .javis-layout,.javis-bottom-grid,.music-diagnostics {
    grid-template-columns: 1fr;
  }
  .javis-reactor-panel,.javis-terminal {
    min-height: auto;
  }
  .javis-terminal {
    height: 650px;
  }
  .diag-grid {
    grid-template-columns: repeat(3,1fr);
  }
}
@media (max-width:620px) {
  .javis-topline {
    display: block;
  }
  .javis-provider-badge {
    margin-top: .8rem;
  }
  .javis-layout {
    display: flex;
    flex-direction: column;
  }
  .javis-reactor-panel {
    padding: .75rem;
  }
  .reactor-shell {
    width: min(270px,75vw);
  }
  .javis-quick-grid {
    grid-template-columns: 1fr;
  }
  .javis-terminal {
    height: 620px;
  }
  .javis-compose {
    grid-template-columns: auto 1fr;
  }
  .javis-send {
    grid-column: 1/-1;
    min-height: 42px;
  }
  .javis-hints {
    display: none;
  }
  .provider-status-grid,.diag-grid {
    grid-template-columns: 1fr 1fr;
  }
  .javis-bottom-grid {
    display: flex;
    flex-direction: column;
  }
  .music-diagnostics {
    padding: .85rem;
  }
}
body.reduce-motion .javis-stage:before,body.reduce-motion .javis-scan,body.reduce-motion .reactor-ring,body.reduce-motion .reactor-wave i,body.reduce-motion .pulse-dot.online {
  animation: none !important;
}
/* v17 Installable App / PWA */
.pwa-install-top {
  font-size: 20px;
  cursor: pointer;
  border: 0;
}
.drawer-install {
  width: 100%;
  margin-top: 8px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb,var(--blue) 32%,transparent);
  border-radius: 14px;
  background: color-mix(in srgb,var(--blue) 9%,transparent);
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.login-app-install {
  width: 100%;
  display: grid;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb,var(--blue) 34%,transparent);
  border-radius: 16px;
  background: linear-gradient(135deg,color-mix(in srgb,var(--blue) 12%,transparent),color-mix(in srgb,var(--blue2) 8%,transparent));
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.login-app-install>span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: color-mix(in srgb,var(--blue) 20%,transparent);
  box-shadow: 0 0 24px color-mix(in srgb,var(--blue) 22%,transparent);
}
.login-app-install div {
  display: grid;
  gap: 2px;
}
.login-app-install small {
  color: var(--muted);
}
.login-app-install i {
  font-style: normal;
  font-size: 22px;
}
.pwa-install-sheet {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: end center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: .22s ease;
}
.pwa-install-sheet.open {
  opacity: 1;
  pointer-events: auto;
}
.pwa-install-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: color-mix(in srgb,var(--bg) 80.00%,transparent);
  backdrop-filter: blur(12px);
}
.pwa-install-card {
  position: relative;
  width: min(620px,100%);
  padding: 24px;
  border-radius: 28px;
  transform: translateY(30px) scale(.98);
  transition: .25s cubic-bezier(.2,.8,.2,1);
  box-shadow: 0 30px 100px #000b,0 0 70px color-mix(in srgb,var(--blue) 16%,transparent);
}
.pwa-install-sheet.open .pwa-install-card {
  transform: none;
}
.pwa-install-icon {
  width: 86px;
  height: 86px;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 0 50px color-mix(in srgb,var(--blue) 30%,transparent);
  margin-bottom: 16px;
}
.pwa-install-icon img {
  width: 100%;
  height: 100%;
  display: block;
}
.pwa-install-copy h2 {
  margin: 5px 0 8px;
  font-size: clamp(25px,5vw,38px);
}
.pwa-install-copy p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}
.pwa-install-features {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 9px;
  margin: 18px 0;
}
.pwa-install-features span,.pwa-ios-help span {
  padding: 10px 12px;
  border: 1px solid #ffffff12;
  border-radius: 12px;
  background: #ffffff07;
}
.pwa-ios-help {
  display: grid;
  gap: 8px;
  margin: 14px 0;
}
.pwa-ios-help b {
  font-size: 15px;
}
.pwa-install-actions {
  display: flex;
  gap: 10px;
  margin: 18px 0 10px;
}
.pwa-install-actions>* {
  flex: 1;
}
.pwa-app-dock {
  display: none;
}
.is-standalone .pwa-install-top,.is-standalone .drawer-install,.is-standalone .login-app-install {
  display: none !important;
}
.is-standalone body {
  overscroll-behavior-y: none;
}
.is-standalone .page {
  padding-bottom: calc(88px + env(safe-area-inset-bottom));
}
.offline-shell {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  padding: 34px;
  max-width: 720px;
  margin: auto;
}
.offline-shell h1 {
  font-size: clamp(34px,8vw,64px);
  margin: 10px 0;
}
.offline-shell p {
  color: var(--muted);
  font-size: 17px;
  line-height: 1.7;
  max-width: 620px;
}
.offline-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin: 22px 0;
}
.offline-reactor {
  position: relative;
  width: 130px;
  height: 130px;
  display: grid;
  place-items: center;
  margin-bottom: 20px;
}
.offline-reactor i {
  position: absolute;
  inset: 10px;
  border: 1px solid color-mix(in srgb,var(--blue) 50%,transparent);
  border-radius: 50%;
  animation: pwa-orbit 4s linear infinite;
}
.offline-reactor i:nth-child(2) {
  inset: 26px;
  animation-direction: reverse;
  animation-duration: 2.7s;
}
.offline-reactor span {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%,#fff,var(--blue) 18%,var(--panel) 72%);
  box-shadow: 0 0 50px color-mix(in srgb,var(--blue) 55%,transparent);
  font-weight: 900;
}
@keyframes pwa-orbit {
  to {
    transform: rotate(360deg);
  }
}
@media (display-mode:standalone) {
  .pwa-app-dock {
    display: flex;
  }
}
@media (max-width:760px) {
  .is-standalone .topbar {
    padding-top: max(8px,env(safe-area-inset-top));
  }
  .pwa-app-dock {
    position: fixed;
    z-index: 9000;
    left: 10px;
    right: 10px;
    bottom: max(10px,env(safe-area-inset-bottom));
    min-height: 68px;
    align-items: center;
    justify-content: space-around;
    padding: 7px 8px;
    border: 1px solid #ffffff14;
    border-radius: 22px;
    background: color-mix(in srgb,var(--panel) 88%,transparent);
    backdrop-filter: blur(24px) saturate(1.4);
    box-shadow: 0 18px 50px #0008;
  }
  .pwa-app-dock a {
    position: relative;
    min-width: 52px;
    display: grid;
    place-items: center;
    gap: 1px;
    color: inherit;
    text-decoration: none;
    font-size: 20px;
  }
  .pwa-app-dock small {
    font-size: 9px;
    color: var(--muted);
  }
  .pwa-app-dock b {
    position: absolute;
    right: 4px;
    top: -3px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 9px;
    background: var(--danger);
    font-size: 9px;
    display: grid;
    place-items: center;
  }
  .pwa-install-sheet {
    padding: 10px;
  }
  .pwa-install-card {
    border-radius: 25px;
    padding: 20px;
  }
  .pwa-install-features {
    grid-template-columns: 1fr;
  }
  .pwa-install-actions {
    flex-direction: column;
  }
}
/* === v18 JAVIS Local Intelligence Workspace === */
.javis-v18 {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 28px;
  padding: clamp(.4rem,1vw,1rem);
  background: radial-gradient(circle at 8% 4%,color-mix(in srgb,var(--blue2) 10.00%,transparent),transparent 30%),
radial-gradient(circle at 92% 0%,color-mix(in srgb,var(--blue) 14.00%,transparent),transparent 34%),
linear-gradient(180deg,color-mix(in srgb,var(--bg) 44.00%,transparent),color-mix(in srgb,var(--bg) 15.00%,transparent));
}
.javis-v18:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background: linear-gradient(115deg,transparent 15%,color-mix(in srgb,var(--blue2) 2.50%,transparent) 32%,transparent 48%,color-mix(in srgb,var(--blue) 2.50%,transparent) 65%,transparent 82%);
  background-size: 240% 100%;
  animation: jv18Sweep 14s linear infinite;
}
.javis-orbit-field {
  position: absolute;
  inset: -10% -5%;
  pointer-events: none;
  overflow: hidden;
  z-index: -1;
  opacity: .38;
}
.javis-orbit-field i {
  position: absolute;
  border: 1px solid color-mix(in srgb,var(--blue2) 12.00%,transparent);
  border-radius: 50%;
  filter: drop-shadow(0 0 12px color-mix(in srgb,var(--blue2) 8.00%,transparent));
  animation: jv18Orbit 20s linear infinite;
}
.javis-orbit-field i:nth-child(1) {
  width: 42vw;
  height: 42vw;
  min-width: 380px;
  min-height: 380px;
  right: -12%;
  top: -18%;
}
.javis-orbit-field i:nth-child(2) {
  width: 30vw;
  height: 30vw;
  min-width: 280px;
  min-height: 280px;
  left: -10%;
  bottom: 4%;
  animation-direction: reverse;
  animation-duration: 27s;
}
.javis-orbit-field i:nth-child(3) {
  width: 18vw;
  height: 18vw;
  min-width: 190px;
  min-height: 190px;
  left: 40%;
  top: 28%;
  animation-duration: 13s;
}
.javis-v18-head {
  align-items: flex-start;
  gap: 1.2rem;
}
.javis-v18-head h1 {
  font-size: clamp(2.5rem,6vw,5.6rem);
  line-height: .88;
  letter-spacing: -.06em;
  text-shadow: 0 0 42px color-mix(in srgb,var(--blue2) 18.00%,transparent);
}
.javis-v18-head h1 small {
  display: block;
  margin-top: .75rem;
  font-size: .16em;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--accent-text);
}
.javis-v18-head>div:first-child p {
  max-width: 820px;
  font-size: clamp(.9rem,1.5vw,1.05rem);
}
.javis-head-status {
  display: flex;
  gap: .55rem;
  align-items: stretch;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.javis-access-badge {
  min-width: 150px;
  padding: .62rem .78rem;
  border: 1px solid color-mix(in srgb,var(--blue2) 16.00%,transparent);
  border-radius: 14px;
  background: color-mix(in srgb,var(--panel) 68.00%,transparent);
  box-shadow: inset 0 1px rgba(255,255,255,.04),0 12px 34px rgba(0,0,0,.18);
}
.javis-access-badge b {
  display: block;
  font-size: .65rem;
  letter-spacing: .14em;
  color: var(--accent-text);
}
.javis-access-badge small {
  display: block;
  margin-top: .2rem;
  color: var(--muted);
  font-size: .62rem;
}
.javis-access-badge.owner {
  border-color: color-mix(in srgb,var(--blue) 24.00%,transparent);
  background: linear-gradient(145deg,rgba(65,44,8,.44),color-mix(in srgb,var(--panel) 78.00%,transparent));
}
.javis-access-badge.owner b {
  color: #ffd67b;
}
.javis-modebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: .85rem 0 1rem;
  padding: .78rem .9rem;
  border-radius: 16px;
  border-color: color-mix(in srgb,var(--blue2) 12.00%,transparent);
}
.javis-modebar>div:first-child b {
  display: block;
  margin-top: .14rem;
  font-size: .9rem;
}
.javis-mode-pills {
  display: flex;
  gap: .42rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.javis-mode-pills button {
  border: 1px solid color-mix(in srgb,var(--blue2) 12.00%,transparent);
  border-radius: 999px;
  background: color-mix(in srgb,var(--panel) 55.00%,transparent);
  color: var(--accent-text);
  padding: .5rem .72rem;
  font-weight: 800;
  font-size: .68rem;
  letter-spacing: .035em;
  cursor: pointer;
  transition: .22s ease;
}
.javis-mode-pills button:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb,var(--blue2) 38.00%,transparent);
  color: var(--text);
}
.javis-mode-pills button.active {
  background: linear-gradient(135deg,color-mix(in srgb,var(--blue2) 32.00%,transparent),color-mix(in srgb,var(--blue) 28.00%,transparent));
  border-color: color-mix(in srgb,var(--blue2) 55.00%,transparent);
  color: var(--text);
  box-shadow: 0 0 24px color-mix(in srgb,var(--blue2) 13.00%,transparent),inset 0 0 16px color-mix(in srgb,var(--blue) 6.00%,transparent);
}
.javis-v18-layout {
  grid-template-columns: minmax(300px,.82fr) minmax(460px,1.6fr);
  gap: 1rem;
}
.javis-v18-reactor {
  position: relative;
  background: linear-gradient(160deg,color-mix(in srgb,var(--panel) 86.00%,transparent),color-mix(in srgb,var(--bg) 74.00%,transparent));
  border-color: color-mix(in srgb,var(--blue2) 15.00%,transparent);
}
.javis-v18-reactor:after {
  content: "";
  position: absolute;
  inset: 14px;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb,var(--blue2) 4.00%,transparent);
  pointer-events: none;
}
.javis-local-health {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: .65rem;
  padding: .7rem .8rem;
  margin: .65rem 0;
  border-radius: 13px;
  border: 1px solid color-mix(in srgb,var(--blue2) 12.00%,transparent);
  background: color-mix(in srgb,var(--panel) 56.00%,transparent);
}
.javis-local-health .health-icon {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  font-weight: 1000;
  color: var(--accent-text);
  background: color-mix(in srgb,var(--blue2) 12.00%,transparent);
  box-shadow: inset 0 0 14px color-mix(in srgb,var(--blue2) 7.00%,transparent);
}
.javis-local-health b,.javis-local-health small {
  display: block;
}
.javis-local-health small {
  font-size: .66rem;
  color: var(--muted);
  margin-top: .12rem;
}
.javis-local-health.ready {
  border-color: rgba(70,230,151,.19);
  background: linear-gradient(135deg,rgba(20,93,69,.17),color-mix(in srgb,var(--panel) 55.00%,transparent));
}
.javis-local-health.ready .health-icon {
  color: #69efad;
  background: rgba(35,200,121,.11);
}
.javis-local-health.warn .health-icon {
  color: #ffd875;
  background: color-mix(in srgb,var(--blue) 9.00%,transparent);
}
.javis-v18-prompts {
  grid-template-columns: 1fr 1fr;
}
.javis-v18-prompts .holo-chip {
  min-height: 62px;
  text-align: left;
  padding: .7rem .76rem;
  font-size: .72rem;
  line-height: 1.25;
}
.javis-v18-prompts .owner-chip {
  border-color: rgba(255,202,91,.13);
  background: linear-gradient(135deg,rgba(74,52,9,.18),color-mix(in srgb,var(--panel) 64.00%,transparent));
}
.javis-v18-terminal {
  height: min(760px,75vh);
  min-height: 590px;
  border-color: color-mix(in srgb,var(--blue2) 14.00%,transparent);
  background: linear-gradient(180deg,color-mix(in srgb,var(--panel) 88.00%,transparent),color-mix(in srgb,var(--bg) 82.00%,transparent));
  box-shadow: 0 28px 80px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.035);
}
.javis-chat-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .48rem .8rem;
  border-bottom: 1px solid color-mix(in srgb,var(--blue2) 7.00%,transparent);
  background: color-mix(in srgb,var(--panel) 45.00%,transparent);
}
.javis-chat-context span {
  font-size: .6rem;
  font-weight: 1000;
  letter-spacing: .18em;
  color: var(--accent-text);
}
.javis-chat-context small {
  font-size: .58rem;
  color: var(--muted);
}
.javis-v18 .javis-message>div:last-child {
  backdrop-filter: blur(10px);
  border-color: color-mix(in srgb,var(--blue2) 10.00%,transparent);
}
.javis-v18 .javis-message.assistant>div:last-child {
  background: linear-gradient(140deg,color-mix(in srgb,var(--panel) 76.00%,transparent),color-mix(in srgb,var(--panel) 63.00%,transparent));
}
.javis-v18 .javis-message.owner>div:last-child {
  background: linear-gradient(140deg,color-mix(in srgb,var(--blue) 30.00%,transparent),color-mix(in srgb,var(--panel2) 72.00%,transparent));
  border-color: color-mix(in srgb,var(--blue) 16.00%,transparent);
}
.javis-v18 .javis-compose {
  background: linear-gradient(180deg,color-mix(in srgb,var(--bg) 72.00%,transparent),color-mix(in srgb,var(--bg) 94.00%,transparent));
  border-top-color: color-mix(in srgb,var(--blue2) 9.00%,transparent);
}
.javis-v18 .javis-compose textarea {
  background: color-mix(in srgb,var(--panel) 76.00%,transparent);
  border-color: color-mix(in srgb,var(--blue2) 13.00%,transparent);
  font-size: .82rem;
}
.javis-v18 .javis-send {
  min-width: 90px;
  background: linear-gradient(135deg,var(--blue2),var(--blue) 62%,var(--blue));
  box-shadow: 0 10px 26px color-mix(in srgb,var(--blue) 20.00%,transparent);
}
.javis-feature-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: .75rem;
  margin-top: 1rem;
}
.javis-feature-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .7rem;
  align-items: flex-start;
  padding: .9rem;
  border-radius: 16px;
  min-height: 105px;
}
.javis-feature-card>span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(135deg,color-mix(in srgb,var(--blue2) 16.00%,transparent),color-mix(in srgb,var(--blue) 14.00%,transparent));
  border: 1px solid color-mix(in srgb,var(--blue2) 12.00%,transparent);
}
.javis-feature-card b {
  display: block;
  font-size: .82rem;
}
.javis-feature-card small {
  display: block;
  margin-top: .26rem;
  color: var(--muted);
  line-height: 1.4;
  font-size: .67rem;
}
.javis-user-access {
  background: linear-gradient(145deg,color-mix(in srgb,var(--panel) 72.00%,transparent),color-mix(in srgb,var(--panel) 72.00%,transparent));
}
.permission-strip {
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
  margin-top: .75rem;
}
.permission-strip span {
  padding: .38rem .52rem;
  border-radius: 999px;
  background: rgba(44,195,142,.08);
  border: 1px solid rgba(74,225,166,.13);
  color: #9cecc6;
  font-size: .64rem;
  font-weight: 800;
}
.permission-strip span:last-child {
  background: rgba(255,100,120,.06);
  border-color: rgba(255,113,132,.12);
  color: #ff9aaa;
}
.javis-setup-command {
  margin-top: .8rem;
  padding: .7rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb,var(--blue2) 17.00%,transparent);
  background: color-mix(in srgb,var(--panel) 54.00%,transparent);
}
.javis-setup-command span {
  display: block;
  font-size: .55rem;
  letter-spacing: .16em;
  color: var(--accent-text);
  font-weight: 900;
  margin-bottom: .25rem;
}
.javis-setup-command code {
  display: block;
  overflow: auto;
  white-space: nowrap;
  color: var(--text);
  font-size: .7rem;
}
.javis-grant {
  display: flex !important;
  align-items: flex-start !important;
  gap: .55rem !important;
  padding: .72rem !important;
  margin: .55rem 0 !important;
  border-color: color-mix(in srgb,var(--blue2) 14.00%,transparent) !important;
  background: linear-gradient(135deg,color-mix(in srgb,var(--blue2) 9.00%,transparent),color-mix(in srgb,var(--blue) 6.00%,transparent)) !important;
}
.javis-grant small {
  display: block;
  margin-left: .2rem;
  color: var(--muted);
  font-weight: 500;
  line-height: 1.35;
}
@keyframes jv18Sweep {
  to {
    background-position: -240% 0;
  }
}
@keyframes jv18Orbit {
  to {
    transform: rotate(360deg);
  }
}
@media (max-width:1180px) {
  .javis-v18-layout {
    grid-template-columns: 1fr;
  }
  .javis-v18-terminal {
    height: 680px;
  }
  .javis-feature-grid {
    grid-template-columns: 1fr 1fr;
  }
  .javis-v18-reactor {
    display: grid;
    grid-template-columns: minmax(250px,.65fr) 1fr;
    column-gap: 1rem;
    align-items: center;
  }
  .javis-v18-reactor .reactor-shell {
    grid-row: 1/5;
  }
  .javis-v18-reactor .javis-quick-grid,.javis-v18-reactor .javis-security-note,.javis-v18-reactor .javis-local-health,.javis-v18-reactor .javis-call-state {
    grid-column: 2;
  }
}
@media (max-width:760px) {
  .javis-v18 {
    padding: 0;
  }
  .javis-v18-head {
    display: block;
  }
  .javis-head-status {
    justify-content: flex-start;
    margin-top: .8rem;
  }
  .javis-modebar {
    display: block;
  }
  .javis-mode-pills {
    justify-content: flex-start;
    margin-top: .6rem;
  }
  .javis-v18-reactor {
    display: flex;
    flex-direction: column;
  }
  .javis-v18-reactor .reactor-shell,.javis-v18-reactor .javis-quick-grid,.javis-v18-reactor .javis-security-note,.javis-v18-reactor .javis-local-health,.javis-v18-reactor .javis-call-state {
    grid-column: auto;
    grid-row: auto;
  }
  .javis-feature-grid {
    grid-template-columns: 1fr;
  }
  .javis-v18-prompts {
    grid-template-columns: 1fr 1fr;
  }
  .javis-v18-terminal {
    height: 68vh;
    min-height: 570px;
  }
  .javis-chat-context small {
    display: none;
  }
}
@media (max-width:480px) {
  .javis-v18-prompts {
    grid-template-columns: 1fr;
  }
  .javis-mode-pills button {
    flex: 1 1 43%;
    text-align: center;
  }
  .javis-head-status {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .javis-access-badge {
    min-width: 0;
  }
  .javis-v18-terminal {
    height: 72vh;
  }
  .javis-feature-card {
    min-height: auto;
  }
  .javis-orbit-field {
    display: none;
  }
}
body.reduce-motion .javis-v18:after,body.reduce-motion .javis-orbit-field i {
  animation: none !important;
}
/* v18 global polish */
body:not(.reduce-motion) .page-enter {
  animation: v18PageIn .42s cubic-bezier(.2,.8,.2,1) both;
}
.premium-topbar {
  background: linear-gradient(180deg,color-mix(in srgb,var(--bg) 88%,transparent),color-mix(in srgb,var(--bg) 74%,transparent));
  border-bottom-color: color-mix(in srgb,var(--blue) 18%,transparent);
}
.top-icon-link,.top-profile,.nav-toggle {
  transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.top-icon-link:hover,.top-profile:hover,.nav-toggle:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb,var(--blue2) 50%,transparent);
  box-shadow: 0 10px 30px color-mix(in srgb,var(--blue) 10%,transparent);
}
.panel.glass,.account-card.glass,.production-team-card,.production-bot-card {
  position: relative;
  overflow: hidden;
}
.panel.glass:before,.account-card.glass:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(120deg,transparent 0 34%,rgba(255,255,255,.015) 45%,transparent 58%);
  background-size: 220% 100%;
  background-position: 100% 0;
  transition: background-position .7s ease;
}
.panel.glass:hover:before,.account-card.glass:hover:before {
  background-position: -100% 0;
}
.primary,.secondary,.button {
  transition: transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.primary:hover,.button.primary:hover {
  transform: translateY(-2px);
  filter: saturate(1.08);
  box-shadow: 0 14px 36px color-mix(in srgb,var(--blue) 34%,transparent);
}
.secondary:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb,var(--blue2) 35%,transparent);
}
.login-shell.v15-login {
  box-shadow: 0 50px 150px rgba(0,0,0,.62),0 0 0 1px color-mix(in srgb,var(--blue) 12%,transparent);
}
.login-shell.v15-login .login-card {
  backdrop-filter: blur(24px);
}
@keyframes v18PageIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.997);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
body.reduce-motion .page-enter {
  animation: none !important;
}
/* v18.2 JAVIS cloud-chat-only */
.reactor-core.static-core {
  cursor: default;
  user-select: none;
  pointer-events: none;
}
.javis-compose-textonly {
  grid-template-columns: minmax(0,1fr) auto !important;
}
.cloud-provider-stack {
  display: grid;
  gap: 10px;
  width: 100%;
  margin: 8px 0 14px;
}
.javis-cloud-core .reactor-wave {
  opacity: .72;
}
@media (max-width:720px) {
  .javis-compose-textonly {
    grid-template-columns: minmax(0,1fr) auto !important;
  }
}

/* v18.3 — Shared finishing rules. Components inherit the configured palette. */
html { scroll-padding-top: 96px; }
body { font-size: 1rem; }
body, input, select, textarea, button { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
button { line-height: 1.35; }
button, .button, .iconbtn, .top-icon-link { touch-action: manipulation; }
button:disabled, input:disabled, select:disabled { opacity: .5; cursor: not-allowed; transform: none !important; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 3px;
}
:where(input, select, textarea):focus { border-color: var(--blue); box-shadow: var(--focus-ring); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: .8; }
:where(input[type=checkbox], input[type=radio], input[type=range]) { accent-color: var(--blue); }
input[type=checkbox], input[type=radio] { width: 18px; height: 18px; flex: 0 0 auto; }
:where(.stack, .panel) label { color: var(--text); }
:where(.page, .panel, .glass, .row > *, .editor-grid > *, .two-col > *) { min-width: 0; }
h1, h2, h3, p, .richtext, .chat-message, .javis-message { overflow-wrap: anywhere; }
pre, .code { overflow: auto; }
.primary, .tabs button.active, .login-submit {
  background: linear-gradient(125deg, var(--blue), var(--blue2));
  color: var(--accent-ink);
  border-color: transparent;
  box-shadow: 0 6px 20px color-mix(in srgb, var(--blue) 15%, transparent);
}
.primary:hover, .login-submit:hover { filter: brightness(1.06); }
.secondary, .iconbtn, .top-icon-link { background: var(--panel2); border-color: var(--line); color: var(--text); }
.secondary:hover, .iconbtn:hover { border-color: var(--blue); }
.glass { border-color: var(--line); box-shadow: var(--shadow); }
.topbar { background: color-mix(in srgb, var(--bg) 92%, transparent); border-color: var(--line); }
.brand-mark { color: var(--accent-ink); box-shadow: none; }
.page { padding-top: 30px; }
.page-head h1 { font-size: clamp(1.8rem, 4vw, 2.65rem); line-height: 1.15; }
.eyebrow { color: var(--accent-text); }
.pill, .tag { background: var(--panel2); border-color: var(--line); color: var(--muted); }
.tabs { gap: 6px; padding: 4px 2px 8px; scrollbar-width: thin; }
.tabs button { min-height: 42px; }
.table-wrap { border: 1px solid var(--line); border-radius: 12px; scrollbar-width: thin; }
th { color: var(--muted); font-size: .76rem; font-weight: 700; background: var(--panel2); }
th, td { border-color: var(--line); }
tbody tr:hover { background: color-mix(in srgb, var(--blue) 4%, transparent); }
.alert { line-height: 1.6; overflow-wrap: anywhere; }
.alert.info { color: var(--text); border-color: color-mix(in srgb, var(--blue) 35%, var(--line)); background: color-mix(in srgb, var(--blue) 9%, var(--panel)); }
.alert.success, .status.online { color: var(--success); border-color: color-mix(in srgb, var(--success) 40%, var(--line)); background: color-mix(in srgb, var(--success) 9%, var(--panel)); }
.alert.error, .status.offline { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, var(--line)); background: color-mix(in srgb, var(--danger) 9%, var(--panel)); }
.danger { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--panel)); border-color: color-mix(in srgb, var(--danger) 36%, var(--line)); }
.danger:hover { background: color-mix(in srgb, var(--danger) 18%, var(--panel)); }
.savebar { background: color-mix(in srgb, var(--panel) 96%, transparent); border-color: var(--line); }
.app-drawer { background: var(--panel); width: min(330px, calc(100vw - 28px)); }
.drawer-section > a.active { color: var(--accent-text); background: color-mix(in srgb, var(--blue) 10%, var(--panel)); border-color: color-mix(in srgb, var(--blue) 35%, var(--line)); }
.nav-open { overflow: hidden; }
.nav-scrim { backdrop-filter: blur(3px); }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 15000; padding: 10px 16px; border-radius: 10px; background: var(--blue); color: var(--accent-ink); }
.skip-link:focus { top: 14px; }
.command-dialog { max-height: min(650px, 85dvh); overflow: auto; }
.command-results:empty::after { content: 'Keine passenden Seiten gefunden.'; display: block; padding: 20px; color: var(--muted); }
.command-item { border-radius: 10px; }
.ui-toast { max-width: min(420px, calc(100vw - 32px)); color: var(--text); background: var(--panel2); border-color: var(--line); }
.login-shell { background: var(--bg); }
.login-showcase { background: transparent; }
.login-copy h1 { font-size: clamp(2.1rem, 4.8vw, 3.9rem); line-height: 1.1; letter-spacing: -.045em; }
.login-copy p { font-size: 1rem; line-height: 1.75; color: var(--muted); }
.login-service-grid b { font-size: .78rem; }
.login-service-grid small { font-size: .66rem; line-height: 1.5; color: var(--muted); }
.login-service-grid > div { background: var(--panel); border-color: var(--line); }
.premium-login-card, .v15-auth-card { background: var(--panel); border-color: var(--line); }
.input-icon { background: var(--bg); border-color: var(--line); }
.input-icon:focus-within { border-color: var(--blue); box-shadow: var(--focus-ring); }
.input-icon input { color: var(--text); background: transparent; }
.input-icon input:focus { box-shadow: none; }
.login-logo.fallback, .login-orb { background: color-mix(in srgb, var(--blue) 15%, var(--panel)); color: var(--accent-text); }
.auth-trust-row span { font-size: .62rem; color: var(--muted); border-color: var(--line); }
.login-foot { font-size: .72rem; line-height: 1.7; }
.account-card, .account-shell, .account-body, .access-builder, .builder-item { border-color: var(--line); }
.account-card summary:hover { background: color-mix(in srgb, var(--blue) 4%, transparent); }
.account-meta, .account-summary-right { flex-wrap: wrap; }
.music-console { grid-template-columns: minmax(180px, .6fr) minmax(0, 1.4fr); }
.vinyl { background: repeating-radial-gradient(circle at center, #131316 0 3px, #232327 4px 5px); border: 1px solid var(--line); }
.vinyl:before { background: linear-gradient(135deg, var(--blue), var(--blue2)); box-shadow: 0 0 30px color-mix(in srgb, var(--blue) 20%, transparent); }
.vinyl span { color: var(--accent-ink); }
.music-now h2 { font-size: clamp(1.35rem, 3vw, 2.2rem); }
.player-controls { flex-wrap: wrap; }
.player-controls button { min-height: 42px; min-width: 44px; }
.javis-v18-head h1 { font-size: clamp(2.4rem, 6vw, 4.6rem); }
.javis-v18-layout { grid-template-columns: minmax(240px, .75fr) minmax(0, 1.6fr); }
.javis-mode-pills button { font-size: .76rem; min-height: 38px; }
.javis-mode-pills button.active { color: var(--accent-ink); background: var(--blue); border-color: var(--blue); }
.javis-message p { font-size: .92rem; line-height: 1.75; color: var(--text); }
.javis-messages { scrollbar-width: thin; scroll-behavior: auto; }
.javis-input, .javis-chat-shell { min-width: 0; }
.javis-compose textarea { font-size: 1rem; }
.javis-compose textarea[readonly] { opacity: .75; }
body[data-visual-fx=false] :is(.fx-field, .mouse-glow, .scanline-layer, .noise-layer, .login-orbit-field, .auth-scan, .javis-orbit-field) { display: none; }

/* One palette change also updates the login, admin, music and JAVIS surfaces. */
html[data-theme=light] {
  color-scheme: light;
  --bg: #f5f4f1;
  --panel: #ffffff;
  --panel2: #efeeea;
  --line: #d8d6d0;
  --text: #25262d;
  --muted: #626571;
  --success: #08796a;
  --danger: #bc2446;
  --accent-text: color-mix(in srgb, var(--blue) 45%, #352819);
  --shadow: 0 12px 36px #2424240a;
}
html[data-theme=light] body { background: var(--bg); color: var(--text); }
html[data-theme=light] :is(.login-shell::before, .login-shell::after) { opacity: .1; }
html[data-theme=light] :is(.top-profile, .chat-message p, .javis-message p, .drawer-section > a, .drawer-section > button) { color: var(--text); }
html[data-theme=light] :is(.noise-layer, .scanline-layer, .mouse-glow) { opacity: .15; }
html[data-theme=light] :is(.login-security, .login-copy p, .login-features) { color: var(--muted); }
html[data-theme=light] :is(.login-showcase, .premium-login-card, .chat-main, .chat-sidebar, .javis-v18-reactor, .javis-chat, .profile-editor-preview) { background: var(--panel); }

@media (max-width: 950px) {
  .javis-v18-layout { grid-template-columns: minmax(0, 1fr); }
  .javis-v18-reactor { max-height: 480px; }
  .music-console { grid-template-columns: minmax(0, 1fr); }
  .vinyl-wrap { padding: 12px; }
  .vinyl { width: 170px; height: 170px; }
}
@media (max-width: 620px) {
  .page { padding: 20px 14px 90px; }
  .topbar { height: 66px; padding: 0 14px; gap: 8px; }
  .topbar-left { min-width: 0; }
  .topbar-actions { gap: 6px; }
  .top-profile > span:last-child { display: none; }
  .top-icon-link { min-width: 36px; height: 36px; }
  .panel, .bot-body { padding: 16px; }
  .row, .hero-actions, .account-card summary { flex-wrap: wrap; }
  .row > input, .row > select { min-width: 0; flex: 1 1 160px; }
  .login-shell.v15-login { display: flex; flex-direction: column; gap: 22px; padding: 20px 0; }
  .v15-login-showcase { padding: 0; }
  .login-copy h1 { font-size: 2rem; }
  .login-features, .login-security, .login-orbit-field { display: none; }
  .login-service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .login-service-grid > div { grid-template-columns: 1fr; gap: 7px; padding: 9px; }
  .login-service-grid .service-glyph { width: 30px; height: 30px; }
  .login-shell.v15-login .login-card { width: 100%; padding: 22px 18px; }
  .login-foot { display: block; }
  .login-foot span { display: block; }
  .savebar { bottom: max(8px, env(safe-area-inset-bottom)); gap: 10px; }
  .savebar > span { font-size: .76rem; }
  .is-standalone .savebar { bottom: calc(88px + env(safe-area-inset-bottom)); }
  .is-standalone .page { padding-bottom: calc(110px + env(safe-area-inset-bottom)); }
  .pwa-app-dock a { min-width: 0; flex: 1; }
  .pwa-app-dock { overflow-x: auto; }
  .javis-v18 { padding: 0; border-radius: 16px; }
  .javis-modebar { align-items: flex-start; flex-direction: column; }
  .javis-mode-pills { justify-content: flex-start; }
  .javis-message { gap: 9px; }
  .javis-mode-pills button { font-size: .72rem; }
  .music-play-form, .radio-search-box { display: grid; grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  :is(.mouse-glow, .cursor-spark, .fx-field, .auth-scan, .javis-orbit-field) { display: none !important; }
}


/* v18.5 login hardening + immersive transition */
.login-shell-minimal{min-height:100dvh;display:grid;place-items:center;padding:24px;position:relative;overflow:hidden}
.v18-login .premium-login-card{width:min(100%,540px);position:relative;z-index:2;padding:30px 28px 24px}
.v18-auth-card{backdrop-filter:blur(24px);box-shadow:0 24px 80px rgba(0,0,0,.42)}
.login-card-head.compact{display:flex;align-items:center;gap:14px}
.v18-login .hero-copy{margin:6px 0 14px;font-size:.98rem;line-height:1.7}
.login-save-hint{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;margin-top:14px;padding:14px 15px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.015))}
.login-save-hint span{font-size:1.1rem;line-height:1.2}
.login-save-hint p{margin:0;color:var(--muted);font-size:.8rem;line-height:1.6}
.login-transition{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 20%,rgba(47,108,255,.22),transparent 34%),linear-gradient(180deg,#030712,#02040d 55%,#030712);opacity:0;pointer-events:none;transition:opacity .35s ease}
.login-transition.active{opacity:1;pointer-events:auto}
.login-transition-video{position:absolute;inset:-12%;overflow:hidden;filter:blur(10px) saturate(1.1)}
.login-transition-video:before,.login-transition-video:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.02) 0 2px,transparent 2px 60px),linear-gradient(135deg,rgba(47,108,255,.16),rgba(125,92,255,.12),rgba(10,18,36,0) 60%);mix-blend-mode:screen;animation:loginSweep 10s linear infinite}
.login-transition-video:after{background:radial-gradient(circle at 20% 30%,rgba(47,108,255,.34),transparent 18%),radial-gradient(circle at 75% 55%,rgba(120,255,214,.18),transparent 16%),radial-gradient(circle at 55% 80%,rgba(140,92,255,.24),transparent 20%);animation:loginFloat 8s ease-in-out infinite alternate}
.login-transition-video i{position:absolute;display:block;border-radius:999px;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 1px rgba(47,108,255,.05) inset,0 0 30px rgba(47,108,255,.08)}
.login-transition-video i:nth-child(1){width:38vmin;height:38vmin;left:12%;top:20%;animation:spinSlow 16s linear infinite}
.login-transition-video i:nth-child(2){width:52vmin;height:52vmin;right:8%;top:10%;animation:spinSlow 20s linear infinite reverse}
.login-transition-video i:nth-child(3){width:34vmin;height:34vmin;left:42%;bottom:8%;animation:spinSlow 18s linear infinite}
.login-transition-card{position:relative;z-index:2;width:min(100%,580px);padding:28px;border-radius:28px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(8,15,30,.82),rgba(8,15,30,.68));backdrop-filter:blur(18px);box-shadow:0 30px 90px rgba(0,0,0,.45)}
.login-transition-card h3{margin:8px 0 8px;font-size:clamp(1.6rem,4vw,2.4rem)}
.login-transition-card p{margin:0 0 18px;color:var(--muted);line-height:1.75}
.login-progress{height:12px;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);overflow:hidden;position:relative}
.login-progress span{display:block;height:100%;width:0%;border-radius:inherit;background:linear-gradient(90deg,#2f6cff,#7c5cff,#78ffd6);box-shadow:0 0 35px rgba(47,108,255,.45);animation:loginProgress 1.7s ease forwards}
.login-stage-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}
.login-stage-list span{padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.03);font-size:.78rem;color:var(--muted);text-align:center;letter-spacing:.08em;text-transform:uppercase;animation:stagePulse 1.5s ease infinite}
.login-stage-list span:nth-child(2){animation-delay:.2s}.login-stage-list span:nth-child(3){animation-delay:.4s}
body.login-busy{overflow:hidden}
body.login-busy .login-card{transform:scale(.985);opacity:.78;filter:blur(2px)}
@keyframes loginProgress{0%{width:0%}20%{width:22%}55%{width:67%}100%{width:100%}}
@keyframes stagePulse{0%,100%{transform:translateY(0);opacity:.82}50%{transform:translateY(-2px);opacity:1}}
@keyframes loginSweep{from{transform:translateX(-3%)}to{transform:translateX(3%)}}
@keyframes loginFloat{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(2%,-2%,0) scale(1.08)}}
@keyframes spinSlow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media (max-width: 720px){.v18-login .premium-login-card{padding:22px 18px}.login-transition-card{padding:22px 18px}.login-stage-list{grid-template-columns:1fr}}

/* v18.6 — final production login */
.v18-6-login{isolation:isolate;background:
 radial-gradient(circle at 50% 0%,color-mix(in srgb,var(--blue) 18%,transparent),transparent 36%),
 radial-gradient(circle at 12% 82%,color-mix(in srgb,var(--blue2) 12%,transparent),transparent 34%),
 linear-gradient(180deg,color-mix(in srgb,var(--bg) 96%,#000),var(--bg));}
.v18-6-login::before{content:"";position:absolute;inset:-15%;z-index:0;background:
 linear-gradient(118deg,transparent 0 44%,color-mix(in srgb,var(--blue) 7%,transparent) 49%,transparent 54%),
 repeating-linear-gradient(90deg,transparent 0 84px,rgba(255,255,255,.018) 85px 86px);transform:perspective(900px) rotateX(66deg) translateY(30%);transform-origin:center bottom;opacity:.72;pointer-events:none;animation:v186GridDrift 13s linear infinite;}
.v18-6-auth-card{border:1px solid color-mix(in srgb,var(--blue) 26%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 94%,transparent),color-mix(in srgb,var(--panel) 86%,transparent));box-shadow:0 38px 120px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.025) inset,0 0 80px color-mix(in srgb,var(--blue) 7%,transparent);overflow:hidden;transition:transform .3s ease,opacity .3s ease,filter .3s ease}
.v18-6-auth-card::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--blue),var(--blue2),transparent);opacity:.7}
.v18-6-auth-card::after{content:"";position:absolute;width:180px;height:180px;right:-90px;top:-90px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--blue) 15%,transparent),transparent 68%);pointer-events:none}
.login-cinematic-bars{position:absolute;inset:0;z-index:4;pointer-events:none}
.login-cinematic-bars span{position:absolute;left:0;right:0;height:clamp(8px,1.4vh,18px);background:#000;opacity:.72}
.login-cinematic-bars span:first-child{top:0}.login-cinematic-bars span:last-child{bottom:0}
.login-energy-field{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.login-energy-field i{position:absolute;width:2px;height:24vh;background:linear-gradient(transparent,color-mix(in srgb,var(--blue) 45%,transparent),transparent);opacity:.3;animation:v186Energy 6s linear infinite}
.login-energy-field i:nth-child(1){left:8%;top:14%;animation-delay:-1s}.login-energy-field i:nth-child(2){left:24%;top:62%;animation-delay:-4s}.login-energy-field i:nth-child(3){right:18%;top:20%;animation-delay:-2.2s}.login-energy-field i:nth-child(4){right:8%;top:68%;animation-delay:-5s}.login-energy-field i:nth-child(5){left:62%;top:40%;animation-delay:-3.1s}
.login-alert-slot{min-height:0}.login-inline-error{margin:0 0 12px}
.password-field{position:relative}.password-field input{padding-right:48px}.password-peek{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:var(--muted);cursor:pointer}.password-peek:hover{background:var(--panel2);color:var(--text)}
.login-remember{display:flex!important;align-items:center;gap:10px;margin-top:-2px;color:var(--muted)!important;font-size:.82rem;cursor:pointer}.login-remember input{margin:0}
.login-security-line{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:14px;color:var(--muted);font-size:.72rem;letter-spacing:.02em}.login-security-line span{display:flex;align-items:center;gap:7px}.login-security-line i{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 12px color-mix(in srgb,var(--success) 70%,transparent)}
.login-boot-lines{position:absolute;inset:0;overflow:hidden;pointer-events:none}.login-boot-lines span{position:absolute;left:-20%;width:140%;height:1px;background:linear-gradient(90deg,transparent,rgba(126,170,255,.32),transparent);animation:v186BootLine 2.8s linear infinite}.login-boot-lines span:nth-child(1){top:18%;animation-delay:-.3s}.login-boot-lines span:nth-child(2){top:34%;animation-delay:-1.1s}.login-boot-lines span:nth-child(3){top:52%;animation-delay:-1.8s}.login-boot-lines span:nth-child(4){top:70%;animation-delay:-2.3s}.login-boot-lines span:nth-child(5){top:86%;animation-delay:-.8s}
.login-reactor{width:112px;height:112px;margin:0 auto 18px;display:grid;place-items:center;position:relative;border-radius:50%;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 70px rgba(47,108,255,.16),inset 0 0 35px rgba(47,108,255,.08)}
.login-reactor::before,.login-reactor::after,.login-reactor i,.login-reactor span{content:"";position:absolute;border-radius:50%;border:1px solid rgba(104,151,255,.28)}
.login-reactor::before{inset:8px;border-style:dashed;animation:spinSlow 5s linear infinite}.login-reactor::after{inset:19px;animation:spinSlow 3.4s linear infinite reverse}.login-reactor i{inset:30px;border-color:rgba(120,255,214,.34);box-shadow:0 0 28px rgba(120,255,214,.09)}.login-reactor span{inset:41px;background:radial-gradient(circle,#fff 0 8%,#72a0ff 10% 24%,rgba(76,118,255,.18) 28% 54%,transparent 56%);border:0;box-shadow:0 0 26px rgba(47,108,255,.5);animation:v186CorePulse 1.4s ease-in-out infinite}.login-reactor b{position:relative;z-index:2;font-size:1.2rem;color:#fff;text-shadow:0 0 18px #6e9aff}
.login-transition-card{overflow:hidden}.login-transition-card::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.035) 45%,transparent 70%);transform:translateX(-120%);animation:v186CardSweep 1.8s ease-in-out infinite;pointer-events:none}
.login-transition-status{display:block;margin-top:15px;color:rgba(220,230,255,.7);text-align:center;letter-spacing:.06em}
@keyframes v186GridDrift{0%{background-position:0 0,0 0}100%{background-position:140px 0,86px 0}}
@keyframes v186Energy{0%{transform:translateY(-35vh);opacity:0}20%{opacity:.28}80%{opacity:.18}100%{transform:translateY(110vh);opacity:0}}
@keyframes v186BootLine{from{transform:translateX(-16%);opacity:0}20%{opacity:.7}80%{opacity:.24}to{transform:translateX(16%);opacity:0}}
@keyframes v186CorePulse{0%,100%{transform:scale(.92);filter:brightness(.9)}50%{transform:scale(1.08);filter:brightness(1.35)}}
@keyframes v186CardSweep{0%,15%{transform:translateX(-120%)}65%,100%{transform:translateX(120%)}}
@media (max-width:620px){.login-shell-minimal{padding:18px 14px}.v18-6-auth-card{border-radius:22px}.login-security-line{display:grid;grid-template-columns:1fr}.login-cinematic-bars span{height:7px}.login-reactor{width:90px;height:90px}.login-stage-list{gap:7px}.login-stage-list span{padding:9px 8px;font-size:.65rem}}
@media (prefers-reduced-motion:reduce){.login-energy-field,.login-boot-lines,.login-cinematic-bars{display:none}.login-transition-video,.login-reactor::before,.login-reactor::after,.login-reactor span{animation:none!important}}


/* v18.8 persistent-login logout control */
.drawer-logout-form{margin:14px 14px 4px}
.drawer-logout{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 14px;border-radius:14px;border:1px solid color-mix(in srgb,var(--danger) 38%,var(--line));background:color-mix(in srgb,var(--danger) 10%,transparent);color:#fff;font:inherit;font-weight:800;cursor:pointer;transition:transform .18s ease,background .18s ease,border-color .18s ease}
.drawer-logout:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--danger) 18%,transparent);border-color:color-mix(in srgb,var(--danger) 58%,var(--line))}


/* v18.9 — cinematic Control Center navigation */
@supports (view-transition-name: root){
  ::view-transition-old(root){animation:v189OldPage .22s ease both}
  ::view-transition-new(root){animation:v189NewPage .34s cubic-bezier(.2,.8,.2,1) both}
}
main#main-content,.page-shell,.content-wrap{animation:v189PageEnter .42s cubic-bezier(.2,.8,.2,1) both}
body.page-leaving main#main-content,body.page-leaving .page-shell,body.page-leaving .content-wrap{animation:v189PageLeave .28s ease both;pointer-events:none}
.page-transition{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .18s ease;overflow:hidden}
.page-transition.active{opacity:1}
.page-transition-backdrop{position:absolute;inset:-8%;background:radial-gradient(circle at 50% 48%,color-mix(in srgb,var(--blue) 27%,transparent),transparent 24%),radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--blue2) 12%,transparent),transparent 42%),rgba(2,5,13,.86);backdrop-filter:blur(14px);transform:scale(1.08);animation:v189Backdrop .46s ease both}
.page-transition-rings{position:absolute;width:min(82vw,520px);aspect-ratio:1;display:grid;place-items:center}
.page-transition-rings i{position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--blue) 35%,rgba(255,255,255,.12));box-shadow:0 0 34px color-mix(in srgb,var(--blue) 12%,transparent),inset 0 0 25px color-mix(in srgb,var(--blue2) 8%,transparent)}
.page-transition-rings i:nth-child(1){inset:4%;border-style:dashed;animation:v189Spin 7s linear infinite}
.page-transition-rings i:nth-child(2){inset:18%;animation:v189Spin 4.8s linear infinite reverse}
.page-transition-rings i:nth-child(3){inset:32%;border-color:color-mix(in srgb,var(--success) 26%,rgba(255,255,255,.09));animation:v189Pulse 1.2s ease-in-out infinite}
.page-transition-core{position:relative;z-index:2;min-width:210px;display:grid;justify-items:center;gap:7px;padding:24px 28px;border-radius:28px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(9,16,31,.84),rgba(5,10,22,.76));box-shadow:0 28px 90px rgba(0,0,0,.48),0 0 70px color-mix(in srgb,var(--blue) 11%,transparent);backdrop-filter:blur(18px);transform:translateY(12px) scale(.96);animation:v189Core .38s cubic-bezier(.2,.8,.2,1) both}
.page-transition-core .brand-mark{width:52px;height:52px;display:grid;place-items:center;border-radius:17px;margin-bottom:4px}
.page-transition-core small{color:var(--muted);font-size:.68rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.page-transition-core strong{font-size:1.08rem;letter-spacing:.02em;color:#fff}
.page-transition-core b{display:block;width:132px;height:3px;border-radius:999px;margin-top:8px;overflow:hidden;background:rgba(255,255,255,.08);position:relative}
.page-transition-core b::after{content:"";position:absolute;inset:0 auto 0 0;width:46%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--blue2));box-shadow:0 0 18px color-mix(in srgb,var(--blue) 35%,transparent);animation:v189Load .72s ease-in-out infinite}
.topbar,.app-drawer,.pwa-app-dock{transition:opacity .2s ease,transform .26s cubic-bezier(.2,.8,.2,1),filter .2s ease}
body.page-leaving .topbar{opacity:.68;transform:translateY(-6px);filter:blur(1px)}
body.page-leaving .pwa-app-dock{opacity:.62;transform:translateY(9px)}
.panel,.bot-card,.member-card,.team-entry,.content-card,.task-card,.resource-card{transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,opacity .22s ease}
@media (hover:hover){.panel:hover,.bot-card:hover,.member-card:hover,.team-entry:hover,.content-card:hover,.task-card:hover,.resource-card:hover{transform:translateY(-2px);box-shadow:0 18px 50px rgba(0,0,0,.18)}}
@keyframes v189PageEnter{from{opacity:0;transform:translateY(10px) scale(.994);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@keyframes v189PageLeave{from{opacity:1;transform:none;filter:none}to{opacity:.25;transform:translateY(-7px) scale(.995);filter:blur(4px)}}
@keyframes v189Backdrop{from{opacity:0;transform:scale(1.18)}to{opacity:1;transform:scale(1.08)}}
@keyframes v189Core{from{opacity:0;transform:translateY(18px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes v189Spin{to{transform:rotate(360deg)}}
@keyframes v189Pulse{0%,100%{transform:scale(.96);opacity:.55}50%{transform:scale(1.04);opacity:1}}
@keyframes v189Load{0%{left:-48%}50%{left:48%;width:62%}100%{left:102%;width:36%}}
@keyframes v189OldPage{to{opacity:0;transform:scale(.99);filter:blur(3px)}}
@keyframes v189NewPage{from{opacity:0;transform:translateY(8px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
@media (max-width:640px){.page-transition-rings{width:92vw}.page-transition-core{min-width:188px;padding:20px 22px;border-radius:24px}.page-transition-core .brand-mark{width:46px;height:46px}}
@media (prefers-reduced-motion:reduce){main#main-content,.page-shell,.content-wrap,.page-transition-backdrop,.page-transition-core,.page-transition-rings i,.page-transition-core b::after{animation:none!important}.page-transition{transition:none!important}}

/* v19 Minecraft Operations Studio */
.minecraft-studio-head{margin-bottom:18px;align-items:flex-start}
.minecraft-studio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.minecraft-studio-grid>.span2{grid-column:1/-1}
.minecraft-ops-card{padding:22px;position:relative;overflow:hidden}
.minecraft-ops-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--team-accent,#22c55e) 12%,transparent),transparent 36%);opacity:.7}
.minecraft-ops-card>*{position:relative;z-index:1}
.minecraft-ops-card h3{margin:5px 0 10px}
.compact-permissions{grid-template-columns:repeat(2,minmax(0,1fr));margin:10px 0 14px}
.role-order-builder{margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--panel) 86%,transparent)}
.role-order-builder>.row:first-child{margin-bottom:10px}
.role-order-list{display:grid;gap:8px;margin-top:10px}
.role-order-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:14px;background:var(--panel-2,var(--panel));transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.role-order-row:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--blue) 35%,var(--line));box-shadow:0 10px 28px rgba(0,0,0,.12)}
.role-order-index{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:color-mix(in srgb,var(--blue) 14%,var(--panel));font-weight:800}
.role-order-row div:nth-child(2){min-width:0;display:grid;gap:2px}
.role-order-row div:nth-child(2) b,.role-order-row div:nth-child(2) small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.role-order-row div:nth-child(2) small{color:var(--muted);font-size:.68rem}
.small-empty{padding:12px!important}
.announcement-studio{background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 94%,#5865f2 6%),var(--panel))}
.legacy-repair-card .command-grid{margin:14px 0}
.live-roster-panel{margin-bottom:20px;padding:20px}
.live-roster-groups{display:grid;gap:14px;margin-top:16px}
.live-role-group{padding:14px;border-left:3px solid var(--live-role,#94a3b8);box-shadow:none}
.live-role-head>div{display:grid;gap:2px}
.live-role-head small{color:var(--muted)}
.live-member-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:9px;margin-top:11px}
.live-discord-member{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;padding:9px 11px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 90%,transparent)}
.live-discord-member>div{min-width:0;display:grid;gap:2px}
.live-discord-member b,.live-discord-member small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.live-discord-member small{color:var(--muted);font-size:.68rem}
.section-subhead{display:flex;justify-content:space-between;gap:16px;align-items:flex-end;margin:24px 0 12px}
.section-subhead h3{margin:4px 0}

/* v19 editor polish: clearer settings hierarchy for ticket/application/panel workflows */
.type-editor{display:grid;gap:16px}
.type-card{border-radius:20px;box-shadow:0 12px 34px rgba(0,0,0,.12);overflow:hidden}
.type-card-head{position:sticky;top:0;z-index:2;backdrop-filter:blur(14px);background:color-mix(in srgb,var(--panel) 92%,transparent)}
.type-card .questions{margin-top:14px;padding:14px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 90%,transparent)}
.builder-item{border-radius:14px}
.panel-builder-list{display:grid;gap:20px}
.raw-editor{margin-top:16px}

@media(max-width:900px){
  .minecraft-studio-grid{grid-template-columns:1fr}
  .minecraft-studio-grid>.span2{grid-column:auto}
  .compact-permissions{grid-template-columns:1fr}
  .section-subhead{align-items:flex-start;flex-direction:column}
}
@media(max-width:620px){
  .minecraft-ops-card{padding:17px}
  .live-member-grid{grid-template-columns:1fr}
  .role-order-row{grid-template-columns:30px minmax(0,1fr)}
  .role-order-row>.row{grid-column:1/-1;justify-content:flex-end}
}

/* v20.2 panel categories */
.panel-category-lane{display:grid;gap:12px;padding:14px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--panel) 72%,transparent)}
.panel-category-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 4px}
.panel-category-head>div{display:flex;align-items:center;gap:10px;min-width:0}
.panel-category-head>div>div{display:grid;gap:1px}
.panel-category-head b{font-size:1rem}
.panel-category-head small{color:var(--muted)}
.panel-category-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:color-mix(in srgb,var(--blue) 14%,var(--panel));font-size:1.1rem}
.panel-category-cards{display:grid;gap:18px}
.panel-category-cards>.small-empty{margin:0;padding:18px;border-radius:16px}
@media(max-width:620px){.panel-category-head{align-items:flex-start}.panel-category-head>.pill{display:none}}

/* v20.3 Production UI refresh -------------------------------------------------
   A calmer operations layout: clearer focus, stronger hierarchy and responsive
   cards without changing the user's stored theme/accent settings. */
:root{--ops-glow:color-mix(in srgb,var(--blue) 18%,transparent);--ops-soft:color-mix(in srgb,var(--panel) 88%,var(--blue) 12%)}
.page-head.premium-head{position:relative;overflow:hidden;padding:26px 28px;margin-bottom:22px;border:1px solid color-mix(in srgb,var(--line) 76%,var(--blue) 24%);border-radius:26px;background:linear-gradient(135deg,color-mix(in srgb,var(--panel) 92%,transparent),color-mix(in srgb,var(--panel) 84%,var(--blue) 16%));box-shadow:0 24px 70px rgba(0,0,0,.22)}
.page-head.premium-head:after{content:"";position:absolute;right:-8%;top:-70%;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--blue) 19%,transparent),transparent 68%);pointer-events:none}
.page-head.premium-head>div,.page-head.premium-head>.server-id{position:relative;z-index:1}
.page-head.premium-head h1{font-size:clamp(30px,4.2vw,50px);margin-bottom:8px}.page-head.premium-head p{margin-bottom:0}
.server-id{padding:11px 14px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--bg) 60%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.settings-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:8px;border-radius:19px;border-color:color-mix(in srgb,var(--line) 72%,var(--blue) 28%);background:color-mix(in srgb,var(--bg) 82%,transparent);box-shadow:0 18px 52px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.03)}
.settings-tabs::-webkit-scrollbar{display:none}.settings-tabs button{flex:0 0 auto;border-radius:13px;padding:10px 14px;transition:background .18s ease,color .18s ease,transform .18s ease,border-color .18s ease}.settings-tabs button:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--panel) 78%,var(--blue) 22%)}.settings-tabs button.active{background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 20%,var(--panel)),color-mix(in srgb,var(--blue2) 11%,var(--panel)));border-color:color-mix(in srgb,var(--blue) 36%,var(--line));color:var(--text)}
.tab-panel.active{animation:v203PanelIn .28s cubic-bezier(.2,.8,.2,1) both}.section-head{margin-top:10px}.section-head h2,.section-subhead h3{letter-spacing:-.025em}
.settings-form input:not([type=checkbox]):not([type=radio]):not([type=range]),.settings-form textarea,.settings-form select,.music-governance-card input:not([type=checkbox]):not([type=radio]):not([type=range]),.music-governance-card textarea,.music-governance-card select{border-color:color-mix(in srgb,var(--line) 88%,transparent);background:color-mix(in srgb,var(--bg) 57%,var(--panel));transition:border-color .16s ease,box-shadow .16s ease,background .16s ease,transform .16s ease}
.settings-form input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,.settings-form textarea:focus,.settings-form select:focus,.music-governance-card input:focus,.music-governance-card textarea:focus,.music-governance-card select:focus{outline:none;border-color:color-mix(in srgb,var(--blue) 64%,var(--line));box-shadow:var(--focus-ring);background:color-mix(in srgb,var(--panel) 91%,var(--blue) 9%)}
.settings-form label>small,.music-governance-card label>small{display:block;margin-top:5px;line-height:1.4;color:var(--muted)}
.featured-check{padding:14px 16px!important;border:1px solid color-mix(in srgb,var(--blue) 22%,var(--line))!important;border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--panel) 94%,transparent),color-mix(in srgb,var(--blue) 7%,var(--panel)))}
.featured-check span{display:grid;gap:2px}.featured-check span small{color:var(--muted)}
.minecraft-ops-card,.gta-ops-card,.music-governance-card{border-color:color-mix(in srgb,var(--line) 80%,var(--blue) 20%);box-shadow:0 16px 48px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.025)}
.minecraft-ops-card:hover,.gta-ops-card:hover,.music-governance-card:hover{border-color:color-mix(in srgb,var(--blue) 34%,var(--line));box-shadow:0 22px 65px rgba(0,0,0,.18),0 0 40px var(--ops-glow)}
.role-order-builder{border-color:color-mix(in srgb,var(--line) 82%,var(--blue) 18%);background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 91%,transparent),color-mix(in srgb,var(--bg) 70%,transparent))}
.role-order-row{min-height:58px}.role-order-row.role-order-missing{border-color:color-mix(in srgb,#f59e0b 52%,var(--line));background:color-mix(in srgb,var(--panel) 88%,#f59e0b 12%)}.role-order-row.role-order-missing .role-order-index{background:color-mix(in srgb,#f59e0b 22%,var(--panel))}.role-order-tools{justify-content:space-between;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.roster-safety-alert{margin:0 0 12px;padding:12px 14px;border-radius:14px}.live-role-group{position:relative;overflow:hidden}.live-role-group:before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:var(--live-role,#94a3b8);box-shadow:0 0 20px var(--live-role,#94a3b8)}
.gta-studio-head{margin-bottom:18px;align-items:flex-start}.gta-ops-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.gta-ops-grid>.span2{grid-column:1/-1}.gta-ops-card{padding:22px;position:relative;overflow:hidden}.gta-ops-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--blue) 10%,transparent),transparent 36%);opacity:.75}.gta-ops-card>*{position:relative;z-index:1}.gta-ops-card h3{margin:5px 0 12px}
.fivem-live-preview{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:16px;padding:14px 16px;border:1px solid var(--line);border-radius:17px;background:color-mix(in srgb,var(--bg) 60%,var(--panel));transition:border-color .2s ease,background .2s ease,box-shadow .2s ease}.fivem-live-preview>div:nth-child(2){display:grid;gap:2px;min-width:0}.fivem-live-preview>div:nth-child(2) small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}.fivem-live-dot{width:12px;height:12px;border-radius:50%;background:var(--muted);box-shadow:0 0 0 5px color-mix(in srgb,var(--muted) 12%,transparent);transition:background .2s ease,box-shadow .2s ease}.fivem-live-preview.online{border-color:color-mix(in srgb,var(--success) 38%,var(--line));background:color-mix(in srgb,var(--panel) 91%,var(--success) 9%);box-shadow:0 14px 40px color-mix(in srgb,var(--success) 8%,transparent)}.fivem-live-preview.online .fivem-live-dot{background:var(--success);box-shadow:0 0 0 5px color-mix(in srgb,var(--success) 14%,transparent),0 0 18px color-mix(in srgb,var(--success) 45%,transparent)}.fivem-live-preview.offline{border-color:color-mix(in srgb,var(--danger) 28%,var(--line))}.fivem-live-preview.offline .fivem-live-dot{background:var(--danger);box-shadow:0 0 0 5px color-mix(in srgb,var(--danger) 12%,transparent)}.fivem-live-kpis{display:flex;gap:8px}.fivem-live-kpis>span{min-width:82px;display:grid;gap:1px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;text-align:center;background:color-mix(in srgb,var(--panel) 83%,transparent)}.fivem-live-kpis b{font-size:1rem}.fivem-live-kpis small{font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.command-cheatsheet{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.command-cheatsheet code,.command-grid code{padding:7px 10px;border:1px solid color-mix(in srgb,var(--line) 78%,var(--blue) 22%);border-radius:10px;background:color-mix(in srgb,var(--panel) 88%,var(--blue) 12%);font-size:.78rem}
.music-governance-card{position:relative;overflow:hidden}.music-governance-card:before{content:"";position:absolute;right:-120px;top:-140px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--blue) 14%,transparent),transparent 69%);pointer-events:none}.music-governance-card>*{position:relative;z-index:1}.music-safety-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;border:1px solid var(--line);border-radius:17px;background:color-mix(in srgb,var(--bg) 55%,var(--panel))}.music-safety-grid>.check{margin:0;min-height:54px;padding:11px 12px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--panel) 90%,transparent)}.music-safety-grid>label:last-child{grid-column:1/-1;margin:0}.music-governance-card input[type=range]{accent-color:var(--blue)}
.savebar{position:sticky;bottom:16px;z-index:7;margin-top:26px;padding:12px 14px;border-color:color-mix(in srgb,var(--blue) 26%,var(--line));background:color-mix(in srgb,var(--bg) 86%,transparent);box-shadow:0 18px 52px rgba(0,0,0,.28),0 0 36px var(--ops-glow);backdrop-filter:blur(20px)}
.alert.warning{border-color:color-mix(in srgb,#f59e0b 38%,var(--line));background:color-mix(in srgb,var(--panel) 91%,#f59e0b 9%);color:color-mix(in srgb,#fbbf24 74%,var(--text))}
@keyframes v203PanelIn{from{opacity:0;transform:translateY(8px);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}
@media(max-width:900px){.gta-ops-grid{grid-template-columns:1fr}.gta-ops-grid>.span2{grid-column:auto}.fivem-live-preview{grid-template-columns:auto minmax(0,1fr)}.fivem-live-kpis{grid-column:1/-1}.music-safety-grid{grid-template-columns:1fr}.music-safety-grid>label:last-child{grid-column:auto}}
@media(max-width:620px){.page-head.premium-head{padding:20px;border-radius:20px}.settings-tabs{border-radius:15px}.gta-ops-card{padding:17px}.fivem-live-kpis{display:grid;grid-template-columns:1fr 1fr}.fivem-live-kpis>span{min-width:0}.role-order-tools{align-items:flex-start;flex-direction:column}.savebar{bottom:8px;align-items:stretch;flex-direction:column}.savebar button{width:100%}}

/* v20.4 strict Team Portal */
.team-locked-profile{cursor:default;pointer-events:none}
.team-access-lock{display:grid;gap:4px;margin:8px 0 2px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--blue) 26%,transparent);border-radius:14px;background:color-mix(in srgb,var(--blue) 8%,transparent)}
.team-access-lock b{font-size:13px}.team-access-lock small{color:var(--muted);line-height:1.45}
@media (max-width:760px){.pwa-app-dock.team-only-dock{left:calc(50% - 95px);right:auto;width:190px;justify-content:center}.pwa-app-dock.team-only-dock a{width:100%;min-width:0}.pwa-app-dock.team-only-dock small{font-size:10px}}

/* ========================================================================== 
   v20.5 — NexoriaCraft Community UI + public Wiki
   Inspired by the supplied dark/cyan mobile references, rebuilt for NexoriaCraft.
   ========================================================================== */
:root{--nexoria-cyan:#22d3ee;--nexoria-blue:#60a5fa;--nexoria-ink:#070b12;--nexoria-surface:#0d141e;--nexoria-surface-2:#121c28}
body:not(.wiki-shell){background-image:radial-gradient(circle at 12% 2%,color-mix(in srgb,var(--blue) 11%,transparent),transparent 28%),radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--blue2) 9%,transparent),transparent 26%),linear-gradient(180deg,color-mix(in srgb,var(--bg) 98%,#000),var(--bg))}
.premium-topbar{border-bottom-color:color-mix(in srgb,var(--line) 75%,var(--blue) 25%);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(22px) saturate(1.15)}
.control-hero-v14,.fleet-card,.network-pulse-card,.production-shortcut,.experience-strip{border-color:color-mix(in srgb,var(--line) 78%,var(--blue) 22%)}
.control-hero-v14{border-radius:30px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 91%,var(--blue) 9%),color-mix(in srgb,var(--panel) 94%,#000));box-shadow:0 28px 90px rgba(0,0,0,.28)}
.production-shortcut{border-radius:18px}.production-shortcut>span{background:linear-gradient(145deg,color-mix(in srgb,var(--blue) 22%,var(--panel)),color-mix(in srgb,var(--blue2) 12%,var(--panel)));border:1px solid color-mix(in srgb,var(--blue) 34%,var(--line))}
.fleet-card{border-radius:28px;overflow:hidden}.fleet-art{min-height:260px}.fleet-art:after{content:"";position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(transparent,color-mix(in srgb,var(--bg) 78%,transparent));pointer-events:none}.bot-card-body{position:relative}
.nexoria-community-portal{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);overflow:hidden;padding:0!important;border-radius:30px;margin:22px 0;border:1px solid color-mix(in srgb,var(--blue) 34%,var(--line));box-shadow:0 28px 84px rgba(0,0,0,.24)}
.community-portal-art{min-height:310px;background-size:cover;background-position:center;position:relative;display:grid;place-items:end start;padding:24px}.community-portal-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,8,15,.08),rgba(2,8,15,.24)),linear-gradient(0deg,rgba(2,8,15,.78),transparent 55%)}.community-portal-art span{position:relative;z-index:1;font-size:clamp(1rem,2vw,1.5rem);font-weight:950;letter-spacing:.2em;color:#eaffff;text-shadow:0 2px 20px rgba(34,211,238,.42)}
.community-portal-copy{padding:34px;display:flex;flex-direction:column;justify-content:center}.community-portal-copy h2{margin:7px 0 10px;font-size:clamp(1.8rem,3vw,2.8rem)}.community-portal-copy p{max-width:720px;color:var(--muted);line-height:1.75}.community-portal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

/* Wiki Studio in admin */
.wiki-admin-studio{border-color:color-mix(in srgb,#22d3ee 28%,var(--line));background:linear-gradient(160deg,color-mix(in srgb,var(--panel) 94%,#22d3ee 6%),var(--panel))}
.wiki-editor-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:22px 0 12px;padding-top:18px;border-top:1px solid var(--line)}.wiki-editor-toolbar>div{display:grid;gap:3px}.wiki-editor-toolbar small{color:var(--muted)}
.wiki-page-editor{display:grid;gap:12px}.wiki-editor-card{border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--bg) 55%,var(--panel));overflow:hidden}.wiki-editor-card[open]{border-color:color-mix(in srgb,#22d3ee 36%,var(--line));box-shadow:0 14px 44px rgba(0,0,0,.16)}.wiki-editor-card summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:15px 16px;cursor:pointer;list-style:none}.wiki-editor-card summary::-webkit-details-marker{display:none}.wiki-editor-card summary>div{display:grid;gap:2px;min-width:0}.wiki-editor-card summary small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wiki-editor-order{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(145deg,color-mix(in srgb,#22d3ee 20%,var(--panel)),color-mix(in srgb,#60a5fa 12%,var(--panel)));font-weight:900}.wiki-editor-body{padding:0 16px 16px;border-top:1px solid var(--line)}.wiki-editor-body .editor-grid{padding-top:16px}.wiki-editor-actions{margin-top:14px}.wiki-editor-card textarea[data-wiki-field="body"]{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.6}

/* Public wiki shell */
body.wiki-shell{margin:0;min-height:100dvh;background:#080d14;color:#f5f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--wiki-line:rgba(255,255,255,.09);--wiki-muted:#9ca8b7;--wiki-card:#101823;--wiki-card-2:#151f2a;padding-bottom:104px;background-image:radial-gradient(circle at 50% -15%,color-mix(in srgb,var(--wiki-accent) 12%,transparent),transparent 35%),linear-gradient(180deg,#080d14,#090f17 65%,#080d14)}
.wiki-shell *{box-sizing:border-box}.wiki-shell a{color:inherit;text-decoration:none}.wiki-topbar{position:sticky;top:0;z-index:40;height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 max(28px,calc((100vw - 1180px)/2));border-bottom:1px solid var(--wiki-line);background:rgba(8,13,20,.88);backdrop-filter:blur(24px) saturate(1.1)}
.wiki-brand{display:flex;align-items:center;gap:12px}.wiki-brand-mark{width:46px;height:46px;display:grid;place-items:center;border-radius:10px;transform:skew(-7deg);font-size:1.45rem;font-weight:1000;color:#061018;background:linear-gradient(145deg,var(--wiki-accent-2),var(--wiki-accent));box-shadow:0 8px 34px color-mix(in srgb,var(--wiki-accent) 24%,transparent)}.wiki-brand>span:last-child{display:grid;line-height:1}.wiki-brand b{font-weight:1000;letter-spacing:.13em;font-size:1.02rem}.wiki-brand small{margin-top:5px;color:var(--wiki-muted);font-size:.62rem;letter-spacing:.22em}
.wiki-top-actions{display:flex;gap:10px}.wiki-icon-btn{width:48px;height:48px;border:1px solid var(--wiki-line);border-radius:16px;background:#0a1018;color:#dbe7f1;display:grid;place-items:center;font-size:1.4rem;cursor:pointer}.wiki-icon-btn:hover{border-color:color-mix(in srgb,var(--wiki-accent) 55%,var(--wiki-line));background:#0e1721}
.wiki-main{width:min(1120px,calc(100% - 44px));margin:0 auto;padding:34px 0 64px}.wiki-kicker{display:inline-block;color:color-mix(in srgb,var(--wiki-accent) 86%,#fff);font-weight:850;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}.wiki-home-hero{display:grid;grid-template-columns:1.08fr .92fr;border:1px solid var(--wiki-line);border-radius:28px;overflow:hidden;background:var(--wiki-card);box-shadow:0 28px 80px rgba(0,0,0,.28)}.wiki-home-art{min-height:400px;background-size:cover;background-position:center;position:relative}.wiki-home-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 50%,var(--wiki-card))}.wiki-home-copy{padding:42px 42px 42px 24px;display:flex;flex-direction:column;justify-content:center}.wiki-home-copy h1{font-size:clamp(2.4rem,5vw,4.7rem);line-height:.96;letter-spacing:-.05em;margin:8px 0 18px}.wiki-home-copy p{font-size:1.08rem;color:var(--wiki-muted);line-height:1.75;margin:0;max-width:590px}.wiki-quick-actions{display:grid;grid-template-columns:1.2fr .8fr;gap:10px;margin-top:28px}.wiki-primary,.wiki-secondary,.wiki-ghost{border:1px solid var(--wiki-line);border-radius:16px;min-height:58px;padding:12px 16px;display:flex;align-items:center;gap:10px;color:#effaff;background:#121b26;cursor:pointer}.wiki-primary{background:linear-gradient(135deg,color-mix(in srgb,var(--wiki-accent-2) 92%,#fff 8%),color-mix(in srgb,var(--wiki-accent) 94%,#fff 6%));color:#061018;border-color:transparent;box-shadow:0 14px 34px color-mix(in srgb,var(--wiki-accent) 18%,transparent)}.wiki-primary b,.wiki-secondary b{font-size:.95rem}.wiki-primary small,.wiki-secondary small{margin-left:auto;opacity:.75}.wiki-secondary:hover,.wiki-ghost:hover{border-color:color-mix(in srgb,var(--wiki-accent) 55%,var(--wiki-line));background:#162230}.wiki-ghost{min-height:44px;padding:9px 13px;background:transparent;font-size:.82rem}
.wiki-action-list{padding:58px 0 24px}.wiki-action-list h2,.wiki-sections h2,.wiki-community-strip h2{font-size:clamp(1.8rem,3vw,2.7rem);letter-spacing:-.04em;margin:0 0 20px}.wiki-action-list>a{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:20px;padding:22px 4px;border-bottom:1px solid var(--wiki-line)}.wiki-action-list>a:hover b{color:var(--wiki-accent)}.wiki-action-list>a>div{display:grid;gap:5px}.wiki-action-list b{font-size:1.14rem;transition:color .16s}.wiki-action-list p{margin:0;color:var(--wiki-muted);line-height:1.6}.wiki-action-list i{font-style:normal;font-size:1.8rem;color:var(--wiki-muted)}.wiki-line-icon{width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--wiki-line);border-radius:15px;color:var(--wiki-accent);background:#0d151f}
.wiki-sections{padding:48px 0}.wiki-section-head{display:flex;justify-content:space-between;gap:18px;align-items:end}.wiki-section-head h2{margin:7px 0 0}.wiki-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:22px}.wiki-card{border:1px solid var(--wiki-line);border-radius:24px;overflow:hidden;background:var(--wiki-card);box-shadow:0 16px 48px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.wiki-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--wiki-accent) 46%,var(--wiki-line));box-shadow:0 24px 60px rgba(0,0,0,.25)}.wiki-card-art{height:230px;background-size:cover;background-position:center;display:grid;place-items:center;position:relative}.wiki-card-art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,10,15,.38),transparent)}.wiki-card-art>span{display:none}.wiki-card-body{padding:22px}.wiki-card-body>small{color:var(--wiki-accent);font-size:.68rem;text-transform:uppercase;letter-spacing:.14em;font-weight:800}.wiki-card-body h3{font-size:1.45rem;margin:7px 0 8px}.wiki-card-body p{color:var(--wiki-muted);line-height:1.65;margin:0 0 16px}.wiki-card-body>b{font-size:.85rem}.wiki-card-body>b span{color:var(--wiki-accent);margin-left:4px}
.wiki-community-strip{margin:24px 0 32px;padding:30px;border:1px solid var(--wiki-line);border-radius:26px;background:linear-gradient(135deg,#101924,color-mix(in srgb,#101924 92%,var(--wiki-accent) 8%));display:flex;align-items:center;justify-content:space-between;gap:26px}.wiki-community-strip h2{margin:6px 0 8px}.wiki-community-strip p{margin:0;color:var(--wiki-muted);line-height:1.65}.wiki-strip-actions{display:flex;gap:10px;flex-wrap:wrap}.wiki-strip-actions .wiki-primary,.wiki-strip-actions .wiki-secondary{min-height:48px}
.wiki-bottom-nav{position:fixed;z-index:45;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(760px,calc(100% - 42px));height:78px;padding:7px;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;border:1px solid var(--wiki-line);border-radius:22px;background:rgba(22,31,42,.94);backdrop-filter:blur(24px);box-shadow:0 18px 50px rgba(0,0,0,.42)}.wiki-bottom-nav a,.wiki-bottom-nav button{border:0;border-radius:16px;background:transparent;color:#aeb9c6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer}.wiki-bottom-nav span{font-size:1.13rem}.wiki-bottom-nav small{font-weight:750}.wiki-bottom-nav .active{background:linear-gradient(180deg,color-mix(in srgb,var(--wiki-accent) 88%,#fff 12%),color-mix(in srgb,var(--wiki-accent) 75%,#0aa7ca 25%));color:#f7feff;box-shadow:0 9px 22px color-mix(in srgb,var(--wiki-accent) 18%,transparent)}
.wiki-search-sheet,.wiki-chapter-sheet{position:fixed;inset:0;z-index:90;display:grid;place-items:start center;padding:100px 18px 24px}.wiki-search-sheet[hidden],.wiki-chapter-sheet[hidden]{display:none}.wiki-search-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.64);backdrop-filter:blur(8px)}.wiki-search-card,.wiki-chapter-card{position:relative;width:min(720px,100%);max-height:min(720px,calc(100dvh - 140px));overflow:auto;border:1px solid var(--wiki-line);border-radius:24px;background:#0d151f;box-shadow:0 30px 90px rgba(0,0,0,.58)}.wiki-search-line{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--wiki-line);background:#0d151f}.wiki-search-line input{width:100%;min-height:50px;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-size:1rem}.wiki-search-line button{border:0;background:transparent;color:var(--wiki-muted);font-size:1.6rem}.wiki-search-results,.wiki-chapter-list{padding:8px}.wiki-search-results>a,.wiki-chapter-list>a{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;border-radius:15px}.wiki-search-results>a:hover,.wiki-chapter-list>a:hover{background:#131f2b}.wiki-search-results>a>span,.wiki-chapter-list>a>span{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(145deg,color-mix(in srgb,var(--wiki-accent) 18%,#121c27),#121c27);color:var(--wiki-accent);font-weight:900}.wiki-search-results div,.wiki-chapter-list div{display:grid;gap:2px;min-width:0}.wiki-search-results small,.wiki-chapter-list small{color:var(--wiki-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wiki-search-results i,.wiki-chapter-list i{font-style:normal;color:var(--wiki-muted);font-size:1.4rem}.wiki-empty{padding:28px;color:var(--wiki-muted);text-align:center}.wiki-chapter-card{padding:20px}.wiki-chapter-card h2{margin:5px 0 0}
.wiki-article{max-width:1000px;margin:0 auto}.wiki-article-hero{border:1px solid var(--wiki-line);border-radius:26px;overflow:hidden;background:var(--wiki-card);box-shadow:0 24px 70px rgba(0,0,0,.24)}.wiki-article-art{height:390px;background-size:cover;background-position:center;display:grid;place-items:center}.wiki-article-art>span{display:none}.wiki-article-title{padding:34px 40px}.wiki-breadcrumb{font-size:.82rem;color:var(--wiki-muted)}.wiki-breadcrumb a{color:var(--wiki-accent)}.wiki-article-title h1{font-size:clamp(2.25rem,4vw,3.8rem);letter-spacing:-.05em;margin:12px 0 10px}.wiki-article-title p{margin:0;color:var(--wiki-muted);font-size:1.1rem;line-height:1.7}.wiki-article-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:42px;padding:44px 6px}.wiki-toc{align-self:start;position:sticky;top:120px}.wiki-toc nav{display:grid;margin:10px 0 24px;border-left:1px solid var(--wiki-line)}.wiki-toc nav a{padding:8px 12px;color:var(--wiki-muted);font-size:.84rem;line-height:1.35}.wiki-toc nav a:hover{color:var(--wiki-accent);border-left:2px solid var(--wiki-accent);margin-left:-1px}.wiki-server-card{padding:15px;border:1px solid var(--wiki-line);border-radius:16px;background:var(--wiki-card)}.wiki-server-card small{display:block;color:var(--wiki-muted);font-size:.65rem;letter-spacing:.12em}.wiki-server-card b{display:block;margin:5px 0 11px}.wiki-server-card button{width:100%;border:1px solid var(--wiki-line);border-radius:11px;padding:9px 10px;color:#fff;background:#121d29;cursor:pointer}.wiki-prose{font-size:1.03rem;line-height:1.86;color:#b9c3ce}.wiki-prose h2,.wiki-prose h3,.wiki-prose h4{color:#f5f7fb;letter-spacing:-.035em;scroll-margin-top:120px}.wiki-prose h2{font-size:2rem;margin:10px 0 16px;padding-bottom:14px;border-bottom:1px solid var(--wiki-line)}.wiki-prose h3{font-size:1.5rem;margin:34px 0 12px}.wiki-prose h4{font-size:1.18rem;margin:26px 0 10px}.wiki-prose p{margin:0 0 20px}.wiki-prose ul,.wiki-prose ol{margin:0 0 24px;padding-left:26px}.wiki-prose li{margin:7px 0}.wiki-prose strong{color:#f3f5f7}.wiki-prose code{padding:4px 8px;border:1px solid var(--wiki-line);border-radius:8px;background:#050a0f;color:var(--wiki-accent);font-size:.92em}.wiki-article-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:12px;border-top:1px solid var(--wiki-line)}.wiki-article-nav a{display:grid;gap:4px;padding:18px;border:1px solid var(--wiki-line);border-radius:17px;background:var(--wiki-card)}.wiki-article-nav a:hover{border-color:color-mix(in srgb,var(--wiki-accent) 45%,var(--wiki-line))}.wiki-article-nav small{color:var(--wiki-muted)}.wiki-article-nav .next{text-align:right}
@media(max-width:900px){.nexoria-community-portal{grid-template-columns:1fr}.community-portal-art{min-height:240px}.community-portal-copy{padding:26px}.wiki-home-hero{grid-template-columns:1fr}.wiki-home-art{min-height:300px}.wiki-home-art:after{background:linear-gradient(0deg,var(--wiki-card),transparent 55%)}.wiki-home-copy{padding:28px}.wiki-article-layout{grid-template-columns:1fr}.wiki-toc{position:static}.wiki-toc nav{grid-template-columns:repeat(2,minmax(0,1fr));border-left:0}.wiki-toc nav a{border:1px solid var(--wiki-line);border-radius:10px;margin:4px;padding:9px}.wiki-server-card{display:none}}
@media(max-width:680px){body.wiki-shell{padding-bottom:108px}.wiki-topbar{height:76px;padding:0 20px}.wiki-brand-mark{width:38px;height:38px;font-size:1.1rem}.wiki-brand b{font-size:.88rem}.wiki-brand small{font-size:.54rem}.wiki-icon-btn{width:42px;height:42px;border-radius:14px}.wiki-main{width:min(100% - 28px,1120px);padding-top:18px}.wiki-home-hero{border-radius:22px}.wiki-home-art{min-height:220px}.wiki-home-copy{padding:22px}.wiki-home-copy h1{font-size:2.35rem}.wiki-home-copy p{font-size:.95rem}.wiki-quick-actions{grid-template-columns:1fr}.wiki-action-list{padding-top:40px}.wiki-action-list>a{grid-template-columns:48px minmax(0,1fr) auto;gap:14px;padding:19px 2px}.wiki-card-grid{grid-template-columns:1fr;gap:16px}.wiki-card-art{height:200px}.wiki-section-head{align-items:flex-start;flex-direction:column}.wiki-community-strip{align-items:flex-start;flex-direction:column;padding:22px}.wiki-bottom-nav{width:calc(100% - 28px);bottom:max(12px,env(safe-area-inset-bottom));height:78px;border-radius:20px}.wiki-bottom-nav small{font-size:.73rem}.wiki-search-sheet,.wiki-chapter-sheet{padding:78px 12px 12px}.wiki-search-card,.wiki-chapter-card{max-height:calc(100dvh - 100px);border-radius:20px}.wiki-article-hero{border-radius:22px}.wiki-article-art{height:250px}.wiki-article-title{padding:24px}.wiki-article-title h1{font-size:2.25rem}.wiki-article-layout{padding:28px 2px;gap:20px}.wiki-toc nav{grid-template-columns:1fr}.wiki-prose{font-size:1rem;line-height:1.8}.wiki-prose h2{font-size:1.72rem}.wiki-article-nav{grid-template-columns:1fr}.wiki-article-nav .next{text-align:left}.wiki-editor-toolbar{align-items:flex-start;flex-direction:column}.wiki-editor-card summary{grid-template-columns:auto minmax(0,1fr)}.wiki-editor-card summary>.tag{grid-column:2}.wiki-editor-actions{align-items:stretch;flex-direction:column}.wiki-editor-actions>.row{width:100%}.wiki-editor-actions button{flex:1}}

/* v20.6 · public application flow + application review center */
.public-application-page{min-height:100vh;background:radial-gradient(circle at 20% 0,#123a8c44,transparent 34rem),radial-gradient(circle at 100% 30%,#703cff2b,transparent 35rem),#040914;color:#eef4ff}
.application-public-shell{width:min(920px,calc(100% - 28px));margin:0 auto;padding:30px 0 50px}.application-public-shell.compact{width:min(760px,calc(100% - 28px))}
.application-public-brand{display:flex;align-items:center;gap:14px;margin:0 0 18px}.application-public-brand img{width:58px;height:58px;border-radius:18px;object-fit:cover;box-shadow:0 0 34px #2f6cff55}.application-public-brand div{display:grid}.application-public-brand span{font-size:.72rem;letter-spacing:.24em;color:#67d8ff;font-weight:800}.application-public-brand b{font-size:1.25rem}.application-public-brand small{color:#8fa4c8}
.application-public-card{overflow:hidden;border:1px solid #4b6cba70;border-radius:28px;background:linear-gradient(160deg,#111d3be8,#091329f5);box-shadow:0 30px 90px #0008,0 0 40px #2f6cff18}.application-public-hero{width:100%;aspect-ratio:16/6;object-fit:cover;display:block;border-bottom:1px solid #5f7bc355}.application-public-copy{padding:clamp(22px,5vw,46px)}.application-public-copy h1{font-size:clamp(2rem,6vw,3.8rem);margin:.25rem 0 1rem;line-height:1}.application-public-copy .lead{font-size:1.08rem;color:#c9d7f3}.application-identity{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 18px;margin:22px 0;border:1px solid #446bb55c;border-radius:16px;background:#0a1631}.application-identity div{display:grid}.application-identity small{color:#8297bc}.application-identity code{background:#203768;border:1px solid #5077c4;border-radius:10px;padding:8px 10px;color:#aeeaff}.application-question-form{display:grid;gap:18px;margin-top:28px}.application-question{display:grid;gap:9px}.application-question>span{display:flex;gap:10px;align-items:flex-start;font-weight:750}.application-question>span i{display:grid;place-items:center;min-width:28px;height:28px;border-radius:9px;background:linear-gradient(135deg,#2f6cff,#714cff);font-style:normal;font-size:.82rem}.application-question textarea{resize:vertical;min-height:122px;background:#071126;border:1px solid #365b9d;border-radius:15px;color:#eef4ff;padding:14px 16px;font:inherit;outline:none}.application-question textarea:focus{border-color:#55c9ff;box-shadow:0 0 0 3px #2f6cff2e}.application-submit-note{padding:14px 16px;border:1px solid #5369d666;background:#24306e45;border-radius:14px;color:#c9d7f3}.application-submit{min-height:54px;font-size:1.02rem}.application-public-footer{text-align:center;color:#7187ad;margin-top:18px}.center-copy{text-align:center}.application-result-icon{width:74px;height:74px;margin:0 auto 18px;display:grid;place-items:center;border-radius:24px;background:#27365e;color:#a9bbdc;font-size:2rem;font-weight:900}.application-result-icon.success{background:linear-gradient(135deg,#196bbd,#624bff);color:white;box-shadow:0 0 35px #2f6cff55}.application-next-steps{display:grid;text-align:left;gap:8px;margin:24px auto;padding:18px;border:1px solid #4c6fb26e;border-radius:16px;background:#09152d}.application-next-steps b{color:#65d3ff;margin-bottom:4px}
.application-review-summary{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:12px;margin:14px 0 22px}.application-review-summary article{padding:16px;border:1px solid #33558d;border-radius:16px;background:#0a1530}.application-review-summary b{font-size:1.8rem;display:block}.application-review-summary small{color:#8fa4c8}.application-review-list{display:grid;gap:16px}.application-review-card{overflow:hidden;border-left:3px solid var(--team-accent,#2f6cff)}.application-review-head{padding:18px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.application-review-head h3{margin:.25rem 0}.application-status{font-size:.72rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase;padding:6px 10px;border-radius:999px;background:#243052;color:#bac9e7}.application-status.submitted{background:#16498f;color:#bfe6ff}.application-status.in_review{background:#4b3d9d;color:#ded6ff}.application-status.accepted{background:#17644d;color:#bff4de}.application-status.rejected{background:#6f2833;color:#ffd2d8}.application-answer-grid{padding:0 18px 18px;display:grid;gap:10px}.application-answer{padding:14px;border-radius:14px;background:#071126;border:1px solid #2b4778}.application-answer b{display:block;color:#78d9ff;margin-bottom:6px}.application-answer p{white-space:pre-wrap;margin:0;color:#d9e3f4}.application-review-form{padding:18px;border-top:1px solid #294878;background:#081226}.application-review-form textarea{width:100%;min-height:90px;resize:vertical;background:#050d1c;border:1px solid #33558d;border-radius:12px;color:#eef4ff;padding:12px;font:inherit}.application-review-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:10px}.application-review-actions button{min-height:40px}.accept-button{background:linear-gradient(135deg,#1767cc,#4b53ef)!important}.reject-button{background:#7f2c42!important}.application-discord-warning{margin:10px 18px 18px;padding:11px 13px;border-radius:12px;background:#4b2c1238;border:1px solid #b878315e;color:#f1c996}
@media(max-width:720px){.application-review-summary{grid-template-columns:repeat(2,1fr)}.application-public-shell{width:min(100% - 16px,920px);padding-top:14px}.application-public-card{border-radius:20px}.application-public-hero{aspect-ratio:16/7}.application-public-copy{padding:20px}.application-identity{align-items:flex-start;flex-direction:column}.application-review-head{flex-direction:column}}
.wiki-survival-soon{display:flex;align-items:center;justify-content:space-between;gap:22px;margin:28px 0;padding:24px 28px;border:1px solid #39579a;border-left:4px solid #7c4dff;border-radius:20px;background:linear-gradient(135deg,#0b1730,#111a38);box-shadow:0 18px 45px #0004}.wiki-survival-soon h2{margin:.2rem 0 .4rem}.wiki-survival-soon p{margin:0;color:#9fb0cd}.wiki-survival-soon .pill{white-space:nowrap}@media(max-width:700px){.wiki-survival-soon{align-items:flex-start;flex-direction:column}}

/* v20.8 public application portal */
.application-landing-page{min-height:100vh;margin:0;background:radial-gradient(circle at 18% -10%,#0f4ba14a,transparent 34rem),radial-gradient(circle at 95% 24%,#4a26a836,transparent 32rem),linear-gradient(180deg,#050b12,#02060a 70%);color:#eef5ff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.application-landing-shell{width:min(980px,calc(100% - 32px));margin:0 auto;padding:22px 0 56px}.application-landing-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:34px}.application-wordmark{display:flex;align-items:center;gap:13px;color:inherit;text-decoration:none}.application-wordmark img{width:54px;height:54px;border-radius:17px;object-fit:cover;box-shadow:0 0 34px #2f6cff55}.application-wordmark div{display:grid}.application-wordmark span{font-size:.72rem;letter-spacing:.24em;color:#5fd7ff;font-weight:900}.application-wordmark b{font-size:1.15rem;letter-spacing:.05em}.application-wiki-link{padding:11px 16px;border:1px solid #33445e;border-radius:13px;background:#0a111a;color:#c8d8ee;text-decoration:none;font-weight:750}.application-wiki-link:hover{border-color:#2f7dff;color:white}.application-landing-hero{text-align:center;padding:34px 12px 38px}.application-landing-hero h1{font-size:clamp(2.5rem,8vw,5.5rem);line-height:.94;letter-spacing:-.055em;margin:.35rem 0 1.2rem}.application-landing-hero p{max-width:720px;margin:0 auto;color:#93a5bc;font-size:1.08rem;line-height:1.7}.application-landing-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:20px}.application-landing-meta span{padding:8px 11px;border:1px solid #223653;border-radius:999px;background:#091322;color:#a9bdd7;font-size:.86rem}.application-setup-warning{margin:0 auto 22px;padding:14px 16px;max-width:820px;border:1px solid #aa7a2f66;border-radius:15px;background:#3a260d99;color:#f6d598}.application-role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.application-role-card{display:grid;gap:18px;padding:27px;border:1px solid #26313f;border-radius:28px;background:linear-gradient(160deg,#0e151d,#070c11);box-shadow:0 24px 70px #0005;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.application-role-card:hover:not(.closed){transform:translateY(-3px);border-color:#1d8bb6;box-shadow:0 28px 75px #0008,0 0 45px #1aa8df17}.application-role-card.closed{opacity:.58}.application-role-top{display:flex;align-items:center;gap:16px}.application-role-icon{display:grid;place-items:center;flex:0 0 64px;width:64px;height:64px;border-radius:21px;background:linear-gradient(145deg,#082b38,#07151e);border:1px solid #123d4f;font-size:1.75rem}.application-role-top>div{display:flex;align-items:center;gap:11px;flex-wrap:wrap}.application-role-top h2{margin:0;font-size:1.52rem}.status-pill{display:inline-flex;align-items:center;justify-content:center;padding:5px 10px;border-radius:999px;font-size:.78rem;font-weight:800;border:1px solid #39434f;background:#171d24;color:#98a4b2}.status-pill.open{border-color:#2b8151;background:#0d3a25;color:#66d69a}.status-pill.closed{border-color:#464c55;background:#1b2026;color:#8e98a4}.application-role-kicker{color:#54c6e6;font-size:.96rem}.application-role-card p{margin:0;color:#95a3b2;line-height:1.65}.application-requirements{display:flex;gap:9px;flex-wrap:wrap}.application-requirements span{padding:6px 10px;border-radius:10px;background:#0b1117;border:1px solid #1e2b38;color:#8193a6;font-size:.82rem}.application-role-button{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 18px;border-radius:14px;background:linear-gradient(180deg,#168eaa,#0d6d86);box-shadow:inset 0 -4px 0 #075970;color:#fff;text-decoration:none;font-weight:900;letter-spacing:.04em}.application-role-button span{font-size:1.35rem}.application-role-button.disabled{background:#151b22;box-shadow:none;color:#6e7782;border:1px solid #282f37}.application-after-submit{display:grid;grid-template-columns:auto 1fr;gap:15px;margin-top:28px;padding:23px 26px;border-radius:24px;background:linear-gradient(135deg,#29c1e4,#20acd1);color:#031018}.application-after-submit>span{font-size:1.8rem}.application-after-submit b{font-size:1.15rem}.application-after-submit p{margin:.4rem 0 0;line-height:1.6}.application-form-shell{max-width:900px}.application-form-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.application-form-heading h1{margin-top:.35rem}.application-submit-note{display:grid;gap:4px}.premium-application-brand{padding:6px 4px}.application-form-card{background:linear-gradient(160deg,#101b33,#07101f)}
@media(max-width:760px){.application-landing-shell{width:min(100% - 18px,980px);padding-top:13px}.application-landing-header{margin-bottom:14px}.application-landing-hero{padding:24px 8px 30px}.application-landing-hero h1{font-size:clamp(2.4rem,13vw,4rem)}.application-role-grid{grid-template-columns:1fr;gap:16px}.application-role-card{padding:22px;border-radius:22px}.application-after-submit{padding:19px;border-radius:20px}.application-form-heading{flex-direction:column}.application-wiki-link{padding:9px 12px}.application-wordmark img{width:46px;height:46px}}

/* v20.8 panel builder organization + search */
.panel-builder-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) auto auto;gap:10px;align-items:center;margin:14px 0 18px;padding:12px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--panel) 84%,transparent)}.panel-builder-search{position:relative}.panel-builder-search input{width:100%;padding-left:42px}.panel-builder-search:before{content:'⌕';position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:1.15rem;color:var(--muted)}.panel-builder-category-filter{min-width:190px}.panel-category-lane{overflow:hidden}.panel-category-head{cursor:pointer}.panel-category-head-actions{display:flex;align-items:center;gap:8px}.panel-category-toggle{min-width:36px}.panel-category-lane.is-collapsed .panel-category-cards{display:none}.panel-builder-card{overflow:hidden}.panel-builder-card .panel-builder-grid{display:none}.panel-builder-card.is-open .panel-builder-grid{display:grid}.panel-card-toggle{white-space:nowrap}.panel-builder-card .type-card-head{cursor:default}.panel-builder-card.is-search-hidden,.panel-category-lane.is-search-hidden{display:none!important}.panel-builder-empty-search{padding:30px;text-align:center;border:1px dashed var(--line);border-radius:18px;color:var(--muted)}
@media(max-width:720px){.panel-builder-toolbar{grid-template-columns:1fr}.panel-builder-category-filter{min-width:0}.panel-category-head-actions .pill{display:none}.panel-builder-card .type-card-head{align-items:flex-start;gap:12px}.panel-builder-card .type-card-head>.row{width:100%;justify-content:flex-start;flex-wrap:wrap}}

/* v20.8.1 direct website applications: no Discord OAuth redirect */
.application-identity-field input{width:100%;box-sizing:border-box;margin-top:12px;border:1px solid rgba(104,142,255,.28);background:#08111f;color:#eef5ff;border-radius:14px;padding:15px 16px;font:inherit;outline:none}.application-identity-field input:focus{border-color:#6178ff;box-shadow:0 0 0 3px rgba(97,120,255,.12)}.application-identity-field small{display:block;margin-top:9px;color:#8594ad;line-height:1.55}.application-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}

/* v20.8.4 — Premium Wiki Command Center */
.wiki-control-hub{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr);overflow:hidden;margin:24px 0 30px;border-color:color-mix(in srgb,#4f7cff 34%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 95%,#14246b 5%),var(--panel));box-shadow:0 30px 90px rgba(0,0,0,.28),0 0 70px rgba(61,94,255,.08)}
.wiki-control-visual{position:relative;min-height:430px;background-size:cover;background-position:center;isolation:isolate}.wiki-control-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(3,8,22,.12),rgba(3,8,22,.86)),linear-gradient(90deg,rgba(9,15,34,.1),rgba(9,15,34,.52))}.wiki-control-badge{position:absolute;top:22px;left:22px;display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(129,180,255,.32);border-radius:999px;background:rgba(5,13,34,.78);backdrop-filter:blur(14px);font-size:.72rem;font-weight:900;letter-spacing:.08em}.wiki-control-badge i,.wiki-live-chip i,.wiki-admin-live i{width:8px;height:8px;border-radius:50%;background:#45f0a8;box-shadow:0 0 16px #45f0a8}.wiki-control-title{position:absolute;left:28px;right:28px;bottom:28px;display:grid;gap:7px}.wiki-control-title>span{font-size:.68rem;letter-spacing:.2em;color:#7fc9ff;font-weight:900}.wiki-control-title strong{font-size:clamp(2.6rem,5vw,4.8rem);line-height:.82;letter-spacing:-.055em;text-shadow:0 14px 40px #000}.wiki-control-title small{color:#dce9ff;font-weight:700}.wiki-control-body{padding:30px;display:flex;flex-direction:column;gap:22px}.wiki-control-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.wiki-control-head h2{margin:.3rem 0 .55rem;font-size:clamp(1.55rem,3vw,2.3rem)}.wiki-control-head p{margin:0;color:var(--muted);line-height:1.65}.wiki-live-chip{white-space:nowrap;display:flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid color-mix(in srgb,#5e80ff 28%,var(--line));border-radius:999px;background:color-mix(in srgb,#4f68ff 9%,var(--panel));font-size:.74rem;font-weight:900}.wiki-control-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wiki-control-stats>div{display:grid;grid-template-columns:auto 1fr;column-gap:11px;padding:13px 14px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--panel2) 82%,transparent)}.wiki-control-stats>div>span{grid-row:1/3;font-size:1.25rem;align-self:center}.wiki-control-stats small{color:var(--muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}.wiki-control-stats b{margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wiki-control-quicklinks{display:flex;flex-wrap:wrap;gap:9px}.wiki-control-chapters{display:grid;gap:8px}.wiki-control-chapters a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 12px;border:1px solid transparent;border-radius:13px;background:color-mix(in srgb,var(--panel2) 58%,transparent);transition:.18s ease}.wiki-control-chapters a:hover{border-color:color-mix(in srgb,#6384ff 32%,var(--line));transform:translateX(3px)}.wiki-control-chapters a>span{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(145deg,#315dff33,#784cff22);color:#9bc9ff;font-size:.72rem;font-weight:900}.wiki-control-chapters a div{display:grid;gap:2px;min-width:0}.wiki-control-chapters a small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wiki-control-chapters a i{font-style:normal;color:#7ba7ff}

.wiki-admin-premium{padding:0!important;overflow:hidden}.wiki-admin-hero{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);min-height:330px;border-bottom:1px solid var(--line)}.wiki-admin-hero-art{position:relative;background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:25px;isolation:isolate}.wiki-admin-hero-art:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(4,8,22,.08),rgba(4,8,22,.9)),linear-gradient(90deg,rgba(45,83,255,.12),transparent)}.wiki-admin-hero-art>div{display:grid;gap:6px}.wiki-admin-hero-art small{font-size:.65rem;letter-spacing:.18em;font-weight:900;color:#78ceff}.wiki-admin-hero-art strong{font-size:clamp(2.8rem,5vw,4.8rem);line-height:.82;letter-spacing:-.055em;text-shadow:0 15px 35px #000}.wiki-admin-hero-art p{margin:5px 0 0;color:#d4e2f8}.wiki-admin-live{position:absolute;top:20px;left:20px;display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(6,12,26,.74);padding:7px 10px;font-size:.67rem;font-weight:900;letter-spacing:.09em;backdrop-filter:blur(15px)}.wiki-admin-overview{padding:28px;display:flex;flex-direction:column;justify-content:center;gap:20px;background:radial-gradient(circle at 90% 0%,rgba(70,83,255,.12),transparent 38%)}.wiki-admin-overview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.wiki-admin-overview-head h3{font-size:1.55rem;margin:.25rem 0 .5rem}.wiki-admin-overview-head p{margin:0;color:var(--muted);line-height:1.6}.wiki-admin-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.wiki-admin-kpis span{padding:13px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel2) 72%,transparent);display:grid;gap:4px}.wiki-admin-kpis small{font-size:.62rem;letter-spacing:.1em;color:var(--muted);font-weight:800}.wiki-admin-kpis b{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wiki-admin-links{display:flex;flex-wrap:wrap;gap:8px}.wiki-admin-links a{padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--panel2) 72%,transparent);font-size:.78rem;font-weight:800}.wiki-admin-links a:hover{border-color:#5578ff;color:#bfe7ff}.wiki-admin-section-title{padding:25px 28px 10px;display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.wiki-admin-section-title h3{margin:.25rem 0 .3rem}.wiki-admin-section-title p{margin:0}.wiki-brand-editor{padding:8px 28px 28px}.wiki-enable-switch{display:flex!important;align-items:center!important;gap:12px!important;background:linear-gradient(135deg,color-mix(in srgb,#245dff 10%,var(--panel2)),var(--panel2))!important;border-color:color-mix(in srgb,#5a83ff 25%,var(--line))!important}.wiki-enable-switch span{display:grid;gap:2px}.wiki-enable-switch small{color:var(--muted)}.wiki-chapter-title{border-top:1px solid var(--line);padding-top:27px}.wiki-editor-commandbar{margin:6px 28px 18px;display:grid;grid-template-columns:minmax(220px,1fr) minmax(150px,.35fr) auto auto auto;gap:9px;align-items:center}.wiki-editor-search{position:relative}.wiki-editor-search>span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:1.1rem}.wiki-editor-search input{width:100%;padding-left:38px}.wiki-editor-result{padding:8px 11px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.72rem;white-space:nowrap}.wiki-admin-premium .wiki-page-editor{padding:0 28px 28px}.wiki-admin-premium .wiki-editor-card{border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel2) 78%,transparent),color-mix(in srgb,var(--panel) 94%,#2f4cff 6%));box-shadow:0 12px 34px rgba(0,0,0,.12)}.wiki-admin-premium .wiki-editor-card summary{grid-template-columns:auto minmax(0,1fr) auto;padding:16px 17px}.wiki-editor-summary{display:grid;gap:3px;min-width:0}.wiki-editor-summary-meta{display:flex;align-items:center;gap:10px}.wiki-editor-arrow{font-size:1.15rem;color:var(--muted);transition:transform .18s ease}.wiki-editor-card[open] .wiki-editor-arrow{transform:rotate(180deg)}.wiki-admin-premium .wiki-editor-order{font-size:.67rem;letter-spacing:.06em}.wiki-editor-preview{height:165px;margin:16px 0 2px;border:1px solid var(--line);border-radius:15px;background-size:cover;background-position:center;position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;padding:15px;isolation:isolate}.wiki-editor-preview:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(1,5,15,.82))}.wiki-editor-preview>span{font-size:1.35rem;font-weight:1000;letter-spacing:.03em;text-shadow:0 4px 16px #000}.wiki-editor-preview>a{padding:7px 9px;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:rgba(7,13,30,.72);font-size:.72rem;font-weight:850}.wiki-format-guide{margin:0 28px 28px;padding:16px;border:1px solid color-mix(in srgb,#5578ff 25%,var(--line));border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,#315aff 8%,var(--panel2)),var(--panel2));display:flex;align-items:center;justify-content:space-between;gap:20px}.wiki-format-guide>div{display:grid;gap:9px}.wiki-format-guide span{display:flex;flex-wrap:wrap;gap:6px}.wiki-format-guide code{padding:4px 7px;border-radius:7px;background:rgba(0,0,0,.18)}.wiki-format-guide p{max-width:460px;margin:0;color:var(--muted);line-height:1.5}.wiki-editor-no-results:after{content:"Keine Kapitel für diese Suche gefunden.";display:block;padding:28px;text-align:center;border:1px dashed var(--line);border-radius:16px;color:var(--muted)}
@media(max-width:980px){.wiki-control-hub,.wiki-admin-hero{grid-template-columns:1fr}.wiki-control-visual{min-height:350px}.wiki-admin-hero-art{min-height:300px}.wiki-admin-kpis{grid-template-columns:repeat(2,1fr)}.wiki-editor-commandbar{grid-template-columns:1fr 1fr auto}.wiki-editor-commandbar .ghost{display:none}}
@media(max-width:680px){.wiki-control-body{padding:20px}.wiki-control-head,.wiki-admin-overview-head,.wiki-admin-section-title,.wiki-format-guide{align-items:flex-start;flex-direction:column}.wiki-control-stats{grid-template-columns:1fr}.wiki-control-quicklinks>*{flex:1 1 45%}.wiki-admin-overview{padding:20px}.wiki-admin-kpis{grid-template-columns:1fr 1fr}.wiki-admin-section-title{padding:22px 18px 8px}.wiki-brand-editor{padding:8px 18px 22px}.wiki-editor-commandbar{margin:6px 18px 14px;grid-template-columns:1fr}.wiki-editor-result{justify-self:start}.wiki-admin-premium .wiki-page-editor{padding:0 18px 22px}.wiki-editor-preview{height:125px}.wiki-format-guide{margin:0 18px 22px}.wiki-editor-summary-meta .tag{display:none}}