﻿
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            color: var(--text-primary);
            position: relative;
        }
        
        /* 鏄熺┖鑳屾櫙 Canvas */
        #starfieldCanvas {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            pointer-events: none;
        }
        .admin-container {
            display: grid;
            grid-template-columns: 260px 1fr;
            grid-template-rows: 70px 1fr;
            height: 100vh;
        }
        .admin-header {
            grid-column: 1 / 3;
            background: rgba(255, 255, 255, 0.85);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 30px;
            box-shadow: var(--glass-shadow);
            z-index: 10;
            border-bottom: 1px solid rgba(255, 255, 255, 0.5);
        }
        .admin-logo { 
            font-size: 22px; 
            font-weight: bold; 
            background: var(--primary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .admin-logo i {
            background: var(--primary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .admin-user { display: flex; align-items: center; gap: 15px; }
        .logout-btn { 
            color: var(--primary); 
            cursor: pointer; 
            font-weight: 500;
            padding: 8px 16px;
            border-radius: 20px;
            transition: all 0.3s;
        }
        .logout-btn:hover { 
            background: rgba(102, 126, 234, 0.1);
        }
        .admin-sidebar {
            background: rgba(255, 255, 255, 0.7);
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            color: white;
            padding: 25px 0;
            height: 100%;
            overflow-y: auto;
            border-right: 1px solid rgba(255, 255, 255, 0.5);
        }
        .menu-item {
            padding: 14px 25px;
            cursor: pointer;
            transition: all 0.3s;
            display: flex;
            align-items: center;
            gap: 12px;
            color: var(--text-primary);
            border-left: 3px solid transparent;
        }
        .menu-item:hover { 
            background: rgba(102, 126, 234, 0.1);
            border-left-color: var(--primary);
        }
        .menu-item.active { 
            background: var(--primary-gradient);
            color: white;
            border-left-color: transparent;
        }
        .menu-item i { width: 20px; text-align: center; }
        .admin-content {
            padding: 25px;
            overflow-y: auto;
            height: 100%;
        }
        .content-title {
            font-size: 24px;
            margin-bottom: 25px;
            background: var(--primary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 600;
        }
        .stats-container {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
            gap: 20px;
            margin-bottom: 30px;
        }
        .stat-card {
            background: var(--glass-bg);
            backdrop-filter: blur(20px);
            border-radius: 16px;
            padding: 25px;
            box-shadow: var(--glass-shadow);
            display: flex;
            flex-direction: column;
            transition: all 0.3s;
            border: 1px solid var(--glass-border);
        }
        .stat-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 12px 40px rgba(31, 38, 135, 0.2);
        }
        .stat-value {
            font-size: 32px;
            font-weight: bold;
            margin: 10px 0;
            background: var(--primary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .stat-label { color: var(--text-muted); font-size: 14px; font-weight: 500; }
        .stat-icon {
            align-self: flex-end;
            font-size: 45px;
            opacity: 0.3;
            margin-top: -10px;
            background: var(--primary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .table-container {
            background: var(--glass-bg);
            backdrop-filter: blur(20px);
            border-radius: 16px;
            box-shadow: var(--glass-shadow);
            overflow-x: auto;
            border: 1px solid var(--glass-border);
        }
        .table-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 18px 22px;
            border-bottom: 2px solid rgba(102, 126, 234, 0.1);
        }
        .table-title { font-weight: 600; font-size: 16px; }
        .search-box, select {
            padding: 10px 14px;
            border: 2px solid var(--glass-border);
            border-radius: 10px;
            transition: all 0.3s;
            background: rgba(255, 255, 255, 0.5);
        }
        .search-box:focus, select:focus {
            border-color: var(--primary);
            outline: none;
        }
        table { width: 100%; border-collapse: collapse; }
        th, td {
            padding: 14px 18px;
            text-align: left;
            border-bottom: 1px solid rgba(102, 126, 234, 0.1);
        }
        th {
            background: rgba(102, 126, 234, 0.05);
            font-weight: 600;
            color: var(--text-primary);
        }
        tr:hover { background: rgba(102, 126, 234, 0.03); }
        .status-badge {
            display: inline-block;
            padding: 5px 12px;
            border-radius: 20px;
            font-size: 12px;
            font-weight: 600;
        }
        .status-active { background: rgba(67,160,71,0.15); color: var(--success); }
        .status-inactive { background: rgba(229,57,53,0.15); color: var(--error); }
        .status-pending { background: rgba(251,140,0,0.15); color: var(--warning); }
        .action-btn {
            padding: 8px 14px;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            margin-right: 5px;
            font-size: 13px;
            font-weight: 500;
            transition: all 0.3s;
        }
        /* .btn-primary 鏍峰紡浣跨敤 theme.css */
        .btn-danger { background: linear-gradient(135deg, var(--error), #ef5350); color: white; box-shadow: 0 4px 12px rgba(229, 57, 53, 0.3); }
        .btn-danger:hover { transform: translateY(-2px); box-shadow: 0 6px 15px rgba(229, 57, 53, 0.4); }
        .btn-warning { background: linear-gradient(135deg, var(--warning), #ffa726); color: white; box-shadow: 0 4px 12px rgba(251, 140, 0, 0.3); }
        .btn-warning:hover { transform: translateY(-2px); }
        .pagination {
            display: flex;
            justify-content: flex-end;
            padding: 18px 22px;
            border-top: 1px solid rgba(102, 126, 234, 0.1);
        }
        .page-btn {
            padding: 8px 14px;
            margin: 0 5px;
            border: 2px solid var(--glass-border);
            background: rgba(255, 255, 255, 0.5);
            cursor: pointer;
            border-radius: 8px;
            transition: all 0.3s;
        }
        .page-btn:hover { border-color: var(--primary); color: var(--primary); }
        .page-btn.active { background: var(--primary-gradient); color: white; border-color: transparent; }
        .page-btn:disabled { cursor: not-allowed; opacity: 0.5; }

        /* ====== 鐧藉ぉ妯″紡閫傞厤锛堢鐞嗗悗鍙帮級 ====== */
        [data-theme="day"] .admin-container { color: #1E293B; }
        [data-theme="day"] .admin-header {
            background: rgba(255, 253, 248, 0.92) !important;
            border-bottom-color: rgba(180, 165, 140, 0.35) !important;
            box-shadow: 0 2px 8px rgba(139, 115, 85, 0.08) !important;
        }
        [data-theme="day"] .admin-logo,
        [data-theme="day"] .admin-logo i {
            background: linear-gradient(135deg, #5B7B9E 0%, #4A6A8C 100%) !important;
            -webkit-background-clip: text;
            color: #5B7B9E;
        }
        [data-theme="day"] .logout-btn { color: #4F6EF6 !important; }
        [data-theme="day"] .logout-btn:hover { background: rgba(91,123,158,0.08) !important; }
        [data-theme="day"] .admin-sidebar {
            background: rgba(250, 246, 236, 0.85) !important;
            border-right-color: rgba(180, 165, 140, 0.3) !important;
        }
        [data-theme="day"] .menu-item { color: #334155 !important; border-left-color: transparent; }
        [data-theme="day"] .menu-item:hover {
            background: #EEF2F7 !important;
            border-left-color: var(--primary) !important;
        }
        [data-theme="day"] .menu-item.active {
            background: linear-gradient(135deg, #5B7B9E, #4A6A8C) !important;
            color: white !important;
        }
        [data-theme="day"] .content-title {
            background: linear-gradient(135deg, #5B7B9E 0%, #4A6A8C 100%);
            -webkit-background-clip: text;
            color: #5B7B9E;
        }
        [data-theme="day"] .stat-card {
            background: #fffdf7 !important;
            backdrop-filter: none !important;
            border-color: rgba(180, 165, 140, 0.28) !important;
            box-shadow:
                0 2px 1px rgba(139, 115, 85, 0.04),
                0 4px 12px rgba(139, 115, 85, 0.08) !important;
        }
        [data-theme="day"] .stat-icon {
            opacity: 0.25;
        }
        [data-theme="day"] .table-container {
            background: #fffdf7 !important;
            backdrop-filter: none !important;
            border-color: rgba(180, 165, 140, 0.28) !important;
            box-shadow:
                0 2px 1px rgba(139, 115, 85, 0.04),
                0 4px 8px rgba(139, 115, 85, 0.06) !important;
        }
        [data-theme="day"] .table-header {
            border-bottom-color: rgba(180, 165, 140, 0.35) !important;
        }
        [data-theme="day"] .search-box,
        [data-theme="day"] select {
            background: rgba(255, 255, 255, 0.75) !important;
            border-color: rgba(180, 165, 140, 0.35) !important;
            color: #2c2417 !important;
        }
        [data-theme="day"] th {
            background: rgba(250, 246, 236, 0.95) !important;
            color: #3d3426 !important;
            border-bottom-color: rgba(180, 165, 140, 0.35) !important;
        }
        [data-theme="day"] td { color: #334155 !important; border-bottom-color: #E2E8F0 !important; }
        [data-theme="day"] tbody tr:hover { background: #EEF2F7 !important; }
        [data-theme="day"] .modal-content {
            background: #fffdf7 !important;
            backdrop-filter: none !important;
            border-color: rgba(180, 165, 140, 0.28) !important;
            box-shadow: 0 12px 40px rgba(139, 115, 85, 0.15) !important;
        }
        [data-theme="day"] .modal-header { border-bottom-color: rgba(180, 165, 140, 0.25) !important; }
        [data-theme="day"] .modal-footer { border-top-color: rgba(180, 165, 140, 0.25) !important; }
        [data-theme="day"] .loading-overlay {
            background: rgba(124, 58, 237, 0.75) !important;
        }
        [data-theme="day"] .progress-bar-container {
            background: rgba(124, 58, 237, 0.08) !important;
        }

        .modal {
            display: none;
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            background-color: rgba(0,0,0,0.5);
            z-index: 100;
            justify-content: center;
            align-items: center;
        }
        .modal-content {
            background: var(--glass-bg);
            backdrop-filter: blur(20px);
            border-radius: 16px;
            width: 500px;
            max-width: 90%;
            max-height: 90vh;
            overflow-y: auto;
            box-shadow: 0 12px 40px rgba(31, 38, 135, 0.2);
            border: 1px solid var(--glass-border);
        }
        .modal-header {
            padding: 18px 22px;
            border-bottom: 2px solid rgba(102, 126, 234, 0.1);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .modal-title { font-weight: bold; font-size: 18px; }
        .close-modal { font-size: 24px; cursor: pointer; }
        .modal-body { padding: 22px; }
        .modal-footer {
            padding: 18px 22px;
            border-top: 1px solid rgba(102, 126, 234, 0.1);
            display: flex;
            justify-content: flex-end;
            gap: 10px;
        }
        .loading-overlay {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            background: rgba(102, 126, 234, 0.8);
            backdrop-filter: blur(5px);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1000;
            color: white;
            font-size: 18px;
            flex-direction: column;
            gap: 15px;
        }
        .progress-bar-container {
            width: 100%;
            height: 22px;
            background: rgba(102, 126, 234, 0.1);
            border-radius: 11px;
            overflow: hidden;
            margin-top: 5px;
        }
        .progress-bar {
            height: 100%;
            background: var(--primary-gradient);
            transition: width 0.3s ease;
            border-radius: 11px;
        }
        .progress-text {
            font-size: 12px;
            color: var(--text-muted);
            margin-top: 3px;
        }
        @keyframes slideIn {
            from { transform: translateX(400px); opacity: 0; }
            to { transform: translateX(0); opacity: 1; }
        }
        @keyframes slideOut {
            from { transform: translateX(0); opacity: 1; }
            to { transform: translateX(400px); opacity: 0; }
        }
    
