/* 프로토콜 페이지 전용 (guide.css 위에 덧씌움) */
.doc.proto{ max-width:900px; }
.pmeta{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.pmeta > span{ background:var(--panel); border:1px solid var(--line); border-radius:999px; padding:4px 12px; font-size:13px; color:var(--dim); }
.pmeta b{ color:var(--text); }
.toc{ display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13.5px; margin:14px 0 4px; }
.toc a{ color:var(--faint); text-decoration:none; } .toc a:hover{ color:var(--brand); }
.keypts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin:12px 0; padding:0; list-style:none; }
.keypts li{ background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 14px; margin:0; font-size:14.5px; }
.mats{ columns:2 260px; padding-left:18px; }
.mats li{ break-inside:avoid; font-size:14.5px; }

/* 단계 체크리스트 */
.stepwrap{ counter-reset:st; }
.steps{ list-style:none; padding:0; margin:12px 0; }
.steps li{ counter-increment:st; position:relative; background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 14px 10px 50px; margin:8px 0; transition:opacity .15s; }
.steps li::before{ content:counter(st); position:absolute; left:12px; top:10px; width:26px; height:26px; border-radius:50%; background:#1d1d28; color:var(--brand); font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center; }
.steps label{ display:flex; gap:10px; align-items:flex-start; cursor:pointer; color:var(--text); font-size:15px; line-height:1.65; }
.steps input{ margin-top:5px; width:17px; height:17px; accent-color:var(--brand); flex:0 0 auto; }
.steps .tm{ display:inline-block; font-size:12px; color:#15110a; background:var(--brand); border-radius:6px; padding:0 7px; margin-left:6px; font-weight:700; white-space:nowrap; }
.steps .tip{ display:block; color:var(--faint); font-size:13.5px; margin:4px 0 0 27px; line-height:1.6; }
.steps li.done{ opacity:.5; }
.steps li.done label{ text-decoration:line-through; text-decoration-color:var(--faint); }
.stepbar{ display:flex; gap:8px; justify-content:flex-end; }
.btn2{ background:transparent; border:1px solid var(--line); color:var(--dim); border-radius:8px; padding:6px 12px; font-size:13px; cursor:pointer; font-family:inherit; }
.btn2:hover{ border-color:var(--brand); color:var(--brand); }

/* 계산 (마스터믹스) */
.mixin{ display:flex; flex-wrap:wrap; gap:12px; margin:8px 0; }
.mixin label, .pw-f{ display:flex; flex-direction:column; gap:4px; font-size:12.5px; color:var(--faint); }
.mixin input, .pw-f input, .pw-f select{ background:#0f0f16; border:1px solid var(--line); color:var(--text); border-radius:8px; padding:8px 10px; font-size:14.5px; font-family:inherit; min-width:0; }
.mixin input{ width:120px; }
.mixin input:focus, .pw-f input:focus, .pw-f select:focus{ outline:none; border-color:var(--brand); }

/* 변수 탐색 */
.vars{ background:linear-gradient(180deg, rgba(245,184,65,.06), transparent 160px); border:1px solid var(--line); border-radius:14px; padding:16px; margin:14px 0; }
.var-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.var-chip{ background:var(--panel); border:1px solid var(--line); color:var(--dim); border-radius:999px; padding:7px 14px; font-size:14px; cursor:pointer; font-family:inherit; }
.var-chip:hover{ border-color:var(--brand); color:var(--text); }
.var-chip.on{ background:var(--brand); color:#15110a; border-color:var(--brand); font-weight:700; }
.var-chip .sim{ font-size:11px; margin-left:4px; opacity:.8; }
.var-pane h3{ margin:4px 0 10px; }
.effects{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; margin:0 0 14px; }
.effects div{ background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:14px; color:var(--dim); line-height:1.6; }
.effects b{ display:block; font-size:12px; letter-spacing:.03em; margin-bottom:3px; }
.effects .lo b{ color:#7fb2ff; } .effects .hi b{ color:#ff9f7a; } .effects .ok b{ color:var(--ok); } .effects .what b{ color:var(--brand); }

/* 시뮬레이터 */
.pw{ background:#0f0f16; border:1px solid var(--line); border-radius:12px; padding:14px; }
.pw-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-bottom:12px; }
.pw-wide{ grid-column:1 / -1; }
.pw-out svg{ display:block; width:100%; max-width:620px; height:auto; margin:0 auto; }
.pw-verdict{ margin-top:10px; }
.pw-verdict p{ margin:5px 0; font-size:14.5px; color:var(--text); }
.pw-small, .pw-concept, .pw-calc{ font-size:12.5px; color:var(--faint); margin-top:8px; line-height:1.6; }
.pw-concept::before{ content:"ⓘ "; } .pw-calc::before{ content:"✓ "; color:var(--ok); }
.pw-kv{ display:flex; flex-wrap:wrap; gap:8px 18px; margin-bottom:8px; font-size:14px; color:var(--dim); }
.pw-kv b{ color:var(--text); }
.pw-t{ margin:6px 0; }
.pw-two{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px; }
.pw-dots{ color:var(--brand); letter-spacing:2px; font-size:15px; }

.cta .ctal{ display:flex; flex-wrap:wrap; gap:8px; }
.cta .ctal a{ white-space:normal; }
.var-chip .sim i{ font-style:normal; }
.trouble td:first-child{ color:var(--text); font-weight:600; }
.safety{ border-left:3px solid #ff7a7a; }
.plist{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:12px; margin:12px 0 24px; }
.plist a{ display:block; background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:14px 16px; text-decoration:none; }
.plist a:hover{ border-color:var(--brand); }
.plist b{ display:block; color:var(--text); font-size:15.5px; margin-bottom:4px; }
.plist em span{ display:inline; }
.plist > a > span{ display:block; color:var(--dim); font-size:13.5px; line-height:1.55; }
.plist em{ display:block; font-style:normal; font-size:11.5px; color:var(--brand); margin-top:6px; }

@media print{
  body{ background:#fff; color:#000; } .sn-bar, .sn-foot, .vars, .stepbar, .toc, .related, .cta, footer, ins{ display:none !important; }
  .steps li{ background:#fff; border-color:#ccc; } .steps label, p, li, td{ color:#000 !important; } .steps li.done{ opacity:1; }
}
@media (max-width:600px){
  .steps li{ padding-left:44px; } .steps li::before{ left:9px; }
  .vars{ padding:12px; } .pw{ padding:10px; }
}
.proto h1 span{ display:block; font-size:.55em; color:var(--faint); font-weight:600; margin-top:4px; }