/* dashboard.css — PORTFOLIO REDESIGN — VanguardBot Dashboard (Yusuf style) */
        /* Auth */
        .login-link{
            color:#fff !important; background:#5865F2;
            border:1px solid rgba(255,255,255,0.12);
            box-shadow:0 4px 14px rgba(88,101,242,0.30);
            font-family:var(--font-body); font-weight:700; border-radius:999px;
        }
        .login-link:hover{ background:#4752C4 !important; box-shadow:0 6px 20px rgba(88,101,242,0.45); }
        .auth-chip{
            display:flex; align-items:center; gap:8px;
            padding:4px 10px 4px 4px; border-radius:999px;
            background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08);
            backdrop-filter:blur(8px);
        }
        .auth-avatar{ width:28px; height:28px; border-radius:50%; object-fit:cover; border:1.5px solid var(--red); }
        .auth-name{ font-family:var(--font-body); font-size:12px; font-weight:600; color:#fff; max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
        /* App shell */
        .dash-app{ padding-bottom:60px; }
        .dash-loading, .dash-login-required, .dash-no-servers{
            max-width:560px; margin:70px auto; text-align:center;
            padding:44px 28px; background:rgba(12,12,12,0.9);
            border:1px solid rgba(255,255,255,0.06); border-radius:20px;
            box-shadow:0 16px 40px rgba(0,0,0,0.45);
        }
        .dash-loading h4, .dash-login-required h2, .dash-no-servers h2{
            font-family:var(--font-display); font-size:24px; font-weight:700; color:#fff; margin-top:14px; letter-spacing:-0.4px;
        }
        .dash-loading p, .dash-login-required p, .dash-no-servers p{
            font-family:var(--font-body); color:#777; font-size:13px; margin:8px 0 18px; line-height:1.6;
        }
        /* Topbar — pill */
        .dash-topbar{
            display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
            padding:14px 16px; margin:18px 0 16px;
            background:rgba(12,12,12,0.84); border:1px solid rgba(255,255,255,0.06);
            border-radius:16px; backdrop-filter:blur(12px);
        }
        .dash-guild-select-wrap{ display:flex; align-items:center; gap:10px; }
        .dash-guild-label{
            font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:1.2px;
            text-transform:uppercase; color:#9a9a9a; display:flex; align-items:center; gap:6px;
        }
        .dash-guild-label i{ color:var(--red); }
        .dash-guild-select{
            background:rgba(8,8,8,0.9); border:1px solid rgba(255,255,255,0.08);
            border-radius:999px; color:#fff;
            padding:9px 14px; font-size:13px; font-family:var(--font-body);
            outline:none; min-width:260px; transition:border-color var(--transition);
        }
        .dash-guild-select:focus{ border-color:var(--red-border); }
        .dash-bot-status{ font-family:var(--font-mono); font-size:11px; font-weight:600; color:#666; }
        .dash-bot-status .in{ color:#00c853; } .dash-bot-status .out{ color:#ff9800; }
        .dash-logout-btn{
            display:inline-flex; align-items:center; gap:7px;
            background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08);
            color:#aaa; border-radius:999px; padding:8px 14px;
            font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.6px;
            text-transform:uppercase; transition:all var(--transition);
        }
        .dash-logout-btn:hover{ color:#fff; border-color:var(--red-border); background:var(--red-dim); }
        /* Layout — sidebar + main as portfolio bento */
        .dash-layout{ display:flex; gap:16px; align-items:flex-start; }
        .dash-layout .dc-nav-sidebar{
            width:240px; min-width:240px;
            background:rgba(12,12,12,0.92); border:1px solid rgba(255,255,255,0.06);
            border-radius:16px; padding:10px 8px;
            position:sticky; top:82px; max-height:calc(100vh - 96px); overflow-y:auto;
            backdrop-filter:blur(10px);
        }
        .dash-layout .dc-nav-sidebar::-webkit-scrollbar{ width:3px; }
        .dash-main{
            flex:1; min-width:0;
            background:rgba(12,12,12,0.92); border:1px solid rgba(255,255,255,0.06);
            border-radius:16px; padding:20px 20px 24px;
            box-shadow:0 12px 32px rgba(0,0,0,0.35);
        }
        .dash-pane-header{
            display:flex; align-items:center; gap:12px;
            padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid rgba(255,255,255,0.06);
        }
        .dash-pane-icon{
            width:42px; height:42px; border-radius:12px;
            background:var(--red-dim); border:1px solid var(--red-border);
            display:flex; align-items:center; justify-content:center; color:var(--red); font-size:16px;
        }
        .dash-pane-title{ font-family:var(--font-display); font-size:18px; font-weight:700; color:#fff; letter-spacing:-0.3px; }
        .dash-pane-desc{ font-family:var(--font-body); font-size:12px; color:#777; margin-top:2px; }
        /* Save row — sticky bottom style */
        .dash-save-row{
            display:flex; align-items:center; gap:12px; flex-wrap:wrap;
            margin-top:20px; padding:14px 16px;
            background:rgba(8,8,8,0.96); border:1px solid rgba(255,255,255,0.06);
            border-radius:12px; position:sticky; bottom:14px; backdrop-filter:blur(10px);
        }
        .dash-save-row .manage-save-btn{ margin-top:0; border-radius:999px; padding:10px 18px; font-family:var(--font-body); }
        .dash-saved-hint{ font-family:var(--font-mono); font-size:11px; color:#666; }
        .dash-saved-hint.dirty{ color:#ffb300; }
        /* Lists */
        .dash-list{ margin-top:10px; display:flex; flex-direction:column; gap:8px; }
        .dash-list-item{
            display:flex; align-items:center; gap:8px; flex-wrap:wrap;
            background:rgba(8,8,8,0.96); border:1px solid rgba(255,255,255,0.06);
            border-radius:12px; padding:10px;
        }
        .dash-list-item input, .dash-list-item select, .dash-list-item textarea{
            background:rgba(18,18,18,0.96); border:1px solid rgba(255,255,255,0.06);
            border-radius:10px; color:#fff; padding:8px 10px;
            font-size:13px; font-family:var(--font-body); outline:none; flex:1; min-width:120px;
        }
        .dash-list-item input:focus, .dash-list-item select:focus{ border-color:var(--red-border); }
        .dash-remove-btn{
            background:rgba(200,40,40,0.12); border:1px solid rgba(200,40,40,0.25);
            color:#ff6b6b; width:30px; height:30px; border-radius:999px;
            cursor:pointer; font-size:13px; display:flex; align-items:center; justify-content:center;
        }
        .dash-remove-btn:hover{ background:rgba(200,40,40,0.22); }
        .dash-add-btn{
            background:transparent; border:1px dashed rgba(122,0,0,0.45);
            color:var(--red); padding:8px 14px; border-radius:999px;
            font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.6px;
            text-transform:uppercase; cursor:pointer; margin-top:10px;
        }
        .dash-add-btn:hover{ background:var(--red-dim); }
        /* Tables */
        .dash-table-wrap{ overflow-x:auto; margin-top:10px; border:1px solid rgba(255,255,255,0.06); border-radius:12px; background:rgba(8,8,8,0.6); }
        .dash-table{ width:100%; border-collapse:collapse; min-width:560px; }
        .dash-table th{
            text-align:left; font-family:var(--font-mono); font-size:10px; font-weight:700;
            text-transform:uppercase; letter-spacing:0.8px; color:#666;
            padding:10px 12px; background:rgba(255,255,255,0.02);
            border-bottom:1px solid rgba(255,255,255,0.06);
        }
        .dash-table td{ padding:10px 12px; border-bottom:1px solid rgba(255,255,255,0.04); font-size:13px; font-family:var(--font-body); }
        .dash-table tr:hover td{ background:rgba(255,255,255,0.02); }
        .dash-table input, .dash-table select{
            background:rgba(18,18,18,0.96); border:1px solid rgba(255,255,255,0.06);
            border-radius:8px; color:#fff; padding:6px 8px; font-family:var(--font-body); font-size:12px;
        }
        .dash-event-label{ font-family:var(--font-body); font-weight:600; color:#fff; display:flex; align-items:center; gap:7px; }
        .dash-event-label i{ color:var(--red); font-size:11px; }
        /* Toast */
        .dash-toast{
            position:fixed; left:50%; bottom:22px; transform:translate(-50%, 12px);
            background:#0a0a0a; border:1px solid rgba(0,200,83,0.35);
            color:#00e676; padding:10px 18px; border-radius:999px;
            font-family:var(--font-mono); font-size:12px; font-weight:700; z-index:9999;
            opacity:0; pointer-events:none; transition:all 0.25s;
            box-shadow:0 10px 30px rgba(0,0,0,0.5);
        }
        .dash-toast.show{ opacity:1; transform:translate(-50%,0); }
        .dash-toast.err{ border-color:rgba(255,80,80,0.35); color:#ff6b6b; }
        /* Embed preview */
        .dash-preview-wrap{ margin-top:8px; }
        .dash-preview-label{
            font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:0.8px;
            text-transform:uppercase; color:#666; display:flex; align-items:center; gap:6px; margin-bottom:8px;
        }
        .dash-preview-label i{ color:var(--red); }
        .dash-embed-preview{
            position:relative; background:#1e1f22; border-radius:12px;
            border-left:4px solid var(--red); padding:14px 16px;
            display:flex; flex-direction:column; gap:5px; max-width:520px;
        }
        .dash-embed-preview-title{ font-family:var(--font-display); font-size:15px; font-weight:700; color:#fff; }
        .dash-embed-preview-desc{ font-family:var(--font-body); font-size:13px; color:#dbdee1; line-height:1.5; }
        .dash-plain-preview{ background:#1e1f22; border-radius:12px; padding:14px 16px; max-width:520px; }
        .dash-var-hint{
            font-family:var(--font-mono); font-size:11px; color:#777;
            background:rgba(255,255,255,0.03); border:1px dashed rgba(255,255,255,0.08);
            border-radius:10px; padding:8px 12px; margin:6px 0;
        }
        .dash-var-hint i{ color:var(--red); margin-right:6px; }
        /* Responsive dashboard */
        @media(max-width:900px){
            .dash-layout{ flex-direction:column; }
            .dash-layout .dc-nav-sidebar{
                width:100%; min-width:0; position:static; max-height:none;
                display:flex; flex-direction:row; flex-wrap:wrap; gap:6px; padding:10px;
                border-radius:14px;
            }
            .dash-layout .dc-nav-sidebar .dc-nav-category{ width:100%; }
            .dash-layout .dc-nav-sidebar .dc-nav-item{ width:auto; flex:1 1 auto; justify-content:center; min-width:120px; }
            .dash-main{ padding:16px; }
        }
        @media(max-width:560px){
            .dash-topbar{ flex-direction:column; align-items:stretch; }
            .dash-guild-select{ min-width:0; width:100%; }
        }
        .dash-emoji-wrap.is-ok input{ border-color:rgba(59,165,92,0.55) !important; }
        .dash-emoji-wrap.is-bad input{ border-color:#ed4245 !important; }
        details.dash-tk-modal{ border:1px solid rgba(255,255,255,0.06); border-radius:12px; background:rgba(8,8,8,0.9); }
        details.dash-tk-modal > summary{ font-family:var(--font-body); cursor:pointer; padding:10px 12px; font-size:13px; color:#aaa; }