@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,400;0,500;0,600;1,500&family=Work+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --paper:#EDE3D0;
  --paper-2:#E4D8C0;
  --ink:#221C15;
  --ink-soft:#5A5145;
  --indigo:#1F3B54;
  --indigo-deep:#152A3D;
  --rust:#A8461F;
  --rust-deep:#7C3216;
  --ochre:#B07E1E;
  --ochre-deep:#8A6216;
  --sage:#4F6B48;
  --sage-deep:#3A4E34;
  --line: rgba(34,28,21,0.18);
  --line-strong: rgba(34,28,21,0.32);
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Work Sans',sans-serif;}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:500;margin:0;}
button{font-family:'Work Sans',sans-serif;}

/* ---------- Login page ---------- */
.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem 1.2rem;}
.login-card{width:100%;max-width:400px;background:var(--paper-2);border:1px solid var(--line-strong);border-radius:3px;padding:2.2rem 2rem;}
.login-logo{display:block;width:64px;height:auto;margin:0 auto 1rem;}
.login-eyebrow{text-align:center;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.3rem;}
.login-title{text-align:center;font-size:24px;font-style:italic;margin-bottom:1.6rem;}
.login-card label{display:block;font-size:12px;color:var(--ink-soft);margin:0 0 .3rem;font-family:'IBM Plex Mono',monospace;letter-spacing:.02em;}
.login-card input{width:100%;font-family:'Work Sans',sans-serif;font-size:14px;padding:.6rem .7rem;border:1px solid var(--line-strong);border-radius:2px;background:var(--paper);color:var(--ink);margin-bottom:1rem;}
.login-card input:focus{outline:2px solid var(--indigo);outline-offset:1px;}
.login-card button{width:100%;font-family:'Work Sans',sans-serif;font-weight:600;font-size:14px;padding:.7rem 1rem;border-radius:2px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;}
.login-card button:hover{opacity:.88;}
.login-card button:disabled{opacity:.45;cursor:default;}
.login-note{text-align:center;font-size:12px;color:var(--ink-soft);margin-top:1.2rem;line-height:1.5;}
.login-msg{font-size:13px;padding:.6rem .8rem;border-radius:2px;margin-bottom:1rem;display:none;}
.login-msg.show{display:block;}
.login-msg.err{background:rgba(168,70,31,0.12);color:var(--rust-deep);border:1px solid var(--rust);}
.login-msg.ok{background:rgba(79,107,72,0.12);color:var(--sage-deep);border:1px solid var(--sage);}

/* ---------- Dashboard ---------- */
.wrap{max-width:1100px;margin:0 auto;padding:1.5rem 1.5rem 5rem;}
.masthead{display:flex;justify-content:space-between;align-items:center;gap:1rem;border-bottom:3px double var(--line-strong);padding-bottom:1.1rem;margin-bottom:1.8rem;flex-wrap:wrap;}
.masthead-left{display:flex;align-items:center;gap:.8rem;}
.masthead-left img{width:38px;height:auto;}
.masthead .eyebrow{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.2rem;}
.masthead h1{font-size:22px;font-style:italic;}
.masthead .who{text-align:right;font-size:13px;color:var(--ink-soft);}
.masthead .who b{color:var(--ink);font-weight:600;}
.role-tag{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border:1px solid var(--line-strong);border-radius:2px;margin-left:6px;}
.logout-btn{font-size:12px;background:transparent;border:1px solid var(--line-strong);color:var(--ink-soft);padding:.4rem .8rem;border-radius:2px;cursor:pointer;font-family:'Work Sans',sans-serif;}
.logout-btn:hover{color:var(--ink);border-color:var(--ink);}

.nav{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap;}
.nav button{background:transparent;color:var(--ink-soft);border:1px solid var(--line);font-family:'Work Sans',sans-serif;font-weight:600;font-size:13px;padding:.55rem 1rem;border-radius:2px;cursor:pointer;}
.nav button.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}

.card{background:var(--paper-2);border:1px solid var(--line);border-radius:3px;padding:1.4rem 1.6rem;margin-bottom:1.4rem;}
.card h2{font-size:19px;margin-bottom:.9rem;}
.card h2 .sub{font-family:'Work Sans',sans-serif;font-size:12px;font-weight:400;color:var(--ink-soft);display:block;margin-top:2px;font-style:normal;}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.9rem;}
.stat{background:var(--paper);border:1px solid var(--line);border-radius:3px;padding:.85rem 1rem;}
.stat .n{font-family:'Fraunces',serif;font-size:26px;}
.stat .l{font-family:'IBM Plex Mono',monospace;font-size:10.5px;text-transform:uppercase;color:var(--ink-soft);letter-spacing:.06em;}

