:root{--primary:#2563eb;--secondary:#7c3aed;--danger:#ef4444;--success:#16a34a;--warning:#f59e0b;--light-bg:#f8fafc;--card-bg:#ffffff;--border:#dbe4f0;--text-dark:#0f172a;--text-muted:#64748b;--gradient:linear-gradient(135deg,#2563eb 0%,#7c3aed 100%)}body{background:linear-gradient(135deg,#eef4ff 0,#f8fbff 100%);font-family:'Segoe UI',sans-serif}.page-title{font-size:2rem;font-weight:800;color:var(--text-dark)}.page-subtitle{color:var(--text-muted);font-size:.95rem}.main-card{background:#fff;border:none;border-radius:24px;overflow:hidden;box-shadow:0 12px 40px rgba(37,99,235,.08)}.gradient-header{background:var(--gradient);padding:30px;color:#fff}.gradient-header h3{font-weight:800;margin-bottom:10px}.gradient-header p{margin-bottom:0;opacity:.9}.content-area{padding:30px}.btn-add{border:none;background:var(--gradient);color:#fff;font-weight:700;padding:14px 26px;border-radius:16px;font-size:1rem;transition:.25s;box-shadow:0 10px 24px rgba(37,99,235,.18)}.btn-add:hover{transform:translateY(-2px);color:#fff}.subject-table{border:1px solid #e2e8f0;border-radius:22px;overflow:hidden}.subject-table table{margin-bottom:0}.subject-table thead{background:#f8fafc}.subject-table th{border:none;padding:18px 14px;font-size:.82rem;text-transform:uppercase;font-weight:800;color:#64748b;letter-spacing:.5px;white-space:nowrap}.subject-table td{padding:14px;vertical-align:middle;border-color:#eef2f7}.table-input{height:50px;border-radius:14px;border:1px solid #dbe4f0;font-weight:600;transition:.2s}.table-input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(37,99,235,.12)}.subject-name{min-width:220px}.marks-input{min-width:140px}.delete-btn{width:48px;height:48px;border:none;border-radius:14px;background:rgba(239,68,68,.14);color:var(--danger);display:flex;align-items:center;justify-content:center;margin:auto;transition:.2s;font-size:1rem}.delete-btn:hover{background:var(--danger);color:#fff;transform:scale(1.05)}.summary-card{background:linear-gradient(135deg,#eff6ff 0,#f5f3ff 100%);border:1px solid #dbeafe;border-radius:24px;padding:26px;text-align:center;height:100%}.summary-title{font-size:.8rem;font-weight:800;color:#64748b;text-transform:uppercase;margin-bottom:18px;letter-spacing:.5px}.percentage-ring{width:220px;height:220px;margin:auto;border-radius:50%;background:conic-gradient(#2563eb 0deg,#7c3aed 0deg,#e2e8f0 0deg);display:flex;align-items:center;justify-content:center;position:relative;transition:.3s}.percentage-ring::before{content:'';position:absolute;width:165px;height:165px;border-radius:50%;background:#fff}.ring-content{position:relative;z-index:2}.ring-percent{font-size:2.8rem;font-weight:900;color:var(--primary);line-height:1}.ring-label{font-size:.85rem;color:#64748b;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.grade-badge{display:inline-block;margin-top:24px;padding:12px 24px;border-radius:50px;font-weight:800;font-size:1rem}.grade-excellent{background:rgba(22,163,74,.15);color:var(--success)}.grade-good{background:rgba(37,99,235,.15);color:var(--primary)}.grade-average{background:rgba(245,158,11,.15);color:#d97706}.grade-poor{background:rgba(239,68,68,.15);color:var(--danger)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px;margin-top:25px}.stat-card{background:#fff;border:1px solid #eef2f7;border-radius:20px;padding:22px;box-shadow:0 4px 12px rgba(15,23,42,.03)}.stat-label{font-size:.78rem;text-transform:uppercase;font-weight:800;color:#64748b;margin-bottom:10px}.stat-value{font-size:1.7rem;font-weight:900;color:var(--text-dark)}@media(max-width:768px){.content-area{padding:20px}.percentage-ring{width:180px;height:180px}.percentage-ring::before{width:130px;height:130px}.ring-percent{font-size:2rem}.subject-name{min-width:180px}.marks-input{min-width:120px}}