:root{
  --ink:#0A1420;
  --paper:#F1ECDD;
  --paper-alt:#E7DFC9;
  --line: rgba(10,20,32,0.16);
  --clay:#A8532A;
  --clay-dark:#8A4322;
  --teal:#061C31;
  --muted:#5C6B7A;
  --white:#FBF9F3;
  --danger:#B23A2E;
  --font-body:'Public Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, monospace;
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font-body); font-size:15px; line-height:1.55;
}
a{color:var(--teal); text-decoration:none;}
a:hover{text-decoration:underline;}

.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; background:var(--ink); color:var(--white);
}
.topbar a{color:var(--white); background:rgba(255,255,255,.1); border:0; border-radius:4px; padding:1px 8px; text-decoration: none;}
.topbar a:hover{background:rgba(255,255,255,.2);}
.topbar .active{background:rgba(255,255,255,.4);color:var(--white);}
.topbar__brand{font-weight:700; letter-spacing:.02em;}
.topbar__nav{display:flex; gap:10px; font-size:13px; font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.04em;}

.wrap{max-width:920px; margin:0 auto; padding:36px 24px 80px;}
.wrap--form-page{padding-bottom:110px;}
.wrap--wide{max-width:1100px;}

h1{font-size:24px; margin:0 0 6px;}
h2{font-size:18px; margin:32px 0 14px;}
.page-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; flex-wrap:wrap; gap:12px;}
.subtitle{color:var(--muted); font-size:14px; margin:0 0 28px;}

.card{
  background:var(--white); border:1px solid var(--line); border-radius:6px;
  padding:24px; margin-bottom:20px;
}

.flash{
  padding:12px 16px; border-radius:6px; margin-bottom:20px; font-size:14px;
}
.flash--success{background:rgba(47,93,87,.12); color:var(--teal); border:1px solid rgba(47,93,87,.25);}
.flash--error{background:rgba(178,58,46,.1); color:var(--danger); border:1px solid rgba(178,58,46,.25);}

label{display:block; font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:6px; font-weight:600;}
input[type=text], input[type=number], input[type=password], input[type=url], input[type=email], textarea, select{
  width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:4px;
  font-family:var(--font-body); font-size:14px; background:var(--white); color:var(--ink);
  margin-bottom:16px;
}
textarea{resize:vertical; min-height:80px;}
input:focus, textarea:focus, select:focus{outline:2px solid var(--clay); outline-offset:1px; border-color:var(--clay);}

.field-row{display:grid; grid-template-columns:repeat(2,1fr); gap:16px;}
.field-row--3{grid-template-columns:repeat(3,1fr);}
.field-row--4{grid-template-columns:repeat(4,1fr);}

.btn{
  display:inline-block; font-family:var(--font-mono); font-size:13px; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase; padding:11px 20px;
  background:var(--clay); color:var(--white); border:none; border-radius:4px; cursor:pointer;
}
.btn:hover{background:var(--clay-dark); text-decoration:none;}
.btn:disabled{
  opacity:.4;
  cursor:not-allowed;
  pointer-events:none;
}
.btn:disabled:hover{background:var(--clay);}

.btn--ghost{background:transparent; color:var(--ink); border:1px solid var(--line);}
.btn--ghost:hover{background:var(--paper-alt);}
.btn--danger{background:var(--danger);}
.btn--danger:hover{background:#8f2e24;}
.btn--sm{padding:7px 12px; font-size:11px;}

.repeat-block{border:1px dashed var(--line); border-radius:6px; padding:16px; margin-bottom:12px; position:relative; background:var(--paper);}
.repeat-block__remove{position:absolute; top:10px; right:10px;}
.repeat-add{margin-bottom:24px;}

.img-field{display:flex; gap:8px; align-items:center; margin-bottom:16px;}
.img-field input{flex:1; margin-bottom:0;}
.img-field .btn{white-space:nowrap;}

.section-eyebrow{
  font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.08em;
  color:var(--clay); font-weight:700; margin:36px 0 4px; display:flex; align-items:center; gap:8px;
}
.section-eyebrow::before{content:""; width:16px; height:1px; background:var(--clay);}
.section-help{color:var(--muted); font-size:13px; margin:0 0 16px;}

table.list{width:100%; border-collapse:collapse; background:var(--white); border:1px solid var(--line); border-radius:6px; overflow:hidden;}
table.list th{
  text-align:left; font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.05em;
  color:var(--muted); padding:12px 16px; border-bottom:1px solid var(--line); background:var(--paper-alt);
}
table.list td{padding:14px 16px; border-bottom:1px solid var(--line); font-size:14px; vertical-align:middle;}
table.list tr:last-child td{border-bottom:none;}
.badge{font-family:var(--font-mono); font-size:11px; padding:3px 9px; border-radius:100px; font-weight:600;}
.badge--live{background:rgba(47,93,87,.12); color:var(--teal);}
.badge--draft{background:var(--paper-alt); color:var(--muted);}
.row-actions{display:flex; gap:10px; font-family:var(--font-mono); font-size:12px; text-transform:uppercase;}
.row-actions form{display:inline;}
.row-actions button, .row-actions a{background:rgba(47,93,87,.08); border:0; border-radius:4px; padding:3px 8px; color:var(--danger); font-family:inherit; font-size:inherit; cursor:pointer; text-transform:uppercase;}
.row-actions a{padding:0 8px; }
.row-actions button:hover, .row-actions a:hover{background:rgba(47,93,87,.2);text-decoration:none;}

.empty-state{text-align:center; padding:60px 20px; color:var(--muted);}

.login-shell{
  min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--ink);
}
.login-card{
  background:var(--white); padding:40px; border-radius:8px; width:100%; max-width:360px;
}
.login-card h1{font-size:20px; margin-bottom:4px;}

.actions-bar{display:flex; gap:10px; margin-top:28px; padding-top:20px; border-top:1px solid var(--line);}

.actions-bar-fixed{
  position:fixed; left:0; right:0; bottom:0; z-index:50;
  background:var(--white); border-top:1px solid var(--line);
  box-shadow:0 -6px 20px rgba(28,41,37,.1);
  padding:14px 24px;
}
.actions-bar-fixed__inner{
  max-width:920px; margin:0 auto; display:flex; gap:10px; align-items:center;
}

@media (max-width:700px){
  .field-row, .field-row--3, .field-row--4{grid-template-columns:1fr;}
}
