/* DQUIZES · a cara do sistema (painel e editor).
   Tinta escura e âmbar. Nada a ver com o azul do XQuiz, de propósito. */
:root{
  --tinta:#12131a; --tinta2:#191b24; --tinta3:#22252f; --linha:#2e3240;
  --letra:#eceaf0; --fraco:#9a9aa8; --ambar:#e0a458; --ambar-forte:#f2b76a;
  --verde:#4ba98a; --vermelho:#e5686d; --azul:#6b93d6;
  --raio:12px; --sombra:0 8px 28px rgba(0,0,0,.42);
  --ui:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box;margin:0}
body{background:var(--tinta);color:var(--letra);font-family:var(--ui);font-size:14px;line-height:1.5;
  -webkit-font-smoothing:antialiased}
a{color:var(--ambar);text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--linha);border-radius:99px;border:3px solid var(--tinta)}

/* topo */
.topo{display:flex;align-items:center;gap:14px;padding:0 20px;height:58px;
  background:var(--tinta2);border-bottom:1px solid var(--linha);position:sticky;top:0;z-index:40}
.marca{display:flex;align-items:center;gap:9px;font-weight:700;letter-spacing:-.02em;font-size:16px}
.marca b{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;
  background:var(--ambar);color:#15161d;font-size:15px;font-weight:800}
.topo .cresce{flex:1}

/* botões */
.bt{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:9px;cursor:pointer;
  border:1px solid var(--linha);background:var(--tinta3);color:var(--letra);font-weight:550;
  transition:background .14s,border-color .14s,transform .07s;white-space:nowrap}
.bt:hover{background:#2b2f3b;border-color:#3c4152}
.bt:active{transform:scale(.98)}
.bt.forte{background:var(--ambar);border-color:var(--ambar);color:#15161d;font-weight:650}
.bt.forte:hover{background:var(--ambar-forte);border-color:var(--ambar-forte)}
.bt.risco{color:var(--vermelho);border-color:color-mix(in srgb,var(--vermelho) 34%,transparent)}
.bt.risco:hover{background:color-mix(in srgb,var(--vermelho) 14%,transparent)}
.bt.nu{background:transparent;border-color:transparent}
.bt.nu:hover{background:var(--tinta3)}
.bt.mini{padding:5px 9px;font-size:12.5px}
.bt[disabled]{opacity:.45;pointer-events:none}

/* campos */
.campo{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.campo>span{font-size:12px;font-weight:600;color:var(--fraco);letter-spacing:.02em}
.campo>span i{font-style:normal;font-weight:400;text-transform:none;letter-spacing:0;opacity:.7}
.ent{width:100%;padding:9px 11px;border-radius:9px;background:var(--tinta);border:1px solid var(--linha)}
.ent:focus{outline:none;border-color:var(--ambar)}
textarea.ent{resize:vertical;min-height:66px;line-height:1.5}
.linha2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.marca-cx{display:flex;align-items:center;gap:9px;cursor:pointer;padding:7px 0;font-size:13.5px}
.marca-cx input{width:16px;height:16px;accent-color:var(--ambar);cursor:pointer}

/* etiquetas */
.tag{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:99px;
  font-size:11.5px;font-weight:650;letter-spacing:.02em}
.tag.no-ar{background:color-mix(in srgb,var(--verde) 18%,transparent);color:#7fdcb9}
.tag.rascunho{background:var(--tinta3);color:var(--fraco)}

.vazio{padding:48px 20px;text-align:center;color:var(--fraco)}
.vazio h3{color:var(--letra);margin-bottom:7px;font-size:16px}
.mono{font-family:var(--mono);font-size:12.5px}
.fraco{color:var(--fraco)}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ── caixas de diálogo próprias ────────────────────────────────────────
   ⛔ prompt() e confirm() do navegador são caixas do sistema operacional:
   feias, fora da identidade, e travam a página inteira. Isto substitui. */
.dlg{position:fixed;inset:0;background:rgba(6,7,11,.72);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;z-index:400;padding:20px}
.dlg-caixa{width:100%;max-width:400px;background:var(--tinta2);border:1px solid var(--linha);
  border-radius:16px;padding:26px;box-shadow:0 22px 60px rgba(0,0,0,.6);animation:dlgSobe .16s ease}
@keyframes dlgSobe{from{transform:translateY(10px) scale(.98);opacity:0}}
.dlg-caixa h3{font-size:17px;font-weight:700;letter-spacing:-.02em;margin-bottom:7px}
.dlg-caixa p{font-size:13.5px;color:var(--fraco);line-height:1.6;margin-bottom:18px}
.dlg-caixa .ent{margin-bottom:18px}
.dlg-bts{display:flex;gap:9px;justify-content:flex-end}