table{width:100%;border-collapse:collapse;font-size:13.5px;}
th{text-align:left;font-family:'IBM Plex Mono',monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);padding:.4rem .5rem;border-bottom:1px solid var(--line-strong);}
td{padding:.65rem .5rem;border-bottom:1px solid var(--line);vertical-align:top;}
tr:hover td{background:rgba(34,28,21,0.04);}

button.small{padding:.35rem .7rem;font-size:12px;font-family:'Work Sans',sans-serif;font-weight:600;border-radius:2px;cursor:pointer;}
button.sage{background:var(--sage);border:1px solid var(--sage-deep);color:#fff;}
button.rust{background:var(--rust);border:1px solid var(--rust-deep);color:#fff;}
button.secondary{background:transparent;color:var(--ink);border:1px solid var(--line-strong);}
button.small:hover{opacity:.88;}

.stamp{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;padding:3px 9px;border:1.5px solid;border-radius:2px;white-space:nowrap;}
.stamp.pending{color:var(--ochre-deep);border-color:var(--ochre);}
.stamp.approved,.stamp.published{color:var(--sage-deep);border-color:var(--sage);}
.stamp.rejected{color:var(--rust-deep);border-color:var(--rust);}

.detail{background:var(--paper);border:1px solid var(--line-strong);border-radius:3px;padding:1rem 1.2rem;margin-top:.6rem;font-size:13px;}
.detail p{margin:.35rem 0;}
.detail b{font-weight:600;}
.pill-row{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.7rem;}
.muted{color:var(--ink-soft);}
.empty{font-size:13px;color:var(--ink-soft);font-style:italic;padding:1rem 0;}
.divider{border:none;border-top:1px dashed var(--line-strong);margin:1.1rem 0;}

label{display:block;font-size:12px;color:var(--ink-soft);margin:.7rem 0 .3rem;font-family:'IBM Plex Mono',monospace;letter-spacing:.02em;}
input,select,textarea{width:100%;font-family:'Work Sans',sans-serif;font-size:14px;padding:.55rem .65rem;border:1px solid var(--line-strong);border-radius:2px;background:var(--paper);color:var(--ink);}
input:focus,select:focus,textarea:focus{outline:2px solid var(--indigo);outline-offset:1px;}

.journal-overview{background:var(--paper);border:1px solid var(--line-strong);border-radius:3px;padding:1rem 1.2rem;margin-bottom:1.2rem;}
.journal-overview h3{font-size:15px;margin-bottom:.6rem;}
.journal-overview h3 .sub{font-family:'Work Sans',sans-serif;font-size:12px;font-weight:400;color:var(--ink-soft);display:block;margin-top:2px;}
.journal-overview details{border-top:1px solid var(--line);padding:.55rem 0;}
.journal-overview details:first-of-type{border-top:none;}
.journal-overview summary{font-family:'IBM Plex Mono',monospace;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink);cursor:pointer;}
.journal-overview .jo-body{font-size:13.5px;color:var(--ink-soft);margin-top:.5rem;line-height:1.5;}
.journal-overview .jo-body p{margin:.35rem 0;}

.msg{font-size:13px;padding:.6rem .8rem;border-radius:2px;margin-bottom:1rem;}
.msg.err{background:rgba(168,70,31,0.12);color:var(--rust-deep);border:1px solid var(--rust);}
.msg.ok{background:rgba(79,107,72,0.12);color:var(--sage-deep);border:1px solid var(--sage);}

.editor-list{list-style:none;margin:0;padding:0;}
.editor-list li{display:flex;justify-content:space-between;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--line);font-size:13.5px;}

.spinner-line{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--ink-soft);padding:1rem 0;}

footer{margin-top:2.5rem;font-size:11.5px;color:var(--ink-soft);text-align:center;font-family:'IBM Plex Mono',monospace;}

@media (max-width:600px){
  table, thead, tbody, th, td, tr{ display:block; }
  thead{ display:none; }
  tr{ border-bottom:2px solid var(--line-strong); padding:.6rem 0; }
  td{ border-bottom:none; padding:.25rem .1rem; }
  td::before{ content: attr(data-label); display:block; font-family:'IBM Plex Mono',monospace; font-size:10px; text-transform:uppercase; color:var(--ink-soft); letter-spacing:.05em; margin-bottom:.15rem; }
}
