/* ============================================================
   shared.css — theme tokens + base reset used on every page
   (login, dashboard, editor). Extracted from the original
   single-file app so the look stays identical everywhere.
   ============================================================ */
:root{
  --bg-canvas:#17140f;
  --bg-sidebar:#1c1712;
  --bg-sidebar-hover:#241d16;
  --paper:#f7f3ea;
  --ink:#2a2620;
  --ink-muted:#7a7367;
  --line:#332c22;
  --brass:#b8935a;
  --brass-bright:#d9b783;
  --danger:#a85c46;
  --danger-bright:#c37257;
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  background:var(--bg-canvas);
  color:#e9e3d6;
  font-family:'Inter',sans-serif;
}
button, input{ font-family:inherit; }
a{ color:var(--brass-bright); }

.wordmark{
  font-family:'Bebas Neue',sans-serif;
  font-size:28px;
  letter-spacing:2px;
  color:var(--brass-bright);
}
.tagline{
  font-size:11px;
  color:var(--ink-muted);
  letter-spacing:.5px;
}
.brass-btn{
  background:transparent;
  border:1px solid var(--brass);
  color:var(--brass-bright);
  font-family:'Inter',sans-serif;
  font-weight:600;
  font-size:13px;
  padding:10px 14px;
  border-radius:6px;
  cursor:pointer;
  letter-spacing:.3px;
  transition:background .15s, color .15s;
}
.brass-btn:hover{ background:var(--brass); color:#1c1712; }
.brass-btn:disabled{ opacity:.45; cursor:default; }

.ghost-btn{
  background:transparent;
  border:1px solid var(--line);
  color:#cfc7b6;
  font-size:12.5px;
  font-weight:600;
  padding:8px 12px;
  border-radius:16px;
  cursor:pointer;
  transition:border-color .15s, color .15s;
}
.ghost-btn:hover{ border-color:var(--brass); color:var(--brass-bright); }

.field{ margin-bottom:16px; text-align:left; }
.field label{
  display:block;
  font-size:11.5px;
  color:var(--ink-muted);
  margin-bottom:6px;
  letter-spacing:.3px;
}
.field input[type="text"],
.field input[type="email"],
.field input[type="password"]{
  width:100%;
  background:#241d16;
  border:1px solid var(--line);
  color:#e9e3d6;
  padding:10px 12px;
  border-radius:6px;
  font-size:14px;
  outline:none;
}
.field input:focus{ border-color:var(--brass); }

.checkbox-row{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
  color:var(--ink-muted);
  margin-bottom:16px;
}
.checkbox-row input{ accent-color:var(--brass); }

.form-msg{
  font-size:12.5px;
  padding:8px 10px;
  border-radius:6px;
  margin-bottom:14px;
  display:none;
}
.form-msg.show{ display:block; }
.form-msg.error{ background:rgba(168,92,70,.15); color:var(--danger-bright); }
.form-msg.success{ background:rgba(184,147,90,.15); color:var(--brass-bright); }

.spinner{
  display:inline-block;
  width:13px; height:13px;
  border:2px solid rgba(233,227,214,.25);
  border-top-color:var(--brass-bright);
  border-radius:50%;
  animation:spin .7s linear infinite;
  vertical-align:-2px;
  margin-right:6px;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
