:root{--bg:#f0f4f8;--surface:#ffffff;--surface-hover:#f8fafc;--bg-secondary:#f1f5f9;--border:rgba(0,0,0,0.06);--text:#1e293b;--text-secondary:#4a5568;--accent:#0d9488;--accent-hover:#0f766e;--accent-soft:rgba(13,148,136,0.12);--video-mark:#c2410c;--success:#059669;--success-soft:rgba(5,150,105,0.14);--warning:#d97706;--danger:#dc2626;--danger-soft:rgba(220,38,38,0.1);--correct:#16a34a;--correct-soft:rgba(22,163,74,0.15);--wrong:#dc2626;--wrong-soft:rgba(220,38,38,0.12);--radius:14px;--radius-sm:10px;--shadow:0 1px 3px rgba(0,0,0,0.04);--shadow-card:0 4px 20px rgba(0,0,0,0.06);--ease:cubic-bezier(0.25,0.46,0.45,0.94)}*,*::before,*::after{box-sizing:border-box}body{font-family:'DM Sans',system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);margin:0;min-height:100vh;-webkit-font-smoothing:antialiased}a{color:var(--accent)}a:hover{color:var(--accent-hover)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:var(--radius-sm);font-size:0.9375rem;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text);text-decoration:none;transition:background 0.15s,border-color 0.15s,color 0.15s}.btn:hover:not(:disabled){background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}.btn:disabled{opacity:0.6;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn-secondary{background:var(--surface);color:var(--text-secondary);border:1.5px solid var(--border)}.btn-secondary:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.btn-danger{border-color:var(--danger);color:var(--danger)}.btn-danger:hover:not(:disabled){background:var(--danger-soft)}.refresh-btn{padding:8px 16px;border-radius:var(--radius-sm);font-size:0.9375rem;font-weight:500;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;font-family:inherit}.refresh-btn:hover{background:var(--accent-soft);color:var(--accent)}.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.4);align-items:center;justify-content:center;z-index:500;padding:20px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.modal-overlay.visible{display:flex}.modal-card{background:var(--surface);border-radius:var(--radius);padding:24px;max-width:480px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 8px 32px rgba(0,0,0,0.12)}.modal-card h3{margin:0 0 16px;font-size:1.125rem}.toast-notification{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:12px 20px;background:var(--text);color:#fff;border-radius:var(--radius-sm);font-size:0.875rem;font-weight:500;max-width:min(92vw,420px);box-shadow:0 8px 24px rgba(0,0,0,0.22);z-index:99999;opacity:0;transition:opacity 0.2s ease;text-align:center;line-height:1.4;pointer-events:none}.toast-notification.visible{opacity:1;pointer-events:auto}.toast-notification.toast-success{background:var(--success)}.toast-notification.toast-error{background:var(--danger)}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:0.875rem}th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border)}th{font-weight:600;color:var(--text-secondary);white-space:nowrap}td{vertical-align:top}th.sortable{cursor:pointer;user-select:none}th.sortable:hover{color:var(--accent)}th .sort-icon{opacity:0.5;margin-left:4px;font-size:0.75em}th.sorted-asc .sort-icon::after{content:' ▲';opacity:1}th.sorted-desc .sort-icon::after{content:' ▼';opacity:1}tbody tr:hover td{background:var(--accent-soft)}.pagination-bar{display:flex;align-items:center;gap:12px;margin-top:12px;padding:10px 0;font-size:0.875rem;color:var(--text-secondary);flex-wrap:wrap}.pagination-bar button{padding:6px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);font-size:0.875rem;cursor:pointer;font-family:inherit;color:var(--text)}.pagination-bar button:hover:not(:disabled){background:var(--accent-soft);color:var(--accent)}.pagination-bar button:disabled{opacity:0.5;cursor:not-allowed}.pagination-bar select{padding:6px 10px;border-radius:var(--radius-sm);border:1px solid var(--border);font-size:0.875rem;font-family:inherit}.filter-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}.filter-row input,.filter-row select{padding:8px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:0.875rem;font-family:inherit;background:var(--surface)}.filter-row input:focus,.filter-row select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.card{background:var(--surface);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}.chart-wrap.dash-chart-panel{position:relative;margin-top:12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:linear-gradient(165deg,var(--surface) 0%,var(--surface-hover) 100%);padding:10px 12px 12px;box-sizing:border-box;box-shadow:var(--shadow),0 14px 40px -22px rgba(15,23,42,0.14);overflow:hidden;transition:transform 0.35s cubic-bezier(0.22,1,0.36,1),box-shadow 0.35s ease,border-color 0.3s ease}.chart-wrap.dash-chart-panel::before{content:'';pointer-events:none;position:absolute;inset:0;border-radius:inherit;opacity:0;transition:opacity 0.35s ease;background:linear-gradient(145deg,rgba(13,148,136,0.11) 0%,transparent 42%,rgba(99,102,241,0.06) 100%)}.chart-wrap.dash-chart-panel:hover{transform:translateY(-3px);border-color:rgba(13,148,136,0.3);box-shadow:0 0 0 1px rgba(13,148,136,0.07),0 18px 48px -16px rgba(15,23,42,0.16)}.chart-wrap.dash-chart-panel:hover::before{opacity:1}@media (prefers-reduced-motion:reduce){.chart-wrap.dash-chart-panel{transition:border-color 0.2s ease,box-shadow 0.2s ease}.chart-wrap.dash-chart-panel:hover{transform:none}.chart-wrap.dash-chart-panel:hover::before{opacity:0}}.text-secondary{color:var(--text-secondary)}.text-accent{color:var(--accent)}.text-danger{color:var(--danger)}.text-success{color:var(--success)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}@media (max-width:640px){body{padding:16px}.modal-overlay{padding:12px}.modal-card{padding:18px;border-radius:var(--radius-sm)}}