:root{--bg:#090a0c;--panel:#111318;--panel2:#171a20;--line:#272b33;--text:#f3f4f6;--muted:#8f96a3;--red:#ef2b32;--green:#25c178;--orange:#f0a128}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:inherit;text-decoration:none}.topbar{height:68px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;background:#0d0f13;position:sticky;top:0;z-index:10}
.brand{font-size:22px;font-weight:900;letter-spacing:-1px;color:var(--red)}.brand span{color:#fff}.brand small{color:var(--muted);font-size:10px;letter-spacing:2px;margin-left:8px}.nav{display:flex;gap:18px;align-items:center;font-size:14px}.nav a{color:#c9cdd4}.nav a:hover{color:#fff}.logout{color:var(--muted)!important}
.container{max-width:1500px;margin:0 auto;padding:32px}.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.page-head h1{font-size:34px;margin:0 0 5px}.page-head p{margin:0;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--panel2);color:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 15px;font-weight:700;cursor:pointer}.btn.primary{background:var(--red);border-color:var(--red)}.btn.small{padding:7px 10px;font-size:12px}.btn.wide{width:100%}.danger-button{margin-top:14px;color:#ff7378}
.money-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:16px}.money-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px}.money-card span{display:block;color:var(--muted);font-size:13px}.money-card strong{display:block;font-size:32px;margin:8px 0}.money-card small{color:var(--muted)}.money-card.accent{border-color:#552127;background:linear-gradient(135deg,#171317,#231015)}.money-card.accent strong{color:#ff646a}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.stat{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px 20px}.stat span{display:block;color:var(--muted);font-size:13px;margin-bottom:9px}.stat strong{font-size:30px}.stat.warning strong{color:var(--orange)}.stat.danger strong{color:var(--red)}
.toolbar{display:grid;grid-template-columns:minmax(240px,1fr) 220px auto;gap:10px;margin-bottom:16px}input,select,textarea{width:100%;background:#0d0f13;border:1px solid var(--line);border-radius:9px;color:#fff;padding:11px 12px;outline:none}input:focus,select:focus,textarea:focus{border-color:#5d626d}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px;background:var(--panel);margin-top:18px}table{width:100%;border-collapse:collapse;min-width:1100px}th,td{text-align:left;padding:14px 15px;border-bottom:1px solid var(--line);vertical-align:middle}th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.6px;background:#0f1115}td{font-size:14px}td small{color:var(--muted)}.fighter{font-size:16px}.badge{display:inline-block;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:800}.badge.active{background:#123527;color:#56e3a0}.badge.trial{background:#182b3b;color:#6cc6ff}.badge.expiring{background:#3b2b10;color:#ffc866}.badge.expired{background:#3c171a;color:#ff777c}.badge.blocked{background:#292b30;color:#aaa}.extend{display:flex;gap:6px}.extend select{padding:7px;width:112px}.link{color:#ff6268;font-weight:700}.empty{text-align:center;color:var(--muted);padding:35px}
.form-card{background:var(--panel);border:1px solid var(--line);padding:22px;border-radius:16px}.form-card.compact{margin-bottom:18px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:16px}.span-2{grid-column:span 2}label{display:block;color:#c9cdd4;font-size:13px;font-weight:700}label input,label select,label textarea{margin-top:7px}.form-card>.btn{margin-top:18px;min-width:150px}
.server-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.server-card,.empty-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px}.server-card-head{display:flex;justify-content:space-between;gap:15px;margin-bottom:16px}.server-card-head strong{display:block;font-size:20px}.server-card-head small{display:block;color:var(--muted);margin-top:4px}.server-card-head span{font-weight:800;color:#ff676d}.server-meta{font-size:14px;margin:8px 0;color:#c7cbd2}.server-note{background:#0d0f13;border-radius:10px;padding:12px;margin:14px 0;color:#aeb4bf}.delete-link{background:none;border:0;color:#ff6f74;padding:0;cursor:pointer;font-weight:700}
.login-card{max-width:420px;margin:90px auto;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:32px}.login-card .mark{font-size:36px;font-weight:900}.login-card .mark span{color:var(--red)}.login-card h1{margin-bottom:5px}.login-card p{color:var(--muted);margin-top:0;margin-bottom:24px}.login-card input{margin-bottom:12px}.flash{padding:12px 15px;border-radius:10px;margin-bottom:14px}.flash.success{background:#123527;color:#66e5aa}.flash.danger{background:#3c171a;color:#ff8b90}
@media(max-width:900px){.money-grid,.stats{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr 1fr}.server-cards{grid-template-columns:1fr}.container{padding:18px}.topbar{padding:0 18px}.page-head{align-items:flex-start;gap:15px}.toolbar{grid-template-columns:1fr}.nav{gap:10px;font-size:12px}}
@media(max-width:580px){.money-grid,.stats,.grid{grid-template-columns:1fr}.span-2{grid-column:auto}.page-head{flex-direction:column}.toolbar{display:flex;flex-direction:column}.page-head h1{font-size:28px}.topbar{height:auto;min-height:68px;align-items:flex-start;padding-top:15px;padding-bottom:15px}.nav{flex-wrap:wrap;justify-content:flex-end}}


/* ===== Dashboard 2.0 ===== */

.dashboard-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-bottom:24px;
    padding:28px;
    border:1px solid var(--line);
    border-radius:22px;
    background:
        radial-gradient(
            circle at top right,
            rgba(239,43,50,.16),
            transparent 34%
        ),
        linear-gradient(135deg,#121419,#0e1014);
}

.dashboard-kicker,
.section-label{
    display:block;
    margin-bottom:7px;
    color:#ff5b61;
    font-size:11px;
    font-weight:900;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

.dashboard-hero h1{
    margin:0 0 8px;
    font-size:38px;
    letter-spacing:-1.4px;
}

.dashboard-hero p{
    margin:0;
    color:var(--muted);
}

.sync-state{
    min-width:230px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 16px;
    border:1px solid var(--line);
    border-radius:14px;
    background:rgba(10,12,15,.72);
}

.sync-state strong,
.sync-state small{
    display:block;
}

.sync-state small{
    margin-top:4px;
    color:var(--muted);
    font-size:11px;
}

.sync-dot{
    width:11px;
    height:11px;
    border-radius:50%;
    flex:0 0 auto;
}

.sync-state.success .sync-dot{
    background:var(--green);
    box-shadow:0 0 0 6px rgba(37,193,120,.12);
}

.sync-state.error .sync-dot{
    background:var(--red);
    box-shadow:0 0 0 6px rgba(239,43,50,.12);
}

.sync-alert{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
    padding:17px 19px;
    border:1px solid #5c2529;
    border-radius:14px;
    background:#281316;
    color:#ff989c;
}

.sync-alert p{
    margin:5px 0 0;
    color:#d6a5a7;
    font-size:13px;
}

.overview-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    margin-bottom:14px;
}

.overview-card{
    display:flex;
    align-items:center;
    gap:15px;
    min-height:132px;
    padding:20px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--panel);
    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease;
}

.overview-card:hover{
    transform:translateY(-2px);
    border-color:#464c58;
    background:#15181e;
}

.overview-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:50px;
    height:50px;
    border-radius:14px;
    background:#1b1e25;
    font-size:24px;
}

.overview-card span{
    display:block;
    color:var(--muted);
    font-size:12px;
}

.overview-card strong{
    display:block;
    margin:4px 0 3px;
    font-size:31px;
}

.overview-card small{
    color:#6f7682;
    font-size:11px;
}

.overview-card.green{
    border-color:#1c4936;
}

.overview-card.green strong{
    color:#55dfa0;
}

.overview-card.green-soft{
    border-color:#244034;
}

.overview-card.green-soft strong{
    color:#7de8b0;
}

.overview-card.blue{
    border-color:#1d3b50;
}

.overview-card.blue strong{
    color:#67c7ff;
}

.overview-card.orange{
    border-color:#533b17;
}

.overview-card.orange strong{
    color:#ffc25d;
}

.finance-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin-bottom:22px;
}

.finance-card{
    padding:20px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--panel);
}

