:root {
      color-scheme: dark;
      --bg: #070910;
      --surface: #10131f;
      --surface-strong: #161a29;
      --surface-hover: #1b2132;
      --line: rgba(137, 151, 184, .16);
      --line-strong: rgba(151, 166, 201, .3);
      --text: #f7f8fc;
      --muted: #9da7ba;
      --subtle: #717d94;
      --cyan: #66dcff;
      --blue: #6878ff;
      --indigo: #9877ff;
      --green: #36d399;
      --red: #ff5f74;
      --warning: #f6b85d;
      --shadow: 0 24px 70px rgba(0, 0, 0, .32);
      --soft-shadow: 0 12px 35px rgba(0, 0, 0, .18);
      --font-sans: "Manrope", "Segoe UI Variable", "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    }
    * { box-sizing: border-box; }
    ::selection { background: rgba(99, 116, 255, .35); }
    body {
      margin: 0; min-height: 100vh; font-family: var(--font-sans);
      background: var(--bg); letter-spacing: -.01em; line-height: 1.45;
      color: var(--text);
      -webkit-font-smoothing: antialiased;
    }
    body::before {
      content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
      background: radial-gradient(circle at 82% -12%, rgba(104, 120, 255, .19), transparent 34%), radial-gradient(circle at 18% 112%, rgba(102, 220, 255, .08), transparent 28%);
    }
    a { color: inherit; text-decoration: none; }
    .app-shell { min-height: 100vh; display: grid; grid-template-columns: 264px minmax(0, 1fr); }
    .sidebar { min-height: 100vh; padding: 22px 14px; border-right: 1px solid var(--line); background: rgba(10, 13, 23, .92); display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
    .brand { display:flex; align-items:center; gap: 11px; min-height: 44px; padding: 0 10px; margin-bottom: 30px; }
    .brand-mark { width: 34px; height: 34px; display:grid; place-items:center; border-radius: 11px; background: linear-gradient(145deg, var(--cyan), var(--blue) 55%, var(--indigo)); color: #080a13; font-size: 19px; font-weight: 900; box-shadow: 0 9px 22px rgba(99, 116, 255, .28); }
    .brand h1 { margin: 0; font-size: 18px; letter-spacing: -.04em; }
    .brand small { display:block; margin-top: 1px; color: var(--subtle); font-size: 11px; letter-spacing: .03em; }
    .sidebar-label { color: var(--subtle); font-size: 10px; font-weight: 800; letter-spacing: .1em; padding: 0 11px; margin: 17px 0 8px; text-transform: uppercase; }
    .sidebar nav { display: grid; gap: 3px; }
    .side-link { display:flex; align-items:center; gap: 10px; min-height: 42px; padding: 0 11px; color: var(--muted); border: 1px solid transparent; border-radius: 10px; font-size: 14px; font-weight: 650; transition: .17s ease; }
    .side-link:hover { color: var(--text); background: rgba(255,255,255,.045); }
    .side-link.active { color: #fff; border-color: rgba(118, 135, 255, .38); background: linear-gradient(90deg, rgba(99,116,255,.24), rgba(99,116,255,.07)); box-shadow: inset 3px 0 0 var(--cyan); }
    .side-icon { display:inline-grid; place-items:center; width: 20px; font-size: 16px; }
    .sidebar-spacer { flex:1; }
    .account { display:flex; align-items:center; gap:10px; margin: 16px 5px 0; padding: 11px 8px; border-top: 1px solid var(--line); }
    .account-name { min-width:0; flex:1; color: var(--muted); font-size: 12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .avatar-placeholder, .account img { width:32px; height:32px; flex:0 0 32px; border-radius:10px; display:grid; place-items:center; background:linear-gradient(145deg, var(--blue), var(--indigo)); color:#fff; font-size:13px; font-weight:800; object-fit:cover; }
    .logout { color:var(--subtle); background:transparent; border:0; padding:4px; font-size:16px; cursor:pointer; }
    .logout:hover { color:var(--text); }
    .content-area { min-width:0; }
    .page-topbar { min-height: 76px; display:flex; align-items:center; justify-content:space-between; padding: 0 clamp(22px, 4vw, 54px); border-bottom:1px solid rgba(40,46,64,.8); }
    .breadcrumb { color:var(--subtle); font-size:12px; font-weight:700; }
    .breadcrumb a { border-radius:6px; transition:color .17s ease, background-color .17s ease; }
    .breadcrumb a:hover { color:var(--text); }
    .breadcrumb strong { color:var(--text); margin-left:8px; font-size:13px; }
    .page-badge { color:var(--green); background:rgba(54,211,153,.1); border:1px solid rgba(54,211,153,.22); border-radius:99px; padding:5px 9px; font-size:11px; font-weight:750; }
    .page-content { width:min(1280px, 100%); margin:0 auto; padding: clamp(24px, 4vw, 46px) clamp(18px, 4vw, 54px) 64px; }
    .guest-shell { display:block; }
    .guest-shell .content-area { min-height:100vh; display:grid; place-items:center; }
    .guest-shell .page-topbar { display:none; }
    .guest-shell .page-content { width:min(520px, calc(100% - 32px)); padding:32px 0; }
    .hero { position:relative; overflow:hidden; padding: clamp(24px, 4vw, 38px); border:1px solid var(--line); border-radius:20px; background: linear-gradient(120deg, rgba(99,116,255,.18), rgba(17,21,34,.94) 58%); box-shadow:var(--shadow); }
    .hero::after { content:""; position:absolute; right:-88px; top:-112px; width:270px; height:270px; border:1px solid rgba(93,216,255,.18); border-radius:50%; box-shadow:0 0 0 36px rgba(93,216,255,.025), 0 0 0 73px rgba(93,216,255,.018); }
    .hero h2 { position:relative; margin:0 0 9px; font-size:clamp(26px, 3vw, 34px); letter-spacing:-.05em; }
    .hero p { position:relative; max-width:620px; color:var(--muted); margin:0; font-size:15px; line-height:1.55; }
    .eyebrow { color:var(--cyan); font-size:11px; letter-spacing:.1em; text-transform:uppercase; font-weight:800; margin-bottom:10px; }
    .section-heading { display:flex; align-items:end; justify-content:space-between; gap:16px; margin:32px 0 14px; }
    .section-heading h3 { margin:0; font-size:16px; letter-spacing:-.02em; }
    .section-heading p { margin:0; color:var(--muted); font-size:13px; }
    .grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:14px; }
    .metric-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; margin-top:16px; }
    .card, .panel, .metric-card { border:1px solid var(--line); background:rgba(17,21,34,.86); border-radius:15px; box-shadow:0 10px 30px rgba(0,0,0,.1); }
    .metric-card { padding:18px; }
    .metric-card b, .card b { display:block; margin-bottom:9px; color:var(--subtle); font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
    .metric-card strong { display:block; font-size:25px; letter-spacing:-.04em; }
    .metric-card small, .card small { display:block; margin-top:7px; color:var(--muted); font-size:12px; }
    .metric-status { display:inline-flex; align-items:center; gap:6px; color:var(--green); }
    .metric-status::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 0 4px rgba(54,211,153,.12); }
    .card { min-height:118px; padding:18px; transition:transform .17s ease, border-color .17s ease, background .17s ease; }
    a.card:hover, .server-card:hover, .module-card:hover { transform:translateY(-2px); border-color:var(--line-strong); background:var(--surface-hover); }
    .quick-card { display:flex; flex-direction:column; justify-content:space-between; min-height:135px; }
    .quick-icon { width:35px; height:35px; display:grid; place-items:center; border-radius:10px; background:rgba(99,116,255,.16); font-size:17px; }
    .quick-card strong { margin-top:15px; font-size:15px; }
    .quick-card span { color:var(--cyan); font-size:12px; font-weight:750; }
    .server-card { display:flex; align-items:center; gap:14px; min-height:88px; padding:16px; border:1px solid var(--line); border-radius:15px; background:rgba(17,21,34,.8); transition:.17s ease; }
    .server-card-detail { min-width:0; flex:1; }
    .server-card-detail strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
    .server-card-detail span { display:block; margin-top:5px; color:var(--muted); font-size:12px; }
    .server-arrow { color:var(--subtle); font-size:18px; }
    .server-icon { width:48px; height:48px; flex:0 0 48px; display:grid; place-items:center; border-radius:14px; overflow:hidden; background:linear-gradient(145deg, #2d3654, #1b2031); color:#dbe4ff; font-weight:800; }
    .server-icon img { width:100%; height:100%; object-fit:cover; }
    .server-icon.large { width:62px; height:62px; flex-basis:62px; border-radius:18px; font-size:24px; }
    .module-card { display:flex; align-items:center; gap:13px; min-height:91px; padding:15px; border:1px solid var(--line); border-radius:14px; background:rgba(17,21,34,.78); transition:.17s ease; }
    .module-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border-radius:11px; background:rgba(93,216,255,.1); font-size:18px; }
    .module-copy { min-width:0; flex:1; }
    .module-copy strong { display:block; font-size:13px; }
    .module-copy small { display:block; margin-top:4px; color:var(--muted); font-size:11px; line-height:1.35; }
    .module-arrow { color:var(--subtle); }
    .panel { padding:22px; }
    .panel h2, .panel h3 { margin-top:0; }
    .button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 14px; border:1px solid var(--line-strong); border-radius:9px; color:var(--text); background:var(--surface-strong); font-weight:700; font-size:13px; cursor:pointer; transition:.17s ease; }
    .button:hover { border-color:#596681; background:var(--surface-hover); }
    .button.primary { color:#fff; border-color:transparent; background:linear-gradient(135deg, var(--blue), #5363e6); box-shadow:0 7px 18px rgba(99,116,255,.22); }
    .button.discord { width:100%; min-height:46px; border:0; background:#5865f2; font-size:14px; }
    .login-box { padding:30px; border:1px solid var(--line); border-radius:20px; background:rgba(17,21,34,.9); box-shadow:var(--shadow); text-align:center; }
    .login-logo { width:52px; height:52px; display:grid; place-items:center; margin:0 auto 18px; border-radius:17px; background:linear-gradient(145deg,var(--cyan),var(--blue),var(--indigo)); color:#070912; font-size:27px; font-weight:900; }
    .login-box h2 { margin:0 0 8px; letter-spacing:-.04em; }
    .form-group { text-align:left; margin-bottom:12px; }
    input[type=password] { width:100%; min-height:44px; padding:0 12px; border:1px solid var(--line-strong); border-radius:9px; outline:0; background:#0b0e17; color:#fff; }
    input[type=password]:focus, textarea:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(93,216,255,.12); }
    .error { padding:12px 14px; background:rgba(255,95,116,.11); border:1px solid rgba(255,95,116,.4); color:#ffb3bd; border-radius:10px; font-size:13px; }
    .pill { display:inline-flex; align-items:center; min-height:26px; padding:0 9px; border:1px solid rgba(93,216,255,.28); border-radius:99px; color:var(--cyan); font-size:11px; font-weight:750; }
    .muted { color:var(--muted); }
    .empty-state { grid-column:1 / -1; padding:35px 18px; border:1px dashed var(--line-strong); border-radius:14px; color:var(--muted); text-align:center; font-size:13px; }
    .config-note { margin:0 0 17px; color:var(--muted); font-size:13px; line-height:1.5; }
    .settings-form { display:grid; gap:14px; }
    .settings-section { padding:20px; border:1px solid var(--line); border-radius:15px; background:rgba(17,21,34,.86); }
    .settings-section-head { padding-bottom:15px; margin-bottom:16px; border-bottom:1px solid var(--line); }
    .settings-section-head h4 { margin:0; font-size:15px; }
    .settings-section-head p { margin:5px 0 0; color:var(--muted); font-size:12px; }
    .settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
    .form-field { min-width:0; display:grid; gap:7px; align-content:start; }
    .form-field.wide { grid-column:1 / -1; }
    .form-label { color:#dfe4ef; font-size:12px; font-weight:720; }
    .form-hint { color:var(--subtle); font-size:10px; line-height:1.35; }
    .form-control { width:100%; min-height:42px; padding:0 11px; border:1px solid var(--line-strong); border-radius:9px; outline:0; background:#0b0e17; color:var(--text); font:inherit; font-size:13px; }
    .form-control:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(93,216,255,.12); }
    input.form-control[type=color] { min-height:48px; padding:5px; cursor:pointer; }
    input.form-control[type=color]::-webkit-color-swatch-wrapper { padding:0; }
    input.form-control[type=color]::-webkit-color-swatch { border:1px solid rgba(255,255,255,.16); border-radius:7px; }
    input.form-control[type=color]::-moz-color-swatch { border:1px solid rgba(255,255,255,.16); border-radius:7px; }
    select.form-control { cursor:pointer; }
    select.form-control[multiple] { min-height:145px; padding:8px; }
    select.form-control option { padding:6px; }
    .discord-picker { position:relative; z-index:1; min-width:0; }
    .discord-picker.discord-picker-open { z-index:30; }
    .discord-picker-control { display:grid; gap:8px; min-height:44px; padding:8px; border:1px solid var(--line-strong); border-radius:10px; background:rgba(7,9,16,.72); transition:border-color .22s ease,box-shadow .22s ease,background .22s ease; }
    .discord-picker:hover .discord-picker-control { border-color:rgba(151,166,201,.4); background:rgba(9,12,18,.82); }
    .discord-picker:focus-within .discord-picker-control { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(93,216,255,.12); }
    .discord-picker-selected { display:flex; flex-wrap:wrap; gap:6px; min-height:0; }
    .discord-picker-selected:empty { display:none; }
    .discord-picker.discord-picker-has-selection .discord-picker-control { position:relative; padding-right:42px; }
    .discord-picker.discord-picker-has-selection .discord-picker-trigger { position:absolute; top:8px; right:8px; width:28px; min-height:28px; justify-content:center; padding:0; }
    .discord-picker.discord-picker-has-selection .discord-picker-trigger [data-picker-summary] { display:none; }
    .discord-picker-chip { display:inline-flex; align-items:center; gap:6px; max-width:100%; min-height:27px; padding:0 7px 0 9px; border:1px solid rgba(107,215,255,.22); border-radius:8px; color:#dff8ff; background:linear-gradient(135deg,rgba(107,215,255,.14),rgba(124,140,255,.12)); font-size:10px; font-weight:720; }
    .discord-picker-chip-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .discord-picker-chip-remove { width:18px; height:18px; display:grid; place-items:center; padding:0; border:0; border-radius:5px; color:#9eb7c8; background:transparent; cursor:pointer; font-size:14px; line-height:1; }
    .discord-picker-chip-remove:hover { color:#fff; background:rgba(255,255,255,.12); }
    .discord-picker-trigger { width:100%; min-height:27px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 3px; border:0; color:var(--muted); background:transparent; font:inherit; font-size:11px; font-weight:700; text-align:left; cursor:pointer; }
    .discord-picker-trigger:hover { color:var(--text); }
    .discord-picker-trigger-icon { width:22px; height:22px; display:grid; place-items:center; flex:0 0 22px; border:1px solid var(--line); border-radius:7px; color:var(--subtle); transition:transform .2s ease,color .2s ease; }
    .discord-picker-open .discord-picker-trigger-icon { color:var(--cyan); transform:rotate(180deg); }
    .discord-picker-trigger-icon .ui-icon { width:13px; height:13px; }
    .discord-picker-dropdown { position:static; width:100%; margin-top:8px; overflow:hidden; padding:9px; border:1px solid rgba(107,215,255,.28); border-radius:13px; background:#0d1320; box-shadow:0 20px 50px rgba(0,0,0,.45),0 0 0 4px rgba(107,215,255,.06); }
    .discord-picker-dropdown.discord-picker-floating { position:fixed; inset:auto; z-index:10000; width:auto; max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); margin:0; box-sizing:border-box; overflow-x:hidden; overflow-y:auto; background:#0d1320; color:var(--text); opacity:1; isolation:isolate; overscroll-behavior:contain; }
    .discord-picker-dropdown::backdrop { background:transparent; pointer-events:none; }
    .discord-picker-dropdown[hidden] { display:none; }
    .discord-picker-search { display:flex; align-items:center; gap:8px; min-height:36px; padding:0 10px; border:1px solid rgba(218,226,255,.1); border-radius:9px; color:var(--cyan); background:rgba(4,7,13,.65); }
    .discord-picker-search input { width:100%; min-width:0; border:0; outline:0; color:var(--text); background:transparent; font:inherit; font-size:11px; }
    .discord-picker-options { display:grid; grid-template-columns:minmax(0,1fr); gap:3px; max-height:300px; min-width:0; margin-top:8px; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
    .discord-picker-option { width:100%; min-width:0; min-height:43px; display:flex; align-items:center; gap:10px; padding:7px 9px; border:1px solid transparent; border-radius:9px; color:var(--text); background:transparent; font:inherit; text-align:left; cursor:pointer; transition:background .16s ease,border-color .16s ease,transform .16s ease; }
    .discord-picker-option:hover { border-color:rgba(107,215,255,.16); background:rgba(107,215,255,.08); transform:none; }
    .discord-picker-option.discord-picker-option-active { border-color:rgba(107,215,255,.34); background:linear-gradient(90deg,rgba(107,215,255,.17),rgba(124,140,255,.1)); box-shadow:inset 3px 0 0 var(--cyan); transform:none; }
    .discord-picker-option[hidden] { display:none !important; }
    .discord-picker-option[aria-selected="true"] { border-color:rgba(107,215,255,.22); background:linear-gradient(90deg,rgba(107,215,255,.14),rgba(124,140,255,.08)); }
    .discord-picker-option-icon { width:27px; height:27px; display:grid; place-items:center; flex:0 0 27px; border:1px solid rgba(218,226,255,.1); border-radius:8px; color:#aeb6ff; background:rgba(124,140,255,.1); font-size:12px; }
    .discord-picker-option-copy { min-width:0; display:grid; gap:2px; flex:1; }
    .discord-picker-option-copy strong { overflow:hidden; font-size:11px; font-weight:720; text-overflow:ellipsis; white-space:nowrap; }
    .discord-picker-option-copy small { color:var(--subtle); font-size:9px; }
    .discord-picker-option-check { width:20px; color:var(--cyan); opacity:0; font-size:14px; transition:opacity .16s ease; }
    .discord-picker-option[aria-selected="true"] .discord-picker-option-check { opacity:1; }
    .discord-picker-empty { padding:16px 10px; color:var(--subtle); font-size:10px; text-align:center; }
    textarea.form-control { min-height:96px; padding:11px; resize:vertical; line-height:1.45; }
    .toggle-field { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:54px; padding:11px 13px; border:1px solid var(--line); border-radius:11px; background:rgba(255,255,255,.018); }
    .toggle-copy strong { display:block; font-size:12px; }
    .toggle-copy small { display:block; margin-top:4px; color:var(--muted); font-size:10px; }
    .toggle-field.is-locked { cursor:not-allowed; }
    .toggle-field.is-locked .toggle { opacity:.45; cursor:not-allowed; }
    .toggle-field.is-locked .toggle-copy small { color:#e4c888; }
    .toggle { position:relative; width:42px; height:24px; flex:0 0 42px; }
    .toggle input { position:absolute; opacity:0; pointer-events:none; }
    .toggle span { position:absolute; inset:0; border-radius:99px; background:#30374b; transition:.18s ease; cursor:pointer; }
    .toggle span::after { content:""; position:absolute; width:18px; height:18px; left:3px; top:3px; border-radius:50%; background:#fff; transition:.18s ease; box-shadow:0 2px 6px rgba(0,0,0,.35); }
    .toggle input:checked + span { background:linear-gradient(135deg,var(--blue),var(--indigo)); }
    .toggle input:checked + span::after { transform:translateX(18px); }
    .settings-actions { position:sticky; bottom:14px; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 14px; border:1px solid var(--line-strong); border-radius:13px; background:rgba(17,21,34,.94);  box-shadow:var(--shadow); }
    .settings-action-buttons { display:flex; align-items:center; justify-content:flex-end; gap:9px; margin-left:auto; }
    .settings-actions .button.secondary { color:var(--muted); border-color:var(--line-strong); background:rgba(255,255,255,.035); }
    .settings-actions .button.secondary:hover { color:var(--text); border-color:rgba(151,166,201,.42); background:rgba(255,255,255,.075); }
    .settings-actions[hidden] { display:none; }
    .community-action-form { position:relative; z-index:0; overflow:visible; gap:18px; margin-bottom:18px; padding:20px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(145deg,rgba(17,21,34,.78),rgba(10,13,22,.7)); box-shadow:0 16px 42px rgba(0,0,0,.16); }
    .community-action-form .settings-actions { position:static; z-index:auto; margin-top:2px; padding:14px 0 0; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent;  box-shadow:none; }
    .community-action-form.community-action-compact { display:block; flex:0 0 auto; margin:0; padding:0; border:0; background:transparent; box-shadow:none; }
    .community-action-form.community-action-compact .settings-actions { margin:0; padding:0; border:0; }
    .community-action-form.community-action-compact .settings-actions .muted { display:none; }
    .community-action-form[aria-busy="true"] { pointer-events:none; opacity:.82; }
    .community-action-form .button.is-loading { cursor:wait; }
    .community-role-menu-grid { grid-template-columns:minmax(0,1fr); }
    .community-role-menu-card { display:grid; gap:20px; min-height:0; padding:22px; border-color:rgba(107,215,255,.15); background:linear-gradient(145deg,rgba(18,23,36,.94),rgba(10,14,23,.92)); }
    .community-role-menu-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding-bottom:18px; border-bottom:1px solid var(--line); }
    .community-role-menu-head h3 { margin:3px 0 8px; font-size:19px; letter-spacing:-.025em; }
    .community-role-menu-eyebrow { color:var(--cyan); font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
    .community-role-menu-meta { display:flex; flex-wrap:wrap; gap:7px; margin:0; }
    .community-role-menu-meta span { padding:5px 8px; border:1px solid var(--line); border-radius:99px; color:var(--muted); background:rgba(255,255,255,.025); font-size:10px; }
    .community-role-menu-section { display:grid; gap:11px; }
    .community-role-menu-subhead { display:flex; align-items:end; justify-content:space-between; gap:14px; }
    .community-role-menu-subhead h4 { margin:0; font-size:13px; }
    .community-role-menu-subhead small { margin:0; }
    .community-role-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:9px; margin:0; padding:0; list-style:none; }
    .community-role-item { display:flex; align-items:center; justify-content:space-between; gap:12px; min-width:0; padding:11px 12px; border:1px solid var(--line); border-radius:11px; background:rgba(5,8,14,.34); }
    .community-role-item-copy { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; column-gap:9px; }
    .community-role-item-copy::before { content:""; width:8px; height:8px; border-radius:50%; background:linear-gradient(135deg,var(--cyan),var(--indigo)); box-shadow:0 0 0 4px rgba(93,216,255,.08); }
    .community-role-item-copy strong { overflow:hidden; color:var(--text); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
    .community-role-item-copy small { grid-column:2; margin:2px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .community-role-item .button { min-height:32px; padding:0 11px; }
    .community-role-menu-add { padding:17px; border:1px solid var(--line); border-radius:13px; background:rgba(7,10,17,.4); }
    .community-role-menu-add .community-action-form { margin:12px 0 0; padding:0; border:0; background:transparent; box-shadow:none; }
    .support-categories-field { grid-column:1 / -1; display:grid; gap:14px; }
    .support-categories-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; }
    .support-categories-toolbar > span:first-child { min-width:0; display:grid; gap:4px; }
    .support-categories-toolbar strong { font-size:12px; }
    .support-categories-toolbar small { color:var(--muted); font-size:10px; line-height:1.45; }
    .support-category-count { flex:0 0 auto; padding:6px 9px; border:1px solid var(--line); border-radius:99px; color:var(--muted); background:rgba(255,255,255,.025); font-size:10px; }
    .support-category-count b { color:var(--cyan); }
    .support-categories-list { display:grid; gap:13px; }
    .support-category-card { overflow:hidden; border:1px solid var(--line-strong); border-radius:14px; background:rgba(5,8,14,.28); }
    .support-category-card-head { min-height:62px; display:flex; align-items:center; gap:11px; padding:11px 13px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.025); }
    .support-category-number { width:30px; height:30px; display:grid; place-items:center; flex:0 0 30px; border:1px solid rgba(104,120,255,.2); border-radius:9px; color:#aeb6ff; background:rgba(104,120,255,.08); font-size:10px; font-weight:850; }
    .support-category-heading { min-width:0; display:grid; gap:2px; flex:1; }
    .support-category-heading strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
    .support-category-heading small { overflow:hidden; color:var(--subtle); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
    .support-category-remove { min-height:34px; padding:0 11px; color:#ff9eab; border-color:rgba(255,95,116,.25); background:rgba(255,95,116,.06); font-size:10px; }
    .support-category-remove:hover { color:#ffd6dc; border-color:rgba(255,95,116,.44); background:rgba(255,95,116,.12); }
    .support-category-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; padding:15px; }
    .support-category-grid .toggle-field { grid-column:1 / -1; }
    .support-category-add { width:100%; min-height:43px; border-style:dashed; color:var(--cyan); }
    .support-category-add:disabled { opacity:.48; cursor:not-allowed; }
    .support-embed-workspace { grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr); gap:18px; align-items:start; }
    .support-embed-studio,.support-embed-controls { min-width:0; overflow:hidden; border:1px solid rgba(218,226,255,.1); border-radius:15px; background:linear-gradient(145deg,rgba(8,11,18,.76),rgba(13,16,26,.65)); }
    .support-embed-studio-head { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; padding:0 16px; border-bottom:1px solid rgba(218,226,255,.08); color:#cbd3e6; font-size:10px; font-weight:750; letter-spacing:.04em; }
    .support-embed-live { display:flex; align-items:center; gap:7px; }
    .support-embed-live::before { content:""; width:6px; height:6px; border-radius:50%; background:#73dabd; box-shadow:0 0 10px rgba(115,218,189,.46); }
    .support-embed-studio-head small { color:#707b91; font-size:9px; font-weight:600; letter-spacing:0; }
    .support-discord-stage { padding:22px 20px 18px; background:#10131c; }
    .support-discord-author { display:flex; align-items:center; gap:8px; margin:0 0 13px 3px; }
    .support-discord-avatar { width:30px; height:30px; display:grid; place-items:center; overflow:hidden; flex:0 0 30px; border-radius:50%; background:#e5ecef; }
    .support-discord-avatar img { width:100%; height:100%; object-fit:cover; }
    .support-discord-author strong { color:#edf0fa; font-size:12px; }
    .support-discord-bot { padding:2px 4px; border-radius:3px; color:#fff; background:#5865f2; font-size:8px; font-weight:850; }
    .support-discord-author small { color:#6c778d; font-size:9px; }
    .support-discord-embed { padding:17px 16px 14px; border:1px solid rgba(255,255,255,.035); border-left:4px solid var(--support-accent,#8b5cf6); border-radius:5px 11px 11px 5px; background:#22252f; box-shadow:0 12px 28px rgba(0,0,0,.16); }
    .support-embed-inline { display:block; width:100%; min-width:0; margin:0; padding:5px 6px; border:1px solid transparent; border-radius:6px; outline:0; color:#edf0f7; background:transparent; font:inherit; line-height:1.55; resize:none; transition:border-color .16s ease,background .16s ease; }
    .support-embed-inline:hover { border-color:rgba(255,255,255,.08); background:rgba(255,255,255,.025); }
    .support-embed-inline:focus { border-color:rgba(146,154,255,.42); background:rgba(12,15,24,.5); box-shadow:none; }
    .support-embed-inline::placeholder { color:#8e97aa; }
    .support-embed-title { font-size:16px; font-weight:780; letter-spacing:-.01em; }
    .support-embed-description { min-height:104px; max-height:260px; margin-top:2px; color:#d8dce8; font-size:12px; overflow:auto; }
    .support-embed-footer { display:flex; align-items:center; gap:7px; margin:12px 6px 0; color:#aeb6c8; font-size:9px; }
    .support-embed-footer::before { content:"G"; width:17px; height:17px; display:grid; place-items:center; border-radius:50%; color:#0c111a; background:#dfe6ea; font-size:9px; font-weight:900; }
    .support-button-preview { display:inline-flex; align-items:center; gap:7px; min-height:34px; max-width:100%; margin-top:10px; padding:0 13px; overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:4px; color:#f3f4f6; background:#4e5058; font-size:11px; font-weight:650; }
    .support-button-preview span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .support-embed-stage-foot { display:flex; justify-content:space-between; gap:12px; padding-top:14px; color:#707b91; font-size:9px; }
    .support-embed-stage-foot span:last-child { white-space:nowrap; font-variant-numeric:tabular-nums; }
    .support-embed-controls { display:grid; gap:16px; padding:18px; }
    .support-embed-controls-head { display:grid; gap:6px; padding-bottom:15px; border-bottom:1px solid rgba(218,226,255,.08); }
    .support-embed-controls-head span { color:#9ca7ff; font-size:8px; font-weight:850; letter-spacing:.14em; }
    .support-embed-controls-head strong { font-size:15px; }
    .support-embed-controls-head small { color:var(--muted); font-size:9px; line-height:1.55; }
    .support-embed-controls .form-field { gap:8px; }
    .support-color-control { display:grid; grid-template-columns:54px minmax(0,1fr); gap:9px; }
    .support-color-control input[type=color] { width:54px; min-height:42px; }
    .support-color-hex { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; text-transform:uppercase; }
    .support-color-swatches { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; }
    .support-color-swatch { height:25px; padding:0; border:3px solid rgba(255,255,255,.1); border-radius:7px; background:var(--swatch); cursor:pointer; }
    .support-color-swatch:hover,.support-color-swatch.is-selected { border-color:rgba(255,255,255,.72); transform:translateY(-1px); }
    .support-embed-tip { display:grid; gap:6px; padding:12px; border:1px solid rgba(124,140,255,.12); border-radius:11px; color:#8d98af; background:rgba(124,140,255,.045); font-size:9px; line-height:1.55; }
    .support-embed-tip strong { color:#cbd2e6; font-size:10px; }
    .support-category-card { --support-category-accent:#5865f2; }
    .support-category-card:not(.is-expanded) .support-category-grid { display:none; }
    .support-category-card:not(.is-expanded) .support-category-card-head { border-bottom-color:transparent; }
    .support-category-card.is-expanded { border-color:color-mix(in srgb,var(--support-category-accent) 30%,rgba(151,166,201,.2)); box-shadow:0 14px 34px rgba(0,0,0,.12); }
    .support-category-color { width:29px; height:29px; display:grid; place-items:center; flex:0 0 29px; border:1px solid rgba(255,255,255,.13); border-radius:9px; background:color-mix(in srgb,var(--support-category-accent) 17%,rgba(10,13,22,.9)); box-shadow:inset 3px 0 0 var(--support-category-accent); font-size:13px; }
    .support-category-actions { display:flex; align-items:center; gap:7px; }
    .support-category-toggle { width:34px; min-height:34px; padding:0; color:#aeb7cd; }
    .support-category-toggle .ui-icon { width:14px; height:14px; transition:transform .18s ease; }
    .support-category-card.is-expanded .support-category-toggle .ui-icon { transform:rotate(180deg); }
    .support-category-state { color:#77839a; font-size:9px; }
    .support-category-state.is-active { color:#79d8bb; }
    .support-category-grid { animation:supportCategoryReveal .18s ease both; }
    @keyframes supportCategoryReveal { from { opacity:0; transform:translateY(-3px); } }
    textarea.json-editor,pre.json-editor { width:100%; min-height:350px; margin:0; padding:15px; border:1px solid var(--line-strong); border-radius:12px; outline:0; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; background:#0a0d16; color:#dce6ff; font:12px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

    /* Visual system */
    body::after { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.18; background-image:linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px); background-size:36px 36px; mask-image:linear-gradient(to bottom,black,transparent 76%); }
    ::-webkit-scrollbar { width:10px; height:10px; }
    ::-webkit-scrollbar-track { background:transparent; }
    ::-webkit-scrollbar-thumb { border:3px solid transparent; border-radius:99px; background:rgba(151,166,201,.28); background-clip:padding-box; }
    :focus-visible { outline:2px solid var(--cyan); outline-offset:3px; }
    .ui-icon { width:19px; height:19px; display:block; flex:0 0 auto; }
    .app-shell { grid-template-columns:252px minmax(0,1fr); }
    .sidebar { padding:20px 14px 16px; border-right-color:rgba(137,151,184,.13); background:linear-gradient(180deg,rgba(11,14,24,.98),rgba(8,10,18,.96)); box-shadow:20px 0 60px rgba(0,0,0,.08); }
    .sidebar::before { content:""; position:absolute; inset:0 0 auto; height:180px; pointer-events:none; background:radial-gradient(circle at 35% 0,rgba(104,120,255,.1),transparent 68%); }
    .brand { position:relative; min-height:48px; margin-bottom:30px; padding:0 10px; }
    .brand-mark { position:relative; isolation:isolate; width:38px; height:38px; overflow:hidden; border-radius:13px; font-size:20px; box-shadow:0 10px 26px rgba(104,120,255,.28),inset 0 1px 0 rgba(255,255,255,.45); }
    .brand-mark::after { content:""; position:absolute; inset:1px; z-index:-1; border:1px solid rgba(255,255,255,.25); border-radius:12px; }
    .brand-mark img { width:118%; height:118%; object-fit:cover; filter:grayscale(1) invert(1) contrast(1.18); mix-blend-mode:screen; }
    .brand h1 { font-size:19px; }
    .brand small { margin-top:0; font-size:9px; font-weight:800; letter-spacing:.14em; }
    .sidebar-label { margin:14px 0 9px; font-size:9px; letter-spacing:.14em; }
    .side-link { position:relative; min-height:44px; padding:0 12px; border-radius:11px; font-size:13px; font-weight:680; }
    .side-link:hover { transform:translateX(2px); background:rgba(255,255,255,.035); }
    .side-link.active { border-color:rgba(104,120,255,.28); background:linear-gradient(90deg,rgba(104,120,255,.2),rgba(104,120,255,.07)); box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 24px rgba(0,0,0,.12); }
    .side-link.active::after { content:""; position:absolute; right:10px; width:5px; height:5px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }
    .side-icon { width:22px; color:#8490a8; }
    .side-link.active .side-icon { color:var(--cyan); }
    .account { margin:16px 1px 0; padding:11px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,255,.025); }
    .account-name { display:grid; gap:1px; }
    .account-name strong { overflow:hidden; color:#e9edf7; font-size:11px; font-weight:750; text-overflow:ellipsis; }
    .account-name small { color:var(--subtle); font-size:9px; }
    .logout { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; }
    .logout:hover { color:#ffadb8; background:rgba(255,95,116,.08); }
    .logout .ui-icon { width:16px; height:16px; }
    .page-topbar { position:sticky; top:0; z-index:20; min-height:68px; border-bottom-color:rgba(137,151,184,.12); background:rgba(7,9,16,.72); }
    .breadcrumb { display:flex; align-items:center; gap:10px; font-size:10px; letter-spacing:.11em; }
    .breadcrumb a { display:inline-flex; align-items:center; min-height:30px; padding:0 6px; margin:0 -6px; }
    .breadcrumb a:hover { background:rgba(255,255,255,.045); }
    .breadcrumb i { color:#434d63; font-size:15px; font-style:normal; }
    .breadcrumb strong { margin:0; font-size:12px; letter-spacing:0; }
    .page-badge { display:inline-flex; align-items:center; gap:7px; padding:6px 10px; color:#a8efd5; background:rgba(54,211,153,.07); border-color:rgba(54,211,153,.18); }
    .page-badge i { width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px rgba(54,211,153,.1); }
    .page-content { width:min(1360px,100%); padding-top:clamp(28px,4vw,52px); }
    .hero { isolation:isolate; min-height:210px; display:flex; flex-direction:column; justify-content:center; padding:clamp(28px,4vw,44px); border-color:rgba(137,151,184,.2); border-radius:23px; background:linear-gradient(125deg,rgba(104,120,255,.18),rgba(16,19,31,.96) 52%,rgba(102,220,255,.05)); box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.045); }
    .hero::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(90deg,black,transparent 72%); }
    .hero::after { right:-70px; top:-96px; width:310px; height:310px; border-color:rgba(102,220,255,.15); box-shadow:0 0 0 44px rgba(102,220,255,.022),0 0 0 90px rgba(104,120,255,.018); }
    .hero > * { position:relative; z-index:1; }
    .hero h2 { max-width:780px; margin-bottom:10px; font-size:clamp(28px,3.2vw,40px); line-height:1.08; }
    .hero p { max-width:680px; font-size:14px; line-height:1.65; }
    .eyebrow { display:flex; align-items:center; gap:8px; margin-bottom:13px; font-size:10px; letter-spacing:.16em; }
    .eyebrow::before { content:""; width:18px; height:1px; background:linear-gradient(90deg,var(--cyan),transparent); }
    .dashboard-hero { min-height:282px; display:grid; grid-template-columns:minmax(0,1fr) 270px; align-items:center; gap:28px; }
    .dashboard-hero .hero-copy { max-width:720px; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
    .button .ui-icon { width:16px; height:16px; margin-right:8px; }
    .hero-visual { position:relative; height:210px; display:grid; place-items:center; }
    .hero > .hero-brand-banner { position:absolute; right:-4%; bottom:-31%; z-index:0; width:min(760px,64%); height:auto; pointer-events:none; opacity:.075; filter:grayscale(1) invert(1) contrast(1.25); mix-blend-mode:screen; transform:rotate(-2deg); }
    .hero-orbit { position:absolute; width:188px; height:188px; border:1px solid rgba(102,220,255,.2); border-radius:50%; animation:none; }
    .hero-orbit::before,.hero-orbit::after { content:""; position:absolute; border-radius:50%; background:var(--cyan); box-shadow:0 0 18px rgba(102,220,255,.9); }
    .hero-orbit::before { width:7px; height:7px; left:18px; top:26px; }
    .hero-orbit::after { width:5px; height:5px; right:14px; bottom:37px; background:var(--indigo); }
    .status-core { position:relative; width:118px; height:118px; overflow:hidden; display:grid; place-items:center; border:1px solid rgba(151,166,201,.26); border-radius:34px; background:linear-gradient(145deg,rgba(102,220,255,.2),rgba(104,120,255,.26) 55%,rgba(152,119,255,.18)); color:#fff; font-size:52px; font-weight:900; box-shadow:0 20px 50px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.2); transform:rotate(-4deg); }
    .status-core::after { content:""; position:absolute; inset:8px; border:1px solid rgba(255,255,255,.14); border-radius:27px; }
    .status-core img { width:126%; height:126%; object-fit:cover; filter:grayscale(1) invert(1) contrast(1.25); mix-blend-mode:screen; transform:rotate(4deg); }
    .status-label { position:absolute; right:3px; bottom:17px; display:flex; align-items:center; gap:6px; padding:6px 9px; border:1px solid rgba(54,211,153,.25); border-radius:99px; background:rgba(9,12,20,.86); color:#a9efd6; font-size:9px; font-weight:800; box-shadow:0 8px 24px rgba(0,0,0,.3); }
    .status-label::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 8px rgba(54,211,153,.8); }
    .section-heading { margin:36px 0 15px; }
    .section-heading h3 { font-size:17px; }
    .section-heading p { margin-top:4px; font-size:12px; }
    .metric-grid { gap:12px; margin-top:16px; }
    .metric-card { position:relative; overflow:hidden; min-height:145px; padding:18px; border-color:rgba(137,151,184,.16); border-radius:17px; background:linear-gradient(145deg,rgba(19,23,37,.96),rgba(14,17,28,.88)); box-shadow:var(--soft-shadow); }
    .metric-card::after { content:""; position:absolute; right:-35px; bottom:-52px; width:110px; height:110px; border-radius:50%; background:radial-gradient(circle,rgba(104,120,255,.09),transparent 68%); }
    .metric-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:19px; }
    .metric-icon { width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(104,120,255,.18); border-radius:10px; color:#9aa5ff; background:rgba(104,120,255,.09); }
    .metric-icon .ui-icon { width:17px; height:17px; }
    .metric-chip { padding:4px 7px; border:1px solid var(--line); border-radius:99px; color:var(--subtle); font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
    .metric-chip.good { color:#9de8ce; border-color:rgba(54,211,153,.2); background:rgba(54,211,153,.06); }
    .metric-card b { margin-bottom:6px; font-size:9px; letter-spacing:.13em; }
    .metric-card strong { font-size:27px; }
    .metric-card small { margin-top:5px; font-size:10px; }
    .card,.panel { border-color:rgba(137,151,184,.16); background:linear-gradient(145deg,rgba(17,21,34,.94),rgba(13,16,26,.88)); box-shadow:var(--soft-shadow); }
    .quick-card { position:relative; overflow:hidden; min-height:172px; padding:20px; border-radius:17px; }
    .quick-card::before { content:""; position:absolute; right:-28px; top:-34px; width:94px; height:94px; border:1px solid rgba(104,120,255,.13); border-radius:50%; }
    .quick-card:hover { box-shadow:0 18px 42px rgba(0,0,0,.25); }
    .quick-icon { width:40px; height:40px; border:1px solid rgba(104,120,255,.17); border-radius:12px; color:#9da7ff; background:linear-gradient(145deg,rgba(104,120,255,.15),rgba(152,119,255,.08)); }
    .quick-icon .ui-icon { width:19px; height:19px; }
    .quick-copy { display:grid; gap:5px; margin-top:18px; }
    .quick-copy strong { margin:0; color:var(--text); font-size:14px; font-weight:760; }
    .quick-copy small { margin:0; max-width:210px; color:var(--muted); font-size:10px; line-height:1.45; }
    .quick-link { display:flex; align-items:center; justify-content:space-between; margin-top:18px; color:var(--cyan) !important; }
    .quick-link .ui-icon { width:14px; height:14px; transition:transform .17s ease; }
    .quick-card:hover .quick-link .ui-icon { transform:translateX(3px); }
    .server-card,.module-card { border-color:rgba(137,151,184,.16); background:linear-gradient(145deg,rgba(17,21,34,.92),rgba(13,16,26,.84)); box-shadow:0 10px 28px rgba(0,0,0,.12); }
    .server-card { min-height:96px; padding:17px; border-radius:17px; }
    .server-icon { box-shadow:inset 0 1px 0 rgba(255,255,255,.07); }
    .server-picker { width:min(900px,100%); margin:0 auto; }
    .server-picker-head { position:relative; overflow:hidden; padding:30px 32px; border:1px solid rgba(137,151,184,.18); border-radius:20px; background:linear-gradient(125deg,rgba(104,120,255,.16),rgba(16,19,31,.96) 58%,rgba(102,220,255,.045)); box-shadow:var(--soft-shadow); }
    .server-picker-head::after { content:""; position:absolute; right:-55px; top:-90px; width:220px; height:220px; border:1px solid rgba(102,220,255,.12); border-radius:50%; box-shadow:0 0 0 35px rgba(104,120,255,.02); }
    .server-picker-head h2 { position:relative; z-index:1; margin:0; font-size:clamp(25px,3vw,34px); letter-spacing:-.045em; }
    .server-picker-head p { position:relative; z-index:1; max-width:600px; margin:9px 0 0; color:var(--muted); font-size:12px; line-height:1.6; }
    .server-picker-summary { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:8px; margin-top:19px; }
    .server-picker-summary span { display:inline-flex; align-items:center; gap:6px; min-height:27px; padding:0 9px; border:1px solid var(--line); border-radius:99px; color:#919caf; background:rgba(255,255,255,.025); font-size:9px; font-weight:750; }
    .server-picker-summary i { width:5px; height:5px; border-radius:50%; background:var(--green); }
    .server-picker-title { display:flex; align-items:end; justify-content:space-between; gap:18px; margin:29px 2px 13px; }
    .server-picker-title h3 { margin:0; font-size:14px; }
    .server-picker-title p { margin:3px 0 0; color:var(--muted); font-size:10px; }
    .server-picker-list { display:grid; gap:11px; }
    .server-picker-card { display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:16px; min-height:92px; padding:16px 18px; border:1px solid rgba(137,151,184,.16); border-radius:16px; background:linear-gradient(145deg,rgba(18,22,36,.94),rgba(13,16,27,.9)); box-shadow:0 12px 34px rgba(0,0,0,.14); transition:.18s ease; }
    .server-picker-card:hover { border-color:rgba(151,166,201,.3); background:linear-gradient(145deg,rgba(23,28,44,.98),rgba(15,19,31,.94)); transform:translateY(-2px); box-shadow:0 18px 42px rgba(0,0,0,.22); }
    .server-picker-card .server-icon { width:58px; height:58px; flex-basis:58px; border-radius:16px; }
    .server-picker-info { min-width:0; }
    .server-picker-name { min-width:0; display:flex; align-items:center; gap:8px; }
    .server-picker-info strong { display:block; min-width:0; overflow:hidden; color:#f4f6fb; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
    .server-picker-role { display:flex; align-items:center; gap:7px; margin-top:5px; color:#8f99ae; font-size:10px; }
    .server-picker-role i { width:5px; height:5px; border-radius:50%; background:#667188; }
    .server-picker-card.installed .server-picker-role i { background:var(--green); box-shadow:0 0 8px rgba(54,211,153,.55); }
    .server-picker-action { min-width:112px; min-height:43px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 15px; border:1px solid rgba(151,166,201,.2); border-radius:11px; color:#eef1f8; background:rgba(255,255,255,.045); font-size:11px; font-weight:780; transition:.17s ease; }
    .server-picker-action .ui-icon { width:15px; height:15px; }
    .server-picker-action:hover { border-color:rgba(151,166,201,.38); background:rgba(255,255,255,.075); }
    .server-picker-action.manage { border-color:transparent; background:linear-gradient(135deg,#7585ff,#6757d9); box-shadow:0 9px 24px rgba(104,104,225,.24); }
    .server-picker-action.manage:hover { filter:brightness(1.08); transform:translateY(-1px); }
    .all-servers-page { display:grid; gap:16px; }
    .all-servers-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
    .all-servers-hero-copy { position:relative; z-index:1; min-width:0; }
    .all-servers-hero .server-picker-summary { margin-top:16px; }
    .all-servers-toolbar { display:grid; grid-template-columns:minmax(230px,1fr) minmax(190px,240px) auto; align-items:center; gap:11px; padding:13px; border:1px solid rgba(137,151,184,.17); border-radius:16px; background:rgba(13,17,28,.78); box-shadow:var(--soft-shadow); }
    .all-servers-search { position:relative; min-width:0; }
    .all-servers-search .ui-icon { position:absolute; left:13px; top:50%; width:16px; height:16px; color:#6d788d; pointer-events:none; transform:translateY(-50%); }
    .all-servers-search .form-control { padding-left:39px; }
    .all-servers-result { min-width:max-content; color:var(--muted); font-size:10px; font-weight:750; text-align:right; }
    .all-servers-list { display:grid; gap:11px; }
    .all-server-card { display:grid; grid-template-columns:58px minmax(200px,1.35fr) minmax(145px,.8fr) minmax(115px,.65fr) minmax(145px,.75fr) auto; align-items:center; gap:17px; min-height:96px; padding:17px 18px; border:1px solid rgba(137,151,184,.16); border-radius:17px; background:linear-gradient(145deg,rgba(18,22,36,.94),rgba(13,16,27,.9)); box-shadow:0 12px 34px rgba(0,0,0,.14); transition:.18s ease; }
    .all-server-card:hover { border-color:rgba(151,166,201,.3); background:linear-gradient(145deg,rgba(23,28,44,.98),rgba(15,19,31,.94)); transform:translateY(-1px); }
    .all-server-card .server-icon { width:58px; height:58px; flex-basis:58px; border-radius:16px; }
    .all-server-main,.all-server-stat { min-width:0; }
    .all-server-name { min-width:0; display:flex; align-items:center; gap:8px; }
    .all-server-name strong { min-width:0; overflow:hidden; color:#f4f6fb; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
    .all-server-id { display:block; overflow:hidden; margin-top:6px; color:#707b90; font:9px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; text-overflow:ellipsis; white-space:nowrap; }
    .all-server-stat b { display:block; margin-bottom:5px; color:#626e84; font-size:8px; font-weight:820; letter-spacing:.11em; text-transform:uppercase; }
    .all-server-stat span { display:block; overflow:hidden; color:#aab3c3; font-size:10px; font-weight:680; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
    .all-server-stat small { display:block; overflow:hidden; margin-top:3px; color:#69758a; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
    .all-server-card.unavailable { opacity:.68; }
    .all-server-card[hidden],.all-servers-empty[hidden] { display:none; }
    .all-servers-empty { padding:34px 18px; }
    @media (max-width:1080px) {
      .all-server-card { grid-template-columns:58px minmax(190px,1fr) repeat(2,minmax(120px,.65fr)) auto; }
      .all-server-owner { display:none; }
    }
    @media (max-width:760px) {
      .all-servers-hero { display:block; }
      .all-servers-toolbar { grid-template-columns:1fr; }
      .all-servers-result { text-align:left; }
      .all-server-card { grid-template-columns:48px minmax(0,1fr) auto; gap:12px; min-height:84px; padding:14px; }
      .all-server-card .server-icon { width:48px; height:48px; flex-basis:48px; border-radius:13px; }
      .all-server-owner,.all-server-members,.all-server-joined { display:none; }
      .all-server-card .server-picker-action { grid-column:auto; min-width:43px; width:43px; padding:0; justify-self:end; }
      .all-server-card .server-picker-action span { display:none; }
    }
    .server-arrow,.module-arrow { width:27px; height:27px; display:grid; place-items:center; border:1px solid var(--line); border-radius:9px; transition:.17s ease; }
    .server-card:hover .server-arrow,.module-card:hover .module-arrow { color:var(--cyan); border-color:rgba(102,220,255,.25); transform:translateX(2px); }
    .module-card { min-height:98px; padding:16px; border-radius:16px; }
    .module-icon { width:42px; height:42px; flex-basis:42px; border:1px solid rgba(102,220,255,.12); border-radius:13px; background:linear-gradient(145deg,rgba(102,220,255,.1),rgba(104,120,255,.07)); }
    .module-copy strong { font-size:13px; }
    .module-copy small { margin-top:5px; font-size:10px; }
    .button { gap:0; min-height:40px; border-radius:10px; box-shadow:inset 0 1px 0 rgba(255,255,255,.03); }
    .button.primary { background:linear-gradient(135deg,#7382ff,#5c69ed 55%,#765ee8); box-shadow:0 9px 24px rgba(104,120,255,.25),inset 0 1px 0 rgba(255,255,255,.18); }
    .button.primary:hover { filter:brightness(1.08); transform:translateY(-1px); }
    .login-box { position:relative; overflow:hidden; padding:34px; border-color:rgba(137,151,184,.2); background:linear-gradient(145deg,rgba(18,22,36,.96),rgba(10,13,22,.94)); }
    .login-box::before { content:""; position:absolute; inset:0 0 auto; height:130px; pointer-events:none; background:radial-gradient(circle at 50% 0,rgba(104,120,255,.18),transparent 68%); }
    .login-box > *:not(.login-wordmark) { position:relative; z-index:1; }
    .login-logo { overflow:hidden; }
    .login-logo img { width:122%; height:122%; object-fit:cover; filter:grayscale(1) invert(1) contrast(1.18); mix-blend-mode:screen; }
    .login-wordmark { position:absolute; left:-12%; top:-5%; z-index:0; width:124%; pointer-events:none; opacity:.055; filter:grayscale(1) invert(1) contrast(1.2); mix-blend-mode:screen; }
    .settings-form { gap:16px; }
    .settings-section { padding:0; overflow:hidden; border-color:rgba(137,151,184,.17); border-radius:17px; background:linear-gradient(145deg,rgba(17,21,34,.94),rgba(12,15,25,.9)); box-shadow:var(--soft-shadow); }
    .settings-section-head { display:flex; align-items:center; gap:13px; padding:17px 19px; margin:0; background:rgba(255,255,255,.018); }
    .settings-section-title { min-width:0; }
    .settings-section-head h4 { font-size:14px; }
    .settings-section-head p { margin-top:3px; font-size:10px; }
    .section-index { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border:1px solid rgba(104,120,255,.2); border-radius:10px; color:#aeb6ff; background:rgba(104,120,255,.08); font-size:9px; font-weight:850; letter-spacing:.06em; }
    .settings-grid { padding:19px; gap:17px; }
    .form-label { font-size:11px; }
    .form-hint { font-size:9px; }
    .form-control { min-height:44px; border-color:rgba(151,166,201,.24); border-radius:10px; background:rgba(7,9,16,.72); }
    .form-control:hover { border-color:rgba(151,166,201,.4); }
    .toggle-field { min-height:61px; padding:12px 14px; border-color:rgba(137,151,184,.14); background:rgba(255,255,255,.014); }
    .toggle-copy strong { font-size:11px; }
    .toggle-copy small { font-size:9px; }
    .settings-actions { bottom:16px; padding:14px 16px; border-color:rgba(151,166,201,.3); border-radius:15px; background:rgba(14,18,29,.9); box-shadow:0 18px 55px rgba(0,0,0,.36); }
    .music-shell { overflow:hidden; padding:0; border-radius:20px; background:linear-gradient(145deg,rgba(16,20,33,.97),rgba(9,12,21,.94)); }
    #music-container { min-height:250px; }
    .music-loading,.music-empty { min-height:250px; display:grid; place-items:center; padding:30px; text-align:center; }
    .music-loading-inner,.music-empty-inner { display:grid; justify-items:center; gap:10px; color:var(--muted); font-size:11px; }
    .music-loader { width:34px; height:34px; border:2px solid rgba(151,166,201,.16); border-top-color:var(--cyan); border-radius:50%; animation:musicLoader .8s linear infinite; }
    @keyframes musicLoader { to { transform:rotate(360deg); } }
    .music-player { position:relative; isolation:isolate; min-height:270px; display:grid; grid-template-columns:176px minmax(0,1fr) 185px; align-items:center; gap:28px; overflow:hidden; padding:28px; }
    .music-backdrop { position:absolute; inset:-40px; z-index:-2; overflow:hidden; pointer-events:none; }
    .music-backdrop img { width:100%; height:100%; object-fit:cover; opacity:.12; filter:blur(50px) saturate(1.4); transform:scale(1.2); }
    .music-backdrop::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,12,21,.78),rgba(9,12,21,.9) 52%,rgba(9,12,21,.96)),linear-gradient(0deg,rgba(104,120,255,.06),transparent); }
    .music-cover-wrap { position:relative; width:176px; aspect-ratio:1; }
    .music-cover { width:100%; height:100%; display:block; object-fit:cover; border:1px solid rgba(255,255,255,.12); border-radius:18px; background:#111522; box-shadow:0 24px 50px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08); }
    .music-cover.fallback { padding:28px; object-fit:cover; filter:grayscale(1) invert(1) contrast(1.2); mix-blend-mode:screen; }
    .music-playing-indicator { position:absolute; right:-8px; bottom:-8px; width:40px; height:40px; display:flex; align-items:center; justify-content:center; gap:3px; border:1px solid rgba(102,220,255,.25); border-radius:13px; background:rgba(11,15,25,.9); box-shadow:0 10px 28px rgba(0,0,0,.35); }
    .music-playing-indicator i { width:3px; height:13px; border-radius:99px; background:linear-gradient(var(--cyan),var(--blue)); animation:musicBars .8s ease-in-out infinite alternate; transform-origin:bottom; }
    .music-playing-indicator i:nth-child(2) { height:20px; animation-delay:-.35s; }
    .music-playing-indicator i:nth-child(3) { height:9px; animation-delay:-.6s; }
    .music-player.paused .music-playing-indicator i { animation-play-state:paused; transform:scaleY(.35); }
    @keyframes musicBars { from { transform:scaleY(.35); } to { transform:scaleY(1); } }
    .music-main { min-width:0; }
    .music-state-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
    .music-now-label { display:inline-flex; align-items:center; gap:7px; color:#86e5ff; font-size:9px; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }
    .music-now-label::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px rgba(102,220,255,.8); }
    .music-channel-pill { max-width:240px; overflow:hidden; padding:4px 8px; border:1px solid rgba(151,166,201,.15); border-radius:99px; color:#7f899d; background:rgba(255,255,255,.025); font-size:8px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
    .music-title { overflow:hidden; margin:0; color:#f8f9fd; font-size:clamp(20px,2.1vw,28px); line-height:1.18; letter-spacing:-.04em; text-overflow:ellipsis; white-space:nowrap; }
    .music-artist { overflow:hidden; margin:6px 0 0; color:#909baf; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
    .music-progress-wrap { margin-top:23px; }
    .music-progress { position:relative; height:5px; border-radius:99px; background:rgba(151,166,201,.14); box-shadow:inset 0 1px 2px rgba(0,0,0,.25); }
    .music-progress > span { position:absolute; inset:0 auto 0 0; width:0; border-radius:inherit; background:linear-gradient(90deg,var(--blue),var(--cyan)); box-shadow:0 0 12px rgba(102,220,255,.4); transition:width .4s ease; }
    .music-progress > span::after { content:""; position:absolute; right:-3px; top:50%; width:8px; height:8px; border-radius:50%; background:#fff; box-shadow:0 0 0 3px rgba(102,220,255,.18); transform:translateY(-50%); }
    .music-progress.seekable > span::after { display:none; }
    .music-seek-range { position:absolute; inset:-9px 0; z-index:2; width:100%; height:23px; margin:0; appearance:none; -webkit-appearance:none; border:0; outline:0; background:transparent; cursor:pointer; }
    .music-seek-range::-webkit-slider-runnable-track { height:5px; border-radius:99px; background:transparent; }
    .music-seek-range::-webkit-slider-thumb { width:14px; height:14px; margin-top:-4.5px; appearance:none; -webkit-appearance:none; border:2px solid #eefcff; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 4px rgba(102,220,255,.16),0 2px 8px rgba(0,0,0,.3); }
    .music-seek-range::-moz-range-track { height:5px; border:0; border-radius:99px; background:transparent; }
    .music-seek-range::-moz-range-thumb { width:11px; height:11px; border:2px solid #eefcff; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 4px rgba(102,220,255,.16),0 2px 8px rgba(0,0,0,.3); }
    .music-seek-range:focus-visible::-webkit-slider-thumb { box-shadow:0 0 0 5px rgba(102,220,255,.28),0 2px 8px rgba(0,0,0,.3); }
    .music-progress.live > span { width:34% !important; animation:musicLiveProgress 2.4s ease-in-out infinite alternate; }
    .music-progress.live > span::after { display:none; }
    @keyframes musicLiveProgress { from { transform:translateX(-25%); } to { transform:translateX(220%); } }
    .music-time-row { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; margin-top:9px; color:#68748a; font:9px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
    .music-time-row > span:last-child { text-align:right; }
    .music-seek-actions { display:flex; align-items:center; gap:5px; }
    .music-seek-button { min-width:43px; height:24px; padding:0 7px; border:1px solid rgba(151,166,201,.16); border-radius:8px; color:#8793a8; background:rgba(20,25,40,.68); font:700 8px/1 ui-sans-serif,system-ui,sans-serif; cursor:pointer; transition:.17s ease; }
    .music-seek-button:hover:not(:disabled) { color:#eaf7ff; border-color:rgba(102,220,255,.28); background:rgba(102,220,255,.07); }
    .music-seek-button:disabled { opacity:.45; cursor:wait; }
    .music-controls { display:flex; align-items:center; gap:9px; margin-top:22px; }
    .music-control { width:42px; height:42px; display:grid; place-items:center; padding:0; border:1px solid rgba(151,166,201,.22); border-radius:13px; color:#aeb7c9; background:rgba(20,25,40,.78); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); cursor:pointer; transition:.17s ease; }
    .music-control .ui-icon { width:17px; height:17px; }
    .music-control:hover:not(:disabled) { color:#fff; border-color:rgba(151,166,201,.42); background:rgba(31,38,57,.95); transform:translateY(-2px); }
    .music-control.primary { width:50px; height:50px; border:0; border-radius:16px; color:#fff; background:linear-gradient(135deg,#7585ff,#6557df); box-shadow:0 12px 28px rgba(104,104,236,.3),inset 0 1px 0 rgba(255,255,255,.22); }
    .music-control.primary .ui-icon { width:20px; height:20px; }
    .music-control.stop:hover:not(:disabled) { color:#ffadb8; border-color:rgba(255,95,116,.3); background:rgba(255,95,116,.09); }
    .music-control:disabled { opacity:.45; cursor:wait; }
    .music-side { display:grid; gap:9px; }
    .music-stat { display:flex; align-items:center; gap:10px; min-height:55px; padding:11px; border:1px solid rgba(151,166,201,.13); border-radius:13px; background:rgba(255,255,255,.018); }
    .music-stat-icon { width:31px; height:31px; display:grid; place-items:center; flex:0 0 31px; border-radius:9px; color:#9da8ff; background:rgba(104,120,255,.09); }
    .music-stat-icon .ui-icon { width:15px; height:15px; }
    .music-stat-copy { min-width:0; }
    .music-stat-copy small { display:block; color:#6f7b91; font-size:8px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
    .music-stat-copy strong { display:block; overflow:hidden; margin-top:2px; color:#e7ebf5; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
    .music-volume-stat { align-items:flex-start; }
    .music-volume-copy { display:grid; flex:1; gap:8px; cursor:pointer; }
    .music-volume-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; }
    .music-volume-heading strong { margin:0; font-variant-numeric:tabular-nums; }
    .music-volume-range { width:100%; height:16px; margin:0; appearance:none; -webkit-appearance:none; border:0; outline:0; background:transparent; cursor:pointer; }
    .music-volume-range::-webkit-slider-runnable-track { height:4px; border-radius:99px; background:linear-gradient(90deg,var(--blue) 0,var(--cyan) var(--volume-percent),rgba(151,166,201,.14) var(--volume-percent),rgba(151,166,201,.14) 100%); }
    .music-volume-range::-webkit-slider-thumb { width:12px; height:12px; margin-top:-4px; appearance:none; -webkit-appearance:none; border:2px solid #eefcff; border-radius:50%; background:var(--cyan); box-shadow:0 2px 7px rgba(0,0,0,.3); }
    .music-volume-range::-moz-range-track { height:4px; border:0; border-radius:99px; background:rgba(151,166,201,.14); }
    .music-volume-range::-moz-range-progress { height:4px; border-radius:99px; background:linear-gradient(90deg,var(--blue),var(--cyan)); }
    .music-volume-range::-moz-range-thumb { width:9px; height:9px; border:2px solid #eefcff; border-radius:50%; background:var(--cyan); box-shadow:0 2px 7px rgba(0,0,0,.3); }
    .music-notice { position:absolute; right:18px; bottom:14px; z-index:3; max-width:320px; padding:8px 11px; border:1px solid rgba(54,211,153,.22); border-radius:10px; color:#a7ebd3; background:rgba(11,25,23,.92); font-size:9px; box-shadow:0 12px 30px rgba(0,0,0,.25); opacity:0; pointer-events:none; transform:translateY(6px); transition:.2s ease; }
    .music-notice.show { opacity:1; transform:none; }
    .music-notice.error { color:#ffb4be; border-color:rgba(255,95,116,.28); background:rgba(34,13,20,.94); }
    .music-empty-icon { width:54px; height:54px; display:grid; place-items:center; border:1px solid rgba(104,120,255,.2); border-radius:17px; color:#9da8ff; background:rgba(104,120,255,.08); }
    .music-empty-icon .ui-icon { width:24px; height:24px; }
    .music-empty strong { color:#e8ebf4; font-size:13px; }
    .music-empty p { max-width:390px; margin:0; color:#758096; font-size:10px; line-height:1.55; }
    .empty-state { padding:44px 22px; background:rgba(255,255,255,.012); }
    @media (max-width:1000px) { .music-player { grid-template-columns:150px minmax(0,1fr); } .music-cover-wrap { width:150px; } .music-side { grid-column:1/-1; grid-template-columns:1fr 1fr; } }
    @media (max-width:620px) { #music-container { min-height:0; } .music-player { grid-template-columns:92px minmax(0,1fr); align-items:start; gap:16px; padding:18px; } .music-cover-wrap { width:92px; } .music-cover { border-radius:14px; } .music-playing-indicator { right:-5px; bottom:-5px; width:31px; height:31px; border-radius:10px; } .music-title { font-size:18px; white-space:normal; } .music-state-row { margin-bottom:7px; } .music-channel-pill { display:none; } .music-progress-wrap,.music-controls { grid-column:1/-1; } .music-controls { justify-content:center; margin-top:19px; } .music-control { width:40px; height:40px; } .music-control.primary { width:48px; height:48px; } .music-side { grid-column:1/-1; grid-template-columns:1fr 1fr; } .music-notice { right:12px; bottom:10px; left:12px; max-width:none; text-align:center; } .server-picker-head { padding:24px 21px; } .server-picker-card { grid-template-columns:48px minmax(0,1fr); gap:12px; padding:14px; } .server-picker-card .server-icon { width:48px; height:48px; flex-basis:48px; border-radius:14px; } .server-picker-action { grid-column:1/-1; width:100%; } .server-picker-title { align-items:flex-start; flex-direction:column; } }
    @media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }
    @media (max-width: 1000px) { .dashboard-hero { grid-template-columns:1fr 200px; } .hero-visual { transform:scale(.86); } }
    @media (max-width: 900px) { .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboard-hero { display:flex; min-height:240px; } .hero-visual { display:none; } .hero > .hero-brand-banner { width:82%; opacity:.055; } }
    @media (max-width: 720px) { body::after { display:none; } .app-shell { display:block; } .sidebar { position:static; width:100%; min-height:0; height:auto; padding:11px 13px 10px; border-right:0; border-bottom:1px solid var(--line); } .sidebar::before { height:100px; } .brand { margin:0; padding:0 4px; } .brand-mark { width:34px; height:34px; border-radius:11px; } .brand small,.sidebar-label,.sidebar-spacer,.account-name { display:none; } .sidebar nav { display:flex; overflow-x:auto; gap:5px; margin-top:9px; padding-bottom:3px; scrollbar-width:none; } .sidebar nav::-webkit-scrollbar { display:none; } .side-link { min-width:max-content; min-height:36px; padding:0 10px; font-size:11px; } .side-link:hover { transform:none; } .side-link.active::after { display:none; } .side-icon { width:17px; } .side-icon .ui-icon { width:16px; height:16px; } .account { position:absolute; right:13px; top:10px; border:0; margin:0; padding:0; background:transparent; } .account form { display:none; } .page-topbar { min-height:54px; padding:0 17px; } .page-badge { padding:5px 7px; font-size:0; } .page-badge i { margin:0; } .page-content { padding:24px 16px 46px; } .metric-grid { grid-template-columns:1fr 1fr; gap:9px; } .metric-card { min-height:132px; padding:13px; } .metric-head { margin-bottom:15px; } .metric-card strong { font-size:22px; } .hero,.dashboard-hero { min-height:220px; padding:24px; border-radius:18px; } .hero h2 { font-size:27px; } .hero-actions .button { width:100%; } .grid,.settings-grid { grid-template-columns:1fr; } .quick-card { min-height:155px; } .guest-shell .page-content { width:min(520px,calc(100% - 28px)); } .settings-section-head,.settings-grid { padding:15px; } .settings-actions { align-items:stretch; flex-direction:column; } .settings-actions .button { width:100%; } }
    @media (max-width: 430px) { .metric-grid { grid-template-columns:1fr; } .metric-card { min-height:120px; } .breadcrumb span,.breadcrumb i { display:none; } }

    /* Smooth control-center refinement */
    :root {
      --bg:#080a0f;
      --surface:#10131b;
      --surface-strong:#161b26;
      --surface-hover:#1a202d;
      --line:rgba(218,226,255,.085);
      --line-strong:rgba(218,226,255,.17);
      --text:#f4f6fb;
      --muted:#98a2b5;
      --subtle:#667085;
      --cyan:#6bd7ff;
      --blue:#7c8cff;
      --indigo:#a38cff;
      --green:#42d6a4;
      --shadow:0 28px 80px rgba(0,0,0,.28);
      --soft-shadow:0 16px 45px rgba(0,0,0,.16);
      --ease:cubic-bezier(.2,.8,.2,1);
    }
    html { scroll-behavior:smooth; }
    body { background:#080a0f; letter-spacing:-.012em; }
    body::before { background:radial-gradient(circle at 72% -12%,rgba(111,126,255,.13),transparent 31%),radial-gradient(circle at 9% 92%,rgba(55,201,255,.05),transparent 25%),#080a0f; }
    body::after { opacity:.1; background-size:48px 48px; mask-image:linear-gradient(to bottom,black,transparent 68%); }
    .app-shell { grid-template-columns:236px minmax(0,1fr); }
    .sidebar { padding:18px 12px 14px; border-right-color:rgba(218,226,255,.075); background:linear-gradient(180deg,rgba(12,15,23,.97),rgba(8,10,15,.985)); box-shadow:24px 0 80px rgba(0,0,0,.08); }
    .sidebar::before { height:210px; background:radial-gradient(circle at 25% -10%,rgba(124,140,255,.12),transparent 67%); }
    .sidebar::after { content:""; position:absolute; right:-1px; top:78px; width:1px; height:150px; background:linear-gradient(transparent,rgba(107,215,255,.18),transparent); pointer-events:none; }
    .brand { gap:12px; min-height:48px; margin:0 2px 34px; padding:0 10px; border-radius:13px; transition:background .25s var(--ease),transform .25s var(--ease); }
    .brand:hover { background:rgba(255,255,255,.026); transform:translateY(-1px); }
    .brand-mark { width:40px; height:40px; border-radius:13px; box-shadow:0 12px 34px rgba(102,118,255,.23),inset 0 1px 0 rgba(255,255,255,.38); }
    .brand h1 { font-size:18px; font-weight:760; letter-spacing:-.045em; }
    .brand small { margin-top:2px; color:#727c91; font-size:8px; letter-spacing:.17em; }
    .sidebar-label { margin:11px 8px 10px; padding:0 6px; color:#5f697e; font-size:8px; letter-spacing:.18em; }
    .sidebar nav { gap:5px; }
    .side-link { min-height:43px; padding:0 12px; border:0; border-radius:12px; color:#8e98ab; font-size:12px; font-weight:650; transition:color .25s var(--ease),background .25s var(--ease),transform .25s var(--ease); }
    .side-link::before { content:""; position:absolute; left:0; width:2px; height:18px; border-radius:99px; background:transparent; transform:scaleY(.35); transition:.25s var(--ease); }
    .side-link:hover { color:#e7ebf4; background:rgba(255,255,255,.032); transform:translateX(2px); }
    .side-link.active { color:#f6f8fc; border:0; background:linear-gradient(90deg,rgba(124,140,255,.14),rgba(124,140,255,.055)); box-shadow:inset 0 0 0 1px rgba(124,140,255,.13),0 10px 30px rgba(0,0,0,.1); }
    .side-link.active::before { background:linear-gradient(var(--cyan),var(--blue)); box-shadow:0 0 14px rgba(107,215,255,.55); transform:scaleY(1); }
    .side-link.active::after { right:12px; width:4px; height:4px; background:var(--cyan); box-shadow:0 0 12px var(--cyan); }
    .side-icon { width:20px; color:#758097; }
    .side-icon .ui-icon { width:17px; height:17px; }
    .account { gap:10px; margin:16px 2px 0; padding:10px; border-color:rgba(218,226,255,.075); border-radius:14px; background:rgba(255,255,255,.018); box-shadow:inset 0 1px 0 rgba(255,255,255,.018); }
    .account img,.avatar-placeholder { width:34px; height:34px; flex-basis:34px; border-radius:10px; }
    .account-name strong { font-size:10px; }
    .account-name small { margin-top:2px; font-size:8px; }
    .logout { border:1px solid transparent; transition:.22s var(--ease); }
    .logout:hover { border-color:rgba(255,95,116,.14); transform:translateX(1px); }
    .content-area { position:relative; background:linear-gradient(180deg,rgba(12,15,24,.22),transparent 260px); }
    .page-topbar { min-height:64px; padding:0 clamp(26px,3.5vw,48px); border-bottom-color:rgba(218,226,255,.065); background:rgba(8,10,15,.7); box-shadow:0 1px 0 rgba(255,255,255,.01); }
    .breadcrumb { gap:8px; color:#687287; font-size:9px; letter-spacing:.15em; }
    .breadcrumb a { min-height:30px; padding:0 7px; margin:0 -7px; border-radius:8px; transition:.22s var(--ease); }
    .breadcrumb a:hover { color:#dce2ee; background:rgba(255,255,255,.035); }
    .breadcrumb i { color:#3f485a; font-size:13px; }
    .breadcrumb strong { color:#dce1eb; font-size:11px; font-weight:700; }
    .page-badge { min-height:29px; padding:0 11px; border-color:rgba(66,214,164,.14); color:#9ce8cf; background:rgba(66,214,164,.055); font-size:9px; box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
    .page-badge i { width:5px; height:5px; animation:none; }
    .page-content { width:min(1440px,100%); padding:clamp(30px,3.6vw,48px) clamp(24px,3.5vw,48px) 72px; }
    .page-content > * { animation:contentReveal .58s var(--ease) both; }
    .page-content > *:nth-child(2) { animation-delay:.045s; }
    .page-content > *:nth-child(3) { animation-delay:.09s; }
    .page-content > *:nth-child(4) { animation-delay:.135s; }
    @keyframes contentReveal { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
    .hero { min-height:174px; padding:30px 34px; border-color:rgba(218,226,255,.09); border-radius:20px; background:linear-gradient(118deg,rgba(124,140,255,.105),rgba(16,20,30,.94) 48%,rgba(107,215,255,.035)); box-shadow:0 22px 65px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.035); }
    .hero::before { opacity:.1; background-size:34px 34px; mask-image:linear-gradient(90deg,black,transparent 64%); }
    .hero::after { right:-70px; top:-160px; width:350px; height:350px; border:0; background:radial-gradient(circle,rgba(107,215,255,.075),transparent 64%); box-shadow:none; filter:blur(2px); }
    .hero h2 { max-width:820px; margin-bottom:9px; font-size:clamp(29px,3vw,39px); font-weight:740; line-height:1.09; letter-spacing:-.05em; }
    .hero p { max-width:690px; color:#98a2b5; font-size:13px; line-height:1.65; }
    .eyebrow { gap:9px; margin-bottom:12px; color:#71d8ff; font-size:9px; letter-spacing:.18em; }
    .eyebrow::before { width:16px; background:linear-gradient(90deg,var(--cyan),rgba(107,215,255,.08)); }
    .dashboard-hero { min-height:236px; grid-template-columns:minmax(0,1fr) 220px; gap:20px; }
    .dashboard-hero h2 { font-size:clamp(32px,3.25vw,44px); }
    .hero-actions { gap:9px; margin-top:21px; }
    .hero-visual { height:176px; }
    .hero > .hero-brand-banner { right:2%; bottom:-22%; width:min(650px,52%); opacity:.045; transform:none; }
    .hero-orbit { width:150px; height:150px; border-color:rgba(107,215,255,.14); }
    .hero-orbit::before { width:5px; height:5px; left:14px; top:22px; }
    .hero-orbit::after { width:4px; height:4px; right:12px; bottom:30px; }
    .status-core { width:94px; height:94px; border-radius:28px; box-shadow:0 20px 52px rgba(0,0,0,.34),0 0 44px rgba(124,140,255,.08),inset 0 1px 0 rgba(255,255,255,.18); transform:rotate(-3deg); }
    .status-core::after { inset:7px; border-radius:22px; }
    .status-label { right:4px; bottom:12px; padding:6px 9px; border-color:rgba(66,214,164,.18); background:rgba(8,11,17,.88); font-size:8px; }
    .button { min-height:41px; padding:0 15px; border-color:rgba(218,226,255,.13); border-radius:11px; color:#e8ecf4; background:rgba(255,255,255,.035); font-size:11px; font-weight:720; box-shadow:inset 0 1px 0 rgba(255,255,255,.025); transition:transform .24s var(--ease),border-color .24s var(--ease),background .24s var(--ease),filter .24s var(--ease); }
    .button:hover { border-color:rgba(218,226,255,.24); background:rgba(255,255,255,.065); transform:translateY(-2px); }
    .button.primary { background:linear-gradient(135deg,#7e8eff,#665ee8); box-shadow:0 10px 28px rgba(103,99,232,.22),inset 0 1px 0 rgba(255,255,255,.2); }
    .section-heading { margin:32px 0 14px; }
    .section-heading h3 { font-size:16px; font-weight:700; letter-spacing:-.035em; }
    .section-heading p { margin-top:4px; color:#7f899d; font-size:10px; }
    .grid { gap:14px; }
    .metric-grid { gap:14px; margin-top:14px; }
    .metric-card { min-height:136px; padding:17px; border-color:rgba(218,226,255,.085); border-radius:16px; background:linear-gradient(155deg,rgba(18,22,32,.94),rgba(12,15,23,.92)); box-shadow:0 14px 42px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.025); transition:transform .28s var(--ease),border-color .28s var(--ease),box-shadow .28s var(--ease); }
    .metric-card:hover { transform:translateY(-3px); border-color:rgba(124,140,255,.19); box-shadow:0 20px 48px rgba(0,0,0,.2); }
    .metric-card::after { opacity:.7; }
    .metric-head { margin-bottom:17px; }
    .metric-icon { width:35px; height:35px; border-color:rgba(124,140,255,.15); color:#a8b1ff; background:linear-gradient(145deg,rgba(124,140,255,.105),rgba(163,140,255,.045)); }
    .metric-chip { border-color:rgba(218,226,255,.08); color:#717b8f; background:rgba(255,255,255,.018); }
    .metric-card b { color:#717c91; }
    .metric-card strong { font-size:25px; font-weight:730; }
    .metric-card small { color:#8892a5; }
    .card,.panel,.module-card,.server-card,.server-picker-card { border-color:rgba(218,226,255,.085); background:linear-gradient(155deg,rgba(17,21,31,.94),rgba(12,15,23,.91)); box-shadow:0 14px 40px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.02); }
    .card { border-radius:16px; transition:transform .28s var(--ease),border-color .28s var(--ease),background .28s var(--ease),box-shadow .28s var(--ease); }
    a.card:hover,.server-card:hover,.module-card:hover { border-color:rgba(124,140,255,.2); background:linear-gradient(155deg,rgba(22,27,40,.96),rgba(14,18,28,.94)); box-shadow:0 22px 54px rgba(0,0,0,.21); transform:translateY(-4px); }
    .page-dashboard .grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
    .quick-card { min-height:158px; padding:18px; }
    .quick-card::before { right:-40px; top:-48px; border-color:rgba(124,140,255,.08); }
    .quick-icon { width:38px; height:38px; border-color:rgba(124,140,255,.14); color:#a8b1ff; background:linear-gradient(145deg,rgba(124,140,255,.11),rgba(163,140,255,.045)); }
    .quick-copy { gap:4px; margin-top:16px; }
    .quick-copy strong { font-size:13px; }
    .quick-copy small { color:#8993a7; font-size:9px; }
    .quick-link { margin-top:15px; color:#83dcfb !important; font-size:9px !important; }
    .page-commands .grid { grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); }
    .command-toolbar { position:sticky; top:76px; z-index:12; display:grid; gap:11px; margin:30px 0 18px; padding:12px; border:1px solid rgba(218,226,255,.085); border-radius:16px; background:rgba(12,15,23,.82); box-shadow:0 16px 44px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.025); }
    .command-toolbar-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
    .command-search { position:relative; width:min(340px,100%); display:flex; align-items:center; }
    .command-search > .ui-icon { position:absolute; left:12px; width:16px; height:16px; color:#687389; pointer-events:none; }
    .command-search input { width:100%; min-height:40px; padding:0 38px; border:1px solid rgba(218,226,255,.1); border-radius:11px; outline:0; color:#e9edf5; background:rgba(6,8,13,.55); font:inherit; font-size:11px; transition:border-color .22s var(--ease),background .22s var(--ease),box-shadow .22s var(--ease); }
    .command-search input::placeholder { color:#657086; }
    .command-search input:hover { border-color:rgba(218,226,255,.18); background:rgba(8,10,16,.75); }
    .command-search input:focus { border-color:rgba(107,215,255,.45); box-shadow:0 0 0 3px rgba(107,215,255,.07); }
    .command-total { flex:0 0 auto; color:#747f93; font-size:9px; font-weight:750; }
    .command-tabs { display:flex; gap:6px; overflow-x:auto; padding:1px 1px 3px; scrollbar-width:none; }
    .command-tabs::-webkit-scrollbar { display:none; }
    .command-tab { min-width:max-content; min-height:35px; display:inline-flex; align-items:center; gap:7px; padding:0 10px; border:1px solid transparent; border-radius:10px; color:#7e899d; background:transparent; font:inherit; font-size:9px; font-weight:700; cursor:pointer; transition:color .22s var(--ease),border-color .22s var(--ease),background .22s var(--ease),transform .22s var(--ease); }
    .command-tab .ui-icon { width:14px; height:14px; }
    .command-tab-count { min-width:19px; height:19px; display:grid; place-items:center; padding:0 5px; border:1px solid rgba(218,226,255,.075); border-radius:7px; color:#667186; background:rgba(255,255,255,.018); font-size:8px; }
    .command-tab:hover { color:#dce2ec; background:rgba(255,255,255,.03); transform:translateY(-1px); }
    .command-tab[aria-pressed="true"] { color:#eef1f8; border-color:rgba(124,140,255,.17); background:linear-gradient(135deg,rgba(124,140,255,.13),rgba(163,140,255,.06)); box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
    .command-tab[aria-pressed="true"] .ui-icon { color:#93ddff; }
    .command-tab[aria-pressed="true"] .command-tab-count { border-color:rgba(124,140,255,.15); color:#b9c0ff; background:rgba(124,140,255,.08); }
    .command-results-heading { margin-top:0; }
    .command-grid { transition:opacity .2s var(--ease); }
    .command-card { position:relative; min-height:132px; padding:18px; overflow:hidden; }
    .command-card::after { content:"/"; position:absolute; right:14px; top:3px; color:rgba(124,140,255,.055); font-size:78px; font-weight:800; line-height:1; pointer-events:none; }
    .command-card-head { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:9px; margin-bottom:17px; }
    .command-kicker { display:inline-flex; align-items:center; gap:7px; color:#747f94; font-size:8px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
    .command-mark { width:22px; height:22px; display:grid; place-items:center; border:1px solid rgba(124,140,255,.15); border-radius:7px; color:#a8b1ff; background:rgba(124,140,255,.07); font-size:12px; }
    .command-card-category { overflow:hidden; color:#69758a; font-size:8px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
    .command-card strong { position:relative; z-index:1; display:block; color:#f0f3f9; font-size:15px; font-weight:700; letter-spacing:-.03em; }
    .command-card small { position:relative; z-index:1; margin-top:8px; color:#8f99ac; font-size:10px; line-height:1.5; }
    .command-card[hidden],.command-empty-filter[hidden] { display:none !important; }
    .command-empty-filter { margin-top:0; }
    .page-configs .grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .module-card { min-height:94px; padding:16px; border-radius:15px; transition:transform .28s var(--ease),border-color .28s var(--ease),background .28s var(--ease),box-shadow .28s var(--ease); }
    .module-icon { width:40px; height:40px; flex-basis:40px; border-color:rgba(107,215,255,.1); border-radius:12px; background:linear-gradient(145deg,rgba(107,215,255,.075),rgba(124,140,255,.045)); }
    .module-copy strong { color:#e9edf5; font-size:12px; }
    .module-copy small { color:#7f899d; font-size:9px; }
    .module-arrow { border-color:rgba(218,226,255,.075); color:#667085; }
    .server-picker { width:min(1120px,100%); }
    .server-picker-head { min-height:188px; display:flex; flex-direction:column; justify-content:center; padding:30px 34px; border-color:rgba(218,226,255,.09); border-radius:20px; background:linear-gradient(118deg,rgba(124,140,255,.1),rgba(16,20,30,.95) 53%,rgba(107,215,255,.03)); box-shadow:0 22px 65px rgba(0,0,0,.19),inset 0 1px 0 rgba(255,255,255,.03); }
    .server-picker-head::after { border:0; background:radial-gradient(circle,rgba(107,215,255,.075),transparent 66%); box-shadow:none; }
    .server-picker-head h2 { font-size:clamp(29px,3vw,38px); font-weight:740; }
    .server-picker-head p { color:#98a2b5; font-size:11px; }
    .server-picker-summary span { min-height:28px; border-color:rgba(218,226,255,.08); color:#8490a4; background:rgba(255,255,255,.018); }
    .server-picker-title { margin:30px 2px 13px; }
    .server-picker-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
    .server-picker-card { grid-template-columns:52px minmax(0,1fr) auto; min-height:88px; padding:15px; border-radius:16px; transition:transform .28s var(--ease),border-color .28s var(--ease),background .28s var(--ease),box-shadow .28s var(--ease); }
    .server-picker-card:hover { border-color:rgba(124,140,255,.2); background:linear-gradient(155deg,rgba(22,27,40,.96),rgba(14,18,28,.94)); box-shadow:0 22px 54px rgba(0,0,0,.2); transform:translateY(-3px); }
    .server-picker-card .server-icon { width:52px; height:52px; flex-basis:52px; border-radius:14px; }
    .server-picker-info strong { font-size:13px; }
    .server-picker-role { color:#7f899d; font-size:9px; }
    .server-picker-action { min-width:96px; min-height:39px; padding:0 13px; border-color:rgba(218,226,255,.1); border-radius:10px; background:rgba(255,255,255,.028); font-size:10px; transition:.24s var(--ease); }
    .server-picker-action.manage { background:linear-gradient(135deg,#7d8dff,#665de7); box-shadow:0 9px 24px rgba(103,99,232,.18); }
    .empty-state { min-height:150px; display:grid; place-items:center; align-content:center; gap:9px; padding:36px 22px; border-color:rgba(218,226,255,.11); border-radius:17px; color:#8791a4; background:linear-gradient(155deg,rgba(17,21,31,.65),rgba(12,15,23,.5)); }
    .empty-state-icon { width:44px; height:44px; display:grid; place-items:center; margin-bottom:3px; border:1px solid rgba(124,140,255,.15); border-radius:14px; color:#a3adff; background:rgba(124,140,255,.07); }
    .empty-state-icon .ui-icon { width:20px; height:20px; }
    .empty-state strong { color:#dfe4ed; font-size:12px; }
    .empty-state span { max-width:430px; font-size:10px; line-height:1.55; }
    .settings-section { position:relative; z-index:0; overflow:visible; border-color:rgba(218,226,255,.085); background:linear-gradient(155deg,rgba(17,21,31,.94),rgba(12,15,23,.91)); box-shadow:0 16px 44px rgba(0,0,0,.14); }
    .settings-section-head { background:rgba(255,255,255,.012); }
    .discord-picker-control { border-color:rgba(218,226,255,.12); background:rgba(7,9,14,.7); }
    .discord-picker-dropdown { border-color:rgba(107,215,255,.34); }
    .form-control { border-color:rgba(218,226,255,.12); background:rgba(7,9,14,.7); transition:border-color .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease); }
    .form-control:hover { border-color:rgba(218,226,255,.21); background:rgba(9,12,18,.82); }
    .form-control:focus { border-color:rgba(107,215,255,.55); box-shadow:0 0 0 3px rgba(107,215,255,.075); }
    .settings-actions { border-color:rgba(218,226,255,.13); background:rgba(14,17,26,.88); box-shadow:0 20px 60px rgba(0,0,0,.3); }
    .music-shell { border-color:rgba(218,226,255,.09); box-shadow:0 22px 60px rgba(0,0,0,.2); }

    @media (max-width:1180px) {
      .page-dashboard .grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .page-configs .grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .server-picker-list { grid-template-columns:1fr; }
    }
    @media (max-width:1000px) {
      .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .dashboard-hero { grid-template-columns:1fr 190px; }
      .support-embed-workspace { grid-template-columns:1fr; }
    }
    @media (max-width:900px) {
      .dashboard-hero { display:flex; min-height:220px; }
      .hero-visual { display:none; }
      .hero > .hero-brand-banner { width:76%; opacity:.035; }
    }
    @media (max-width:720px) {
      .app-shell { display:block; }
      .sidebar { position:relative; width:100%; min-height:0; height:auto; padding:10px 12px 9px; border-right:0; border-bottom:1px solid var(--line); }
      .sidebar::before { height:90px; }
      .sidebar::after,.side-link::before { display:none; }
      .brand { min-height:38px; margin:0; padding:0 4px; }
      .brand-mark { width:34px; height:34px; border-radius:11px; }
      .brand small,.sidebar-label,.sidebar-spacer,.account-name { display:none; }
      .sidebar nav { display:flex; overflow-x:auto; gap:5px; margin-top:8px; padding-bottom:3px; scrollbar-width:none; }
      .side-link { min-width:max-content; min-height:36px; padding:0 10px; font-size:10px; }
      .side-link:hover { transform:none; }
      .side-link.active::after { display:none; }
      .side-icon { width:17px; }
      .side-icon .ui-icon { width:15px; height:15px; }
      .account { position:absolute; right:12px; top:10px; margin:0; padding:0; border:0; background:transparent; }
      .account form { display:none; }
      .page-topbar { min-height:52px; padding:0 16px; }
      .page-badge { min-height:26px; padding:0 8px; font-size:0; }
      .page-content { padding:22px 15px 48px; }
      .community-role-menu-card { padding:17px; }
      .community-role-menu-head { align-items:stretch; flex-direction:column; }
      .community-role-menu-head form { align-self:flex-start; }
      .community-role-list { grid-template-columns:1fr; }
      .command-toolbar { top:62px; margin-top:22px; border-radius:14px; }
      .command-toolbar-top { align-items:stretch; flex-direction:column; }
      .command-search { width:100%; }
      .command-total { padding-left:2px; }
      .hero,.dashboard-hero,.server-picker-head { min-height:190px; padding:23px; border-radius:17px; }
      .hero h2,.server-picker-head h2 { font-size:27px; }
      .hero-actions .button { width:100%; }
      .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
      .metric-card { min-height:126px; padding:14px; }
      .page-dashboard .grid,.page-configs .grid,.page-commands .grid,.settings-grid,.support-category-grid { grid-template-columns:1fr; }
      .support-categories-toolbar { align-items:flex-start; flex-direction:column; }
      .support-category-card-head { align-items:flex-start; flex-wrap:wrap; }
      .support-category-actions { width:100%; }
      .support-category-remove { flex:1; }
      .support-discord-stage { padding:17px 12px 15px; }
      .support-embed-studio-head { padding:0 13px; }
      .quick-card { min-height:145px; }
      .server-picker-list { grid-template-columns:1fr; }
      .settings-section-head,.settings-grid { padding:15px; }
      .settings-actions { align-items:stretch; flex-direction:column; }
      .settings-action-buttons { width:100%; flex-direction:column; margin-left:0; }
      .settings-actions .button { width:100%; }
    }
    @media (max-width:520px) {
      .server-picker-card { grid-template-columns:46px minmax(0,1fr); gap:11px; padding:13px; }
      .server-picker-card .server-icon { width:46px; height:46px; flex-basis:46px; border-radius:13px; }
      .server-picker-action { grid-column:1/-1; width:100%; }
      .server-picker-title { align-items:flex-start; flex-direction:column; }
    }
    @media (max-width:430px) {
      .metric-grid { grid-template-columns:1fr; }
      .breadcrumb i { display:none; }
      .metric-card { min-height:116px; }
    }
    .server-switcher { position:relative; min-width:0; color:var(--text); letter-spacing:0; }
    .server-switcher summary { width:max-content; min-width:0; max-width:min(420px,48vw); min-height:38px; display:flex; align-items:center; gap:8px; padding:5px 6px 5px 12px; border:1px solid transparent; border-radius:11px; list-style:none; cursor:pointer; transition:border-color .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease); }
    .server-switcher summary::-webkit-details-marker { display:none; }
    .server-switcher summary:hover,.server-switcher[open] summary { border-color:rgba(218,226,255,.11); background:rgba(255,255,255,.045); box-shadow:inset 0 1px 0 rgba(255,255,255,.045); }
    .server-switcher-current { min-width:0; max-width:280px; display:grid; gap:1px; flex:0 1 auto; }
    .server-switcher-current small { color:#657086; font-size:7px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
    .server-switcher-current-line,.server-switcher-option-name { min-width:0; display:flex; align-items:center; gap:7px; }
    .server-switcher-current strong { overflow:hidden; color:#e9edf5; font-size:11px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
    .server-switcher-chevron { width:28px; height:28px; display:grid; place-items:center; flex:0 0 28px; border:1px solid rgba(218,226,255,.08); border-radius:8px; color:#7c879a; background:rgba(255,255,255,.025); }
    .server-switcher-chevron .ui-icon { width:14px; height:14px; transition:transform .22s var(--ease); }
    .server-switcher[open] .server-switcher-chevron .ui-icon { transform:rotate(180deg); }
    .server-switcher-menu { position:absolute; left:0; top:calc(100% + 9px); z-index:80; width:min(340px,calc(100vw - 32px)); overflow:hidden; padding:8px; border:1px solid rgba(218,226,255,.12); border-radius:14px; background:rgba(12,15,23,.97); box-shadow:0 26px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.04);   animation:serverSwitcherIn .18s var(--ease) both; }
    @keyframes serverSwitcherIn { from { opacity:0; transform:translateY(-5px) scale(.985); } }
    .server-switcher-menu > header { display:flex; align-items:center; justify-content:space-between; padding:9px 10px 11px; border-bottom:1px solid rgba(218,226,255,.07); }
    .server-switcher-menu > header span { display:grid; gap:2px; }
    .server-switcher-menu > header strong { color:#e8ecf4; font-size:11px; }
    .server-switcher-menu > header small { color:#687389; font-size:8px; }
    .server-switcher-options { max-height:320px; display:grid; gap:3px; overflow-y:auto; padding:7px 0; }
    .server-switcher-option { min-height:52px; display:flex; align-items:center; gap:10px; padding:7px 9px; border:1px solid transparent; border-radius:10px; color:#8d98aa; transition:border-color .18s ease,background .18s ease,color .18s ease; }
    .server-switcher-option:hover { color:#edf1f7; border-color:rgba(218,226,255,.08); background:rgba(255,255,255,.04); }
    .server-switcher-option.active { color:#f4f7fb; border-color:rgba(124,140,255,.14); background:linear-gradient(110deg,rgba(124,140,255,.12),rgba(255,255,255,.025)); }
    .server-switcher-option-avatar { width:34px; height:34px; flex:0 0 34px; }
    .server-switcher-option-avatar .server-icon { width:34px; height:34px; min-height:0; flex-basis:34px; border-radius:10px; font-size:12px; }
    .server-switcher-option-copy { min-width:0; display:grid; gap:2px; flex:1; }
    .server-switcher-option-copy strong { min-width:0; overflow:hidden; font-size:10px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
    .server-switcher-option-copy small { color:#687389; font-size:8px; }
    .server-switcher-check { width:6px; height:6px; flex:0 0 6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px rgba(107,215,255,.65); }
    .server-switcher-all { min-height:39px; display:flex; align-items:center; gap:8px; padding:0 10px; border-top:1px solid rgba(218,226,255,.07); color:#7f8b9d; font-size:9px; font-weight:700; }
    .server-switcher-all:hover { color:#dfe5ef; }
    .server-switcher-all .ui-icon { width:14px; height:14px; }
    .server-switcher-all .ui-icon:last-child { margin-left:auto; }
    .premium-badge { width:max-content; min-height:20px; display:inline-flex; align-items:center; gap:4px; flex:0 0 auto; padding:0 7px; border:1px solid rgba(255,210,98,.28); border-radius:999px; color:#ffe39a; background:linear-gradient(135deg,rgba(255,194,73,.14),rgba(153,111,255,.14)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 18px rgba(255,194,73,.07); font-size:8px; font-weight:850; letter-spacing:.08em; line-height:1; text-transform:uppercase; white-space:nowrap; vertical-align:middle; }
    .premium-badge .ui-icon { width:10px; height:10px; color:#ffd56d; stroke-width:2; }
    .premium-badge.compact { min-height:17px; gap:3px; padding:0 5px; font-size:7px; }
    .premium-badge.compact .ui-icon { width:8px; height:8px; }
    @media (max-width:720px) {
      .server-switcher summary { min-width:0; max-width:52vw; padding-left:8px; }
      .server-switcher-current small { display:none; }
      .server-switcher-current strong { font-size:10px; }
      .server-switcher-menu { position:fixed; right:12px; left:12px; top:116px; width:auto; }
    }
    .sidebar-with-modules { overflow-y:auto; scrollbar-width:thin; }
    .sidebar-with-modules::-webkit-scrollbar { width:7px; }
    .sidebar-with-modules::-webkit-scrollbar-thumb { border:2px solid transparent; border-radius:99px; background:rgba(151,166,201,.2); background-clip:padding-box; }
    .sidebar-module-panel { display:block; flex:0 0 auto; margin:18px 2px 0; padding-top:16px; border-top:1px solid rgba(218,226,255,.065); }
    .sidebar-module-heading { display:grid; gap:2px; padding:0 9px 11px; }
    .sidebar-module-heading span { color:#5f697e; font-size:8px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
    .sidebar-module-heading small { color:#8b96a9; font-size:9px; font-weight:650; }
    .sidebar-module-overview { min-height:48px; display:flex; align-items:center; gap:10px; margin-bottom:7px; padding:6px 9px; border:1px solid rgba(218,226,255,.075); border-radius:11px; color:#9aa5b6; background:rgba(255,255,255,.018); transition:border-color .18s ease,background .18s ease,color .18s ease; }
    .sidebar-module-overview:hover { color:#eef2f7; border-color:rgba(218,226,255,.14); background:rgba(255,255,255,.04); }
    .sidebar-module-overview.active { color:#f5f8fc; border-color:rgba(107,215,255,.18); background:linear-gradient(110deg,rgba(107,215,255,.1),rgba(124,140,255,.045)); }
    .sidebar-module-overview > span:last-child { min-width:0; display:grid; gap:1px; }
    .sidebar-module-overview strong { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
    .sidebar-module-overview small { color:#687489; font-size:8px; }
    .sidebar-module-nav { display:grid !important; gap:5px !important; overflow:visible !important; margin:0 !important; padding:0 !important; }
    .sidebar-module-group { overflow:hidden; border:1px solid rgba(218,226,255,.06); border-radius:10px; background:rgba(255,255,255,.012); }
    .sidebar-module-group-links { display:grid; gap:2px; padding:3px 5px 6px; border-top:1px solid rgba(218,226,255,.055); }
    .sidebar-module-link { min-height:35px; display:flex; align-items:center; gap:8px; padding:0 7px; border:1px solid transparent; border-radius:8px; color:#778398; font-size:9px; font-weight:650; transition:color .18s ease,border-color .18s ease,background .18s ease; }
    .sidebar-module-link:hover { color:#dce2ec; background:rgba(255,255,255,.03); }
    .sidebar-module-link.active { color:#f0f4f9; border-color:rgba(107,215,255,.13); background:linear-gradient(90deg,rgba(107,215,255,.085),rgba(124,140,255,.035)); }
    .sidebar-module-icon { width:27px; height:27px; display:grid; place-items:center; flex:0 0 27px; border:1px solid rgba(218,226,255,.075); border-radius:8px; color:#96a2b5; background:rgba(255,255,255,.025); font-size:12px; }
    .sidebar-module-icon .ui-icon { width:13px; height:13px; }
    .sidebar-module-overview.active .sidebar-module-icon,.sidebar-module-link.active .sidebar-module-icon { border-color:rgba(107,215,255,.16); color:var(--cyan); background:rgba(107,215,255,.07); }
    .sidebar-module-link > span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .sidebar-with-modules .account { margin-top:18px; }
    .page-servers .page-content { width:min(1180px,100%); }
    .page-servers .guild-dashboard-hero { min-height:150px; padding:25px 28px; }
    .page-servers .guild-dashboard-hero h2 { font-size:clamp(27px,3vw,36px); }
    .guild-dashboard-title { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
    .page-servers #music-container,.page-servers .music-loading,.page-servers .music-empty { min-height:180px; }
    @media (max-width:720px) {
      .sidebar-with-modules { overflow:visible; }
      .sidebar-module-panel { margin:7px 0 0; padding:7px 0 0; border-top-color:rgba(218,226,255,.07); }
      .sidebar-module-heading { display:none; }
      .sidebar-module-overview { min-width:max-content; min-height:36px; margin:0; padding:4px 8px; }
      .sidebar-module-overview small { display:none; }
      .sidebar-module-nav { display:flex !important; overflow-x:auto !important; overflow-y:hidden !important; gap:5px !important; padding:0 0 3px !important; scrollbar-width:none; }
      .sidebar-module-nav::-webkit-scrollbar { display:none; }
      .sidebar-module-group { min-width:max-content; overflow:visible; }
      .sidebar-module-group-links { max-height:175px; overflow-y:auto; }
      .sidebar-module-link { min-width:max-content; min-height:33px; padding:0 7px; }
      .sidebar-module-icon { width:23px; height:23px; flex-basis:23px; }
      .sidebar-with-modules .account { margin-top:0; }
    }

    /* Fixed category headings and spacious server navigation */
    .panel-with-modules .app-shell { grid-template-columns:360px minmax(0,1fr); }
    .panel-with-modules .sidebar { padding-right:24px; padding-left:24px; }
    .panel-page .brand {
      min-height:60px; gap:11px; margin:0 0 25px; padding:8px;
      border:1px solid rgba(218,226,255,.07); border-radius:14px;
      background:linear-gradient(120deg,rgba(255,255,255,.038),rgba(124,140,255,.018));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
      transition:border-color .22s var(--ease),background .22s var(--ease),transform .22s var(--ease);
    }
    .panel-page .brand:hover { border-color:rgba(218,226,255,.12); background:linear-gradient(120deg,rgba(255,255,255,.055),rgba(124,140,255,.03)); transform:translateY(-1px); }
    .panel-page .brand-mark {
      width:42px; height:42px; flex:0 0 42px; padding:2px; overflow:hidden;
      border:1px solid rgba(226,234,255,.2); border-radius:13px;
      background:linear-gradient(145deg,#7ee2ff 0%,#7084ff 55%,#9a7cff 100%);
      box-shadow:0 8px 24px rgba(91,112,255,.2),inset 0 1px 0 rgba(255,255,255,.35);
    }
    .panel-page .brand-mark::after { display:none; }
    .panel-page .brand-mark img {
      width:100%; height:100%; border-radius:10px; object-fit:cover; object-position:center;
      filter:grayscale(1) invert(1) contrast(1.14); mix-blend-mode:screen; transform:none;
    }
    .panel-page .brand > span:last-child { min-width:0; display:grid; gap:2px; }
    .panel-page .brand h1 { color:#f5f7fb; font-size:20px; font-weight:760; letter-spacing:-.045em; line-height:1.05; }
    .panel-page .brand small { margin:0; color:#788398; font-size:10px; font-weight:750; letter-spacing:.12em; line-height:1.2; }
    .panel-with-modules .sidebar-label { color:#999aaf; font-size:11px; }
    .panel-with-modules .side-link { min-height:50px; gap:20px; padding:0 16px; border:0; border-radius:6px; color:#999aaf; background:transparent; box-shadow:none; font-size:16px; font-weight:500; }
    .panel-with-modules .side-link:hover,.panel-with-modules .side-link.active { color:#f4f4f8; background:#292a33; box-shadow:none; transform:none; }
    .panel-with-modules .side-link::before,.panel-with-modules .side-link::after { display:none; }
    .panel-with-modules .side-icon { width:26px; flex:0 0 26px; color:inherit; }
    .panel-with-modules .side-icon .ui-icon { width:26px; height:26px; stroke-width:1.7; }
    .sidebar-module-panel {
      display:flex; flex-direction:column; margin:20px 0 28px; padding:0;
      border:0; border-radius:0;
      background:transparent; box-shadow:none;
    }
    .sidebar-module-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 7px 8px; }
    .sidebar-module-heading span { color:#626d82; font-size:10px; letter-spacing:.18em; }
    .sidebar-module-heading small { color:#8d98aa; font-size:11px; font-weight:650; }
    .sidebar-module-overview {
      min-height:54px; gap:11px; margin:0 0 7px; padding:7px 10px; border-color:transparent;
      border-radius:10px; color:#9ea9ba; background:transparent; box-shadow:none;
      transition:color .2s var(--ease),border-color .2s var(--ease),background .2s var(--ease),transform .2s var(--ease);
    }
    .sidebar-module-overview:hover { color:#eef2f8; border-color:rgba(218,226,255,.07); background:rgba(255,255,255,.028); transform:translateX(1px); }
    .sidebar-module-overview.active { border-color:rgba(107,215,255,.13); background:linear-gradient(105deg,rgba(107,215,255,.09),rgba(124,140,255,.045)); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); }
    .sidebar-module-overview strong { color:#edf2f8; font-size:14px; font-weight:720; }
    .sidebar-module-overview small { color:#69758a; font-size:10px; }
    .panel-with-modules .sidebar-module-overview { min-height:50px; gap:20px; margin:0; padding:8px 16px; border:0; border-radius:6px; color:#999aaf; background:transparent; box-shadow:none; }
    .panel-with-modules .sidebar-module-overview:hover,.panel-with-modules .sidebar-module-overview.active { color:#f4f4f8; background:#292a33; transform:none; }
    .panel-with-modules .sidebar-module-overview strong { color:inherit; font-size:16px; font-weight:500; }
    .sidebar-music-status { display:flex; align-items:center; gap:6px; color:#69d9f9 !important; font-weight:750; }
    .sidebar-music-status[hidden] { display:none; }
    .sidebar-music-bars { width:15px; height:12px; display:inline-flex; align-items:flex-end; justify-content:center; gap:2px; flex:0 0 15px; }
    .sidebar-music-bars i { width:2px; height:9px; border-radius:99px; background:linear-gradient(var(--cyan),var(--blue)); animation:sidebarMusicBar .72s ease-in-out infinite alternate; transform-origin:bottom; }
    .sidebar-music-bars i:nth-child(2) { height:12px; animation-delay:-.28s; }
    .sidebar-music-bars i:nth-child(3) { height:7px; animation-delay:-.5s; }
    .sidebar-music-paused .sidebar-music-bars i { animation-play-state:paused; transform:scaleY(.35); }
    @keyframes sidebarMusicBar { from { transform:scaleY(.32); } to { transform:scaleY(1); } }
    .sidebar-module-nav { gap:18px !important; }
    .sidebar-module-group { border:0; border-radius:0; background:transparent; box-shadow:none; }
    .sidebar-module-group-title { font-size:12px; font-weight:800; letter-spacing:.055em; text-transform:uppercase; display:flex; align-items:center; min-height:40px; margin:0; padding:0 16px; color:#f4f4f8; line-height:1.4; cursor:default; }
    .sidebar-module-group-links { gap:0; padding:2px 0 0; border-top:0; animation:none; }
    .sidebar-module-link { position:relative; display:grid; grid-template-columns:8px 26px minmax(0,1fr); align-items:center; min-height:54px; gap:20px; padding:8px 12px 8px 16px; border:0; border-radius:6px; color:#999aaf; font-size:16px; font-weight:500; line-height:1.35; }
    .sidebar-module-link::before { content:""; position:static; width:8px; height:8px; border-radius:50%; background:currentColor; box-shadow:none; }
    .sidebar-module-link:hover,.sidebar-module-link.active { color:#f4f4f8; background:#292a33; }
    .sidebar-module-link.active::before { background:currentColor; box-shadow:none; }
    .sidebar-module-icon { width:26px; height:26px; flex-basis:26px; border:0; border-radius:0; color:inherit; background:transparent; }
    .sidebar-module-icon .ui-icon { width:26px; height:26px; stroke-width:1.7; }
    .sidebar-module-link > span:last-child { white-space:normal; overflow-wrap:anywhere; }
    .sidebar-module-overview.active .sidebar-module-icon,.sidebar-module-link.active .sidebar-module-icon { border:0; color:inherit; background:transparent; }
    .sidebar-module-link:focus-visible { outline:2px solid #b7b3ef; outline-offset:-2px; border-radius:6px; }
    .panel-with-modules .sidebar-with-modules .account { flex:0 0 auto; gap:9px; min-height:54px; margin:auto 4px 0; padding:8px 9px; border-radius:12px; }
    .panel-with-modules .sidebar-with-modules .account img,.panel-with-modules .sidebar-with-modules .avatar-placeholder { width:36px; height:36px; flex-basis:36px; border-radius:10px; }
    .panel-with-modules .sidebar-with-modules .account-name strong { font-size:12px; }
    .panel-with-modules .sidebar-with-modules .account-name small { margin-top:1px; font-size:10px; }
    .panel-with-modules .sidebar-with-modules .logout { width:31px; height:31px; }
    @media (max-width:720px) {
      .panel-with-modules .app-shell { display:block; }
      .panel-with-modules .sidebar { padding-right:12px; padding-left:12px; }
      .panel-page .brand { min-height:42px; margin:0; padding:3px 4px; border:0; background:transparent; box-shadow:none; }
      .panel-page .brand:hover { background:transparent; transform:none; }
      .panel-page .brand-mark { width:34px; height:34px; flex-basis:34px; padding:2px; border-radius:10px; }
      .panel-page .brand-mark img { border-radius:8px; }
      .sidebar-module-panel { margin-top:14px; padding-top:0; }
      .sidebar-module-nav { gap:12px !important; }
      .sidebar-module-group { width:280px; min-width:280px; }
      .sidebar-module-overview { min-height:36px; }
      .sidebar-module-group-title { padding:0 12px; }
      .sidebar-module-link { min-width:0; min-height:48px; grid-template-columns:6px 24px minmax(0,1fr); gap:16px; padding:8px 12px; font-size:14px; }
      .sidebar-module-link::before { width:6px; height:6px; }
      .sidebar-module-icon,.sidebar-module-icon .ui-icon { width:24px; height:24px; }
      .panel-with-modules .sidebar-with-modules .account { margin-top:0; padding:0; }
    }

    /* Liquid glass material system */
    :root {
      --glass-fill:rgba(18,22,34,.48);
      --glass-fill-strong:rgba(18,22,34,.66);
      --glass-fill-soft:rgba(255,255,255,.035);
      --glass-edge:rgba(238,244,255,.13);
      --glass-edge-soft:rgba(238,244,255,.075);
      --glass-shine:rgba(255,255,255,.14);
      --glass-shadow:0 24px 70px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.11),inset 1px 0 0 rgba(255,255,255,.035);
      --glass-shadow-soft:0 14px 42px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.075);
    }
    .panel-page::before {
      background:
        radial-gradient(circle at 78% 2%,rgba(104,138,255,.2),transparent 31%),
        radial-gradient(circle at 22% 82%,rgba(57,199,225,.1),transparent 27%),
        radial-gradient(circle at 54% 48%,rgba(160,111,255,.08),transparent 34%),
        #080a0f;
      background-size:115% 115%;
      /* Tam ekran gradyanı hareket ettirmek her karede yeniden boyama yapar. */
      animation:none;
    }
    .panel-page::after { opacity:.065; }
    .sidebar {
      border-right-color:var(--glass-edge-soft);
      background:linear-gradient(165deg,#121623,#080b12);
      box-shadow:18px 0 55px rgba(0,0,0,.13),inset -1px 0 0 rgba(255,255,255,.025);
    }
    .page-topbar {
      border-bottom-color:var(--glass-edge-soft);
      background:linear-gradient(180deg,#0f121d,#090c14);
      box-shadow:0 12px 40px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.035);
    }
    .content-area { background:radial-gradient(circle at 82% 4%,rgba(113,139,255,.055),transparent 26%),linear-gradient(180deg,rgba(10,13,21,.06),transparent 300px); }
    .hero,.server-picker-head {
      border-color:var(--glass-edge);
      background:
        radial-gradient(circle at 12% 0,rgba(255,255,255,.105),transparent 32%),
        radial-gradient(circle at 88% 100%,rgba(103,209,255,.06),transparent 31%),
        linear-gradient(135deg,rgba(126,141,255,.105),rgba(21,25,38,.49) 43%,rgba(255,255,255,.025));
      box-shadow:var(--glass-shadow);
    }
    .card,.panel,.metric-card,.module-card,.server-card,.server-picker-card,.settings-section,.music-shell,.login-box,.empty-state {
      border-color:var(--glass-edge-soft);
      background:
        radial-gradient(circle at 12% -8%,rgba(255,255,255,.09),transparent 34%),
        linear-gradient(145deg,rgba(255,255,255,.052),rgba(255,255,255,.017) 48%,rgba(105,125,255,.025)),
        rgba(11,14,23,.47);
      box-shadow:var(--glass-shadow-soft);
    }
    a.card:hover,.metric-card:hover,.server-card:hover,.module-card:hover,.server-picker-card:hover {
      border-color:rgba(194,210,255,.2);
      background:
        radial-gradient(circle at 12% -8%,rgba(255,255,255,.13),transparent 34%),
        linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025) 48%,rgba(112,139,255,.05)),
        rgba(15,19,30,.55);
      box-shadow:0 28px 68px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.13),0 0 0 1px rgba(124,140,255,.025);
    }
    .metric-card::after { background:radial-gradient(circle,rgba(114,140,255,.13),transparent 67%); }
    .side-link:hover { background:rgba(255,255,255,.05); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); }
    .side-link.active {
      border:1px solid rgba(190,204,255,.12);
      background:linear-gradient(110deg,rgba(126,141,255,.17),rgba(255,255,255,.045));
      box-shadow:0 12px 32px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.1);
    }
    .account,.page-badge,.pill,.metric-chip,.server-picker-summary span,.music-channel-pill {
      border-color:var(--glass-edge-soft);
      background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.065);
    }
    .button,.server-picker-action,.music-control {
      border-color:rgba(238,244,255,.12);
      background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.03));
      box-shadow:0 10px 28px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.11);
    }
    .button:hover,.server-picker-action:hover,.music-control:hover:not(:disabled) { border-color:rgba(238,244,255,.22); background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.045)); }
    .button.primary,.server-picker-action.manage,.music-control.primary {
      border-color:rgba(202,211,255,.2);
      background:linear-gradient(135deg,rgba(130,149,255,.88),rgba(105,91,224,.82));
      box-shadow:0 15px 36px rgba(77,80,192,.25),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(42,39,116,.22);
    }
    .metric-icon,.quick-icon,.module-icon,.section-index,.music-stat-icon,.empty-state-icon,.command-mark {
      border-color:rgba(202,216,255,.12);
      background:linear-gradient(145deg,rgba(153,172,255,.14),rgba(255,255,255,.035));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.11),0 8px 22px rgba(0,0,0,.1);
    }
    .command-toolbar,.settings-actions {
      border-color:var(--glass-edge);
      background:linear-gradient(145deg,#1b202f,#0b0e17);
      box-shadow:var(--glass-shadow);
    }
    .command-search input,.form-control,input[type=password],textarea.json-editor {
      border-color:rgba(238,244,255,.1);
      background:linear-gradient(145deg,rgba(5,8,14,.5),rgba(255,255,255,.025));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
    }
    .command-tab:hover,.command-tab[aria-pressed="true"] { border-color:rgba(205,216,255,.12); background:linear-gradient(135deg,rgba(143,159,255,.14),rgba(255,255,255,.04)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
    .toggle-field,.music-stat { border-color:rgba(238,244,255,.07); background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012)); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); }
    .settings-section-head,.landing-window-bar { background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.012)); }
    .breadcrumb a:hover,.logout:hover { background:rgba(255,255,255,.065); }
    .web-language-form { display:flex; align-items:center; gap:9px; }
    .web-language-form label { color:var(--muted); font-size:10px; font-weight:750; letter-spacing:.02em; }
    .web-language-select { min-width:118px; height:38px; padding:0 32px 0 12px; border:1px solid rgba(238,244,255,.11); border-radius:11px; color:#edf2fb; background:rgba(7,10,17,.58); font:700 11px/1 Manrope,sans-serif; cursor:pointer; }
    .topbar-language-form { margin-left:auto; }
    .topbar-language-form label { display:none; }
    .topbar-language-form .web-language-select { min-width:126px; height:36px; border-radius:10px; }
    /* Panel cam görünümü statiktir; hover sırasında büyük yüzeyleri tekrar boyama. */
    .card,.metric-card,.server-card,.module-card,.server-picker-card,.all-server-card,
    .button,.server-picker-action,.music-control { transition:transform .18s var(--ease); }
    .server-switcher-menu { background:#0c0f17; max-height:calc(100dvh - 140px); display:flex; flex-direction:column; }
    .server-switcher-options { min-height:0; overflow-x:hidden; overscroll-behavior:contain; }
    .server-switcher-menu > header,.server-switcher-all { flex-shrink:0; }

    
.me-notice-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.me-notice-actions .button{font-size:12px;padding:9px 14px}.me-notice-actions button{cursor:pointer}.me-notice-actions button:disabled{opacity:.6;cursor:wait}
.me-hero.hero{min-height:150px;padding:30px 34px;margin-bottom:24px}.me-hero.hero h2{font-size:36px;letter-spacing:-.045em;margin:12px 0 8px}.me-hero.hero p{font-size:14px;max-width:760px}
.me-editor{--me-accent:#818cf8}.me-editor *{box-sizing:border-box}.me-editor [hidden],.me-notice[hidden]{display:none!important}.me-icon{width:19px;height:19px;flex:0 0 19px;vertical-align:middle}.me-editor button{cursor:pointer}.me-editor button:disabled{opacity:.5;cursor:default}.me-editor button:focus-visible,.me-inline:focus-visible{outline:2px solid #a5b4fc;outline-offset:3px}
.me-document{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 0 22px;margin-bottom:24px;border-bottom:1px solid var(--line)}.me-document-name{display:flex;align-items:center;gap:14px;min-width:0;flex:1}.me-document-name>.me-icon{color:#9da6fe;width:22px;height:22px}.me-document-name label{display:grid;gap:6px;min-width:0;width:min(100%,390px)}.me-document-name label>span{font-size:9px;font-weight:750;letter-spacing:.15em;color:#8490aa}.me-document-name input{width:100%;border:0;border-bottom:1px solid transparent;background:transparent;color:#f1f3fb;font-family:inherit;line-height:1.4;padding:2px 0;font-size:19px;font-weight:650;border-radius:0}.me-document-name input:focus{outline:0;border-color:#818cf8}.me-document-name input::placeholder{color:#646e83;font-weight:450}.me-document-actions{display:flex;align-items:center;gap:16px}.me-status{color:#8792a7;font-size:11px}.me-status.dirty{color:#d9bd80}
.me-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px;align-items:start}.me-studio,.me-library{min-width:0;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.005))}.me-channel{display:grid;gap:9px;padding:24px 26px;border-bottom:1px solid var(--line)}.me-channel label{display:grid;gap:9px}.me-channel-note{font-size:11px;color:#778197}.me-studio-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 24px}.me-studio-top>div:first-child{display:flex;align-items:center;gap:8px;font-size:12px;color:#c9d0e1}.me-live-dot{width:6px;height:6px;border-radius:50%;background:#73dabd;box-shadow:0 0 9px #73dabd30}.me-mode{display:flex;gap:3px;border:1px solid var(--line);padding:3px;border-radius:10px;background:#0d1018}.me-mode button{display:flex;align-items:center;gap:6px;border:0;border-radius:7px;background:transparent;color:#8490a6;padding:7px 10px;font-size:11px;font-weight:650}.me-mode .me-icon{width:14px;height:14px;flex-basis:14px}.me-mode button[aria-pressed=true]{background:#252b40;color:#e5e9ff}
.me-stage{margin:0 16px 16px;padding:23px 18px 14px;border:1px solid rgba(255,255,255,.035);border-radius:14px;background:#10131c}.me-message-head{display:flex;align-items:center;gap:8px;margin:0 0 16px 38px;min-width:0}.me-avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e5ecef;overflow:hidden;flex-shrink:0}.me-avatar img{display:block;width:100%;height:100%;object-fit:cover}.me-message-head strong{font-size:13px;color:#edf0fa;overflow:hidden;text-overflow:ellipsis}.me-message-head small{font-size:10px;color:#6c778d}.me-bot{font-size:8px;font-weight:800;background:#5865f2;color:white;border-radius:3px;padding:2px 4px}
.me-compose{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start}.me-tools{display:grid;gap:7px;padding-top:2px}.me-tool{display:grid;place-items:center;width:28px;height:30px;padding:0;border:1px solid transparent;border-radius:8px;background:transparent;color:#8c96ad}.me-tool:hover,.me-tool[aria-expanded=true]{color:#dce0ff;background:#292c40;border-color:#737bad55}.me-tool .me-icon{width:18px;height:18px;flex-basis:18px}.me-color-tool span{width:16px;height:16px;border-radius:50%;background:var(--me-accent);box-shadow:0 0 0 3px #ffffff0c}
.me-card{min-width:0;padding:18px 17px 15px;border-radius:5px 12px 12px 5px;border:1px solid #ffffff06;border-left:4px solid var(--me-accent);background:#22252f;box-shadow:0 10px 25px #00000016;overflow-wrap:anywhere}.me-card-top{display:flex;align-items:flex-start;gap:12px}.me-card-copy{min-width:0;flex:1}.me-inline{display:block;width:100%;min-width:0;border:1px solid transparent!important;background:transparent!important;color:#edf0f7!important;padding:5px 6px!important;margin:0!important;border-radius:5px!important;font:inherit;line-height:1.55;box-shadow:none!important;resize:none;overflow:hidden;min-height:0!important;transition:background .15s,border-color .15s}.me-inline:hover{background:#ffffff04!important;border-color:#ffffff10!important}.me-inline:focus{outline:0;background:#11152055!important;border-color:#929aff70!important}.me-inline::placeholder{color:#9aa1b3!important;opacity:.78}.me-inline[name=title]{font-size:17px;font-weight:750;line-height:1.4;margin:5px 0!important}.me-inline[name=description]{font-size:13px;min-height:86px!important}.me-inline[name=author]{font-size:11px;font-weight:600}.me-inline[name=footer]{font-size:10px;color:#b3bccf!important;min-height:25px!important}.me-author,.me-footer{display:flex;align-items:flex-start;gap:3px;min-width:0}.me-author{margin:0 0 2px}.me-footer{margin-top:14px}.me-inline-icon{position:relative;display:grid;place-items:center;width:24px;height:26px;padding:2px;border:1px solid transparent;border-radius:50%;background:transparent;color:#8f97ac;flex:0 0 24px}.me-inline-icon:hover{color:#bec5fc;border-color:#a7b1fc50}.me-inline-icon .me-icon{width:15px;height:15px;flex-basis:15px}.me-inline-icon img{width:20px;height:20px;object-fit:cover;border-radius:50%}.me-inline-icon.has-image>span{display:none}
.me-media{position:relative;display:grid;place-items:center;overflow:hidden;min-width:0;border:1px dashed #abb5d52b;border-radius:9px;background:#11151e33;color:#8994ac;transition:border-color .15s,background .15s}.me-media:hover{border-color:#9b9efa90;background:#8088f510;color:#bac3f5}.me-media>span{display:grid;justify-items:center;gap:8px;padding:12px}.me-media small{font-size:10px;font-weight:500}.me-media .me-icon{width:23px;height:23px}.me-thumbnail{width:76px;min-height:76px;flex:0 0 76px;margin-top:4px;padding:0}.me-thumbnail small{font-size:8px}.me-thumbnail img{max-width:76px;max-height:90px;object-fit:contain}.me-cover{width:100%;min-height:126px;margin-top:14px;padding:0}.me-cover img{max-width:100%;max-height:320px;object-fit:contain;display:block}.me-media.has-image{border-style:solid}.me-media.has-image>span{display:none}.me-media.image-error>span{display:grid}.me-media.image-error>img{display:none}
.me-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}.me-field{grid-column:1/-1;min-width:0;border:1px solid #ffffff13;border-radius:7px;padding:8px}.me-field.inline{grid-column:auto}.me-field input[name=fieldName]{font-size:12px;font-weight:700}.me-field textarea{font-size:12px}.me-field-tools{display:flex;justify-content:space-between;align-items:center;gap:5px;margin-top:6px;color:#8f9ab0;font-size:10px}.me-field-tools label{display:flex;align-items:center;gap:5px}.me-field-tools input{width:12px;height:12px;accent-color:#929aff}.me-field-tools button{background:transparent;color:#949fb8;border:0;padding:2px}.me-field-tools .me-icon{width:14px;height:14px}.me-add-field{display:flex;gap:6px;align-items:center;border:0;background:transparent;color:#9dabc7;padding:10px 6px 0;font-size:11px}.me-add-field .me-icon{width:13px;height:13px;flex-basis:13px}.me-add-field small{color:#77849e;font-size:9px;margin-left:4px}
.me-stage-bottom{display:flex;justify-content:space-between;gap:10px;padding:15px 0 0 38px;color:#6f7c95;font-size:9px}.me-stage-bottom>span:first-child{display:flex;gap:5px;align-items:center}.me-stage-bottom .me-icon{width:11px;height:11px;flex-basis:11px}.me-stage-bottom>[data-embed-count]{white-space:nowrap;font-variant-numeric:tabular-nums}.me-stage-bottom .over-limit{color:#ffa0b1}.me-delivery{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:7px 24px 24px}.me-delivery p{font-size:11px;color:#8490a6;max-width:270px;line-height:1.7;margin:0}.me-delivery .button{flex-shrink:0}.me-delivery .me-icon{width:16px;height:16px;flex-basis:16px}
.me-library{padding:22px 18px}.me-library-head .eyebrow{font-size:8px;letter-spacing:.14em}.me-library-head h3{margin:10px 0;font-size:20px;letter-spacing:-.035em;display:flex;align-items:center;gap:8px}.me-library-head h3 small{font-size:10px;letter-spacing:0;color:#9ba9cb;border:1px solid #ffffff15;padding:3px 6px;border-radius:6px}.me-library p{font-size:11px;color:#8290a7;line-height:1.7;margin:0}.me-new{width:100%;display:flex;align-items:center;gap:8px;justify-content:center;background:#818cf80a;border:1px dashed #818cf855;border-radius:10px;color:#b6baff;font-size:12px;font-weight:650;padding:12px;margin:20px 0 12px}.me-new:hover{background:#818cf81a}.me-new .me-icon{width:15px;height:15px;flex-basis:15px}.me-draft-list{display:grid;gap:7px;max-height:350px;overflow:auto;scrollbar-width:thin}.me-draft-item{display:flex;gap:10px;align-items:center;padding:12px 10px;background:transparent;border:1px solid #ffffff07;border-radius:10px;color:#bdc6dd;text-align:left;min-width:0;width:100%}.me-draft-item[aria-pressed=true]{border-color:#969aff44;background:linear-gradient(105deg,#858ff415,#858ff406)}.me-draft-item:hover{background:#ffffff05}.me-draft-item>i{width:5px;height:27px;flex:0 0 5px;border-radius:3px}.me-draft-item>span{min-width:0;display:grid;gap:5px}.me-draft-item strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.me-draft-item small{font-size:9px;color:#74829b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.me-draft-empty{padding:17px 8px;text-align:center;font-size:11px;color:#727e96}.me-delete{background:transparent;border:0;color:#a98391;font-size:10px;padding:12px 0 0;width:100%;text-align:center}.me-tip{margin-top:24px;border-top:1px solid var(--line);padding-top:22px;display:grid;gap:10px}.me-tip>span{color:#abb5fa;background:#818cf811;border:1px solid #818cf81d;border-radius:11px;width:34px;height:34px;display:grid;place-items:center}.me-tip strong{font-size:12px;line-height:1.5;color:#ced5e5}.me-tip small{font-size:9px;color:#707f97}
.me-popover{position:fixed;z-index:1500;width:320px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #5f68866b;background:#181c29;border-radius:14px;box-shadow:0 20px 70px #00000080;padding:15px;color:#e0e6f6}.me-popover>header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px;font-size:13px}.me-popover>header button{border:0;background:transparent;color:#9ba7c0;padding:3px}.me-popover .form-field{display:grid;gap:8px;margin:12px 0}.me-popover .form-label{font-size:11px}.me-popover .form-control{font-size:12px;padding:10px 12px;min-height:40px}.me-popover>footer{display:flex;align-items:center;gap:14px;justify-content:space-between;margin-top:14px}.me-popover>footer p{font-size:10px;line-height:1.5;color:#8896b0;margin:0}.me-popover .button{min-height:34px;padding:7px 12px;font-size:11px}.me-color-picker{display:flex;gap:12px}.me-color-picker input[type=color]{width:56px;height:42px;padding:3px;border:1px solid #ffffff22;border-radius:8px;background:#ffffff06}.me-color-picker input[type=text]{width:150px;border:1px solid #ffffff18;border-radius:8px;background:#0e121d;padding:8px 12px;color:#e3e6f4;font-family:monospace}.me-swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:15px}.me-swatches button{height:26px;border:3px solid #ffffff15;border-radius:6px;background:var(--swatch)}.me-swatches button:hover{border-color:#ffffff80}.me-emoji-tabs{display:flex;gap:4px;flex-wrap:wrap;margin:12px 0}.me-emoji-tabs button{width:29px;height:29px;background:transparent;color:#adb6ce;border:1px solid transparent;border-radius:7px;font-size:16px;padding:0}.me-emoji-tabs button[aria-pressed=true]{border-color:#a5b4fc66;background:#818cf820}.me-emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;max-height:230px;min-height:96px;overflow:auto;scrollbar-width:thin}.me-emoji-grid button{height:32px;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;font-size:21px;padding:3px}.me-emoji-grid button:hover{background:#818cf833}.me-emoji-grid img{width:24px;height:24px;object-fit:contain}.me-emoji-grid p{grid-column:1/-1;font-size:12px;color:#94a2bf}.me-popover [data-emoji-hint]{display:block;font-size:10px;color:#8290a8;line-height:1.6;margin-top:12px}
.me-rendered{line-height:1.6;font-size:13px;white-space:normal;min-height:160px}.me-rendered>h4{font-size:17px;color:#f1f4fc;margin:7px 0;font-weight:750}.me-rendered a{color:#81c9f5;text-decoration:none}.me-rendered a:hover{text-decoration:underline}.me-rendered .me-preview-text{white-space:pre-wrap;overflow-wrap:anywhere}.me-rendered .me-preview-author,.me-rendered .me-preview-footer{display:flex;align-items:center;gap:7px;font-size:11px;white-space:pre-wrap}.me-rendered .me-preview-footer{font-size:10px;color:#b0bacf;margin-top:14px}.me-preview-author img,.me-preview-footer img{width:22px;height:22px;border-radius:50%;object-fit:cover}.me-rendered>.me-preview-thumbnail{float:right;max-width:80px;max-height:90px;margin:0 0 12px 12px;border-radius:7px}.me-rendered>.me-preview-image{max-width:100%;max-height:330px;display:block;object-fit:contain;margin-top:14px;border-radius:7px}.me-rendered .me-preview-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:10px}.me-preview-fields>div{grid-column:1/-1;min-width:0}.me-preview-fields>.inline{grid-column:auto}.me-preview-fields strong{font-size:12px}.me-rendered code{background:#10131e;border:1px solid #ffffff0a;border-radius:4px;padding:1px 4px;font-size:.9em}.me-rendered .me-custom-emoji{display:inline-block;width:20px;height:20px;vertical-align:middle;object-fit:contain}.me-preview-empty{color:#96a1b8;font-size:12px}.me-notice{border:1px solid #65d8b638;background:#193d322b;color:#acebd6;border-radius:12px;margin:0 0 22px;padding:15px 18px;font-size:13px;line-height:1.6}.me-notice.error{border-color:#ff849e55;background:#62253740;color:#ffb7c6}
@media(min-width:1600px){.me-stage{padding:28px 30px 18px}.me-layout{grid-template-columns:minmax(0,1fr) 300px}.me-card{padding:22px}.me-cover{min-height:160px}}
@media(max-width:1200px){.me-layout{grid-template-columns:minmax(0,1fr)}.me-library{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}.me-library-head{grid-row:span 2}.me-library .me-new{margin:0}.me-draft-list{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));max-height:220px}.me-tip{display:none}.me-delete{grid-column:1/-1}.me-status{display:none}}
@media(max-width:650px){.me-hero.hero{padding:24px;min-height:130px}.me-hero.hero h2{font-size:29px}.me-document{flex-wrap:wrap}.me-document-name{flex-basis:100%}.me-document-actions{width:100%;justify-content:space-between}.me-status{display:block}.me-document-actions .button{margin-left:auto}.me-channel{padding:18px}.me-studio-top{padding:14px}.me-mode button{padding:6px 8px;font-size:10px}.me-mode .me-icon{display:none}.me-stage{margin:0 8px 12px;padding:16px 9px 12px}.me-card{padding:12px 9px}.me-compose{grid-template-columns:24px minmax(0,1fr);gap:6px}.me-tools .me-tool{width:24px}.me-message-head{margin-left:30px}.me-thumbnail{width:52px;min-height:60px;flex-basis:52px}.me-thumbnail small{display:none}.me-thumbnail img{max-width:52px}.me-card-top{gap:5px}.me-inline[name=title]{font-size:15px}.me-stage-bottom{padding-left:30px;flex-wrap:wrap}.me-delivery{padding:8px 16px 18px;flex-wrap:wrap}.me-delivery p{max-width:none}.me-delivery .button{width:100%}.me-fields,.me-rendered .me-preview-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.me-library{padding:18px;display:block}.me-library .me-new{margin:16px 0 10px}.me-draft-list{grid-template-columns:1fr}.me-popover{width:310px}.me-editor .button{font-size:12px}}
.page-content > .me-editor{animation:none;transform:none}
.me-popover{inset:auto;margin:0;box-sizing:border-box}
.me-stage-bottom>[data-embed-count]{margin-left:auto}
.me-preview-author .me-custom-emoji,.me-preview-footer .me-custom-emoji{border-radius:0;width:1.4em;height:1.4em}
.me-editor .me-media>.me-media-status:not([hidden]){display:block;position:absolute;bottom:6px;left:6px;right:6px;padding:4px 6px;border-radius:5px;background:#101c20eb;color:#97e0c5;font-size:10px;line-height:1.3;pointer-events:none}
.me-media[data-image-state=loaded]{border-color:#6ad6b366}.me-cover[data-image-state=loaded]{padding-bottom:28px}
.me-media[data-image-state=loading]{border-color:#9ea3f477}.me-media[data-image-state=loading] [data-media-placeholder]{color:#b5bcfa}
.me-media.image-error{border-color:#e8878b88;background:#602d351c}.me-media.image-error [data-media-placeholder]{color:#efabb1}
.me-editor .me-thumbnail:not([data-image-state=empty]) [data-media-placeholder] small{display:block;font-size:8px;line-height:1.4}.me-thumbnail [data-media-placeholder]{padding:7px}.me-thumbnail .me-media-status{font-size:8px!important;left:2px!important;right:2px!important;bottom:2px!important;padding:2px!important}
.me-inline-icon.image-error>span{display:grid}.me-inline-icon[data-image-state]:not([data-image-state=empty])::after{content:'';position:absolute;right:-2px;bottom:0;width:7px;height:7px;border:2px solid #23262f;border-radius:50%;background:#a5adff}.me-inline-icon[data-image-state=loaded]::after{background:#73dabd}.me-inline-icon.image-error::after{background:#ed939c}
.me-image-feedback{display:block;font-size:11px;line-height:1.55;color:#b8c1db;overflow-wrap:anywhere}.me-image-feedback[data-state=loaded]{color:#8bdbbd}.me-image-feedback[data-state=error],.me-image-feedback[data-state=page],.me-image-feedback[data-state=invalid]{color:#f1a6af}.me-popover .me-image-help{margin:12px 0 0;padding-top:12px;border-top:1px solid #ffffff12;color:#909db6;font-size:11px;line-height:1.6}.me-preview-media-error{display:block;padding:7px 9px;margin:6px 0;border:1px dashed #e8878b66;border-radius:6px;color:#efa6b0;font-size:11px}
@media(prefers-reduced-motion:reduce){.me-editor *{transition:none!important}}

.auto-reply-editor{min-width:0;gap:14px}.auto-reply-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px}.auto-reply-toolbar h5{margin:0;color:var(--text);font-size:14px;font-weight:750}.auto-reply-toolbar p,.auto-reply-empty p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.6}.auto-reply-count{flex-shrink:0;padding:6px 11px;border:1px solid rgba(162,175,255,.17);border-radius:9px;color:#b6c1fa;background:rgba(140,155,255,.07);font-size:12px;font-variant-numeric:tabular-nums}.auto-reply-list{display:grid;gap:14px;min-width:0}.auto-reply-card{min-width:0;border:1px solid rgba(225,233,255,.11);border-radius:16px;background:linear-gradient(120deg,rgba(148,161,232,.045),rgba(7,10,18,.25));overflow:hidden}.auto-reply-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;border-bottom:1px solid rgba(225,233,255,.07)}.auto-reply-card-title{display:flex;align-items:center;gap:10px;color:#dce2f5;font-size:12px;font-weight:750}.auto-reply-number{color:#abb9ff;font-size:11px;font-variant-numeric:tabular-nums}.auto-reply-remove{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:6px 9px;border:1px solid transparent;border-radius:8px;background:transparent;color:#a1a9bd;font-family:inherit;font-size:12px;font-weight:600;cursor:pointer}.auto-reply-remove svg{width:15px;height:15px}.auto-reply-remove:hover{color:#ffc0c6;background:rgba(255,105,126,.09);border-color:rgba(255,105,126,.15)}
.auto-reply-fields{display:grid;grid-template-columns:minmax(220px,.85fr) minmax(0,1.6fr);align-items:start;gap:18px 24px;padding:18px}.auto-reply-match{margin:0;padding:0;border:0;min-width:0}.auto-reply-match legend{margin-bottom:9px;padding:0}.auto-reply-segments{display:flex;gap:4px;padding:4px;border:1px solid rgba(226,234,255,.1);border-radius:11px;background:rgba(3,6,13,.4)}.auto-reply-segments label{position:relative;flex:1;min-width:0;cursor:pointer}.auto-reply-segments input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.auto-reply-segments span{display:flex;justify-content:center;align-items:center;min-height:34px;padding:4px 8px;border:1px solid transparent;border-radius:7px;color:#929bb0;font-size:12px;font-weight:700;text-align:center}.auto-reply-segments input:checked+span{color:#e4e8ff;background:rgba(140,154,255,.18);border-color:rgba(168,180,255,.27);box-shadow:0 2px 6px rgba(0,0,0,.15)}.auto-reply-segments input:focus-visible+span,.auto-reply-remove:focus-visible,.auto-reply-add:focus-visible{outline:2px solid #a8b5ff;outline-offset:3px}.auto-reply-help{margin:8px 0 0;color:var(--muted);font-size:11px;line-height:1.6}.auto-reply-trigger{min-width:0}.auto-reply-trigger .form-control{min-height:44px}.auto-reply-response{grid-column:1/-1;min-width:0}.auto-reply-response-label{display:flex;align-items:center;justify-content:space-between;gap:12px}.auto-reply-character-count{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}.auto-reply-response textarea.form-control{width:100%;min-height:80px;line-height:1.6}
.auto-reply-embed-toggle,.auto-reply-embed-designer{grid-column:1/-1}.auto-reply-embed-designer{min-width:0;border:1px solid rgba(155,166,229,.16);border-radius:16px;background:linear-gradient(145deg,rgba(12,16,27,.94),rgba(17,20,34,.72));overflow:hidden}.auto-reply-embed-designer .me-studio-top{border-bottom:1px solid rgba(225,233,255,.08)}.auto-reply-embed-designer .me-stage{margin:16px}.auto-reply-embed-designer .me-inline[data-auto-reply-field=embedTitle]{font-size:17px;font-weight:750;line-height:1.4;margin:5px 0!important}.auto-reply-embed-designer [data-auto-reply-embed-reply-slot]>.me-inline{font-size:13px;min-height:86px!important}.auto-reply-embed-designer .me-inline[data-auto-reply-field=embedAuthor]{font-size:11px;font-weight:600}.auto-reply-embed-designer .me-inline[data-auto-reply-field=embedFooter]{font-size:10px;color:#b3bccf!important;min-height:25px!important}.auto-reply-embed-designer .me-field [data-auto-reply-field=embedFieldName]{font-size:12px;font-weight:700}.auto-reply-embed-designer .me-rendered{grid-column:2}.auto-reply-embed-options{margin:0 16px 16px 54px;padding:16px;border:1px solid rgba(129,140,248,.22);border-radius:12px;background:#151a27;box-shadow:0 14px 34px rgba(0,0,0,.2)}.auto-reply-embed-options>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid rgba(225,233,255,.08);color:#dfe4f3;font-size:12px}.auto-reply-embed-options>header button{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:8px;color:#9da8c0;background:transparent}.auto-reply-embed-options>header .me-icon{width:16px;height:16px}.auto-reply-embed-options .form-field{display:grid;gap:8px;margin:12px 0}.auto-reply-embed-options .me-color-picker{display:flex;flex-wrap:wrap}.auto-reply-embed-options .me-emoji-grid{min-height:0;grid-template-columns:repeat(10,minmax(0,1fr))}.auto-reply-emoji-hint{margin:0 0 10px;color:#8995ad;font-size:11px}
.auto-reply-empty{padding:28px 20px;text-align:center;border:1px dashed rgba(168,180,255,.18);border-radius:14px;background:rgba(140,154,255,.025)}.auto-reply-empty strong{color:#dce2f5;font-size:14px}.auto-reply-add{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;padding:10px 16px;border:1px dashed rgba(168,180,255,.3);border-radius:11px;color:#bec8ff;background:rgba(140,154,255,.055);font-family:inherit;font-size:12px;font-weight:750;cursor:pointer}.auto-reply-add>span{font-size:20px;line-height:1;font-weight:400}.auto-reply-add:hover:enabled{background:rgba(140,154,255,.12);border-color:rgba(168,180,255,.55)}.auto-reply-add:disabled{opacity:.45;cursor:not-allowed}.auto-reply-footnote,.auto-reply-limit{margin:0;color:var(--muted);font-size:11px;line-height:1.6}.auto-reply-limit{color:#e9c294}.auto-reply-editor [hidden]{display:none!important}
@media(max-width:760px){.auto-reply-toolbar{align-items:flex-start}.auto-reply-fields{grid-template-columns:minmax(0,1fr);gap:16px;padding:14px}.auto-reply-card-head{padding:6px 14px}.auto-reply-remove{min-height:44px;min-width:44px}.auto-reply-segments span{min-height:40px}.auto-reply-toolbar h5{font-size:13px}.auto-reply-embed-designer .me-stage{margin:8px}.auto-reply-embed-options{margin:0 8px 8px 38px}.auto-reply-embed-options .me-emoji-grid{grid-template-columns:repeat(7,minmax(0,1fr))}}


  
.page-topbar:has(.panel-search) { gap:24px; }
.page-topbar:has(.panel-search) .breadcrumb { min-width:0; flex-shrink:1; }
.panel-search { position:relative; flex:0 1 360px; min-width:220px; margin:0; color:var(--text); }
.panel-search-box { display:flex; align-items:center; gap:10px; height:40px; padding:0 12px; border:1px solid rgba(191,203,237,.13); border-radius:11px; background:rgba(255,255,255,.028); }
.panel-search-box:focus-within { border-color:#8491ef; box-shadow:0 0 0 3px rgba(124,140,255,.10); }
.panel-search-box svg { width:17px; height:17px; color:#8c99b0; flex-shrink:0; }
.panel-search input { min-width:0; width:100%; padding:0; border:0; outline:0; box-shadow:none; color:#edf2fc; background:transparent; font:inherit; font-size:12px; }
.panel-search input::placeholder { color:#8e9aaf; }
.panel-search input::-webkit-search-cancel-button { display:none; }
.panel-search kbd { flex-shrink:0; border:1px solid rgba(191,203,237,.13); border-radius:5px; padding:2px 4px; color:#9ca7bd; font-family:inherit; font-size:10px; white-space:nowrap; }
.panel-search-clear { flex:0 0 23px; width:23px; height:23px; padding:0; border:0; border-radius:5px; color:#bdc8db; background:transparent; cursor:pointer; font-size:19px; }
.panel-search-clear:hover { background:rgba(255,255,255,.08); }
.panel-search [hidden] { display:none !important; }
.panel-search-panel { position:absolute; top:calc(100% + 12px); left:0; z-index:50; width:max(100%,430px); max-width:calc(100vw - 32px); max-height:calc(100dvh - 160px); box-sizing:border-box; display:flex; flex-direction:column; overflow:auto; border:1px solid rgba(177,192,241,.2); border-radius:15px; padding:8px; background:linear-gradient(145deg,#1b2030,#10141f 65%); box-shadow:0 20px 60px rgba(0,0,0,.5); }
.panel-search-status { margin:0; padding:7px 10px 10px; color:#a1acc0; font-size:11px; line-height:1.6; }
.panel-search-list { min-height:0; max-height:min(450px,55vh); overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; }
.panel-search-result { display:flex; align-items:center; gap:11px; padding:11px 10px; border-radius:9px; color:#eff2fc; text-decoration:none; }
.panel-search-result[aria-selected=true] { background:linear-gradient(105deg,rgba(124,140,255,.18),rgba(107,215,255,.06)); outline:1px solid rgba(147,161,245,.2); outline-offset:-1px; }
.panel-search-kind { display:grid; place-items:center; width:30px; height:30px; flex-shrink:0; border:1px solid rgba(157,178,238,.12); border-radius:8px; color:#8ed6f6; background:rgba(107,215,255,.05); }
.panel-search-result > span:last-child { min-width:0; }
.panel-search-result strong { display:block; font-size:12px; line-height:1.6; }
.panel-search-result small { display:block; color:#8c9ab2; font-size:10px; line-height:1.5; margin-top:2px; overflow-wrap:anywhere; }
.panel-search-help { border-top:1px solid rgba(191,203,237,.08); margin:6px 4px 0; padding:10px 6px 3px; color:#77859e; font-size:10px; }
.panel-search-target { outline:2px solid #8b9aff; outline-offset:5px; border-radius:8px; scroll-margin-top:160px; }
@media(max-width:1200px) {
 .page-topbar:has(.panel-search) { flex-wrap:wrap; gap:10px 18px; padding-top:12px; padding-bottom:12px; }
 .page-topbar .panel-search { order:3; flex:1 0 100%; min-width:0; }
 .panel-search-panel { width:100%; box-sizing:border-box; }
}
@media(max-width:520px) {
 .page-topbar:has(.panel-search) .breadcrumb { flex:1; overflow:hidden; }
 .page-topbar:has(.panel-search) .breadcrumb > a,.page-topbar:has(.panel-search) .breadcrumb > i { display:none; }
 .page-topbar:has(.panel-search) .web-language-select { min-width:85px; }
 .panel-search kbd { display:none; }
}