/* DX 문제은행 최신 시험 — qbank-latest.css (그림자 없음 · 직각 · 테마 변수 사용 · 다크모드는 변수가 따라감) */
.dxql-main[hidden],.dxql-side[hidden],.dxql-item[hidden]{display:none!important}
.dxql-main *,.dxql-side *{box-sizing:border-box}
.dxql-main a,.dxql-side a{text-decoration:none}

/* 배경색 없음 — 테두리만 (직각) */
.dxql-facts{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:10.5px;font-weight:700}
.dxql-facts span{display:inline-flex;align-items:baseline;gap:4px}
.dxql-facts b{font-size:13px;font-weight:900;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.dxql-kind{display:block;font-size:9.5px;font-weight:900;letter-spacing:.16em}
.dxql-go{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:900;letter-spacing:-.01em}
.dxql-go i{font-size:10px;font-style:normal;transition:transform .25s}

/* ── 메인 섹션: 같은 크기의 시험지 카드 (테두리만, 직각) ── */
.dxql-main{margin:0}
.dxql-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.dxql-n1{grid-template-columns:minmax(0,1fr)}
.dxql-n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.dxql-n3,.dxql-n6,.dxql-n9{grid-template-columns:repeat(3,minmax(0,1fr))}
.dxql-n5{grid-template-columns:repeat(5,minmax(0,1fr))}
.dxql-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--text-main,#1d211d);border-radius:0;background:#fff;color:var(--text-main,#1d211d)}
.dxql-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 16px;border-bottom:1px solid var(--border,#dedfd5);font-size:10px;font-weight:900;letter-spacing:.14em}
.dxql-tries{letter-spacing:0;font-weight:700;color:var(--text-muted,#777c70)}
.dxql-body{flex:1 1 auto;display:flex;flex-direction:column;gap:8px;padding:18px 16px 16px;min-height:112px}
.dxql-title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:17px;line-height:1.35;font-weight:900;letter-spacing:-.05em}
.dxql-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12.5px;line-height:1.55;font-weight:500;color:var(--text-muted,#777c70)}
.dxql-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--border,#dedfd5)}
.dxql-stats span{display:flex;flex-direction:column;gap:2px;padding:10px 12px;min-width:0}
.dxql-stats span+span{border-left:1px solid var(--border,#dedfd5)}
.dxql-stats b{font-size:15px;font-weight:900;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.dxql-stats small{font-size:10px;font-weight:700;color:var(--text-muted,#777c70)}
.dxql-card .dxql-go{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;border-top:1px solid var(--text-main,#1d211d);font-size:12px;font-weight:900;letter-spacing:-.01em;transition:background .2s,color .2s}
.dxql-card .dxql-go i{font-size:11px;font-style:normal;transition:transform .25s}
.dxql-card:hover .dxql-go{background:var(--text-main,#1d211d);color:var(--bg-card,#fff)}
.dxql-card:hover .dxql-go i{transform:translateX(4px)}
@media(max-width:1100px){
  .dxql-grid,.dxql-n3,.dxql-n5,.dxql-n6,.dxql-n9{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dxql-n1{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:560px){
  .dxql-grid,.dxql-n2,.dxql-n3,.dxql-n5,.dxql-n6,.dxql-n9{grid-template-columns:minmax(0,1fr);gap:12px}
}

/* ── 사이드바 박스: 박스 1개에 시험 1개 (new-basic 사이드 블록과 같은 평면 스타일) ── */
.dxql-side{border-top:1px solid var(--text-main,#1d211d);padding-top:14px;margin:0 0 24px}
.dxql-side-h{margin:0 0 12px;font-size:14px;font-weight:900;letter-spacing:-.03em;color:var(--text-main,#1d211d)}
.dxql-side-h small{margin-left:6px;font-size:9px;font-weight:800;letter-spacing:.12em;color:var(--text-muted,#777c70)}
.dxql-item{display:flex;flex-direction:column;gap:8px;padding:16px 16px 14px;border:1px solid var(--text-main,#1d211d);border-radius:0;background:#fff;color:var(--text-main,#1d211d)}
.dxql-item .dxql-kind{color:var(--text-muted,#777c70)}
.dxql-it{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:16px;line-height:1.38;font-weight:900;letter-spacing:-.05em}
.dxql-id{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.55;font-weight:500;color:var(--text-muted,#777c70)}
.dxql-item .dxql-facts{padding-top:9px;border-top:1px solid var(--border,#dedfd5)}
.dxql-item:hover .dxql-go i{transform:translateX(4px)}
.dxql-item:hover .dxql-it{text-decoration:underline}
.dxql-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}
.dxql-shuffle{appearance:none;-webkit-appearance:none;margin:0;padding:6px 0 3px;border:0;border-bottom:1px solid var(--text-main,#1d211d);border-radius:0;background:transparent;font:inherit;font-size:11px;font-weight:850;color:var(--text-main,#1d211d);cursor:pointer}
.dxql-shuffle i{font-size:10px;margin-right:3px}
.dxql-all{display:inline-block;padding:6px 0 3px;font-size:11px;font-weight:850;color:var(--text-muted,#777c70)}
.dxql-shuffle:hover,.dxql-all:hover{opacity:.6}
/* 사이드바가 숨겨지는 화면(모바일)에서는 본문 아래에 붙음 */
.dxql-side.dxql-m{margin:28px 0 0;padding-top:14px}
body.dark .dxql-card,body.dark .dxql-item,html.dark .dxql-card,html.dark .dxql-item,[data-theme=dark] .dxql-card,[data-theme=dark] .dxql-item{background:var(--bg-card,#1e293b)}
body.dark .dxql-card .dxql-title,body.dark .dxql-card .dxql-no,body.dark .dxql-card .dxql-stats b,body.dark .dxql-card .dxql-go,html.dark .dxql-card .dxql-title,html.dark .dxql-card .dxql-no,html.dark .dxql-card .dxql-stats b,html.dark .dxql-card .dxql-go,[data-theme=dark] .dxql-card .dxql-title,[data-theme=dark] .dxql-card .dxql-no,[data-theme=dark] .dxql-card .dxql-stats b,[data-theme=dark] .dxql-card .dxql-go{color:#eef1ee!important}
body.dark .dxql-card .dxql-desc,body.dark .dxql-card .dxql-tries,body.dark .dxql-card .dxql-stats small,html.dark .dxql-card .dxql-desc,html.dark .dxql-card .dxql-tries,html.dark .dxql-card .dxql-stats small,[data-theme=dark] .dxql-card .dxql-desc,[data-theme=dark] .dxql-card .dxql-tries,[data-theme=dark] .dxql-card .dxql-stats small{color:#a4acb6!important}
body.dark .dxql-card:hover .dxql-go,html.dark .dxql-card:hover .dxql-go,[data-theme=dark] .dxql-card:hover .dxql-go{background:#eef1ee;color:#11151c!important}
@media(max-width:560px){.dxql-body{min-height:0}}
