:root{--bg-grad-start: #f8fafc;--bg-grad-end: #eef2ff;--card: #ffffff;--text: #0f172a;--text-dim: #334155;--muted: #64748b;--border: #e5e7eb;--border-soft: #eef2f7;--primary: #4f46e5;--primary-2: #2563eb;--primary-dark: #3730a3;--accent: #06b6d4;--success: #16a34a;--success-soft: #dcfce7;--warn: #d97706;--warn-soft: #fef3c7;--danger: #dc2626;--danger-soft: #fee2e2;--grad-primary: linear-gradient(135deg, #4f46e5 0%, #2563eb 55%, #06b6d4 100%);--grad-primary-hover: linear-gradient(135deg, #4338ca 0%, #1d4ed8 55%, #0891b2 100%);--grad-page: radial-gradient(1200px 600px at -10% -20%, #e0e7ff 0%, transparent 60%), radial-gradient(1000px 500px at 110% 10%, #cffafe 0%, transparent 55%), linear-gradient(180deg, var(--bg-grad-start), var(--bg-grad-end));--shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);--shadow-md: 0 2px 8px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);--shadow-lg: 0 18px 40px -12px rgba(37, 99, 235, .25), 0 4px 10px rgba(15, 23, 42, .06);--radius: 14px;--radius-sm: 10px;--radius-pill: 999px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text);background:var(--grad-page);background-attachment:fixed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4{margin-top:0;letter-spacing:-.01em;font-weight:700}h1{font-size:28px}h2{font-size:22px}h3{font-size:17px}p{line-height:1.55}.container{max-width:1020px;margin:0 auto;padding:28px 20px 48px}.navbar{position:sticky;top:0;z-index:50;background:#ffffffbf;backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border-soft);padding:12px 28px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow-sm)}.navbar a{color:var(--text-dim);text-decoration:none;margin-right:18px;font-weight:500;font-size:14.5px;transition:color .15s ease}.navbar a:hover,.navbar a.active{color:var(--primary)}.navbar a.brand{display:inline-flex;align-items:center;gap:12px;margin-right:22px;text-decoration:none}.brand-logo{display:block;height:38px;width:auto;transition:transform .3s ease}.navbar a.brand:hover .brand-logo{transform:scale(1.04)}.brand-text{display:flex;flex-direction:column;transition:transform .3s ease}.navbar a.brand:hover .brand-text{transform:translateY(-2px)}.brand-name{font-size:22px;font-weight:800;color:var(--text);letter-spacing:-.035em;line-height:1}.brand-sub-wrap{overflow:hidden;max-height:0;opacity:0;margin-top:0;transition:max-height .3s ease,opacity .3s ease,margin-top .3s ease}.navbar a.brand:hover .brand-sub-wrap{max-height:24px;opacity:1;margin-top:4px}.brand-sub{display:block;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--primary);white-space:nowrap;line-height:1}@media (max-width: 600px){.brand-name{font-size:18px}.brand-logo{height:30px}}.card{background:var(--card);border:1px solid var(--border-soft);border-radius:var(--radius);padding:24px;margin-bottom:18px;box-shadow:var(--shadow-md);animation:card-in .35s ease both}@keyframes card-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}label{display:block;font-size:12.5px;color:var(--muted);margin:12px 0 6px;font-weight:500;letter-spacing:.02em;text-transform:uppercase}input,select,textarea{width:100%;padding:11px 13px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:14px;font-family:inherit;background:#fff;color:var(--text);transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}input::placeholder,textarea::placeholder{color:#9ca3af}input:hover,select:hover{border-color:#cbd5e1}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px #4f46e524}input[type=file]{padding:8px;background:#f8fafc;cursor:pointer}input[type=radio]{accent-color:var(--primary)}button,.btn{cursor:pointer;border:none;padding:11px 18px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;letter-spacing:.01em;color:#fff;background:var(--grad-primary);background-size:180% 180%;background-position:0% 50%;box-shadow:0 6px 14px -6px #4f46e58c;transition:transform .12s ease,box-shadow .15s ease,background-position .3s ease,opacity .15s ease}button:hover:not(:disabled),.btn:hover{background-position:100% 50%;box-shadow:0 10px 20px -8px #4f46e599;transform:translateY(-1px)}button:active:not(:disabled){transform:translateY(0);box-shadow:var(--shadow-sm)}button.secondary{background:#f1f5f9;color:var(--text-dim);box-shadow:inset 0 0 0 1px var(--border)}button.secondary:hover:not(:disabled){background:#e2e8f0;box-shadow:inset 0 0 0 1px #cbd5e1;transform:translateY(-1px)}button.danger{background:linear-gradient(135deg,#f43f5e,#dc2626);box-shadow:0 6px 14px -6px #dc26268c}button.danger:hover:not(:disabled){box-shadow:0 10px 20px -8px #dc262699;transform:translateY(-1px)}button:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}.grid>.card{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .2s ease,border-color .2s ease}.grid>.card:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--grad-primary);opacity:.9}.grid>.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:#d9dff3}.badge{display:inline-block;padding:4px 12px;border-radius:var(--radius-pill);font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;border:1px solid transparent}.badge.not_attempted{background:#f1f5f9;color:#475569;border-color:#e2e8f0}.badge.in_progress{background:var(--warn-soft);color:var(--warn);border-color:#fde68a}.badge.completed{background:var(--success-soft);color:var(--success);border-color:#bbf7d0}.error{color:var(--danger);font-size:13px;margin:10px 0;background:var(--danger-soft);border:1px solid #fecaca;padding:8px 12px;border-radius:var(--radius-sm)}.success{color:var(--success);font-size:13px;margin:10px 0;background:var(--success-soft);border:1px solid #bbf7d0;padding:8px 12px;border-radius:var(--radius-sm)}.muted{color:var(--muted);font-size:13px}.timer{float:right;font-weight:700;font-variant-numeric:tabular-nums;font-family:Inter,ui-monospace,SFMono-Regular,monospace;color:#fff;background:var(--grad-primary);padding:6px 14px;border-radius:var(--radius-pill);font-size:13px;letter-spacing:.05em;box-shadow:0 4px 10px -4px #4f46e580;transition:background .3s ease,box-shadow .3s ease}.timer.timer-warning{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 4px 10px -4px #d977068c}.timer.timer-critical{background:linear-gradient(135deg,#f43f5e,#dc2626);box-shadow:0 4px 14px -4px #dc262699;animation:pulse-danger 1s ease-in-out infinite}@keyframes pulse-danger{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}.question{padding:18px 0;border-bottom:1px solid var(--border-soft)}.question:last-child{border-bottom:none}.question h3{line-height:1.45;font-weight:600}.options label{display:flex;align-items:center;gap:10px;margin:8px 0;padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-dim);font-size:14px;cursor:pointer;transition:border-color .12s ease,background .12s ease,transform .12s ease;text-transform:none;letter-spacing:normal}.options label:hover{background:#f8fafc;border-color:#cbd5e1}.options label:has(input[type=radio]:checked){background:#4f46e514;border-color:var(--primary);color:var(--text)}.options input[type=radio]{width:auto;margin:0}table{width:100%;border-collapse:separate;border-spacing:0}th,td{text-align:left;padding:11px 12px;font-size:14px;border-bottom:1px solid var(--border-soft)}th{background:#f8fafc;color:var(--muted);font-weight:600;font-size:12px;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid var(--border)}tbody tr{transition:background .12s ease}tbody tr:hover{background:#f8fafc}tbody tr:nth-child(2n){background:#f8fafc73}tbody tr:nth-child(2n):hover{background:#f1f5f9}.auth-card{position:relative;padding:30px 28px 26px;box-shadow:var(--shadow-lg);border:1px solid #e3e8f6}.auth-card:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--grad-primary);border-radius:var(--radius) var(--radius) 0 0}.auth-card h2{background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@media (max-width: 600px){.container{padding:18px 14px 32px}.navbar{padding:10px 16px;flex-wrap:wrap;gap:6px}.navbar a{margin-right:12px}.grid{grid-template-columns:1fr}h1{font-size:24px}h2{font-size:20px}.timer{float:none;display:inline-block;margin-top:8px}}