.finance-card-head{
    display:flex;
    justify-content:space-between;
    gap:10px;
}

.finance-card-head span{
    color:#d6d9df;
    font-weight:800;
}

.finance-card-head small{
    color:var(--muted);
}

.finance-card>strong{
    display:block;
    margin:18px 0 9px;
    font-size:34px;
}

.finance-previous{
    color:var(--muted);
    font-size:12px;
}

.finance-card.net{
    border-color:#5a252a;
    background:
        linear-gradient(
            135deg,
            rgba(239,43,50,.08),
            rgba(239,43,50,.015)
        ),
        var(--panel);
}

.finance-card.net>strong{
    color:#ff646a;
}

.quick-panel,
.users-section{
    margin-bottom:22px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:20px;
    background:var(--panel);
}

.quick-panel{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:26px;
}

.quick-panel h2,
.section-head h2{
    margin:0;
    font-size:23px;
}

.quick-actions{
    display:grid;
    grid-template-columns:repeat(4,minmax(155px,1fr));
    gap:10px;
    width:min(880px,75%);
}

.quick-action{
    display:flex;
    align-items:center;
    gap:11px;
    padding:13px;
    border:1px solid var(--line);
    border-radius:13px;
    background:#0e1014;
}

.quick-action:hover{
    border-color:#4a505b;
    background:#13161b;
}

