:root {
  color-scheme: dark;
  --bg: #07071a;
  --surface: #0e102a;
  --surface-2: #17153c;
  --line: rgba(146,104,255,.42);
  --line-soft: rgba(122,117,215,.23);
  --text: #f4f3ff;
  --muted: #aaaad0;
  --violet: #ab79ff;
  --violet-2: #873dff;
  --cyan: #38a7ff;
  --ok: #56ee89;
  --warn: #ffc789;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  min-width: 320px; margin: 0; color: var(--text); min-height: 100dvh;
  background:
    radial-gradient(ellipse 52% 34% at 0% 70%, rgba(75,29,164,.21), transparent),
    radial-gradient(ellipse 43% 29% at 98% 12%, rgba(49,38,146,.17), transparent),
    linear-gradient(155deg, #070918 1%, #07071b 43%, #090822 100%);
}
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { opacity: .53; cursor: not-allowed; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid #b992ff; outline-offset: 3px; }
.hidden { display: none !important; }
h1,h2,h3,p { margin-top: 0; }
h1,h2,h3 { letter-spacing: -.035em; }
h1 { font-size: clamp(1.5rem, 2.45vw, 2.05rem); }
h2 { font-size: 1.08rem; }
h3 { font-size: 1rem; }
.muted { color: var(--muted); }
.tiny { font-size: .79rem; line-height: 1.5; }
.eyebrow { color: #b9a1ff; font-size: .67rem; font-weight: 800; letter-spacing: .19em; }

/* Full-bleed responsive luminous banner. The wave is decoration; buttons remain real HTML. */
.topbar {
  position: relative; isolation: isolate; width: 100%; overflow: hidden;
  min-height: clamp(118px, 10.5vw, 170px);
  background:
    radial-gradient(ellipse at 27% 120%, rgba(84,35,165,.22), transparent 56%),
    linear-gradient(95deg,#090920 0%,#09071b 60%,#0d0725 100%);
  border-bottom: 1px solid #7c44ef;
  box-shadow: 0 1px 18px #6026da5e, inset 0 -8px 20px #1a0c3b37;
}
.header-art { position: absolute; z-index: -1; inset: 0; height: 100%; width: 100%; pointer-events: none; }
.header-inner {
  max-width: 1730px; margin: 0 auto; min-height: inherit; padding: 19px clamp(20px, 4.1vw, 68px);
  display: flex; align-items: center; justify-content: space-between; gap: 22px;
}
.brand { display:flex; align-items:center; gap: 19px; min-width:0; }
.brand-icon {
  width: clamp(62px,7vw,96px); height: clamp(62px,7vw,96px); flex-shrink:0;
  display:grid;place-items:center; border-radius:23px;
  background: radial-gradient(circle at 25% 15%, #3f338e9e, #15102c 71%);
  border:1px solid #b07cffb8;
  box-shadow: 0 0 0 4px #5e35ca23, 0 0 27px #862aff89, inset 0 2px 15px #a279ff3c;
}
.brand-icon svg { width: 64%; height:64%; filter: drop-shadow(0 0 7px #924cff); }
.brand-title { white-space:nowrap; font-size: clamp(1.3rem,3vw,3.12rem); letter-spacing:-.065em; line-height:1.06; }
.brand-title strong { color:#faf9ff; font-weight:850; }
.brand-title span { font-weight:340; letter-spacing:-.05em; background:linear-gradient(90deg,#e8deff,#a99bff 55%,#8aa2ff); color:transparent; background-clip:text; }
.action-bar { display:flex;align-items:center;gap:12px;min-width:0; }
.account-badge { max-width: 200px; padding: 13px 18px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-weight:700;font-size:.88rem; color:#e9dcff; background: #120e31b5; border:1px solid #6c40d8;
  border-radius:16px; box-shadow:inset 0 1px 9px #7140d62d,0 0 11px #7029dd25;
}
.account-badge::before { content:'◌'; font-size:1.16rem;vertical-align:-.03em;color:#af8eff;margin-right:11px; }
.text-btn, .icon-btn, .secondary, .friend-btn, .quiet-btn {
  background:linear-gradient(145deg,#161336c9,#100e29d9); color:#f3ecff;
  border:1px solid #6551b2; border-radius:13px; padding:10px 16px; font-weight:650;
  transition: border-color .15s,box-shadow .15s,background .15s,transform .15s;
}
.text-btn:hover, .icon-btn:hover, .secondary:hover, .friend-btn:hover, .quiet-btn:hover {
  border-color:#be67ff; box-shadow:0 0 17px #8231ff3d; background:#252052;
}
.icon-btn { padding: 10px 12px;display:grid;place-items:center;min-height:44px;min-width:46px; }
.icon-btn svg,.logout-btn svg { width:21px;height:21px; stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.75;fill:none; }
.logout-btn { display:inline-flex;align-items:center;gap:10px;min-height:44px; }
.primary {
  display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:14px 18px;
  border:1px solid #bd71ff; border-radius:12px;color:#fff;font-weight:740;
  background:linear-gradient(110deg,#4737da,#9334d5 92%);box-shadow:0 0 16px #9c39ef44,inset 0 1px 0 #ffffff50;
}
.primary:hover { filter:brightness(1.12); }

/* The sidebar, live view and right status panels share one 3-column grid. */
.shell { max-width: 1730px; margin:0 auto; padding:23px clamp(16px,2vw,28px) 45px; }
.dashboard-grid { display:grid; grid-template-columns:minmax(195px,232px) minmax(0,1fr) minmax(235px,318px); gap:19px; align-items:start; }
.sidebar, .overview-card, .channel-card, .info-card, .login-card, .settings-panel {
  border:1px solid var(--line); border-radius:18px;
  background:linear-gradient(145deg,rgba(23,19,59,.96),rgba(11,12,35,.97) 57%,rgba(14,13,42,.96));
  box-shadow: 0 9px 39px #0102135e,inset 0 1px 0 #947ff91b;
}
.sidebar { min-height: min(80dvh,850px); padding:14px 10px; display:flex;flex-direction:column; position:sticky;top:16px; }
.nav-list { display:flex;flex-direction:column;gap:8px; }
.nav-btn { border:1px solid transparent;background:transparent;color:#d8cff3;border-radius:13px;text-align:left;display:flex;align-items:center;gap:13px;padding:13px 14px;font-weight:650; min-height:48px; }
.nav-btn:hover { border-color:#7657a1;background:#27204e; }
.nav-btn.active { color:#fff;background:linear-gradient(100deg,#563bea,#4d1d9f98);border-color:#c55bff;box-shadow:0 0 18px #8c31fd6e,inset 0 1px 0 #dfb3ff6a; }
.nav-glyph { font-size:1.4rem;line-height:1;color:#d8c5ff;width:22px;text-align:center; }
.sidebar-lower { margin-top:32px;padding:13px 11px;border-radius:13px;background:linear-gradient(135deg,#171338,#100e2a);border:1px solid var(--line-soft); }
.sidebar-heading {font-size:.68rem;letter-spacing:.12em;color:#baabef;font-weight:800;margin-bottom:13px;}
.sidebar-status {display:flex;align-items:center;gap:9px;font-size:.82rem;font-weight:700;margin-bottom:14px;}
.online-dot {width:10px;height:10px;flex:0 0 10px;border-radius:50%;background:#747590;box-shadow:0 0 12px #777;}
.online-dot.ok {background:var(--ok);box-shadow:0 0 10px #39f361;}
.online-dot.bad {background:#f48a9b;box-shadow:0 0 10px #dd5170;}
.sidebar-detail {display:flex;align-items:center;justify-content:space-between;gap:4px;border-top:1px solid #7760b532;padding:10px 0;font-size:.73rem;}
.sidebar-detail span { color:#b6abd5; }
.sidebar-detail strong {font-size:.73rem;}
.sidebar-foot { margin-top:auto; padding:24px 11px 5px;color:#a79cca;font-size:.71rem;display:flex;justify-content:space-between;align-items:center;gap:6px;}
.sidebar-foot span {font-weight:700;color:#cfb8ff;border:1px solid #7b32dc;border-radius:99px;padding:4px 8px;}
.primary-column { min-width:0;display:grid;gap:17px; }
.overview-card { padding:22px; }
.overview-title h1 {font-size:clamp(1.2rem,2vw,1.7rem);margin:7px 0 4px;font-weight:760;}
.overview-title p { color:var(--muted); font-size:.79rem;margin:0; }
.stats { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:19px; }
.stat { min-width:0;padding:15px 16px;border-radius:13px;background:linear-gradient(145deg,#21194a9c,#11132dbd);border:1px solid var(--line-soft); }
.stat-label {font-size:.72rem;color:#c9bdea;font-weight:650;}
.stat strong {display:block;font-size:2.05rem;letter-spacing:-.07em;line-height:1.35;margin:1px 0;}
.stat strong.small-value {font-size:clamp(1rem,1.35vw,1.4rem);letter-spacing:-.03em;margin:11px 0 7px;}
.stat small {font-size:.67rem;color:#a5a2c9;}
.notice {background:linear-gradient(100deg,#34261b,#3426238c);border:1px solid #85634f;border-radius:12px;color:var(--warn);padding:12px 15px;font-size:.78rem;}
.notice.good {background:#1b3a34;color:#b5ffdb;border-color:#3c9477;}
.channel-card { overflow:hidden;min-width:0; }
.section-heading {display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 19px;border-bottom:1px solid var(--line-soft);}
.section-title {display:flex;align-items:center;gap:11px;min-width:0;}
.section-title h2 {margin:0 0 3px;font-size:1.02rem;}
.section-title p {margin:0;color:var(--muted);font-size:.69rem;}
.section-symbol {font-size:1.7rem;color:#a88aff;text-shadow:0 0 11px #995dff;}
.channel-tools {display:flex;align-items:center;gap:7px;}
.channel-tools input {width:clamp(125px,15vw,202px);padding:9px 11px;font-size:.74rem;}
.secondary.compact {display:grid;place-items:center;min-width:37px;min-height:37px;padding:6px 10px;font-size:1.2rem;}
.channels {display:grid;gap:0;padding:11px 12px 16px;}
.channel { min-width:0;padding:0; }
.channel-title {display:flex;align-items:center;gap:7px;width:100%;min-width:0;padding:10px 12px;border:0;border-bottom:1px solid #54409957;border-radius:10px;color:#e9e4ff;text-align:left;background:linear-gradient(100deg,#342263b5,#251b52b0 85%,#1d1643b5);}
.channel-title:hover {background:linear-gradient(100deg,#55359dbc,#2e215fa3);}
.channel-symbol {font-size:1.0rem;flex:0 0 17px;color:#c5abff;}
.channel-chevron {width:17px;color:#bea6fa;flex:none;display:inline-block;text-align:center;transition:transform .15s;}
.channel-chevron.collapsed {transform:rotate(-90deg);}
.channel-name {font-size:.83rem;font-weight:730;word-break:break-word;}
.occupancy {font-size:.7rem;color:#c2b5e5;white-space:nowrap;margin-left:auto;}
.persons {padding:6px 8px 10px 29px;}
.person {display:flex;align-items:center;gap:10px;padding:7px 3px;border-bottom:1px solid #50437538;}
.person:last-child {border-bottom:0;}
.avatar {width:26px;height:26px;flex:0 0 26px;border-radius:50%;display:grid;place-items:center;font-size:.7rem;font-weight:800;background:linear-gradient(145deg,#6635dc,#246ef2);box-shadow:0 0 8px #4d44fc8c;border:1px solid #a88aff9e;}
.person-label {min-width:0;flex:1;}
.person-name {font-weight:660;font-size:.8rem;overflow-wrap:anywhere;}
.person-meta {color:#aba5ce;font-size:.68rem;margin-top:2px;}
.friend-pill {color:#dec8ff;background:#4d287c66;border-radius:99px;padding:2px 6px;font-size:.64rem;margin-left:6px;white-space:nowrap;}
.friend-btn {font-size:.7rem;border-radius:9px;padding:7px 9px;white-space:nowrap;}
.friend-btn.active {color:#d7b5ff;border-color:#a26cff;box-shadow:inset 0 0 6px #7845d33c;}
.empty {font-size:.79rem;color:#a49acb;padding:24px 12px;text-align:center;}
.info-column {display:grid;gap:17px;min-width:0;}
.info-card {padding:17px 17px 20px;overflow:hidden;}
.info-head {display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line-soft);padding-bottom:12px;margin-bottom:13px;}
.info-head h2 {margin:0;font-size:.98rem;white-space:normal;}
.info-head h2>span:first-child {color:#c297ff;text-shadow:0 0 11px #943ffb;margin-right:4px;}
.status-tag {white-space:nowrap;border-radius:99px;font-size:.65rem;padding:6px 9px;font-weight:760;border:1px solid transparent;}
.status-tag.ok {border-color:#1bc85c;color:#65ff91;background:#102a24;}
.status-tag.bad {border-color:#b24669;color:#ffa5b6;background:#341a2b;}
.status-tag.unknown {border-color:#55468f;color:#c5b5fc;background:#231b43;}
.server-summary {display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.server-summary>div {display:grid;gap:4px;text-align:center;padding:6px;}
.server-summary>div+div {border-left:1px solid #7f5cb239;}
.server-summary span {color:#aa9ecc;font-size:.72rem;}
.server-summary strong {font-size:1.6rem;}
.quiet-btn {font-size:.7rem;padding:6px 9px;border-color:transparent;background:transparent;color:#c5a8f7;}
.friends-online-list {display:grid;gap:0;}
.friends-online-list .friend-presence {padding:10px 2px;border-bottom:1px solid #765baf34;display:flex;align-items:center;gap:9px;font-size:.78rem;}
.friends-online-list .friend-presence:last-child {border:0;}
.friend-presence .presence-name {flex:1;min-width:0;overflow-wrap:anywhere;}
.presence-status {font-size:.66rem;color:#77f39d;white-space:nowrap;}
.presence-status.offline {color:#9d95b5;}
.activity-text {margin-bottom:7px;font-size:.82rem;color:#ddd4f7;}
.activity-hint {font-size:.72rem;color:#928daf;line-height:1.6;margin:0;}

/* Sign-in and management panels use exactly the same visual system. */
.login-card {max-width:480px;margin:clamp(18px,7vh,78px) auto 38px;padding:clamp(25px,4vw,43px);text-align:center;}
.hero-mark {width:64px;height:64px;display:grid;place-items:center;font-size:2.8rem;color:#d4b1ff;text-shadow:0 0 18px #9b3aff;margin:0 auto 18px;border:1px solid var(--line);background:#2b1f64;border-radius:17px;}
.login-card h1 {margin:10px 0 8px;}
.login-card p {color:var(--muted);font-size:.86rem;line-height:1.5;}
.login-card form {margin:23px 0 0;text-align:left;}
.login-card label,.password-label {display:block;font-size:.77rem;font-weight:740;margin:13px 0 7px;}
input[type=text],input[type=password],input[type=time],input[type=search],select {background:#10122d;border:1px solid #65539a;color:var(--text);border-radius:10px;padding:11px 12px;min-width:0;max-width:100%;}
input[type=text],input[type=password],input[type=time],select {width:100%;}
input::placeholder {color:#9990bf;}
.login-card .primary {margin-top:18px;}
.footnote {margin-top:24px;color:#8c83ae;font-size:.72rem;}
.error {color:#ff9fae !important;}
.overlay {position:fixed;z-index:30;inset:0;display:flex;justify-content:center;align-items:flex-start;overflow:auto;padding:clamp(12px,3vw,30px);background:#040517da;backdrop-filter:blur(9px);}
.settings-panel {width:min(100%,610px);padding:clamp(18px,3vw,28px);margin:auto 0;box-shadow:0 25px 100px #000b,0 0 45px #6635d840;}
.settings-head {position:sticky;top:-30px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-8px -7px 14px;padding:12px 7px;background:linear-gradient(#151337 72%,#151337d0);border-radius:12px;}
.settings-head h2 {font-size:1.55rem;margin:6px 0 0;}
.settings-group {margin-top:15px;padding:15px;border:1px solid var(--line-soft);border-radius:13px;background:#19143869;}
.settings-group h3 {font-size:1.02rem;margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line-soft);}
.settings-group .tiny {margin-bottom:13px;}
.setting-row {display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--line-soft);}
.setting-row strong {font-size:.81rem;}
.setting-row small {display:block;color:var(--muted);font-size:.71rem;margin-top:5px;}
.setting-row input[type=checkbox],.friend-notify input {width:19px;height:19px;flex:none;accent-color:#994cfc;}
.scope-select {margin:3px 0 9px;}
.times {display:flex;gap:12px;margin:12px 0 16px;}
.times label {flex:1;min-width:0;color:var(--muted);font-size:.79rem;}
.times input {margin-top:6px;padding:9px;}
.wide {width:100%;margin-top:9px;}
.friends-list {display:grid;gap:8px;}
.friend-row {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:11px;background:#1e1941;border:1px solid #5f4f923c;border-radius:11px;}
.friend-row div {min-width:0;}
.friend-row strong {font-size:.82rem;word-break:break-word;}
.friend-row span {display:block;color:#b5a8d7;font-size:.69rem;word-break:break-all;margin-top:3px;}
.friend-notify {display:inline-flex;align-items:center;gap:6px;font-size:.73rem;cursor:pointer;}
.friend-notify span {white-space:nowrap;}
.guest-create {display:grid;gap:8px;}
.guest-secret {display:grid;gap:9px;padding:13px;background:#38266881;border:1px solid #956cee;border-radius:11px;margin:12px 0;}
.guest-secret strong {font-size:.83rem;}
.guest-secret input {font-family:ui-monospace, monospace;}
.guest-actions {display:flex;gap:7px;flex-wrap:wrap;align-items:center;}
.rename-controls {display:flex;align-items:stretch;gap:8px;}
.rename-controls input {flex:1;min-width:0;}
.rename-controls button {white-space:nowrap;}
#renameInfo {margin:8px 0 0;}
.settings-panel .notice {margin-top:12px;}
.save-toast {position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:35;max-width:min(92vw,440px);width:max-content;padding:12px 18px;background:#1c4133;border:1px solid #5de9a7;border-radius:13px;color:#b7ffdc;font-size:.86rem;font-weight:700;box-shadow:0 15px 40px #000b;pointer-events:none;}

@media(max-width:1250px) {
  .dashboard-grid {grid-template-columns:195px minmax(0,1fr) 254px;gap:12px;}
  .sidebar {padding:10px 7px;}
  .info-card {padding:14px;}
  .section-heading {flex-wrap:wrap;}
  .channel-tools {width:100%;}
  .channel-tools input {flex:1;width:100%;}
}
@media(max-width:1000px) {
  .dashboard-grid {grid-template-columns:minmax(0,1fr) 250px;}
  .sidebar {grid-column:1/-1;min-height:auto;position:static;padding:9px;}
  .nav-list {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
  .nav-btn {justify-content:center;padding:11px 8px;gap:7px;font-size:.82rem;}
  .sidebar-lower,.sidebar-foot {display:none;}
  .primary-column {grid-column:1;}
  .info-column {grid-column:2;}
}
@media(max-width:700px) {
  .header-inner {padding:14px 17px;flex-direction:column;align-items:stretch;gap:13px;}
  .topbar {min-height:150px;}
  .brand-icon {width:53px;height:53px;border-radius:15px;}
  .brand-title {font-size:clamp(1.32rem,5.4vw,2rem);}
  .brand {gap:11px;}
  .action-bar {justify-content:flex-end;gap:7px;}
  .account-badge {margin-right:auto;max-width:48vw;padding:8px 12px;}
  .logout-btn {min-height:39px;padding:9px 10px;}
  .icon-btn {min-height:39px;min-width:39px;padding:8px;}
  .shell {padding:12px 10px 35px;}
  .dashboard-grid {grid-template-columns:minmax(0,1fr);gap:13px;}
  .sidebar, .primary-column, .info-column {grid-column:1;}
  .nav-list {gap:4px;}
  .nav-btn {display:grid;justify-items:center;gap:3px;font-size:.64rem;min-height:62px;padding:9px 3px;text-align:center;}
  .nav-glyph {font-size:1.36rem;}
  .info-column {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .activity-card {grid-column:1/-1;}
  .overview-card {padding:15px;}
  .stats {gap:6px;}
  .stat {padding:10px 8px;}
  .stat strong {font-size:1.62rem;}
  .stat strong.small-value {font-size:1rem;margin:8px 0 7px;}
  .stat-label {font-size:.66rem;}
  .stat small {font-size:.59rem;}
  .channel-card,.info-card {border-radius:14px;}
  .section-heading {padding:13px 12px;}
  .channels {padding:8px 6px;}
  .channel-title {padding:10px 7px;}
  .person {gap:7px;}
  .persons {padding:3px 4px 7px 12px;}
  .friend-btn {padding:7px;}
  .settings-panel {padding:13px;}
  .settings-group {padding:11px;}
}
@media(max-width:420px) {
  .info-column {grid-template-columns:1fr;}
  .activity-card {grid-column:auto;}
  .brand-title {font-size:1.31rem;}
  .nav-btn {font-size:.59rem;}
  .friend-pill {display:inline-block;}
  .rename-controls {flex-direction:column;}
  .account-badge::before {display:none;}
}
@media(prefers-reduced-motion:reduce) {html {scroll-behavior:auto;}button {transition:none;}}

/* Precise line icons and delicate dotted neon mesh, matching the banner. */
.nav-glyph {display:grid;place-items:center;}
.nav-glyph svg {width:22px;height:22px;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;fill:none;}
.topbar::before {content:"";position:absolute;inset:0 0 0 0;pointer-events:none;z-index:-1;opacity:.16;background-image:radial-gradient(circle,#a36dff .75px,transparent 1.2px);background-size:11px 9px;mask-image:linear-gradient(to bottom,transparent 35%,#000 90%);-webkit-mask-image:linear-gradient(to bottom,transparent 35%,#000 90%);}

/* v0.2.5: Offline visitor picker stays inside the existing unified neon dialog. */
#visitorSearch { width:100%; margin-bottom:6px; }
.visitor-row { display:flex;align-items:center;gap:10px;padding:10px;background:#1e1941;border:1px solid var(--line-soft);border-radius:11px;min-width:0; }
.visitor-row .avatar { width:36px;height:36px;flex:0 0 36px; }
.visitor-details { flex:1;min-width:0;display:grid;gap:3px; }
.visitor-details strong { font-size:.86rem;overflow-wrap:anywhere; }
.visitor-meta { color:var(--muted);font-size:.72rem; }
.visitor-meta.online { color:var(--ok); }
.visitor-row .friend-btn { flex:0 0 auto;padding:9px 10px;font-size:.78rem; }
@media(max-width:420px) { .visitor-row { gap:6px;padding:8px; } .visitor-row .friend-btn { padding:7px; } }

/* v0.2.5: Uploaded account photos with polished neon initial fallback. */
.visually-hidden {position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}
.avatar-bubble {
  width:36px;height:36px;flex:0 0 36px;border-radius:50%;display:inline-grid;place-items:center;
  position:relative;overflow:hidden;isolation:isolate;font-size:.88rem;font-weight:800;letter-spacing:-.055em;
  color:#faf3ff;background:radial-gradient(circle at 28% 18%,#9e75ff,#5334b6 48%,#1f438b 100%);
  border:1px solid #c097ffb5;box-shadow:0 0 0 2px #5d38b533,0 0 15px #7c4dff63,inset 0 2px 8px #e0b4ff4d;
  text-shadow:0 1px 5px #100928;
}
.avatar-bubble .avatar-uploaded {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;background:#18102d;}
.account-badge {display:inline-flex;align-items:center;gap:10px;padding:5px 14px 5px 6px;min-height:46px;}
.account-badge::before {display:none;}
.account-avatar {width:31px;height:31px;flex-basis:31px;font-size:.78rem;}
#accountName {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.profile-photo-row {display:flex;align-items:center;gap:17px;margin:16px 0 17px;padding:14px;border:1px solid #6848b35d;background:#1d1744a8;border-radius:14px;}
.profile-avatar {width:76px;height:76px;flex-basis:76px;font-size:1.7rem;}
.profile-photo-actions {flex:1;min-width:0;display:grid;gap:6px;}
.profile-photo-actions p {margin:0;}
.profile-photo-buttons {display:flex;flex-wrap:wrap;gap:8px;}
.profile-photo-buttons button {font-size:.76rem;padding:8px 10px;}
.guest-row {gap:10px;align-items:center;}
.guest-avatar {width:32px;height:32px;flex-basis:32px;}
.guest-row strong {min-width:0;overflow-wrap:anywhere;}
@media(max-width:420px){.profile-photo-row {gap:10px;padding:10px;}.profile-avatar{width:59px;height:59px;flex-basis:59px;font-size:1.3rem;}.profile-photo-buttons button{font-size:.7rem;}.account-avatar {width:26px;height:26px;flex-basis:26px;}}
/* TS3 visitor initials use the same quieter glass-neon design language. */
.person .avatar,.visitor-row .avatar {
  background:radial-gradient(circle at 28% 15%,#9f76f4,#49349f 57%,#2449a2);
  border:1px solid #bda1ffb0;
  box-shadow:0 0 0 2px #6946a626,0 0 10px #855df452,inset 0 1px 5px #f3cbff40;
  color:#fff5ff;text-shadow:0 1px 3px #080520;
}

/* v0.2.7: Stable UID-linked profile avatars in all TeamSpeak views. */
.avatar { position:relative;overflow:hidden;isolation:isolate; }
.avatar .avatar-uploaded {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;background:#18102d;}
.friend-presence .avatar {width:30px;height:30px;flex:0 0 30px;font-size:.75rem;}
.friend-row > .avatar {width:34px;height:34px;flex:0 0 34px;}
.ts3-link-box {margin:13px 0 18px;padding:13px;border:1px solid var(--line-soft);border-radius:12px;background:#15133490;}
.ts3-link-box > strong {display:block;font-size:.89rem;margin-bottom:7px;}
.ts3-link-box > .muted {margin:0 0 9px;}
.ts3-link-status {font-size:.77rem;font-weight:650;color:#c5b1ff;margin:8px 0;overflow-wrap:anywhere;}
#ts3ProfileSearch {width:100%;}
.ts3-profile-matches {display:grid;gap:5px;margin-top:8px;max-height:265px;overflow-y:auto;}
.ts3-match {display:flex;align-items:center;gap:9px;padding:7px 9px;background:#20194a;border:1px solid #5f4f9257;border-radius:10px;}
.ts3-match .avatar {width:30px;height:30px;flex:0 0 30px;}
.ts3-match-name {flex:1;min-width:0;font-size:.8rem;font-weight:700;overflow-wrap:anywhere;}
.ts3-match .friend-btn {font-size:.72rem;padding:7px 9px;}
#ts3UnlinkBtn {margin-top:8px;font-size:.73rem;padding:7px 10px;}
#ts3LinkMessage {margin:8px 0 0;}

/* v0.2.7: Recognizable user avatars and compact, touch-friendly direct actions. */
.person {
  display:grid;grid-template-columns:52px minmax(0,1fr);grid-template-rows:auto auto;
  align-items:center;column-gap:12px;row-gap:6px;min-width:0;
  padding:12px 7px;border-bottom:1px solid #62529343;
}
.person:hover {background:#3b286d24;border-radius:10px;}
.person .avatar {grid-column:1;grid-row:1/3;width:52px;height:52px;flex:0 0 52px;font-size:1.1rem;border-radius:50%;}
.person-label {grid-column:2;min-width:0;}
.person-name {font-size:.89rem;line-height:1.3;}
.person-meta {margin-top:3px;font-size:.72rem;}
.person-actions {grid-column:2;display:flex;align-items:center;flex-wrap:wrap;gap:6px;min-width:0;}
.person-action {
  flex:0 0 auto;min-height:34px;padding:7px 10px;border-radius:9px;
  border:1px solid #6551b2;background:#17143bd9;color:#eee8ff;
  font-size:.73rem;font-weight:700;line-height:1.15;white-space:nowrap;
}
.person-action:hover:not(:disabled) {border-color:#b584ff;background:#30235f;box-shadow:0 0 10px #8045eb3a;}
.person-friend.active {border-color:#9971e7;color:#eedbff;background:#382358a1;}
.person-push.on {border-color:#3f9772;color:#99f6c5;background:#10382ba8;}
.person-push.off:not(:disabled) {border-color:#897284;color:#d8bed8;}
.person-action:disabled {opacity:.52;cursor:default;}
.person-copy {color:#bbb5dc;}
.person-manage {border-color:#bd8d59;color:#ffd6a2;}

.friend-presence .avatar {width:40px;height:40px;flex:0 0 40px;font-size:.91rem;}
.friend-row > .avatar {width:44px;height:44px;flex:0 0 44px;font-size:1rem;}
.guest-row > .guest-avatar {width:44px;height:44px;flex:0 0 44px;}
.ts3-match .avatar {width:40px;height:40px;flex:0 0 40px;}
.visitor-row {display:grid;grid-template-columns:46px minmax(0,1fr);grid-template-rows:auto auto;column-gap:11px;row-gap:7px;align-items:center;padding:11px;}
.visitor-row .avatar {grid-column:1;grid-row:1/3;width:46px;height:46px;flex:0 0 46px;font-size:1rem;}
.visitor-details {grid-column:2;}
.visitor-row .person-actions {grid-column:2;}
.guest-row.guest-focus {border-color:#d5a7ff;box-shadow:0 0 16px #9453e656;}
@media(min-width:1580px) {
  .person {grid-template-columns:52px minmax(0,1fr) auto;grid-template-rows:auto;}
  .person .avatar {grid-row:1;}
  .person-actions {grid-column:3;grid-row:1;}
}
@media(max-width:700px) {
  .person {grid-template-columns:46px minmax(0,1fr);column-gap:10px;padding:10px 4px;}
  .person .avatar {width:46px;height:46px;flex-basis:46px;}
  .person-action {font-size:.7rem;min-height:36px;padding:7px 9px;}
  .visitor-row .person-action {font-size:.7rem;padding:7px 9px;}
}

/* Mandatory first-login password change: no dashboard is visible until completed. */
.initial-password-view {max-width:520px;}
.initial-password-view p {line-height:1.6;}
.initial-password-logout {margin:18px auto 0;}

/* Multi-server account permissions: limited to Owner, adaptive layout. */
.account-access-controls {grid-column:1/-1;display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;
  padding:9px 0 2px 55px;width:100%;min-width:0;}
.account-role-label {display:grid;gap:6px;font-size:.72rem;font-weight:700;color:#cbb7ff;}
.account-role {min-width:122px;max-width:165px;padding:8px 11px;}
.account-server-access {min-width:220px;flex:1;border:1px solid var(--line-soft);border-radius:10px;
  padding:10px 12px;display:flex;align-items:center;flex-wrap:wrap;gap:9px;}
.account-server-access legend {font-size:.73rem;font-weight:700;color:#cbb7ff;padding:0 6px;}
.account-server-check {display:inline-flex;align-items:center;gap:6px;color:#e6deff;font-size:.73rem;
  padding:6px 8px;border:1px solid var(--line-soft);border-radius:8px;}
.account-server-check input {accent-color:#994cfc;width:17px;height:17px;}
.account-server-access .friend-btn {margin-left:auto;}
@media(max-width:700px) { .account-access-controls {padding-left:0;flex-direction:column;} .account-server-access {width:100%;min-width:0;} }

/* Dynamic multi-server overview and editor. */
.server-switch {display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0 9px;}
.server-switch label {color:#cbbdf1;font-weight:700;font-size:.79rem;}
.server-switch select {max-width:min(100%,320px);padding:9px 12px;flex:1;}
.server-quick-list {display:flex;gap:8px;overflow-x:auto;padding:3px 0 7px;max-width:100%;scrollbar-width:thin;}
.server-quick {white-space:nowrap;padding:8px 12px;border-radius:11px;min-height:36px;
  border:1px solid #54458d;color:#d7c9f6;background:#211b48;font-size:.73rem;font-weight:700;}
.server-quick.active {border-color:#c185ff;color:#fff;background:linear-gradient(105deg,#6337be,#2b307a);box-shadow:0 0 10px #7535dd59;}
.server-quick:disabled {opacity:.45;}
.managed-server-list {display:grid;gap:9px;margin-bottom:16px;}
.managed-server-row {border:1px solid var(--line-soft);background:#171539a8;border-radius:12px;padding:12px;min-width:0;}
.managed-server-head {display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}
.managed-server-head strong {overflow-wrap:anywhere;}
.managed-server-row>small {display:block;margin-top:5px;overflow-wrap:anywhere;}
.managed-server-actions {display:flex;gap:7px;align-items:center;flex-wrap:wrap;}
.server-form,.server-edit {display:grid;gap:9px;margin-top:12px;}
.server-form label,.server-edit label {font-size:.75rem;font-weight:650;color:#d4c8f5;}
.server-form input,.server-edit input {display:block;width:100%;margin-top:5px;padding:9px 10px;}
.server-form-pair {display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.server-form-pair>div {min-width:0;}
.server-form-pair input[type=checkbox],.server-edit-check input[type=checkbox] {display:inline;width:17px;height:17px;margin:0 7px 0 0;vertical-align:middle;accent-color:#994cfc;}
@media(max-width:460px) {.server-form-pair {grid-template-columns:1fr;}.server-switch {align-items:stretch;flex-direction:column;}}

.server-quick.online::before {content:"";display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#56ee89;box-shadow:0 0 9px #56ee897a;}

/* v0.3.0: approved premium radar-eye R icon and clear account identity. */
.brand-icon {overflow:hidden;padding:0;border-radius:23px;background:#09051e;}
.brand-icon img {width:100%;height:100%;object-fit:cover;display:block;}
.account-identity {min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;}
.account-identity strong {font-size:.83rem;font-weight:800;line-height:1.2;max-width:128px;}
.account-identity small {font-size:.66rem;color:#bb9aff;font-weight:650;line-height:1.2;}
.account-badge {max-width:245px;}
.nav-list .manager-nav {color:#e7dcff;}
/* Round avatars must not inherit .friend-row span or text rules. */
.guest-row {display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;column-gap:12px;row-gap:10px;padding:14px;}
.guest-row > .guest-avatar.avatar-bubble {
  grid-column:1;grid-row:1;width:54px;height:54px;min-width:54px;max-width:54px;
  min-height:54px;max-height:54px;flex:none;box-sizing:border-box;
  display:grid;place-items:center;border-radius:50%;overflow:hidden;line-height:1;
  padding:0;text-align:center;font-size:1.05rem;
}
.guest-row > .guest-avatar .avatar-uploaded {
  display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;
  border-radius:50%;object-fit:cover;object-position:50% 50%;
}
.guest-identity {grid-column:2;grid-row:1;min-width:0;display:flex;flex-direction:column;gap:4px;align-items:flex-start;justify-content:center;}
.guest-identity .guest-display-name {font-size:.91rem;color:#f6f2ff;line-height:1.22;}
.guest-identity .guest-role {display:block;font-size:.73rem;color:#bba7e5;line-height:1.25;}
.guest-row > .guest-actions {grid-column:1/-1;display:flex;gap:7px;flex-wrap:wrap;align-items:center;}
.guest-row > .account-access-controls {grid-column:1/-1;padding:6px 0 0;}
.account-active-label {display:inline-flex;align-items:center;gap:7px;border:1px solid #775bbb;
  border-radius:9px;padding:6px 10px;color:#d6c9f9;font-weight:700;font-size:.74rem;cursor:pointer;}
.account-active-toggle {appearance:none;width:31px;height:18px;position:relative;margin:0;border-radius:99px;
  background:#625b79;border:1px solid #9b8fb4;cursor:pointer;transition:background .15s;}
.account-active-toggle::before {content:"";position:absolute;left:2px;top:2px;width:12px;height:12px;
  background:#efeaff;border-radius:50%;transition:transform .15s;}
.account-active-toggle:checked {background:#238158;border-color:#5ee9a8;}
.account-active-toggle:checked::before {transform:translateX(13px);}
.account-active-toggle:focus-visible {outline:2px solid #c594ff;outline-offset:3px;}
.account-active-toggle:disabled {opacity:.55;cursor:wait;}
/* All three state dots are present, including a red offline marker. */
.server-quick {display:inline-flex;align-items:center;gap:8px;}
.server-status-light {display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;
  background:#89849b;box-shadow:0 0 7px #89849b55;}
.server-quick.status-online .server-status-light {background:#56ee89;box-shadow:0 0 9px #56ee89b3;}
.server-quick.status-offline .server-status-light {background:#ff6b80;box-shadow:0 0 9px #ff526ea8;}
.server-quick.status-unknown .server-status-light,.server-quick.status-paused .server-status-light {background:#9991ba;}
.server-quick.online::before {display:none;}
/* Compact two-day presence timeline shown beside the live dashboard. */
.timeline-window {color:#c4acee;font-size:.7rem;white-space:nowrap;}
.timeline-filter {display:grid;gap:6px;color:#b6a6dc;font-size:.7rem;margin-bottom:12px;}
.timeline-filter select {padding:7px 10px;font-size:.76rem;width:100%;}
.timeline-list {max-height:326px;overflow-y:auto;scrollbar-width:thin;}
.timeline-entry {display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:9px;align-items:center;
  padding:10px 0;border-bottom:1px solid #6755a132;}
.timeline-entry:last-child {border-bottom:0;}
.timeline-dot {height:8px;width:8px;border-radius:50%;background:#9991ba;}
.timeline-dot.joined {background:#56ee89;box-shadow:0 0 7px #56ee8980;}
.timeline-dot.left {background:#ff6b80;box-shadow:0 0 7px #ff6b8080;}
.timeline-summary {min-width:0;display:grid;gap:3px;}
.timeline-summary strong {font-size:.77rem;overflow-wrap:anywhere;}
.timeline-summary small {font-size:.67rem;color:#c0b0dd;}
.timeline-summary .timeline-server {color:#a78deb;}
.timeline-time {font-size:.67rem;color:#a99bd0;white-space:nowrap;font-variant-numeric:tabular-nums;}
.timeline-note {margin:9px 0 0;line-height:1.45;}
@media(max-width:700px) {
  .nav-list {grid-template-columns:repeat(3,minmax(0,1fr));}
  .nav-btn {min-height:60px;}
  .guest-row {padding:11px;}
}

/* v0.3.0 premium visual language: shared elevation, crisp icons and states. */
:root {
  --premium-glass:linear-gradient(150deg,rgba(39,27,86,.95),rgba(17,15,47,.98) 67%,rgba(13,17,44,.98));
  --premium-edge:rgba(164,120,255,.43);
  --premium-highlight:rgba(213,185,255,.7);
  --premium-blue:#6dbdff;
}
/* Source artwork already contains its own neon rim. Do not create a second border. */
.brand-icon {
  border:0;box-shadow:0 0 25px #8e4aff4c,0 0 0 1px #bca2ff20;
  background:#0a071e;border-radius:23px;
}
.brand-icon img {display:block;width:100%;height:100%;object-fit:contain;}
/* A uniform compact icon system, including the previously malformed settings control. */
.icon-btn,.nav-glyph {flex-shrink:0;}
#settingsBtn {
  position:relative;isolation:isolate;width:46px;height:46px;min-height:46px;min-width:46px;
  padding:0;border-radius:14px;border:1px solid var(--premium-edge);
  background:linear-gradient(145deg,#2b2159 0%,#171135 57%,#11122d 100%);
  box-shadow:inset 0 1px 0 #ccb2ff45,0 7px 20px #050317a3,0 0 12px #8158ff2d;
  color:#dfc7ff;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s;
}
#settingsBtn svg {width:23px;height:23px;stroke:currentColor;stroke-width:1.85;fill:none;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px #ae76ff4d);}
#settingsBtn:hover {transform:translateY(-1px);color:#fff;border-color:#c18cff;
  background:linear-gradient(145deg,#433072,#201847 75%);box-shadow:inset 0 1px 0 #dbc2ff70,0 8px 25px #08051bc2,0 0 16px #b259ff55;}
#settingsBtn:active {transform:translateY(1px);box-shadow:inset 0 2px 8px #08051baa,0 0 8px #934aff42;}
#settingsBtn:focus-visible {outline:2px solid #d9bbff;outline-offset:3px;}
.nav-glyph svg {width:21px;height:21px;stroke-width:1.8;}
.nav-btn {transition:background .18s,border-color .18s,box-shadow .18s,color .18s;}
.nav-btn:hover {border-color:#9674d8;background:#29204d;}
.nav-btn.active {background:linear-gradient(105deg,#392b7f,#221b4b);
  border-color:#ad7aff;box-shadow:inset 3px 0 0 #bb85ff,inset 0 1px 0 #d5b6ff36,0 0 17px #8550f734;}
.sidebar,.overview-card,.channel-card,.info-card,.settings-panel,.login-card {
  background:var(--premium-glass);border-color:var(--premium-edge);
  box-shadow:inset 0 1px 0 #d8baff18,0 10px 30px #02031a8a;
}
/* Shared focus and pressed feedback across account and administrative controls. */
.primary,.secondary,.text-btn,.friend-btn,.quiet-btn {transition:filter .18s,transform .18s,background .18s,border-color .18s,box-shadow .18s;}
.primary:active,.secondary:active,.text-btn:active,.friend-btn:active,.quiet-btn:active {transform:translateY(1px);filter:brightness(.93);}
.primary:focus-visible,.secondary:focus-visible,.text-btn:focus-visible,.friend-btn:focus-visible,.quiet-btn:focus-visible,
.nav-btn:focus-visible,.server-quick:focus-visible {outline:2px solid #d9bbff;outline-offset:2px;}
.settings-head {background:linear-gradient(180deg,#1a153b 75%,#1a153bd9);border-bottom:1px solid #a77aff29;}
.settings-group {background:linear-gradient(145deg,#1b173fba,#111029b5);border-color:#886bc15e;}
.settings-group h3 {color:#f7f0ff;}
.managed-server-row,.guest-row,.friend-row {border-color:#7864b85e;background:linear-gradient(130deg,#27204dba,#1c173ca8);}
.server-quick,.account-active-label {transition:background .16s,border-color .16s,box-shadow .16s;}
.server-quick:hover:not(:disabled) {border-color:#bd8cff;background:#2e235c;box-shadow:0 0 12px #9558ef34;}
input[type=text]:focus,input[type=password]:focus,input[type=time]:focus,input[type=search]:focus,select:focus {
  border-color:#b58cfd;box-shadow:0 0 0 2px #a76cff24;}
@media(max-width:700px) {
  #settingsBtn {width:40px;height:40px;min-height:40px;min-width:40px;border-radius:12px;}
  #settingsBtn svg {width:21px;height:21px;}
  .brand-icon {border-radius:16px;}
}
@media(prefers-reduced-motion:reduce) {
  #settingsBtn,.nav-btn,.primary,.secondary,.text-btn,.friend-btn,.quiet-btn,.server-quick {transition:none;}
}

/* ServerQuery-Diagnose: relevante Ursache sofort, technische Details nur bei Admins. */
.query-diagnostic-heading {display:block;color:#ffd4ad;font-weight:780;font-size:.9rem;margin-bottom:4px;}
.query-diagnostic-stale {font-size:.77rem;margin:5px 0;opacity:.9;}
.query-diagnostic-remedy {font-size:.79rem;line-height:1.55;margin:8px 0;color:#ffdfbd;}
.query-diagnostic-details {margin-top:10px;padding-top:9px;border-top:1px solid #b28a764d;}
.query-diagnostic-details summary {cursor:pointer;font-size:.76rem;font-weight:760;color:#e8c3ff;}
.query-diagnostic-grid {display:grid;grid-template-columns:minmax(105px,35%) minmax(0,1fr);gap:7px 12px;margin:12px 0 0;font-size:.73rem;}
.query-diagnostic-grid dt {color:#c6b9d8;}
.query-diagnostic-grid dd {margin:0;color:#f2e7ff;overflow-wrap:anywhere;font-family:ui-monospace,Consolas,monospace;}

/* Startup: do not flash the login form while checking an existing session. */
.auth-loading { min-height:180px; display:grid; justify-items:center; align-content:center; gap:18px; }
.auth-loading p { margin:0; }
.auth-loading-spinner { width:38px;height:38px;border-radius:50%;border:3px solid #7752b457;border-top-color:#b58aff;border-right-color:#398dff;animation:auth-spin .9s linear infinite;box-shadow:0 0 18px #804de955; }
@keyframes auth-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .auth-loading-spinner { animation:none; } }

/* v0.3.2: polished login mark and consistent role/status alignment. */
.hero-mark.hero-premium {width:82px;height:82px;border-radius:20px;background:#08071e;
  border:1px solid #a777ff88;box-shadow:0 0 24px #8b4aff66,inset 0 0 16px #7d4ac344;
  padding:0;overflow:hidden;}
.hero-premium img {display:block;width:100%;height:100%;object-fit:cover;}
.account-role-stack {width:165px;max-width:100%;flex:0 0 165px;display:grid;gap:7px;}
.account-role-stack .account-role-label {width:100%;}
.account-role-stack .account-role {width:100%;max-width:100%;min-width:0;min-height:38px;}
.account-role-readonly {border:1px solid #765caa;background:#181632;border-radius:9px;
  padding:9px 11px;color:#d7ccf9;font-size:.8rem;}
.account-role-stack .account-active-label {width:100%;min-height:38px;box-sizing:border-box;
  justify-content:space-between;border-color:#765caa;background:#1b1740;margin:0;}
.account-role-stack .account-active-label:hover {border-color:#b68bff;box-shadow:0 0 11px #8346de33;}
@media(max-width:520px) {.account-role-stack {width:100%;flex-basis:100%;}}

/* Server overview, Push devices, backups, and management: shared visual system. */
.global-panel {width:min(100%,760px);}
.global-server-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:14px 0 19px;}
.global-server-card {display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:6px;padding:13px 14px;border:1px solid #7550b8;border-radius:13px;
  color:#f2eeff;text-align:left;background:linear-gradient(130deg,#241a51,#12152f);
  box-shadow:inset 0 1px #c1a1ff18;}
.global-server-card:hover {border-color:#c39eff;box-shadow:0 0 16px #8247ed39;}
.global-server-card strong {font-size:.86rem;}
.global-server-card small {color:#b4a5d8;font-size:.72rem;}
.global-server-card .server-status-light {margin-bottom:3px;}
.global-server-card .status-online {background:#56ee89;box-shadow:0 0 9px #56ee89aa;}
.global-server-card .status-offline {background:#ff617e;box-shadow:0 0 9px #ff617eaa;}
.settings-mini {margin:13px 0 6px;padding:11px;border-radius:11px;
  background:#151438b3;border:1px solid var(--line-soft);}
.settings-mini > strong {font-size:.78rem;color:#dfcaff;}
.settings-mini p {margin:7px 0;}
.filter-checks {display:flex;gap:7px;flex-wrap:wrap;margin-top:9px;}
.filter-check {font-size:.75rem;display:inline-flex;align-items:center;gap:6px;
  border:1px solid #6651a6;border-radius:8px;padding:7px 9px;background:#211d46;}
.filter-check input {accent-color:#a363ff;width:17px;height:17px;}
.management-list {display:grid;gap:9px;margin:12px 0;}
.management-row {display:flex;flex-direction:column;align-items:flex-start;gap:6px;
  padding:11px;border:1px solid var(--line-soft);border-radius:11px;
  background:#1c1940b0;min-width:0;overflow-wrap:anywhere;}
.management-row > strong {font-size:.81rem;color:#f1e9ff;}
.management-row > small {font-size:.69rem;color:#b9a7d5;}
.management-row input {width:100%;font-size:.79rem;}
.management-row .managed-server-actions {width:100%;}
#backupManager input[type=password],#backupManager input[type=file] {display:block;width:100%;margin:10px 0;
  color:#e8dbff;background:#14112d;border:1px solid #65539a;border-radius:10px;padding:11px;}
#serverProbeResult {line-height:1.5;overflow-wrap:anywhere;}

/* v0.3.3: ergonomic management views and quiet premium controls. */
.global-server-heading {display:flex;align-items:center;gap:9px;min-width:0;}
.global-server-heading strong {overflow-wrap:anywhere;line-height:1.35;}
.global-server-card .global-server-heading .server-status-light {margin:0;flex:0 0 9px;}
.quick-panel {width:min(100%,650px);margin:clamp(20px,7vh,80px) auto auto;}
.quick-results {display:grid;gap:5px;max-height:52vh;overflow:auto;padding:10px 1px;}
.quick-result {display:block;width:100%;padding:12px 14px;text-align:left;color:#ece4ff;
  background:#191536;border:1px solid #604e98;border-radius:10px;font-weight:600;}
.quick-result:hover,.quick-result.selected,.quick-result:focus-visible {
  background:linear-gradient(105deg,#42317c,#1b255c);border-color:#b88bff;
  box-shadow:inset 0 1px 0 #b5a3ff33,0 0 12px #8955ff33;outline:none;}
.simulation-verdict {display:block;font-size:.88rem;margin:4px 0;}
.simulation-check {width:100%;display:flex;gap:9px;align-items:center;padding:5px 0;font-size:.77rem;}
.check-ok {color:#56ee89;font-weight:800;}.check-bad {color:#ff7a9b;font-weight:800;}
#inviteShareBox input {width:100%;font-size:.77rem;}
#inviteClaimError:empty {display:none;}
.account-role-stack .account-active-label {flex-direction:row;align-items:center;}
.account-role-stack .account-active-label>span {order:0;}
.account-role-stack .account-active-label input {order:1;margin-left:auto;}
#rendezvousNow {line-height:1.5;}
@media (max-width:700px) {
 .global-server-grid {grid-template-columns:minmax(0,1fr);}
 .quick-panel {margin:20px auto auto;}
}

/* v0.3.4: consistent violet forms, no platform-grey number inputs. */
input[type=number], input[type=email], input[type=url], textarea,
.settings-panel input:not([type=checkbox]):not([type=radio]):not([type=file]),
.settings-panel select, .server-edit select {
  background:#100c29; color:#f4f0ff; border:1px solid #7158ad;
  border-radius:10px; min-height:42px;
}
input[type=number]:focus,textarea:focus,.settings-panel input:not([type=checkbox]):focus,
.settings-panel select:focus {outline:2px solid #ac83ff;outline-offset:1px;border-color:#bf97ff;}
input::placeholder,textarea::placeholder {color:#9788bd;opacity:1;}
.password-entry {display:block;position:relative;width:100%;min-width:0;margin-top:5px;}
.password-entry input {width:100%;display:block;padding-right:94px!important;margin-top:0!important;}
.password-reveal {position:absolute;right:5px;top:50%;transform:translateY(-50%);
  min-height:31px;padding:5px 10px;border:1px solid #65529a;border-radius:8px;
  color:#ddcbff;background:#21173f;white-space:nowrap;font-size:.73rem;font-weight:700;}
.password-reveal:hover,.password-reveal:focus-visible {background:#38245f;border-color:#bc87ff;}
.server-probe-message {display:block;line-height:1.5;padding:3px 0;overflow-wrap:anywhere;}
.ts3-manual-box {margin:10px 0;padding:12px;border:1px solid #594783;border-radius:12px;background:#110e2c;}
.save-preferences-btn {width:auto;max-width:100%;display:block;margin:17px 0 0 auto;
  padding:12px 20px;border-radius:11px;font-size:.89rem;font-weight:740;
  background:linear-gradient(112deg,#2c2057,#473078);border:1px solid #a680e6;
  color:#f9f4ff;box-shadow:inset 0 1px 0 #cbb7ff22,0 0 15px #6c45af20;}
.save-preferences-btn:hover {background:linear-gradient(112deg,#3b2869,#624398);border-color:#d1b0ff;}
@media(max-width:580px){.ts3-manual-box .rename-controls{flex-wrap:wrap}.save-preferences-btn{width:100%;}}

/* v0.3.4: management is a real content page, not a popup. */
.dashboard-grid.page-detail {grid-template-columns:minmax(195px,232px) minmax(0,1fr);}
.dashboard-grid.page-detail>.primary-column,
.dashboard-grid.page-detail>.info-column {display:none!important;}
.dashboard-grid .page-slot {display:none;}
.dashboard-grid.page-detail .page-slot:not(.hidden) {
  display:block;position:static;inset:auto;grid-column:2;min-width:0;
  overflow:visible;background:transparent;backdrop-filter:none;padding:0;
  z-index:auto;box-shadow:none;
}
.dashboard-grid .page-slot>.settings-panel {
  width:100%;max-width:none;margin:0;padding:clamp(16px,2vw,30px);
  border-radius:18px;box-shadow:0 9px 39px #0102135e,inset 0 1px 0 #947ff91b;
}
.dashboard-grid .page-slot .settings-head {top:0;}
@media(max-width:1000px){
 .dashboard-grid.page-detail {grid-template-columns:minmax(0,1fr);}
 .dashboard-grid.page-detail>.sidebar {grid-column:1;}
 .dashboard-grid.page-detail .page-slot:not(.hidden) {grid-column:1;}
}

.doctor-issue {padding:12px;margin:8px 0;border:1px solid #6a529e;background:#1c163d;border-radius:11px;}
.doctor-issue small {display:block;color:#bfb2d9;font-size:.73rem;margin-top:6px;}

.avatar-studio {display:grid;gap:6px;margin:12px 0;padding:12px;border:1px solid #6d51a3;border-radius:12px;background:#110d30;}
.avatar-studio label {font-size:.74rem;color:#cbb8e8;margin:3px 0 0;}
.avatar-studio input[type=range] {width:100%;accent-color:#a068ff;}
.avatar-studio .secondary {margin-top:8px;}