:root{--primary:#8b5cf6;--accent:#ec4899;--muted:#6b7280;--bg:#f8fafc;--card:#ffffff;--radius:.75rem;--gap:1rem;--max-width:1200px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial}body{background:var(--bg);color:#111827}.container{max-width:var(--max-width);margin:0 auto;padding:1rem;width:100%}.card{background:var(--card);border-radius:var(--radius);padding:1rem;margin-bottom:1rem;box-shadow:0 2px 8px #0f172a0f}.header{display:flex;align-items:center;gap:var(--gap);padding:.75rem;border-radius:var(--radius);background:linear-gradient(90deg,var(--primary),#6366f1);color:#fff}.header .title{font-size:1.125rem;font-weight:600;flex:1;text-align:center}.header .actions{display:flex;gap:.5rem}.hamburger{display:none;background:none;border:none;color:#fff;font-size:1.125rem}.hostel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}.hostel-card{padding:1rem;border-radius:.75rem;background:linear-gradient(180deg,#fff,#fbf7ff);display:flex;flex-direction:column;gap:.5rem}.hostel-card .meta{font-size:.875rem;color:var(--muted)}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:.5rem;border:none;cursor:pointer}.btn.primary{background:linear-gradient(90deg,var(--accent),#7c3aed);color:#fff}.btn.ghost{background:transparent;border:1px solid rgba(0,0,0,.06);color:var(--muted)}.students-table{width:100%;border-collapse:collapse}.students-table thead th{position:sticky;top:0;background:#fff;padding:.75rem;text-align:left;font-weight:600;border-bottom:1px solid #eef2ff}.students-table tbody tr{border-bottom:1px solid #f1f5f9}.students-table td{padding:.75rem;vertical-align:middle}.actions-cell{display:flex;justify-content:flex-end;gap:.5rem}img,video{max-width:100%;height:auto}input,select,textarea,button{font-size:1rem;padding:.6rem;border-radius:.5rem}button,.btn,.btn.primary,.btn.ghost,.btn.secondary,.btn-icon,.action-button{transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease,opacity .15s ease;will-change:transform,box-shadow}button:hover,.btn:hover,.btn.primary:hover,.btn.ghost:hover,.btn.secondary:hover,.btn-icon:hover,.action-button:hover{transform:translateY(-3px);box-shadow:0 6px 18px #0f172a1f}button:active,.btn:active,.btn.primary:active,.btn.ghost:active,.btn.secondary:active,.btn-icon:active,.action-button:active{transform:translateY(0);box-shadow:0 3px 8px #0f172a14}@media(max-width:640px){button:hover,.btn:hover,.btn-icon:hover,.action-button:hover{transform:translateY(0);box-shadow:none}}@media(max-width:1024px){.header{padding:.75rem}.header .title{font-size:1rem}.hostel-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}}@media(max-width:768px){.header{flex-wrap:wrap;align-items:center}.hamburger{display:block}.header .title{text-align:center;order:2;width:100%}.header .actions{order:3;width:100%;justify-content:center}.hostel-grid{grid-template-columns:1fr}.students-table thead th:nth-child(4),.students-table thead th:nth-child(3){display:none}.students-table td:nth-child(4),.students-table td:nth-child(3){display:none}}@media(max-width:480px){.container,.header,.btn{padding:.5rem}.students-table thead th{font-size:.8125rem}}
