:root{
    --bg:#f6f8f7;
    --card:#ffffff;
    --text:#16302b;
    --muted:#5a6b67;
    --primary:#1f7a5b;
    --primary-dark:#135642;
    --accent:#dcefe7;
    --border:#d8e4df;
    --danger:#9a2c2c;
    --warning:#8a6200;
    --shadow:0 10px 30px rgba(19,86,66,.08);
}
*{box-sizing:border-box}
body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    background:var(--bg);
    color:var(--text);
}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1100px,calc(100% - 2rem));margin:0 auto}
.topbar{background:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.nav{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 0}
.brand{font-weight:700;font-size:1.2rem;color:var(--primary-dark)}
.menu{display:flex;gap:1rem;flex-wrap:wrap}
.menu a{color:var(--text);font-weight:600}
.hero,.card,.stat,.empty{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow)}
.hero{padding:2rem;margin:1.5rem 0}
.grid{display:grid;gap:1rem}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card{padding:1.2rem}
.stat{padding:1rem}
.stat h3{margin:.2rem 0;font-size:2rem}
.muted{color:var(--muted)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
label{display:block;font-weight:700;margin-bottom:.4rem}
input,select,textarea{
    width:100%;padding:.8rem;border:1px solid var(--border);border-radius:12px;
    background:#fff;color:var(--text);font:inherit
}
textarea{min-height:120px;resize:vertical}
button,.btn{
    display:inline-block;background:var(--primary);color:#fff;border:none;border-radius:12px;
    padding:.85rem 1.1rem;font-weight:700;cursor:pointer
}
button:hover,.btn:hover{background:var(--primary-dark);text-decoration:none}
.btn-secondary{background:#eef5f2;color:var(--text);border:1px solid var(--border)}
.btn-secondary:hover{background:#e4efea}
.alert{padding:1rem 1.1rem;border-radius:14px;margin:1rem 0}
.alert-success{background:#e7f7ef;color:#15533d;border:1px solid #b8e1c7}
.alert-error{background:#fdeaea;color:#7f1f1f;border:1px solid #efb8b8}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:.85rem;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.badge{display:inline-block;background:var(--accent);color:var(--primary-dark);padding:.35rem .65rem;border-radius:999px;font-size:.88rem;font-weight:700}
.footer{margin-top:2rem;padding:2rem 0;color:var(--muted)}
.auth-card{max-width:520px;margin:2.5rem auto;padding:1.5rem}
.center{text-align:center}
.thumb{width:100%;max-height:240px;object-fit:cover;border-radius:14px;border:1px solid var(--border)}
.profile{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;border:3px solid var(--accent);background:#fff}
.empty{padding:1.2rem}
ul.clean{margin:.6rem 0;padding-left:1.1rem}
.actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
small{color:var(--muted)}
@media (max-width:700px){
    .nav{flex-direction:column;align-items:flex-start}
}