.coding-question-editor[hidden],
.coding-question-editor [hidden] {
  display: none !important;
}

.coding-question-editor.ov {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 500;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(0, 0, 0, .48);
}

.coding-question-editor.ov.open {
  display: flex;
}

.coding-question-editor .modal {
  width: 100%;
  max-width: 740px;
  max-height: 94vh;
  overflow-y: auto;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .28);
}

.coding-question-editor .mh {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  border-bottom: 1px solid #e9ecf0;
  background: #fff;
}

.coding-question-editor .mh h3 {
  margin: 0;
  color: #111827;
  font-size: 16px;
  font-weight: 700;
}

.coding-question-editor .mclose {
  border: 0;
  background: none;
  color: #94a3b8;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}

.coding-question-editor .mb {
  padding: 22px;
}

.coding-question-editor .mf {
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  padding: 14px 22px;
  border-top: 1px solid #e9ecf0;
  background: #fff;
}

.coding-question-editor .fg {
  min-width: 0;
  margin-bottom: 13px;
}

.coding-question-editor .fg label {
  display: block;
  margin-bottom: 6px;
  color: #374151;
  font-size: 12px;
  font-weight: 600;
}

.coding-question-editor .fg input[type="text"],
.coding-question-editor .fg input[type="number"],
.coding-question-editor .fg select,
.coding-question-editor .fg textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #d1d5db;
  border-radius: 7px;
  padding: 9px 11px;
  outline: none;
  background: #fff;
  color: #111827;
  font-family: inherit;
  font-size: 13px;
}

.coding-question-editor .fg input:focus,
.coding-question-editor .fg select:focus,
.coding-question-editor .fg textarea:focus {
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, .12);
}

.coding-question-editor .fg textarea {
  resize: vertical;
}

.coding-question-editor .frow-m {
  display: flex;
  gap: 10px;
}

.coding-question-editor .frow-m .fg {
  flex: 1;
}

.coding-question-editor .err {
  display: none;
  margin: 0 0 12px;
  padding: 7px 12px;
  border: 1px solid #fecaca;
  border-radius: 6px;
  background: #fee2e2;
  color: #dc2626;
  font-size: 12px;
}

.coding-question-editor .err.is-visible {
  display: block;
}

.coding-question-editor .fg input.is-invalid,
.coding-question-editor .fg select.is-invalid,
.coding-question-editor .fg textarea.is-invalid {
  border-color: #dc2626;
  background: #fff7f7;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, .12);
}

.coding-question-editor .err-sticky {
  position: sticky;
  top: 0;
  z-index: 3;
}

.coding-question-editor .ai-panel {
  position: relative;
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid #c4b5fd;
  border-radius: 10px;
  background: linear-gradient(135deg, #f5f3ff, #ede9fe);
}

.coding-question-editor .ai-panel-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.coding-question-editor .ai-panel-header h4 {
  flex: 1;
  margin: 0;
  color: #4f46e5;
  font-size: 13px;
  font-weight: 700;
}

.coding-question-editor .ai-panel-header .emoji {
  font-size: 18px;
}

.coding-question-editor .ai-badge {
  border-radius: 10px;
  padding: 2px 7px;
  background: #4f46e5;
  color: #fff;
  font-size: 10px;
}

.coding-question-editor .ai-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 10px;
}

.coding-question-editor .ai-chk,
.coding-question-editor .cqfpub-label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #374151;
  cursor: pointer;
  font-size: 12px;
}

.coding-question-editor .ai-chk input,
.coding-question-editor .cqfpub-checkbox {
  width: 15px;
  height: 15px;
  accent-color: #4f46e5;
}

.coding-question-editor .ai-help {
  margin: 10px 0;
  padding: 10px 12px;
  border: 1px solid #e9ecf0;
  border-radius: 8px;
  background: #fff;
  color: #374151;
  font-size: 12px;
  line-height: 1.7;
}

.coding-question-editor .ai-help ul {
  margin: 0;
  padding-right: 18px;
}

.coding-question-editor .ai-status {
  min-height: 18px;
  margin-top: 6px;
  color: #6d28d9;
  font-size: 12px;
}

.coding-question-editor .ai-status.success {
  color: #16a34a;
}

.coding-question-editor .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  border: 1px solid transparent;
  border-radius: 7px;
  padding: 7px 14px;
  cursor: pointer;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
}

.coding-question-editor .btn:disabled {
  cursor: not-allowed;
  opacity: .6;
}

.coding-question-editor .btn-primary {
  background: #4f46e5;
  color: #fff;
}

.coding-question-editor .btn-ghost {
  border-color: #d1d5db;
  background: #fff;
  color: #374151;
}

.coding-question-editor .btn-sm {
  min-height: 28px;
  padding: 4px 9px;
}

