/* 16호 설정집 홈페이지 — 가이드 (PC 가로 기준 · GPT 시안 mock11). 손으로 쓴 정적 파일이다. atlas.css의 .atlas · .parch · .cast-head를 같이 쓴다. */
.gd-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr) minmax(0,1.1fr) minmax(0,1.15fr);gap:calc(var(--u)*1.3);align-items:start;margin-top:calc(var(--u)*1.4)}
.gd-col{display:grid;gap:calc(var(--u)*1.3)}
.gd{padding:calc(var(--u)*1.1) calc(var(--u)*1.3) calc(var(--u)*1.3)}
.parch.gd h2{display:inline-block;margin:0 0 calc(var(--u)*.9);padding:.28em 1.6em .28em 1em;font-size:max(15px,calc(var(--u)*1.08));letter-spacing:.14em;color:#F3E6C2;
  background:linear-gradient(90deg,#6A3FD0,#3B2A66);clip-path:polygon(0 0,100% 0,93% 50%,100% 100%,0 100%)}
.parch.gd h3{margin:calc(var(--u)*.9) 0 calc(var(--u)*.6)}
.parch.gd h2+h3{margin-top:0}
.gd p,.gd-list{margin:0;font-size:max(13px,calc(var(--u)*.84));line-height:1.7;word-break:keep-all}
.gd-list{padding-left:1.1em;display:grid;gap:.45em}
.gtag{display:inline-block;margin-left:.5em;padding:.15em .8em;vertical-align:.25em;font-size:max(11px,calc(var(--u)*.68));color:#F6E7C3;background:#5B3F2A;border-radius:999px}
.gd-note{font-size:max(12px,calc(var(--u)*.78))!important;color:#5B3F2A}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:calc(var(--u)*1.25)}
.steps li{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:calc(var(--u)*.9);padding:calc(var(--u)*.75) calc(var(--u)*.9);background:#F8ECCB99;border:1px solid #8B5A2B88}
.steps li+li::before{content:"";position:absolute;left:calc(50% - var(--u)*.4);top:calc(var(--u)*-.95);border:calc(var(--u)*.4) solid transparent;border-top-color:#5B3F2A}
.steps b{display:grid;place-items:center;width:2em;height:2em;font-family:var(--serif);font-size:max(13px,calc(var(--u)*.9));color:#F6E7C3;background:#3B2A66;border:1px solid #FFC857aa;border-radius:50%}
.steps p{font-family:var(--serif);font-weight:700;font-size:max(14px,calc(var(--u)*.98));line-height:1.5}
.steps li:last-child{background:#FFF1BFcc;outline:2px solid #FFC857;box-shadow:0 0 calc(var(--u)*.9) #FFC85799}
.risk{list-style:none;margin:0 0 calc(var(--u)*.7);padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:calc(var(--u)*.5)}
.risk li{display:grid;place-items:center;padding-bottom:18%;aspect-ratio:1/1.1;font-family:var(--serif);font-weight:800;font-size:max(16px,calc(var(--u)*1.35));color:#F3E6C2;background:#3B2A66;clip-path:polygon(50% 100%,0 70%,0 0,100% 0,100% 70%)}
.risk li.hot{background:#A32222}
.rel{list-style:none;margin:0 0 calc(var(--u)*.7);padding:0;display:flex;flex-wrap:wrap;gap:calc(var(--u)*.4)}
.rel li{padding:.2em .9em;font-size:max(12px,calc(var(--u)*.8));color:#F3E6C2;background:#3B2A66;border-radius:calc(var(--u)*.2)}
.cmds{margin:calc(var(--u)*.7) 0;display:grid;gap:calc(var(--u)*.25)}
.cmds dt{margin-top:calc(var(--u)*.45)}
.cmds dt:first-child{margin-top:0}
.cmds kbd{display:inline-block;padding:.3em 1em;font-family:var(--sans);font-weight:700;font-size:max(13px,calc(var(--u)*.88));letter-spacing:.02em;color:#F3E6C2;background:linear-gradient(#3B2A66,#1B1233);border:1px solid #FFC857aa;border-radius:calc(var(--u)*.3);box-shadow:0 calc(var(--u)*.15) 0 #000a}
.cmds dd{margin:0;font-size:max(13px,calc(var(--u)*.82));line-height:1.6;word-break:keep-all}
@media (max-width:900px){
  .gd-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .gd-col{gap:16px}
  .gd{padding:14px 14px 16px}
  .steps{gap:18px}.steps li+li::before{top:-13px;border-width:6px}
  .risk{max-width:320px}
}
