.guide-layout{display:grid;grid-template-columns:225px minmax(0,1fr);gap:44px;padding-bottom:70px}.guide-sidebar{position:sticky;top:105px;align-self:start;max-height:calc(100vh - 130px);overflow:auto;padding-right:12px}.guide-sidebar label{display:block;font-size:12px;color:var(--muted);margin-bottom:7px}.guide-sidebar input{font-size:12px;margin-bottom:18px}.guide-sidebar nav{display:flex;flex-direction:column}.guide-sidebar a{font-size:12px;color:var(--muted);padding:9px 10px;border-left:1px solid var(--line)}.guide-sidebar a:hover,.guide-sidebar a.active{color:var(--cyan);border-color:var(--cyan);background:#17313b55}.guide-section{padding:32px 0 38px;border-top:1px solid var(--line);scroll-margin-top:105px}.guide-section:first-child{padding-top:0;border-top:0}.guide-section h2{font-size:27px;margin-bottom:23px;letter-spacing:-.6px}.guide-section h3{font-size:18px;margin:26px 0 13px}.guide-section p,.guide-section li{font-size:14px;color:#b6c5d4}.guide-section p{margin:13px 0}.guide-section strong{color:var(--text)}.guide-section ol,.guide-section ul{padding-left:24px}.guide-section li{padding:5px 0 5px 5px}.guide-section li::marker{color:var(--cyan)}.guide-section a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px}.guide-section code{font:12px/1.8 Consolas,monospace;color:#b3eddf;overflow-wrap:anywhere}.guide-section p code,.guide-section li code{padding:2px 5px;background:#14242e;border-radius:3px}.code-wrap{position:relative;margin:18px 0}.guide-section pre{background:#0c1722;border:1px solid var(--line);padding:45px 22px 20px;border-radius:8px;overflow:auto;margin:0;line-height:1.8}.copy-code{position:absolute;right:12px;top:10px;border:1px solid #34525c;background:#122a34;color:var(--cyan);padding:3px 10px;border-radius:4px;font-size:11px;cursor:pointer}.guide-callout{padding:17px 20px;border-left:2px solid var(--cyan);background:#132530;color:#c6dae0;font-size:13px;margin:22px 0}.table-scroll{overflow:auto;margin:20px 0}.guide-section table{border-collapse:collapse;width:100%;min-width:550px;font-size:12px;line-height:1.7}.guide-section th{color:var(--cyan);background:#14242e;text-align:left;padding:13px 15px}.guide-section td{padding:14px 15px;border-bottom:1px solid var(--line);color:#b7c6d4}.guide-section td:first-child{color:var(--text);min-width:125px}.flow-demo{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:24px 0;font-size:12px}.flow-demo span{border:1px solid #335260;padding:8px 12px;border-radius:5px;background:#12232e}.flow-demo b{color:var(--cyan)}.key-demo{border:1px solid #395160;border-radius:8px;padding:18px 22px;margin:24px 0;background:#101d2a}.key-demo>div{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:10px;padding:14px 0;border-bottom:1px solid var(--line);font-size:12px}.key-demo b{color:var(--cyan);font-size:11px}.key-demo small{display:block;color:var(--muted);margin-top:12px;font-size:10px}.builder{border:1px solid #416169;border-radius:10px;padding:22px;background:#10212b;margin:24px 0}.builder-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.builder label{font-size:12px;color:var(--muted)}.builder label:first-child{grid-column:1/-1}.builder input,.builder select{margin-top:7px;font-size:12px}.builder .error{color:#ffbca6;font-size:12px}.checklist{list-style:'✓  '}.guide-empty{padding:32px;border:1px solid var(--line);color:var(--muted)}.print-source{display:none}.guide-article{min-width:0}
@media(max-width:900px){.guide-layout{grid-template-columns:180px minmax(0,1fr);gap:24px}.guide-section h2{font-size:24px}.guide-sidebar a{font-size:11px}}@media(max-width:700px){.guide-layout{display:block}.guide-sidebar{position:static;max-height:none;padding:0;margin-bottom:30px}.guide-sidebar nav{display:grid;grid-template-columns:1fr 1fr;max-height:240px;overflow:auto}.guide-sidebar a{font-size:11px}.guide-section{padding:27px 0}.guide-section h2{font-size:23px}.guide-section p,.guide-section li{font-size:13px}.builder-grid{grid-template-columns:1fr}.builder{padding:16px}.key-demo{padding:10px 12px}.key-demo>div{grid-template-columns:1fr;gap:3px}.guide-section pre{padding:44px 14px 16px}.guide-section code{font-size:11px}}
@media print{.guide-sidebar,.toolbar,.copy-code,.builder{display:none!important}.guide-layout{display:block}.guide-section{break-inside:auto;page-break-inside:auto;padding:20px 0}.guide-section h2,.guide-section h3{break-after:avoid}.guide-section p,.guide-section li,.guide-section td,.guide-section strong{color:#17232c}.guide-section pre{white-space:pre-wrap;background:#f2f5f7;color:#11242a;break-inside:avoid;padding:16px}.guide-section code{color:#123640}.guide-section table{min-width:0}.guide-section a{color:#185765}.print-source{display:block}.page-head{padding:20px 0}}