*{box-sizing:border-box}
body{font-family:system-ui,'Segoe UI',Tahoma,Arial,'Cairo',sans-serif;margin:0;background:#f7fafb;color:#0b1720}
a{color:#0f6d7a;text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:16px}
.card{background:#fff;border:1px solid #e3edf2;border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.03);padding:16px;margin-bottom:16px}
h1,h2{margin:6px 0 12px}
input,select,textarea{width:100%;padding:10px;border:1px solid #d9e3ea;border-radius:10px}
label{display:block;margin-top:10px;font-size:14px;color:#334e68}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;border:1px solid #0f6d7a;background:#0f6d7a;color:#fff;cursor:pointer}
.btn.secondary{background:#fff;color:#0f6d7a}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid #eef3f6;padding:8px;text-align:right}
.flex{display:flex;gap:12px;flex-wrap:wrap}
.badge{background:#e6fffa;color:#065f46;border:1px solid #b2f5ea;padding:2px 8px;border-radius:999px;font-size:12px}
.header{background:#0f6d7a;color:#fff;padding:10px}
.header a{color:#fff;margin-left:12px}
.actions{display:flex;gap:8px;align-items:center}
.small{font-size:12px;color:#5a6a77}
.success{color:#0a7d55}
.error{color:#b00020}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:800px){.grid-2,.grid-3{grid-template-columns:1fr}}