/* v3.29.1 – SINKAYO OS Top Command Bar Foundation */
.top-command-shell {
  position: sticky;
  top: 0;
  z-index: 80;
  padding: 18px 28px 0;
  background:
    linear-gradient(180deg, rgba(5, 5, 9, 0.96), rgba(5, 5, 9, 0.76) 72%, rgba(5, 5, 9, 0));
  backdrop-filter: blur(18px) saturate(130%);
}
.top-command-bar {
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 26px;
  background:
    radial-gradient(circle at 9% 0%, rgba(217,52,97,0.18), transparent 36%),
    radial-gradient(circle at 86% 0%, rgba(66,216,255,0.12), transparent 34%),
    linear-gradient(135deg, rgba(10,10,16,0.88), rgba(23,19,32,0.78));
  box-shadow: 0 30px 90px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.07);
}
.top-command-brand { border:0; background:transparent; color:var(--sx-text-0,var(--text)); display:flex; align-items:center; gap:12px; min-width:205px; padding:8px 10px; border-radius:18px; cursor:pointer; text-align:left; }
.top-command-brand:hover { background: rgba(255,255,255,0.055); }
.top-command-mark { width:43px; height:43px; border-radius:16px; display:grid; place-items:center; font-family:var(--font-display,Rajdhani,sans-serif); font-size:22px; font-weight:900; color:#fff; background:linear-gradient(135deg,rgba(217,52,97,0.95),rgba(72,32,95,0.92)); box-shadow:0 0 28px rgba(217,52,97,0.34); }
.top-command-brand-text strong { display:block; font-family:var(--font-display,Rajdhani,sans-serif); font-size:15px; letter-spacing:.18em; text-transform:uppercase; }
.top-command-brand-text small { display:block; margin-top:2px; color:var(--sx-text-2,var(--text-muted)); font-size:11px; letter-spacing:.04em; white-space:nowrap; }
.top-command-nav { display:flex; align-items:center; gap:7px; flex:1; min-width:0; }
.top-command-main,.top-command-arrow { height:42px; border:0; background:transparent; color:var(--sx-text-1,var(--text)); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:.16s ease; }
.top-command-main { padding:0 12px 0 15px; border-radius:999px; font-weight:800; font-size:13px; letter-spacing:.02em; white-space:nowrap; }
.top-command-main.solo { border:1px solid transparent; background:rgba(255,255,255,.025); padding:0 15px; }
.top-command-arrow { width:32px; border-left:1px solid rgba(255,255,255,.08); border-radius:0 999px 999px 0; color:var(--sx-text-2,var(--text-muted)); }
.top-command-cluster { position:relative; display:flex; align-items:center; border:1px solid transparent; border-radius:999px; background:rgba(255,255,255,.025); }
.top-command-cluster::after { content:""; position:absolute; left:0; right:0; top:100%; height:18px; pointer-events:auto; }
.top-command-cluster:hover,.top-command-cluster.open,.top-command-main.solo:hover { background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.1); }
.top-command-cluster.open .top-command-arrow,.top-command-cluster:hover .top-command-arrow { color:#fff; background:rgba(255,255,255,.055); }
.top-command-main.active,.top-command-cluster.active { background:rgba(217,52,97,.13); border-color:rgba(217,52,97,.3); box-shadow:0 0 24px rgba(217,52,97,.12); }
.top-command-cluster.active .top-command-main,.top-command-main.solo.active { color:#fff; }
.top-command-dropdown { position:absolute; top:calc(100% + 12px); left:0; min-width:295px; padding:10px; z-index:120; border:1px solid rgba(255,255,255,.15); border-radius:22px; background:rgba(8,8,13,.95); backdrop-filter:blur(24px) saturate(160%); box-shadow:0 32px 100px rgba(0,0,0,.66),0 0 0 1px rgba(217,52,97,.07); opacity:0; transform:translateY(-8px) scale(.985); pointer-events:none; transition:.16s ease; overflow:hidden; }
.top-command-dropdown-right { left:auto; right:0; }
.top-command-dropdown::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 0 0,rgba(217,52,97,.18),transparent 45%); pointer-events:none; }
.top-command-cluster:hover .top-command-dropdown,.top-command-cluster.open .top-command-dropdown { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.top-command-dropdown button { position:relative; display:grid; gap:2px; width:100%; border:0; background:transparent; text-align:left; padding:10px 12px; border-radius:15px; cursor:pointer; color:var(--sx-text-0,var(--text)); }
.top-command-dropdown button:hover { background:rgba(255,255,255,.08); }
.top-command-dropdown b { font-size:13px; letter-spacing:.01em; }
.top-command-dropdown span { color:var(--sx-text-2,var(--text-muted)); font-size:11px; line-height:1.35; }
.top-command-actions { display:flex; align-items:center; gap:9px; flex-shrink:0; }
.top-command-ghost,.top-command-primary { height:43px; border-radius:999px; cursor:pointer; white-space:nowrap; }
.top-command-ghost { width:43px; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.035); color:var(--sx-text-2,var(--text-muted)); }
.top-command-ghost:hover { color:#fff; background:rgba(255,255,255,.075); }
.top-command-primary { border:0; padding:0 18px; font-weight:900; color:#fff; background:linear-gradient(135deg,rgba(217,52,97,.96),rgba(143,91,255,.92)); box-shadow:0 14px 34px rgba(217,52,97,.27); }
.top-command-primary:hover { transform:translateY(-1px); box-shadow:0 18px 44px rgba(217,52,97,.34); }
body.is-guest .top-command-shell, body.is-guest-preview .top-command-shell { display:none !important; }
body.is-admin .sidebar-command-centers { opacity:.72; }
body.is-admin .sidebar-command-label::after { content:" · Topbar aktiv"; color:rgba(255,255,255,.25); font-weight:500; }
@media (max-width:1220px){ .top-command-bar{align-items:flex-start;flex-wrap:wrap;min-height:auto}.top-command-brand{min-width:180px}.top-command-nav{order:3;width:100%;overflow-x:auto;padding-bottom:3px}.top-command-nav::-webkit-scrollbar{height:0}.top-command-dropdown{position:fixed;top:92px;left:24px;right:24px;min-width:0}.top-command-dropdown-right{left:24px;right:24px} }
@media (max-width:780px){ .top-command-shell{padding:12px 12px 0}.top-command-brand-text small{display:none}.top-command-brand{min-width:120px}.top-command-actions{margin-left:auto}.top-command-primary{padding:0 13px} }

/* v3.29.2.1 – Topbar Action Links */
.top-command-mini {
  height: 39px;
  min-width: 39px;
  padding: 0 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.035);
  color: var(--sx-text-1,var(--text));
  text-decoration: none;
  font: 900 11px/1 Rajdhani, Inter, sans-serif;
  letter-spacing: .07em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .16s ease, color .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.top-command-mini:hover {
  transform: translateY(-1px);
  color: #fff;
  background: rgba(255,255,255,.075);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 14px 34px rgba(0,0,0,.22);
}
.top-command-youtube:hover { border-color: rgba(255,92,92,.35); box-shadow: 0 14px 34px rgba(255,70,70,.12); }
.top-command-spotify:hover { border-color: rgba(80,255,160,.34); box-shadow: 0 14px 34px rgba(40,255,150,.10); }
.top-command-distro:hover { border-color: rgba(180,150,255,.35); box-shadow: 0 14px 34px rgba(160,110,255,.12); }
.top-command-logout:hover { border-color: rgba(255,190,120,.32); box-shadow: 0 14px 34px rgba(255,160,80,.10); }
.top-command-action-icon { font-size: 13px; line-height: 1; }
@media (max-width:1540px){
  .top-command-action-label{display:none}
  .top-command-mini{width:39px;padding:0;gap:0}
}

/* v3.29.2.2 – Topbar Live Status */
.top-command-live {
  height: 39px;
  padding: 0 12px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.035);
  color: var(--sx-text-2,var(--text-muted));
  font: 900 11px/1 Rajdhani, Inter, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.top-command-live .server-dot {
  width: 8px;
  height: 8px;
  margin: 0;
  flex: 0 0 auto;
}
.top-command-live-label {
  display: inline-flex;
  align-items: center;
}
@media (max-width:1540px){
  .top-command-live-label{display:none}
  .top-command-live{width:39px;padding:0;gap:0}
}