.quick-action.primary{
    border-color:#69252a;
    background:#271216;
}

.quick-action>span{
    font-size:21px;
}

.quick-action strong,
.quick-action small{
    display:block;
}

.quick-action strong{
    font-size:13px;
}

.quick-action small{
    margin-top:3px;
    color:var(--muted);
    font-size:10px;
}

.section-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:17px;
}

.result-count{
    color:var(--muted);
    font-size:13px;
}

.result-count strong{
    color:#fff;
}

.modern-toolbar{
    grid-template-columns:minmax(280px,1fr) 210px auto auto;
}

.search-field{
    position:relative;
}

.search-field span{
    position:absolute;
    top:50%;
    left:13px;
    transform:translateY(-50%);
    color:var(--muted);
}

.search-field input{
    padding-left:35px;
}

.modern-table{
    margin-top:0;
}

.modern-table table{
    min-width:1250px;
}

.modern-table tbody tr{
    transition:background .15s ease;
}

.modern-table tbody tr:hover{
    background:#15181d;
}

.user-cell{
    display:flex;
    align-items:center;
    gap:11px;
}

.user-cell strong,
.user-cell small{
    display:block;
}

.user-cell small{
    margin-top:3px;
}

.user-avatar{
    display:flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border:1px solid #373c46;
    border-radius:11px;
    background:#1a1d23;
    color:#fff;
    font-size:13px;
    font-weight:900;
}

.access-label{
    display:inline-block;
    padding:6px 9px;
    border-radius:8px;
    background:#171a20;
    color:#bfc4cd;
    font-size:11px;
}

.edit-action{
    white-space:nowrap;
    color:#ff676d;
    font-size:12px;
    font-weight:800;
}

@media(max-width:1150px){
    .overview-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .quick-panel{
        align-items:flex-start;
        flex-direction:column;
    }

    .quick-actions{
        width:100%;
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:760px){
    .dashboard-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .sync-state{
        width:100%;
    }

    .overview-grid,
    .finance-grid{
        grid-template-columns:1fr;
    }

    .quick-actions{
        grid-template-columns:1fr;
    }

.finance-card.net{
    border-color:#24442f;
    background:linear-gradient(135deg,#101812,#13241a);
}

.finance-card-link{
    display:block;
    text-decoration:none;
    transition:transform .15s ease,border-color .15s ease;
}

.finance-card-link:hover{
    transform:translateY(-2px);
    border-color:#552127;
}

.finance-card-link strong{
    color:#ff6f74;
}

.payments-section{
    margin-bottom:28px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--panel);
}

.compact-summary{
    margin-bottom:16px;
}

.payments-filter{
    margin-bottom:14px;
}

.manual-payments-block{
    padding:18px 20px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#0f1115;
}

.manual-payments-block summary{
    cursor:pointer;
    font-weight:800;
    color:#c9cdd4;
    margin-bottom:12px;
}

.manual-payments-block[open] summary{
    margin-bottom:18px;
}

.modal-referral-link-wrap{
    margin-bottom:16px;
}

.modal-referral-link-wrap.hidden{
    display:none;
}

.filter-banner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:18px;
    padding:14px 16px;
    border:1px solid #3a2f18;
    border-radius:12px;
    background:#17130d;
    color:#ffd389;
}

.sync-state.idle .sync-dot{
    background:#7d8590;
    box-shadow:0 0 10px rgba(125,133,144,.25);
}

.pagination{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    margin-top:18px;
}

.pagination-info{
    color:var(--muted);
    font-size:13px;
}

.btn-small{
    padding:6px 10px;
    font-size:12px;
}

.modern-toolbar{
    grid-template-columns:minmax(240px,1fr) 220px auto;
}

    .dashboard-hero h1{
        font-size:31px;
    }
}

/* ===== Today + User modal + Gifts ===== */

.today-panel{
    margin-bottom:22px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--panel);
}

.today-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    margin-top:16px;
}

.today-card{
    padding:18px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#0f1115;
}

.today-card span,
.today-card small{
    display:block;
}

.today-card span{
    color:var(--muted);
    font-size:12px;
    margin-bottom:8px;
}

