.qg-entry-links { display:flex; flex-wrap:wrap; align-items:center; gap:10px 22px; }
.qg-entry { display:inline-flex; align-items:center; gap:6px; padding:5px 9px; background:#f3f7fa; color:#244867; border:1px solid #c6d5e2; border-radius:5px; font:600 12px/1.4 var(--sans,sans-serif); }
.qg-entry svg { width:15px; height:15px; }
.course-intro .qg-entry { margin-top:12px; }
#quickGuide { position:fixed; box-sizing:border-box; width:min(780px,calc(100vw - 24px)); max-height:calc(100dvh - 28px); overflow:auto; margin:auto; padding:0; border:1px solid #aabbc9; border-radius:12px; background:#fff; color:#1d364e; box-shadow:0 18px 75px #0b253c35; font-family:var(--sans,sans-serif); }
#quickGuide::backdrop { background:#152e4466; }
.qg-head { position:static; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:15px 22px; color:#fff; background:#193951; }
.qg-head h2 { color:inherit; font:600 20px/1.3 var(--sans,sans-serif); margin:0; }
.qg-head .qg-close { padding:0; min-width:32px; min-height:32px; border:1px solid #7390a5; border-radius:5px; background:transparent; color:white; font-size:21px; }
.qg-layout { display:grid; grid-template-columns:165px minmax(0,1fr); }
.qg-selector { margin:0; padding:20px 12px; min-width:0; border:0; border-right:1px solid #d8e2ea; background:#f3f7fa; }
.qg-selector legend { float:left; margin:0 0 12px 6px; font-weight:650; font-size:12px; color:#537089; }
.qg-choices { clear:both; display:grid; gap:3px; }
.qg-choice { display:flex; align-items:center; position:relative; cursor:pointer; }
.qg-choice input { position:absolute; opacity:0; width:1px; height:1px; }
.qg-choice span { padding:9px; width:100%; border:1px solid transparent; border-radius:6px; font-weight:550; font-size:13px; }
.qg-choice input:checked + span { background:#dceaf6; border-color:#b4cadd; color:#153e63; }
.qg-choice input:focus-visible + span { outline:2px solid #36658d; }
.qg-content { min-width:0; padding:clamp(15px,3vw,26px); }
.qg-content .qg-title { margin:0 0 5px; font:650 clamp(19px,3vw,25px)/1.2 var(--sans,sans-serif); color:#193951; text-transform:none; }
.qg-content :is(.qg-intent,.qg-observe,.qg-procedure,.qg-error) { font-size:14px; line-height:1.55; margin:10px 0; }
.qg-source { margin:14px 0; border-radius:7px; overflow:hidden; background:#173248; color:#e3f1f9; }
.qg-file { display:block; padding:6px 12px; background:#25465f; font:11px/1.4 var(--mono,monospace); color:#c6e0f1; }
.qg-source pre { overflow-x:auto; margin:0; padding:12px; color:inherit; background:transparent; }
.qg-source code { color:inherit; background:transparent; font:12px/1.55 var(--mono,monospace); }
.qg-procedure { padding-left:1.45em; }
.qg-procedure li+li { margin-top:5px; }
.qg-content .qg-observe { padding:8px 11px; border-left:3px solid #6193ba; background:#f0f6fa; }
.qg-content .qg-open { margin-top:4px; min-height:35px; padding:6px 12px; }
.qg-error { color:#a42d35; }
@media (max-width:620px) {
  .qg-layout { grid-template-columns:minmax(0,1fr); }
  .qg-selector { border:0; border-bottom:1px solid #d8e2ea; padding:9px 12px; }
  .qg-selector legend { margin:0 0 4px 0; }
  .qg-choices { display:flex; flex-wrap:wrap; gap:2px; }
  .qg-choice span { padding:5px 7px; }
  .qg-head { padding:9px 14px; }
}