*{box-sizing:border-box}body{margin:0;font-family:Inter,sans-serif;background:#edf1ef;color:#162126}.container{max-width:1100px;margin:0 auto;padding:1rem}.row{display:flex}.between{justify-content:space-between}.center{align-items:center}.gap-sm{gap:.6rem}.wrap{flex-wrap:wrap}.topbar{background:#1d4d40;color:#edf4f1;position:sticky;top:0}.brand{font-weight:800}.link{color:#d7e9e2;text-decoration:none;padding:.45rem}.btn{border:1px solid transparent;padding:.58rem .9rem;border-radius:.6rem;font-weight:600;cursor:pointer}.btn-primary{background:#2a6a58;color:white}.btn-ghost{background:transparent;color:#1d4d40;border-color:#9eb9b1}.topbar .btn-ghost{color:#edf4f1;border-color:#5e867b}.hero{display:grid;grid-template-columns:1.4fr 1fr;gap:1rem;padding:2rem 0}.hero h1{font-size:2.1rem;margin:.2rem 0 .6rem}.hero p{color:#496059;line-height:1.6}.card{background:#f8fbfa;border:1px solid #d5e0db;border-radius:12px;padding:1rem;box-shadow:0 4px 10px rgba(0,0,0,.04);margin-bottom:1rem}.hero-card ul{padding-left:1.2rem;line-height:1.8}.pill{display:inline-block;background:#e5efeb;border:1px solid #c4d8d1;padding:.35rem .55rem;border-radius:999px;font-size:.9rem}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1rem}.dashboard-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem}.block{background:#f1f6f4;border:1px solid #d8e5e0;border-radius:10px;padding:.8rem}.block h4{margin:.1rem 0 .4rem}.subtle{color:#516761}.auth-row input{flex:1;min-width:260px;border:1px solid #c4d5cf;border-radius:10px;padding:.62rem .7rem;background:#fff}.role-toggle{display:flex;gap:.5rem}.role-btn{border:1px solid #c3d5ce;background:#fff;padding:.45rem .7rem;border-radius:8px;cursor:pointer;font-weight:600;color:#25483f}.role-btn.active{background:#2a6a58;color:#fff;border-color:#2a6a58}.role-view{display:none;margin-top:.75rem}.role-view.active{display:block}.table-wrap{overflow:auto}.table-wrap table{width:100%;border-collapse:collapse;font-size:.92rem}.table-wrap th,.table-wrap td{border:1px solid #d5e0db;padding:.55rem;text-align:left;vertical-align:top}.table-wrap th{background:#edf5f2;color:#20463b}@media(max-width:860px){
  .hero,.grid-3,.dashboard-grid{grid-template-columns:1fr}
  .topbar .container{align-items:flex-start;gap:.5rem;flex-direction:column}
  .topbar nav{display:flex;flex-wrap:wrap;gap:.35rem}
  .topbar nav .link{padding:.35rem .45rem;font-size:.92rem}
  .topbar nav .btn{padding:.45rem .65rem;font-size:.86rem}
  .table-wrap{font-size:.86rem}
  .auth-row input{min-width:100%}
}