.today-card strong{
    display:block;
    font-size:28px;
    margin-bottom:6px;
}

.today-card small{
    color:#aeb4bf;
    font-size:12px;
}

.today-card.orange strong{color:var(--orange)}
.today-card.blue strong{color:#6cc6ff}

.today-list{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid var(--line);
}

.today-chip{
    border:1px solid #3a2f18;
    background:#17130d;
    color:#ffd389;
    border-radius:999px;
    padding:8px 12px;
    font-size:12px;
    cursor:pointer;
}

.today-chip:hover{
    border-color:#7a5d22;
    color:#fff;
}

.user-row{
    cursor:pointer;
    transition:background .15s ease;
}

.user-row:hover{
    background:#151920;
}

.open-card-hint{
    color:#ff6f74;
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
}

.modal{
    position:fixed;
    inset:0;
    z-index:100;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
}

.modal.hidden{
    display:none;
}

.modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.72);
}

.modal-card{
    position:relative;
    width:min(560px,100%);
    max-height:90vh;
    overflow:auto;
    padding:24px;
    border:1px solid var(--line);
    border-radius:20px;
    background:#111318;
    box-shadow:0 24px 80px rgba(0,0,0,.45);
}

.modal-close{
    position:absolute;
    top:14px;
    right:14px;
    width:34px;
    height:34px;
    border:1px solid var(--line);
    border-radius:10px;
    background:#0d0f13;
    color:#fff;
    cursor:pointer;
}

.modal-head h2{
    margin:0 0 6px;
    font-size:30px;
}

.modal-status-wrap{
    margin:16px 0 18px;
}

.modal-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:12px;
    margin-bottom:18px;
}

.modal-field{
    padding:12px 14px;
    border:1px solid var(--line);
    border-radius:12px;
    background:#0d0f13;
}

.modal-field span{
    display:block;
    color:var(--muted);
    font-size:11px;
    margin-bottom:6px;
    text-transform:uppercase;
    letter-spacing:.5px;
}

.modal-field strong{
    display:block;
    font-size:14px;
    word-break:break-word;
}

.modal-notes{
    margin:0 0 16px;
    padding:12px 14px;
    border-radius:12px;
    background:#0d0f13;
    color:#aeb4bf;
    font-size:13px;
}

.modal-notes.hidden{
    display:none;
}

.modal-actions{
    display:flex;
    gap:10px;
    margin-bottom:14px;
}

.modal-extend{
    display:flex;
    gap:10px;
    padding-top:14px;
    border-top:1px solid var(--line);
}

.modal-extend select{
    flex:1;
}

body.modal-open{
    overflow:hidden;
}

.badge.gift-waiting_payment{
    background:#3b2b10;
    color:#ffc866;
}

.badge.gift-ready{
    background:#182b3b;
    color:#6cc6ff;
}

.badge.gift-activated{
    background:#123527;
    color:#56e3a0;
}

.gifts-overview .overview-card{
    text-decoration:none;
}

@media(max-width:900px){
    .today-grid,
    .modal-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:580px){
    .today-grid,
    .modal-grid{
        grid-template-columns:1fr;
    }

    .modal-actions,
    .modal-extend{
        flex-direction:column;
    }
}

.finance-card-link{
    display:block;
    text-decoration:none;
    transition:transform .15s ease,border-color .15s ease;
}

.finance-card-link:hover{
    transform:translateY(-2px);
    border-color:#552127;
}

.finance-card-link strong{
    color:#ff6f74;
}

.payments-section{
    margin-bottom:28px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--panel);
}

.compact-summary{
    margin-bottom:16px;
}

.payments-filter{
    margin-bottom:14px;
}

.manual-payments-block{
    padding:18px 20px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#0f1115;
}

.manual-payments-block summary{
    cursor:pointer;
    font-weight:800;
    color:#c9cdd4;
    margin-bottom:12px;
}

.manual-payments-block[open] summary{
    margin-bottom:18px;
}

.modal-referral-link-wrap{
    margin-bottom:16px;
}

.modal-referral-link-wrap.hidden{
    display:none;
}

.filter-banner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:18px;
    padding:14px 16px;
    border:1px solid #3a2f18;
    border-radius:12px;
    background:#17130d;
    color:#ffd389;
}

.sync-state.idle .sync-dot{
    background:#7d8590;
    box-shadow:0 0 10px rgba(125,133,144,.25);
}

.pagination{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    margin-top:18px;
}

.pagination-info{
    color:var(--muted);
    font-size:13px;
}

.btn-small{
    padding:6px 10px;
    font-size:12px;
}
