:root{
  --ink:#1c1f26; --ink-soft:#2a2e38;
  --brass:#b5893f; --brass-bright:#d8b25a; --brass-deep:#8a6722;
  --paper:#f6f3ec; --card:#ffffff;
  --text:#23262d; --muted:#6c7078; --line:#e4ddcf;
  --ok:#2e7d52; --loan:#b5893f; --over:#c0392b; --maint:#5a6b8c; --retire:#8a8d93;
  --shadow:0 1px 2px rgba(28,31,38,.06), 0 8px 24px rgba(28,31,38,.06);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--text);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:16px; line-height:1.55;
}
.wrap{width:100%; max-width:920px; margin:0 auto; padding:0 18px}
a{color:var(--brass-deep)}

/* masthead */
.masthead{background:var(--ink); color:#f3eede; border-bottom:3px solid var(--brass)}
.masthead-inner{display:flex; align-items:center; justify-content:space-between;
  gap:14px; min-height:64px; flex-wrap:wrap; padding-top:8px; padding-bottom:8px}
.brand{display:flex; align-items:baseline; gap:10px; text-decoration:none; color:#f3eede}
.brand-mark{color:var(--brass-bright); font-size:1.4rem; transform:translateY(2px)}
.brand-name{font-family:"Fraunces",serif; font-weight:800; font-size:1.3rem; letter-spacing:.2px}
.brand-sub{font-size:.72rem; text-transform:uppercase; letter-spacing:.18em; color:#b9b09a}
.adminnav{display:flex; gap:18px; flex-wrap:wrap}
.adminnav a{color:#d8cfb9; text-decoration:none; font-size:.9rem; font-weight:500}
.adminnav a:hover{color:#fff}
.adminnav .logout{color:var(--brass-bright)}

.main{padding:28px 18px 60px}
.foot{border-top:1px solid var(--line); color:var(--muted); font-size:.82rem; padding:22px 0; text-align:center}

/* typography */
h1{font-family:"Fraunces",serif; font-weight:800; font-size:1.8rem; line-height:1.15; margin:.2em 0 .1em}
h2{font-family:"Fraunces",serif; font-weight:600; font-size:1.25rem; margin:1.4em 0 .5em}
.eyebrow{text-transform:uppercase; letter-spacing:.16em; font-size:.72rem; color:var(--brass-deep); font-weight:600}
.muted{color:var(--muted)}

/* cards */
.card{background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:22px; box-shadow:var(--shadow); margin-bottom:20px}
.card.tight{padding:16px 18px}

/* instrument header tag */
.tag{display:flex; gap:16px; align-items:flex-start; border-left:5px solid var(--brass);
  padding:18px 20px; background:linear-gradient(180deg,#fffdf8,#fbf7ee);
  border:1px solid var(--line); border-left:5px solid var(--brass); border-radius:14px}
.tag .id{font-family:"Fraunces",serif; font-size:.9rem; color:var(--brass-deep); letter-spacing:.05em}
.tag .type{font-family:"Fraunces",serif; font-weight:800; font-size:1.5rem; margin:.1em 0}
.tag dl{display:grid; grid-template-columns:auto 1fr; gap:2px 14px; margin:10px 0 0; font-size:.9rem}
.tag dt{color:var(--muted)} .tag dd{margin:0}

/* status badge */
.badge{display:inline-block; font-size:.72rem; font-weight:600; letter-spacing:.04em;
  text-transform:uppercase; padding:3px 10px; border-radius:999px; border:1px solid}
.badge.available{color:var(--ok); border-color:#bfe0cc; background:#eef7f1}
.badge.on_loan{color:var(--brass-deep); border-color:#e7d3a4; background:#fbf3df}
.badge.maintenance{color:var(--maint); border-color:#cdd6e6; background:#eef1f7}
.badge.retired{color:var(--retire); border-color:#dadbde; background:#f1f1f3}
.badge.overdue{color:#fff; border-color:var(--over); background:var(--over)}

/* forms */
form{margin:0}
.field{margin:0 0 16px}
label{display:block; font-weight:500; font-size:.9rem; margin-bottom:6px}
.req{color:var(--over)}
input[type=text],input[type=email],input[type=tel],input[type=date],
input[type=number],input[type=password],select,textarea{
  width:100%; font:inherit; color:var(--text); background:#fff;
  border:1px solid #cfc8b8; border-radius:10px; padding:12px 13px; outline:none}
textarea{min-height:84px; resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--brass); box-shadow:0 0 0 3px rgba(181,137,63,.18)}
.check{display:flex; gap:10px; align-items:flex-start}
.check input{width:auto; margin-top:4px}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:0 16px}
.hint{font-size:.82rem; color:var(--muted); margin-top:4px}
.guardian{display:none; border-top:1px dashed var(--line); margin-top:6px; padding-top:14px}
.guardian.show{display:block}

/* buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font:inherit; font-weight:600; cursor:pointer; border-radius:10px; padding:12px 20px;
  border:1px solid var(--brass-deep); background:var(--brass); color:#fff; text-decoration:none}
.btn:hover{background:var(--brass-deep)}
.btn.block{width:100%}
.btn.ghost{background:#fff; color:var(--ink); border-color:#cfc8b8}
.btn.ghost:hover{background:#f3efe6}
.btn.danger{background:#fff; color:var(--over); border-color:#e2b4ad}
.btn.sm{padding:7px 13px; font-size:.86rem}
.btnrow{display:flex; gap:10px; flex-wrap:wrap; margin-top:8px}

/* details / accordion for secondary actions */
details{border:1px solid var(--line); border-radius:12px; background:#fff; margin-bottom:14px}
details summary{cursor:pointer; padding:14px 18px; font-weight:600; list-style:none}
details summary::-webkit-details-marker{display:none}
details[open] summary{border-bottom:1px solid var(--line)}
details .body{padding:18px}

/* flash */
.flash{padding:12px 15px; border-radius:10px; margin-bottom:16px; font-size:.92rem}
.flash-error{background:#fcecea; border:1px solid #e6b8b0; color:#9a2b1d}
.flash-ok{background:#eef7f1; border:1px solid #bfe0cc; color:#1f6b45}

/* dashboard */
.stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; margin-bottom:22px}
.stat{background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px}
.stat .n{font-family:"Fraunces",serif; font-size:1.7rem; font-weight:800; line-height:1}
.stat .l{font-size:.78rem; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; margin-top:4px}
.stat.alert .n{color:var(--over)}

table{width:100%; border-collapse:collapse; font-size:.9rem}
th,td{text-align:left; padding:11px 10px; border-bottom:1px solid var(--line); vertical-align:top}
th{font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted)}
tr.over td{background:#fdf1ef}
.tbl-wrap{overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:14px}
.tbl-wrap table{min-width:540px}
td a{font-weight:600; text-decoration:none}

.list-reset{list-style:none; margin:0; padding:0}
.log-item{border-bottom:1px solid var(--line); padding:12px 0}
.log-item:last-child{border-bottom:0}
.log-meta{font-size:.8rem; color:var(--muted)}

@media (max-width:560px){
  .row2{grid-template-columns:1fr}
  h1{font-size:1.5rem}
  .adminnav{gap:13px; font-size:.85rem}
}
@media print{
  .masthead,.foot,.adminnav{display:none}
}