:root{
  --paper: #F6F4EF;
  --paper-raised: #FFFFFF;
  --ink: #232032;
  --ink-soft: #5B5770;
  --ink-faint: #A6A2B8;
  --line: #E3E0D6;
  --line-strong: #CFCBBD;
  --accent: #2F6F62;
  --accent-bg: #E4EEE9;
  --danger: #A14E4E;
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
.topbar{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 20px; background:var(--paper-raised); border-bottom:1px solid var(--line);
  flex-wrap:wrap; gap:10px;
}
.topbar .brand{font-weight:600; font-size:16px;}
.topbar nav{display:flex; gap:14px; flex-wrap:wrap; align-items:center; font-size:14px;}
.topbar a{color:var(--ink-soft); text-decoration:none;}
.topbar a:hover{color:var(--ink);}
.container{max-width:900px; margin:0 auto; padding:20px 16px 60px;}
h1{font-size:22px; margin:0 0 16px;}
.card{background:var(--paper-raised); border:1px solid var(--line); border-radius:12px; padding:16px; margin-bottom:12px;}
.obs-meta{font-size:12.5px; color:var(--ink-faint); margin-bottom:6px;}
.tag{display:inline-block; background:var(--accent-bg); color:var(--accent); font-size:11.5px; padding:2px 8px; border-radius:999px; margin-right:6px;}
.obs-text{font-size:14.5px; line-height:1.5;}
.btn{display:inline-block; background:var(--ink); color:var(--paper); border:none; padding:9px 16px; border-radius:8px; font-size:14px; text-decoration:none; cursor:pointer;}
.btn:hover{opacity:.9;}
.btn-danger{background:var(--danger);}
.btn-ghost{background:none; border:1px solid var(--line-strong); color:var(--ink-soft); padding:8px 15px; border-radius:8px; text-decoration:none; font-size:14px;}
form .field{margin-bottom:14px;}
form label{display:block; font-size:13px; color:var(--ink-soft); margin-bottom:4px;}
form input, form select, form textarea{
  width:100%; padding:8px 10px; border:1px solid var(--line-strong); border-radius:8px;
  font-size:14px; background:var(--paper); color:var(--ink); font-family:inherit;
}
.empty{color:var(--ink-faint); font-size:14px; padding:20px 0;}
.student-list{list-style:none; padding:0; margin:0;}
.student-list li{padding:8px 0; border-bottom:1px solid var(--line);}
.student-list a{color:var(--ink); text-decoration:none; font-size:14.5px;}
.actions-row{display:flex; gap:10px; margin-bottom:18px; flex-wrap:wrap;}
.login-box{max-width:360px; margin:80px auto; background:var(--paper-raised); border:1px solid var(--line); border-radius:12px; padding:28px;}