:root{
  --b:#ddd; --bg:#f7f7f7; --text:#111; --muted:#666; --link:#0645AD;
}
*{box-sizing:border-box}
body{font-family:system-ui,Arial,sans-serif;color:var(--text);background:#fff;margin:0}
a{color:var(--link);text-decoration:none} a:hover{text-decoration:underline}
.container{max-width:1100px;margin:20px auto;padding:12px}
.topnav{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--b);background:var(--bg)}
.topnav .links a{margin-right:12px;padding:6px 8px;border-radius:6px}
.topnav .links a.active{background:#e9eef9}
.card{border:1px solid var(--b);padding:12px;border-radius:10px;margin:16px 0;background:#fff}
.muted{color:var(--muted)}
.kpi{display:flex;gap:14px;flex-wrap:wrap}
.kpi .card{flex:1 1 220px;text-align:center}
.big{font-size:28px;font-weight:700}

/* Tables */
table{border-collapse:separate;border-spacing:0;width:100%;background:#fff;border:1px solid var(--b);border-radius:10px;overflow:hidden}
th,td{padding:10px 8px;border-bottom:1px solid var(--b);vertical-align:top}
th{background:var(--bg);text-align:left;font-weight:600}
tr:last-child td{border-bottom:none}
tr:nth-child(even) td{background:#fafafa}

/* Forms */
.form{display:grid;gap:10px;max-width:520px}
.form-row{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
input,button,textarea,select{font-size:16px;padding:8px}
button{cursor:pointer}
.alert{padding:8px 10px;border-radius:6px;margin:6px 0}
.alert.error{background:#ffe9e9;border:1px solid #f3b5b5}
.alert.ok{background:#e7f7e7;border:1px solid #a8d9a8}

/* QR & Map */
.qr{display:inline-block;border:1px solid #eee;padding:6px;background:#fff;border-radius:8px}
.qrwrap{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
.map{height:300px;border:1px solid #ccc;border-radius:8px}