:root{
  color-scheme: dark;
  --bg:#090705; --bg-alt:#120d08; --text:#ece3d1; --text-muted:#978c73;
  --gold:#b48a3f; --gold-soft:#d4ac6a; --line:#231d13;
  --serif:'Fraunces', Georgia, serif; --sans:'Inter', sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
[hidden]{display:none !important;}
body{background:var(--bg); color:var(--text); font-family:var(--sans); min-height:100vh;}
button{font-family:var(--sans); cursor:pointer;}
input{font-family:var(--sans);}

.login-view{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;}
.login-form{background:var(--bg-alt); border:1px solid var(--line); border-radius:6px; padding:36px; width:100%; max-width:360px; display:flex; flex-direction:column; gap:12px;}
.login-form h1{font-family:var(--serif); font-size:1.4rem; color:var(--gold-soft); margin-bottom:10px;}
.login-form input{background:var(--bg); border:1px solid var(--line); color:var(--text); padding:11px 14px; border-radius:3px;}
.login-form button{background:var(--gold); color:#090705; border:none; padding:12px; border-radius:3px; font-weight:600; margin-top:6px;}
.msg{font-size:.85rem; min-height:1.2em;}
.msg.error{color:#c97a6b;}
.msg.ok{color:var(--gold-soft);}

.panel-view{padding:24px 32px 60px;}
.panel-head{display:flex; justify-content:space-between; align-items:center; padding-bottom:20px; border-bottom:1px solid var(--line); margin-bottom:20px;}
.brand{font-family:var(--serif); color:var(--gold-soft); font-style:italic;}
.panel-head-right{display:flex; align-items:center; gap:14px; font-size:.9rem; color:var(--text-muted);}
.btn-ghost{background:none; border:1px solid var(--line); color:var(--text-muted); padding:8px 16px; border-radius:3px;}
.btn-ghost:hover{color:var(--gold-soft); border-color:var(--gold);}
.btn-primary{background:var(--gold); color:#090705; border:none; padding:10px 18px; border-radius:3px; font-weight:600;}

.tabs{display:flex; gap:10px; margin-bottom:24px;}
.tab{background:none; border:1px solid var(--line); color:var(--text-muted); padding:9px 18px; border-radius:3px; font-size:.9rem;}
.tab[aria-pressed="true"]{color:var(--gold-soft); border-color:var(--gold);}

.inline-form{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; align-items:center;}
.inline-form input{background:var(--bg-alt); border:1px solid var(--line); color:var(--text); padding:9px 12px; border-radius:3px; font-size:.9rem;}
.inline-form input[name=name], .inline-form input[name=description]{flex:1; min-width:160px;}

.data-table{width:100%; border-collapse:collapse; font-size:.9rem;}
.data-table th{text-align:left; color:var(--text-muted); font-weight:500; padding:10px 8px; border-bottom:1px solid var(--line); font-size:.8rem;}
.data-table td{padding:10px 8px; border-bottom:1px solid var(--line);}
.data-table button{background:none; border:1px solid var(--line); color:var(--text-muted); padding:5px 10px; border-radius:3px; font-size:.8rem; margin-right:4px;}
.data-table button:hover{color:var(--gold-soft); border-color:var(--gold);}
.status-select{background:var(--bg-alt); border:1px solid var(--line); color:var(--text); padding:5px 8px; border-radius:3px; font-size:.82rem;}

.settings-form{display:flex; flex-direction:column; gap:16px; max-width:480px;}
.settings-form label{display:flex; flex-direction:column; gap:6px; font-size:.85rem; color:var(--text-muted);}
.settings-form input, .settings-form textarea{background:var(--bg-alt); border:1px solid var(--line); color:var(--text); padding:10px 12px; border-radius:3px; font-size:.9rem; font-family:var(--sans);}
.settings-form textarea{resize:vertical;}
.settings-form button{align-self:flex-start;}
.msg.ok{color:var(--gold-soft);}
