@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700&family=Playfair+Display:wght@600&display=swap');

:root{
  --bg: #2b2015;
  --panel: #fbf3e3;
  --panel-border:#c9a96b;
  --accent:#8f2d2d;
  --accent-2:#556b3a;
  --ink:#2b1f14;
  --ink-soft:#5a4632;
  --gold:#e0a83f;
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Playfair Display', Georgia, serif;
  background:linear-gradient(180deg,#1c140d,#2b2015 40%, #4a2f18);
  min-height:100vh;
  color:var(--ink);
}
.topbar{
  display:flex; justify-content:space-between; align-items:center;
  padding:16px 26px;
  background:rgba(0,0,0,.25);
  color:#f3cd82;
  font-family:'Cinzel',serif;
  letter-spacing:1px;
}
.topbar a{color:#f3cd82; text-decoration:none; font-size:13px; border:1px solid #f3cd82; padding:6px 14px; border-radius:20px;}
.topbar a:hover{background:#f3cd82; color:#2b2015;}
.container{max-width:980px; margin:0 auto; padding:30px 20px 60px;}

.panel{
  background:linear-gradient(180deg,var(--panel),#f0e2c4);
  border:2px solid var(--panel-border);
  border-radius:14px;
  padding:24px;
  margin-bottom:22px;
  box-shadow:0 10px 24px rgba(0,0,0,.3);
}
h1,h2,h3{font-family:'Cinzel', serif; color:var(--accent); margin-top:0;}
h1{font-size:22px;} h2{font-size:18px;} h3{font-size:15px; letter-spacing:1px; text-transform:uppercase;}

table{width:100%; border-collapse:collapse; font-size:14px;}
table th, table td{padding:10px 8px; border-bottom:1px solid rgba(90,70,50,.2); text-align:left; vertical-align:middle; word-break:break-word; overflow-wrap:anywhere;}
table th{font-family:'Cinzel',serif; font-size:12px; letter-spacing:.5px; text-transform:uppercase; color:var(--ink-soft);}
.table-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 -4px;}
.table-scroll table{min-width:520px;}
.actions-cell{display:flex; flex-wrap:wrap; gap:6px;}

input[type=text], input[type=password], input[type=number], textarea, select{
  width:100%;
  border:1.5px solid var(--panel-border);
  border-radius:8px;
  padding:9px 11px;
  font-family:inherit;
  font-size:14.5px;
  background:#fffaf0;
}
label.field-label{display:block; font-family:'Cinzel',serif; font-size:12px; letter-spacing:.5px; text-transform:uppercase; color:var(--accent); margin-bottom:6px;}
.field{margin-bottom:16px;}
.row{display:flex; gap:14px; flex-wrap:wrap;}
.row > .field{flex:1; min-width:180px;}

.btn{
  display:inline-block;
  font-family:'Cinzel', serif;
  letter-spacing:1px;
  text-transform:uppercase;
  font-size:12.5px;
  font-weight:600;
  color:#fff;
  background:linear-gradient(180deg,#b23c3c,var(--accent));
  border:none;
  border-radius:24px;
  padding:10px 22px;
  cursor:pointer;
  text-decoration:none;
}
.btn.green{background:linear-gradient(180deg,#7a8a5c,var(--accent-2));}
.btn.gray{background:linear-gradient(180deg,#8a7a63,#5f5342);}
.btn.small{padding:6px 14px; font-size:11px;}
.btn:hover{opacity:.92;}

.badge{display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-family:'Cinzel',serif;}
.badge.active{background:#556b3a; color:#fff;}
.badge.inactive{background:#8a7a63; color:#fff;}

.flash{padding:12px 16px; border-radius:8px; margin-bottom:18px; font-size:14px;}
.flash.ok{background:#dfead0; border:1px solid #7a8a5c; color:#3a4a26;}
.flash.err{background:#f0d4d0; border:1px solid #8f2d2d; color:#5a1a1a;}

.section-block{border:1.5px dashed var(--panel-border); border-radius:10px; padding:16px; margin-bottom:16px; background:rgba(255,255,255,.35); scroll-margin-top:20px;}
.mini-form{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap;}
.mini-form input, .mini-form select{width:auto; flex:1; min-width:140px;}
.mini-form textarea.qf-label-input{width:auto; flex:2; min-width:160px;}

.question-edit-row{
  display:flex;
  align-items:flex-end;
  gap:8px;
  flex-wrap:wrap;
  padding:10px 0 4px;
}
.question-edit-row .field{margin-bottom:0;}
.qf-label{flex:1 1 200px; min-width:160px;}
.qf-type{flex:0 0 120px; min-width:100px;}
.qf-actions{display:flex; gap:6px; flex:0 0 auto; padding-bottom:1px; white-space:nowrap;}
.qf-actions form{margin:0;}
.qf-actions .btn.small{padding:6px 10px;}
.qf-opts-wrap{flex-basis:100%; margin:2px 0 10px;}
.question-row-wrap{border-bottom:1px dotted rgba(90,70,50,.25); padding-bottom:4px; margin-bottom:4px;}
.question-row-wrap:last-of-type{border-bottom:none;}

.qf-label-input{
  width:100%;
  min-height:40px;
  max-height:130px;
  overflow-y:auto;
  resize:vertical;
  line-height:1.4;
  font-family:inherit;
}

@media (min-width:700px){
  .question-edit-row{flex-wrap:nowrap;}
  .qf-label{flex:1 1 auto;}
}

.stat-cards{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:20px;}
.stat-card{flex:1; min-width:140px; background:linear-gradient(180deg,var(--panel),#f0e2c4); border:2px solid var(--panel-border); border-radius:12px; padding:16px; text-align:center;}
.stat-card .num{font-family:'Cinzel',serif; font-size:28px; color:var(--accent);}
.stat-card .lbl{font-size:12px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:1px;}

.bar-row{margin-bottom:12px;}
.bar-row .bl{display:flex; justify-content:space-between; font-size:13.5px; margin-bottom:4px;}
.bar-track{background:#e7dbc0; border-radius:6px; height:14px; overflow:hidden;}
.bar-fill{background:linear-gradient(90deg,#c95d3a,var(--gold)); height:100%;}

.text-answer{background:#fffaf0; border-left:3px solid var(--gold); padding:8px 12px; margin-bottom:6px; border-radius:0 6px 6px 0; font-size:14px;}

.setup-box{max-width:440px; margin:60px auto;}
.link-copy{display:flex; gap:8px; align-items:center;}
.link-copy input{flex:1;}
small.muted{color:var(--ink-soft);}
