*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  background: var(--background-color, #FDF6E3);
  color: #1a1a1a;
  line-height: 1.5;
}

/* Layout */
.admin-header {
  background: #1a1a2e;
  color: #fff;
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.admin-header h1 { font-size: 16px; font-weight: 600; letter-spacing: 0.03em; }
.admin-header .subtitle { color: #888; font-size: 13px; }
.admin-header a { color: #aac; text-decoration: none; font-size: 13px; }
.admin-header a:hover { color: #fff; }

.admin-body { max-width: 960px; margin: 0 auto; padding: 24px 16px; }

/* Flash messages */
.flash-list { list-style: none; margin-bottom: 16px; }
.flash-list li {
  padding: 10px 14px;
  border-radius: 4px;
  margin-bottom: 8px;
  font-size: 13px;
}
.flash-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.flash-error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
.flash-warning { background: #fff3cd; color: #856404; border: 1px solid #ffeeba; }

/* Cards */
.card {
  background: #fff;
  border: 1px solid #dde;
  border-radius: 6px;
  padding: 20px;
  margin-bottom: 16px;
}
.card-title {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 14px;
  color: #333;
}

/* Generate form */
.gen-form {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.gen-form input[type="date"] {
  padding: 7px 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 14px;
}

/* Table */
.days-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.days-table th {
  text-align: left;
  padding: 8px 12px;
  background: #f7f8fa;
  border-bottom: 2px solid #dde;
  color: #555;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.days-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #eee;
  vertical-align: middle;
}
.days-table tr:last-child td { border-bottom: none; }
.days-table tr:hover td { background: #fafbff; }

/* Badges */
.badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.badge-published  { background: #d4edda; color: #155724; }
.badge-draft      { background: #fff3cd; color: #856404; }
.badge-generating { background: #cce5ff; color: #004085; }
.badge-failed     { background: #f8d7da; color: #721c24; }
.badge-easy      { background: #d4edda; color: #155724; }
.badge-medium    { background: #cce5ff; color: #004085; }
.badge-hard      { background: #f8d7da; color: #721c24; }
.badge-connects  { background: #e2e3e5; color: #383d41; }
.badge-place     { background: #e8d5f0; color: #4b0082; }

/* Buttons */
.btn {
  display: inline-block;
  padding: 6px 12px;
  border: none;
  border-radius: 4px;
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  font-family: inherit;
  font-weight: 500;
  line-height: 1.4;
}
.btn + .btn { margin-left: 6px; }
.btn-primary   { background: #1a1a2e; color: #fff; }
.btn-primary:hover { background: #2a2a4e; }
.btn-secondary { background: #e9ecef; color: #333; }
.btn-secondary:hover { background: #dde; }
.btn-success   { background: #28a745; color: #fff; }
.btn-success:hover { background: #218838; }
.btn-warning   { background: #ffc107; color: #333; }
.btn-warning:hover { background: #e0a800; }
.btn-danger    { background: #dc3545; color: #fff; }
.btn-danger:hover { background: #c82333; }
.btn-sm { padding: 4px 9px; font-size: 12px; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* Question cards */
.q-card {
  background: #fff;
  border: 1px solid #dde;
  border-radius: 6px;
  margin-bottom: 20px;
  overflow: hidden;
}
.q-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: #f7f8fa;
  border-bottom: 1px solid #dde;
}
.q-num {
  font-weight: 700;
  font-size: 16px;
  color: #333;
  min-width: 28px;
}
.q-card-body { padding: 16px; }

.q-section { margin-bottom: 14px; }
.q-section label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #888;
  margin-bottom: 5px;
}
.q-section textarea {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-family: inherit;
  font-size: 14px;
  resize: vertical;
  min-height: 56px;
  line-height: 1.5;
}
.q-section textarea:focus {
  outline: none;
  border-color: #7090cc;
  box-shadow: 0 0 0 2px rgba(112,144,204,0.2);
}

/* Answer choices */
.answers-list { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.answer-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 4px;
  border: 1px solid #eee;
  background: #fafafa;
}
.answer-item.correct {
  background: #edfaed;
  border-color: #28a745;
}
.answer-correct-mark {
  font-size: 14px;
  width: 18px;
  text-align: center;
  flex-shrink: 0;
}
.answer-text { flex: 1; font-size: 13px; }
.answer-meta { font-size: 11px; color: #999; }

.q-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid #eee;
  background: #fafafa;
  flex-wrap: wrap;
}
.save-status {
  font-size: 12px;
  color: #888;
  margin-left: 4px;
}
.save-status.ok  { color: #28a745; }
.save-status.err { color: #dc3545; }

/* Day header bar */
.day-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.day-header h2 { font-size: 18px; font-weight: 700; }
.day-header .spacer { flex: 1; }

/* Inline form helper */
.inline-form { display: inline; }

/* Wait note */
.wait-note {
  font-size: 12px;
  color: #888;
  font-style: italic;
}

/* Generation progress bar */
.progress-wrap {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #eee;
}
.progress-label {
  font-size: 13px;
  color: #444;
  margin-bottom: 8px;
}
.progress-bar-track {
  background: #e9ecef;
  border-radius: 4px;
  height: 8px;
  overflow: hidden;
}
.progress-bar-fill {
  background: #004085;
  height: 100%;
  border-radius: 4px;
  transition: width 0.4s ease;
}