:root { --sidebar-width:240px; --brand:#ee5700; }
    body { background:#f4f5fb; font-size:.9rem; }

    /* Login */
    #login-screen { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#1e1e2e,#313244); }
    .login-card { width:100%; max-width:380px; background:#fff; border-radius:16px; padding:2.4rem; box-shadow:0 20px 60px rgba(0,0,0,.3); }
    .login-logo { width:52px; height:52px; background:var(--brand); border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.6rem; margin:0 auto 1.2rem; }

    /* Sidebar */
    #sidebar { width:var(--sidebar-width); min-height:100vh; background:#1e1e2e; color:#cdd6f4; position:fixed; top:0; left:0; display:flex; flex-direction:column; z-index:200; transition:transform .25s ease; }
    @media(max-width:767.98px){ #sidebar{transform:translateX(-100%);} #sidebar.open{transform:translateX(0);} }
    #sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:199; }
    #sidebar-overlay.show { display:block; }
    #sidebar .brand { padding:1.4rem 1.2rem 1rem; font-size:1.05rem; font-weight:700; color:#fff; border-bottom:1px solid #313244; display:flex; align-items:center; gap:.5rem; }
    #sidebar .brand .icon { width:32px; height:32px; min-width:32px; min-height:32px; flex-shrink:0; background:var(--brand); border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:1rem; }
    #sidebar nav { flex:1; padding:.8rem 0; }
    #sidebar nav .nav-label { font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:#6c7086; padding:.6rem 1.2rem .3rem; }
    #sidebar nav a { display:flex; align-items:center; gap:.55rem; padding:.52rem 1.2rem; color:#a6adc8; text-decoration:none; transition:background .15s,color .15s; font-size:.88rem; }
    #sidebar nav a:hover { background:#313244; color:#fff; }
    #sidebar nav a.active { background:var(--brand); color:#fff; }
    #sidebar nav a i { font-size:1rem; width:20px; }
    #sidebar .sidebar-footer { padding:.8rem 1.2rem; border-top:1px solid #313244; font-size:.78rem; color:#585b70; }
    .sidebar-user { display:flex; align-items:center; gap:.5rem; color:#a6adc8; font-size:.82rem; min-width:0; }
    .sidebar-user .user-info { min-width:0; flex:1; overflow:hidden; }
    .sidebar-user .admin-name { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .sidebar-user .admin-email { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .sidebar-user .role-badge { font-size:.65rem; background:#313244; color:#cba6f7; padding:.1rem .35rem; border-radius:4px; flex-shrink:0; white-space:nowrap; }
    #sidebarAvatar { width:28px !important; height:28px !important; min-width:28px !important; min-height:28px !important; flex-shrink:0 !important; flex-grow:0 !important; }

    /* Main */
    #main { margin-left:var(--sidebar-width); min-height:100vh; display:flex; flex-direction:column; }
    #main .content { flex:1; }
    @media(max-width:767.98px){ #main{margin-left:0;} }
    .topbar { background:#fff; border-bottom:1px solid #e5e7f0; padding:.75rem 1.6rem; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:50; }
    .topbar .page-title { font-weight:600; font-size:1rem; color:#1e1e2e; }
    .content { padding:1.6rem; }
    @media(max-width:575.98px){ .content{padding:1rem;} }
    .hamburger { display:none; }
    @media(max-width:767.98px){ .hamburger{display:flex;} }

    /* Cards */
    .stat-card { background:#fff; border-radius:12px; padding:1.2rem 1.4rem; border:1px solid #e5e7f0; display:flex; align-items:center; gap:1rem; }
    .stat-icon { width:48px; height:48px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; flex-shrink:0; }
    .stat-value { font-size:1.7rem; font-weight:700; line-height:1; }
    .stat-label { font-size:.78rem; color:#6c7086; margin-top:.2rem; }
    .card { border:1px solid #e5e7f0; border-radius:12px; }
    .card-header { background:#fff; border-bottom:1px solid #e5e7f0; font-weight:600; padding:.9rem 1.2rem; }

    /* Table */
    .table thead th { font-size:.76rem; text-transform:uppercase; letter-spacing:.05em; color:#6c7086; border-bottom:2px solid #e5e7f0; background:#f8f9fe; white-space:nowrap; }
    .table tbody tr:hover { background:#f4f5fb; }
    .table td { vertical-align:middle; white-space:nowrap; }
    .table th.col-sticky, .table td.col-sticky { position:sticky; right:0; background:#fff; box-shadow:-2px 0 4px rgba(0,0,0,.06); border-left:1px solid #e5e7f0; z-index:1; }
    .table thead th.col-sticky { background:#f8f9fe; }
    .table tbody tr:hover td.col-sticky { background:#f4f5fb; }
    .table tbody tr.lic-revoked td.col-sticky { background:#fff; }
    .table tbody tr.lic-revoked:hover td.col-sticky { background:#f8f9fa; }
    .table tbody tr.lic-revoked td { color:#adb5bd; }
    .table tbody tr.lic-revoked .key-mono { color:#adb5bd; background:#f8f9fe; }

    /* Page sections */
    .page-section { display:none; }
    .page-section.active { display:block; }

    /* Badges */
    .badge-active { background:#dcfce7; color:#166534; font-weight:600; font-size:.72rem; padding:.2rem .55rem; border-radius:20px; }
    .badge-expired { background:#fee2e2; color:#991b1b; font-weight:600; font-size:.72rem; padding:.2rem .55rem; border-radius:20px; }
    .badge-revoked { background:#f3f4f6; color:#6b7280; font-weight:600; font-size:.72rem; padding:.2rem .55rem; border-radius:20px; }

    /* License key */
    .key-mono { font-family:monospace; font-size:.8rem; color:#3d4fd6; text-decoration:none; }
    .key-mono:hover { text-decoration:underline; }

    /* Permissions table */
    .perm-check { color:#22c55e; font-size:1.1rem; }
    .perm-cross { color:#ef4444; font-size:1.1rem; }

    /* Owner-only nav */
    .owner-only-nav { display:none; }

    /* Addon card */
    .addon-card { background:#fff; border:1px solid #e5e7f0; border-radius:12px; padding:1.2rem; position:relative; overflow:hidden; }
    .addon-card-accent { position:absolute; top:0; left:0; width:4px; height:100%; border-radius:12px 0 0 12px; }
    .addon-thumbnail { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:8px; background:#f4f5fb; }

    /* Misc */
    .cursor-pointer { cursor:pointer; }
    pre { font-size:.8rem; border-radius:8px; }
