* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; margin:0; background:#f6f7fb; color:#222; }
.nav { display:flex; gap:1rem; align-items:center; padding:0.75rem 1rem; background:#111827; color:#fff; }
.nav a { color:#fff; text-decoration:none; opacity:0.9; }
.nav a:hover{ opacity:1; }
.nav .brand{ font-weight:700; letter-spacing:0.2px; }
.nav .spacer{ flex:1; }
.container { max-width: 1100px; margin: 2rem auto; background:#fff; padding:1.25rem; border-radius: 14px; box-shadow: 0 8px 20px rgba(0,0,0,.06); }
h1,h2,h3 { margin: 0 0 0.75rem 0; }
form .row { display:flex; flex-direction:column; margin-bottom:0.75rem; }
input, select, button { padding:0.6rem 0.7rem; border:1px solid #d3d6df; border-radius: 10px; }
button { cursor:pointer; border:0; background:#111827; color:#fff; }
table { width:100%; border-collapse: collapse; }
th, td { text-align:left; padding:0.6rem; border-bottom:1px solid #eee; }
.card { border:1px solid #eee; border-radius:12px; padding:1rem; margin-bottom:1rem;}
.grid { display:grid; grid-template-columns: repeat(12, 1fr); gap:1rem;}
.col-3 { grid-column: span 3; } .col-4 { grid-column: span 4; } .col-6 { grid-column: span 6; } .col-12 { grid-column: span 12; }
.alert { padding:0.75rem 1rem; border-radius:10px; background:#fef3c7; border:1px solid #fde68a; }