.coding-question-editor .btn-ai {
  border: 0;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: #fff;
}

.coding-question-editor .cq-public-field {
  display: flex;
  align-items: flex-end;
}

.coding-question-editor .cqfpub-label {
  margin: 0 0 9px;
  font-size: 13px;
}

.coding-question-editor .ai-loading-overlay {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 10px;
  background: rgba(245, 243, 255, .82);
  backdrop-filter: blur(2px);
}

.coding-question-editor .ai-loading-ring {
  width: 36px;
  height: 36px;
  border: 3px solid #c4b5fd;
  border-top-color: #4f46e5;
  border-radius: 50%;
  animation: cq-editor-spin .8s linear infinite;
}

.coding-question-editor .ai-loading-text {
  color: #4f46e5;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}

.coding-question-editor .ai-loading-subtext {
  color: #6d28d9;
  font-weight: 400;
}

@keyframes cq-editor-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 640px) {
  .coding-question-editor.ov {
    padding: 8px;
  }

  .coding-question-editor .modal {
    max-height: 98vh;
  }

  .coding-question-editor .frow-m {
    display: block;
  }

  .coding-question-editor .ai-panel-header {
    flex-wrap: wrap;
  }
}

/* Tabs */
.cq-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px;border-bottom:1px solid #e5e7eb;padding-bottom:10px}
.cq-tab{border:1px solid #e5e7eb;background:#f8fafc;color:#334155;border-radius:999px;padding:6px 12px;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.cq-tab.active{background:#4f46e5;border-color:#4f46e5;color:#fff}
.cq-panel[hidden]{display:none!important}
.cq-diff-seg{display:flex;gap:6px}
.cq-diff-btn{flex:1;border:1px solid #e5e7eb;background:#fff;border-radius:8px;padding:8px;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.cq-diff-btn.active{background:#eef2ff;border-color:#818cf8;color:#3730a3}
.cq-diff-select-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.cq-switch-label{display:flex;align-items:center;gap:10px;font-weight:600;cursor:pointer}
.cq-switch{position:relative;width:42px;height:24px;display:inline-block}
.cq-switch input{opacity:0;width:0;height:0}
.cq-switch-ui{position:absolute;inset:0;background:#cbd5e1;border-radius:999px;transition:.2s}
.cq-switch-ui:before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.cq-switch input:checked+.cq-switch-ui{background:#4f46e5}
.cq-switch input:checked+.cq-switch-ui:before{transform:translateX(18px)}
.cq-field-note{font-size:11px;color:#64748b;margin:.35rem 0 0;line-height:1.5}
.cq-warn-note{color:#b45309}
.cq-code-area{font-family:ui-monospace,Consolas,monospace!important;direction:ltr!important;text-align:left}
.cq-tc-host{border:1px solid #e5e7eb;border-radius:10px;padding:12px;background:#f8fafc}
.ctc-row{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:10px;margin-bottom:10px}
.ctc-row-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px}
.ctc-row textarea{width:100%;box-sizing:border-box;margin-top:4px;font-family:ui-monospace,Consolas,monospace}
.cq-test-overlay{position:fixed;inset:0;z-index:600;background:rgba(15,23,42,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.cq-test-overlay[hidden]{display:none!important}
.cq-test-panel{width:min(920px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,.3)}
.cq-test-head,.cq-test-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid #e5e7eb}
.cq-test-foot{border-bottom:0;border-top:1px solid #e5e7eb}
.cq-test-body{padding:16px 18px}
.cq-test-badge{display:inline-block;background:#fef3c7;color:#92400e;font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px}
.cq-test-desc{white-space:pre-wrap;margin:10px 0;line-height:1.7}
.cq-test-hint{background:#eff6ff;border-right:3px solid #3b82f6;padding:8px 10px;border-radius:8px;margin:10px 0}
.coding-question-editor .modal{max-width:860px}
.cq-monaco-host{height:280px;border:1px solid #d1d5db;border-radius:8px;overflow:hidden;background:#fff;direction:ltr}
.cq-monaco-host.cq-monaco-expanded{position:fixed;inset:24px;z-index:700;height:auto;border-radius:12px;box-shadow:0 24px 64px rgba(0,0,0,.35)}
.cq-monaco-toolbar{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.cq-monaco-toolbar select{font:inherit;padding:4px 8px;border-radius:6px;border:1px solid #d1d5db}
.cq-test-monaco{height:220px;margin-bottom:10px}
.cq-test-case-list{padding-right:18px;line-height:1.5}
.cq-test-case-list pre{background:#0f172a;color:#e2e8f0;padding:10px;border-radius:8px;overflow:auto;font-size:12px}
@media(max-width:640px){
  .coding-question-editor .frow-m{flex-direction:column}
  .cq-tabs{gap:4px}
  .cq-tab{font-size:11px;padding:5px 9px}
}