/* Guides du wiki (blocs « spg ») : styles repris du guide imprimable, adaptés au site. Généré, puis surchargé plus bas. */
.spg h3 { font-family: var(--sans); font-weight: 600; font-size: 1.1rem; margin: 0 0 0.591rem; text-transform: uppercase; letter-spacing: .3px; display: flex; align-items: center; gap: 0.472rem; color: var(--text); }
.spg .g-card { background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; padding: 0.945rem; }
.spg .g-card.g-small { padding: 0.709rem 0.827rem; }
.spg .g-mt { margin-top: 0.945rem; }
.spg .g-mt3 { margin-top: 0.472rem; }
.spg .g-g2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-g3 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-g2w { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-g2w.g-r { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); }
.spg .g-g3w { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-note { color: #c9c4bc; font-size: 0.88rem; margin: 0.472rem 0 0; }
.spg .g-muted { color: var(--text2); font-size: 0.825rem; }
.spg .g-row { display: flex; align-items: center; gap: 0.591rem; margin: 0.354rem 0; }
.spg .g-row.g-wrap { flex-wrap: wrap; }
.spg .g-center { display: flex; align-items: center; justify-content: center; }
.spg svg.g-i { vertical-align: middle; flex: none; }
.spg .g-fa { color: var(--text2); }
.spg ul.g-ticks { list-style: none; padding: 0; margin: 0.236rem 0 0; }
.spg ul.g-ticks li { position: relative; padding-left: 1.181rem; margin: 0.283rem 0; font-size: 0.898rem; }
.spg ul.g-ticks li:before { content: ""; left: 0; top: 0.378rem; width: 0.52rem; height: 0.52rem; border-radius: 50%; background: var(--g-amber); }
.spg ul.g-ticks.g-x li:before { background: var(--g-accent); border-radius: 1px; }
.spg .g-key { display: inline-flex; align-items: center; justify-content: center; min-width: 1.89rem; height: 1.771rem; padding: 0 0.425rem; border-radius: 0.378rem; background: linear-gradient(var(--line2),var(--line)); border: 1px solid #4a5150; border-bottom-width: 2.5px; font-family: var(--sans); font-weight: 700; font-size: 0.962rem; color: var(--text); margin-right: 0.236rem; white-space: nowrap; }
.spg .g-key.g-wide { padding: 0 0.591rem; }
.spg .g-mat { display: inline-flex; align-items: center; gap: 0.236rem; background: var(--raised); border: 1px solid var(--line2); border-left: 3px solid var(--mc); border-radius: 0.331rem; padding: 0.142rem 0.425rem 0.142rem 0.283rem; margin: 0.142rem 0.236rem 0.142rem 0; color: var(--mc); font-size: 0.917rem; white-space: nowrap; }
.spg .g-mat b { color: var(--text); font-family: var(--sans); font-size: 1.008rem; }
.spg .g-mat.g-big { padding: 0.283rem 0.567rem 0.283rem 0.378rem; }
.spg .g-mat.g-big b { font-size: 1.283rem; }
.spg .g-na { color: var(--text3); }
.spg .g-chip { display: flex; align-items: center; gap: 0.591rem; background: var(--panel); border: 1px solid var(--line); border-left: 4px solid var(--cc, var(--g-amber)); border-radius: 0.591rem; padding: 0.591rem 0.709rem; color: var(--cc, var(--g-amber)); }
.spg .g-chip .g-v { font-family: var(--sans); font-weight: 700; font-size: 1.742rem; line-height: 1; color: var(--text); }
.spg .g-chip .g-l { font-size: 0.761rem; text-transform: uppercase; letter-spacing: .4px; color: var(--text2); margin-top: 0.142rem; }
.spg .g-chips4 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.709rem; }
.spg .g-chips2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.709rem; }
.spg .g-chips-row { display: grid; grid-template-columns: repeat(4,minmax(0, 1fr)); gap: 0.945rem; margin-top: 1.181rem; }
.spg img.g-picto { width: 3.071rem; height: 3.071rem; object-fit: contain; }
.spg img.g-shot { width: 100%; border-radius: 0.472rem; border: 1px solid var(--line); display: block; }
.spg svg.g-diag { width: 100%; height: auto; display: block; }
.spg svg .g-dl { font: 600 9px var(--sans); fill: var(--text); }
.spg svg .g-ds { font: 8px var(--sans); fill: #a9b1ba; }
.spg svg .g-pl { font: 700 10px var(--sans); text-anchor: middle; fill: #10140f; }
.spg svg .g-pv { font: 700 10px var(--sans); fill: var(--text); }
.spg svg .g-ax { font: 8.5px var(--sans); fill: var(--text3); }
.spg svg .g-tl { font: 700 12px var(--sans); fill: var(--text); letter-spacing: .5px; }
.spg svg .g-wt { font: 700 13px var(--sans); fill: var(--text); text-anchor: middle; letter-spacing: .6px; }
.spg svg .g-ws { font: 8.5px var(--sans); fill: #c9c4bc; text-anchor: middle; }
.spg .g-journey { display: flex; align-items: stretch; gap: 0.236rem; margin-top: 0.472rem; }
.spg .g-jstep { flex: 1; background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; padding: 0.945rem 0.709rem; text-align: center; position: relative; }
.spg .g-jn { top: 0.472rem; left: 0.709rem; font-family: var(--sans); font-weight: 800; color: var(--g-accent); font-size: 1.192rem; }
.spg .g-jico { color: var(--g-amber); margin: 0.472rem auto 0.472rem; display: block; }
.spg .g-jt { font-family: var(--sans); font-weight: 700; font-size: 1.146rem; text-transform: uppercase; }
.spg .g-jd { color: var(--text2); font-size: 0.825rem; margin-top: 0.236rem; }
.spg .g-jarrow { display: flex; align-items: center; color: var(--text3); }
.spg .g-toc { display: grid; grid-template-columns: repeat(4,minmax(0, 1fr)); gap: 0.591rem; margin-top: 1.181rem; }
.spg .g-toc a { display: flex; align-items: center; gap: 0.709rem; background: var(--deep); border: 1px solid var(--line); border-radius: 0.591rem; padding: 0.614rem 0.709rem; color: var(--text); text-decoration: none; }
.spg .g-toc .g-tn { font-family: var(--sans); font-weight: 800; color: var(--g-accent); font-size: 1.192rem; min-width: 1.89rem; }
.spg .g-toc .g-tt { flex: 1; font-size: 0.917rem; }
.spg .g-toc .g-tp { color: var(--text2); font-size: 0.825rem; }
.spg .g-eq { display: flex; align-items: center; gap: 0.472rem; flex-wrap: wrap; }
.spg .g-op { font-family: var(--sans); font-size: 1.65rem; color: var(--text2); }
.spg .g-kitbox { display: inline-flex; flex-direction: column; align-items: center; color: var(--g-amber); font-family: var(--sans); font-weight: 700; text-align: center; font-size: 0.917rem; }
.spg .g-keys > div { display: flex; align-items: center; gap: 0.591rem; margin: 0.52rem 0; }
.spg .g-keys span { font-size: 0.917rem; }
.spg .g-holo { display: flex; gap: 0.709rem; align-items: center; margin-top: 0.945rem; background: var(--deep); border-radius: 0.472rem; padding: 0.472rem; font-size: 0.871rem; }
.spg .g-holo img { width: 5.669rem; }
.spg svg.g-wheel { width: 100%; max-width: 19.368rem; }
.spg .g-strip { margin-top: 1.181rem; }
.spg .g-flow { display: flex; align-items: center; gap: 0.709rem; }
.spg .g-flow > div { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.236rem; color: var(--g-amber); }
.spg .g-flow > div b { color: var(--text); font-size: 0.962rem; }
.spg .g-flow > div span { color: var(--text2); font-size: 0.807rem; }
.spg .g-flow > svg { flex: none; }
.spg .g-flow.g-tight { margin: 0.709rem 0 0.472rem; }
.spg .g-mini-warn { margin-top: 0.709rem; color: #c9c4bc; font-size: 0.871rem; display: flex; gap: 0.472rem; align-items: center; }
.spg .g-terr .g-g2.g-small { margin-top: 0.945rem; gap: 0.945rem; }
.spg .g-pieces { display: grid; grid-template-columns: repeat(3,minmax(0, 1fr)); gap: 0.945rem; }
.spg .g-pgroup { background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; padding: 0.709rem; }
.spg .g-pgh { font-family: var(--sans); font-weight: 700; text-transform: uppercase; color: var(--g-amber); font-size: 0.962rem; margin-bottom: 0.472rem; }
.spg .g-ptiles { display: flex; flex-wrap: wrap; gap: 0.472rem; }
.spg .g-ptile { width: 5.196rem; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.236rem; font-size: 0.761rem; color: #d8d3cb; background: var(--deep); border-radius: 0.472rem; padding: 0.472rem 0.236rem; }
.spg .g-tiers { display: grid; grid-template-columns: repeat(4,minmax(0, 1fr)); gap: 0.945rem; }
.spg .g-tier { background: var(--panel); border: 1px solid var(--line); border-top: 5px solid var(--tc); border-radius: 0.709rem; padding: 0.709rem; display: flex; flex-direction: column; gap: 0.378rem; }
.spg .g-th { font-family: var(--sans); font-weight: 800; font-size: 1.375rem; text-transform: uppercase; color: var(--tc); }
.spg .g-tier img { width: 100%; height: 8.503rem; object-fit: cover; border-radius: 0.472rem; }
.spg .g-tv { font-family: var(--sans); font-weight: 800; font-size: 2.017rem; line-height: 1; }
.spg .g-tv small { font-size: 0.917rem; color: var(--text2); }
.spg .g-hpbar { height: 0.567rem; background: var(--line); border-radius: 0.472rem; overflow: hidden; }
.spg .g-hpbar i { display: block; height: 100%; }
.spg .g-hpbar.g-inf i { background-image: repeating-linear-gradient(45deg,rgba(255,255,255,.25) 0 3px,transparent 3px 7px) !important; }
.spg .g-tl { color: var(--text2); font-size: 0.779rem; text-transform: uppercase; letter-spacing: .4px; }
.spg .g-trec { min-height: 3.071rem; }
.spg .g-ttools { color: #ddd; display: flex; gap: 0.472rem; }
.spg .g-traid { font-size: 0.825rem; color: #c9c4bc; }
.spg .g-ladder { display: flex; flex-direction: column; gap: 0.283rem; }
.spg .g-ladder span { border-left: 4px solid var(--tc); padding-left: 0.472rem; font-size: 0.917rem; }
.spg table.g-costs { width: 100%; border-collapse: separate; border-spacing: 0 0.283rem; }
.spg table.g-costs th { font-family: var(--sans); text-transform: uppercase; font-size: 1.008rem; color: var(--tc); text-align: left; padding: 0 0.472rem; border-bottom: 3px solid var(--tc); }
.spg table.g-costs td { background: var(--panel); padding: 0.189rem 0.472rem; vertical-align: middle; }
.spg table.g-costs td:first-child { border-radius: 0.472rem 0 0 0.472rem; }
.spg table.g-costs td:last-child { border-radius: 0 0.472rem 0.472rem 0; }
.spg td.g-pn { display: flex; align-items: center; gap: 0.472rem; font-size: 0.88rem; width: 14.644rem; }
.spg td.g-pn img.g-picto { width: 1.89rem; height: 1.89rem; }
.spg td.g-pn small { color: var(--text2); }
.spg .g-costs .g-mat { font-size: 0.825rem; margin: 0.071rem 0.189rem 0.071rem 0; padding: 0.071rem 0.331rem 0.071rem 0.236rem; }
.spg .g-costs .g-mat b { font-size: 0.917rem; }
.spg .g-costs .g-mat svg { width: 14px; height: 14px; }
.spg .g-machines { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr); gap: 0.709rem; margin-top: 0.591rem; }
.spg .g-machines > div { background: var(--deep); border: 1px solid var(--line); border-radius: 0.472rem; padding: 0.354rem 0.591rem; display: flex; align-items: center; gap: 0.472rem; flex-wrap: wrap; font-size: 0.871rem; }
.spg .g-machines .g-mat { font-size: 0.825rem; padding: 0.047rem 0.283rem 0.047rem 0.213rem; }
.spg .g-machines .g-mat svg { width: 14px; height: 14px; }
.spg .g-legend { display: flex; flex-wrap: wrap; gap: 0.236rem 0.945rem; margin-top: 0.591rem; font-size: 0.779rem; color: var(--text2); }
.spg .g-legend .g-mat { margin: 0; padding: 0.047rem 0.236rem; }
.spg .g-tchain { display: flex; align-items: center; gap: 0.709rem; margin: 0.472rem 0 0.236rem; }
.spg .g-tstep { flex: 1; text-align: center; font-family: var(--sans); font-weight: 800; text-transform: uppercase; font-size: 1.283rem; padding: 0.709rem; border-radius: 0.591rem; background: var(--deep); border: 2px solid var(--tc); color: var(--tc); }
.spg .g-howto { display: flex; gap: 0.709rem; align-items: flex-start; background: var(--deep); border-radius: 0.591rem; padding: 0.709rem; font-size: 0.917rem; }
.spg .g-hn { font-family: var(--sans); font-weight: 800; font-size: 1.65rem; color: var(--g-accent); line-height: 1; }
.spg .g-tools-line { margin-top: 0.709rem; font-size: 0.852rem; color: #c9c4bc; display: flex; align-items: center; gap: 0.283rem; flex-wrap: wrap; }
.spg .g-window10 { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); gap: 0; border-radius: 0.591rem; overflow: hidden; }
.spg .g-w-on { background: rgba(92,184,92,.13); border: 1px solid rgba(92,184,92,.5); padding: 0.709rem 0.945rem; border-radius: 0.591rem 0 0 0.591rem; }
.spg .g-w-off { background: var(--deep); border: 1px solid var(--line); border-left: 0; padding: 0.709rem 0.945rem; border-radius: 0 0.591rem 0.591rem 0; }
.spg .g-mini { background: var(--deep); border-radius: 0.472rem; padding: 0.52rem 0.709rem; font-size: 0.871rem; display: flex; gap: 0.472rem; align-items: center; }
.spg table.g-raid { width: 100%; border-collapse: separate; border-spacing: 0 0.331rem; }
.spg table.g-raid th { font-family: var(--sans); font-size: 0.917rem; text-transform: uppercase; color: var(--text2); text-align: center; font-weight: 600; }
.spg table.g-raid th:first-child { text-align: left; }
.spg table.g-raid td { background: var(--panel); text-align: center; font-family: var(--sans); font-size: 1.192rem; padding: 0.378rem 0.472rem; }
.spg td.g-tn { text-align: left !important; font-family: var(--sans) !important; font-size: 0.917rem !important; border-left: 4px solid var(--tc); border-radius: 0.472rem 0 0 0.472rem; }
.spg td.g-tn small { display: block; color: var(--text2); font-size: 0.733rem; }
.spg td.g-pips { text-align: left !important; }
.spg td.g-pips div { display: inline-flex; gap: 0.165rem; vertical-align: middle; margin-right: 0.472rem; }
.spg td.g-pips i { width: 0.803rem; height: 1.087rem; background: var(--g-accent); border-radius: 0.142rem; display: inline-block; }
.spg td.g-pips b { color: var(--text); }
.spg tr.g-immune td { color: var(--g-accent); letter-spacing: 3px; font-weight: 800; }
.spg .g-softside { display: grid; grid-template-columns: minmax(0, 1fr) 2.126rem minmax(0, 1fr); align-items: stretch; margin: 0.472rem 0 0.709rem; height: 5.196rem; }
.spg .g-side { display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 0.472rem; font-size: 0.825rem; text-align: center; }
.spg .g-side b { font-family: var(--sans); font-size: 1.192rem; }
.spg .g-side span { color: var(--text2); }
.spg .g-side.g-out { background: var(--deep); }
.spg .g-side.g-in { background: rgba(201,99,74,.16); border: 1px solid rgba(201,99,74,.5); color: #ffb3a8; }
.spg .g-wallcut { background: repeating-linear-gradient(0deg,#8a5a32 0 5px,#6e4425 5px 9px); border-radius: 0.236rem; }
.spg .g-cmp > div { display: grid; grid-template-columns: 1.653rem minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 0.472rem; background: var(--deep); border-radius: 0.472rem; padding: 0.472rem 0.709rem; margin: 0.354rem 0; color: var(--g-amber); }
.spg .g-cmp b { color: var(--text); font-size: 0.917rem; }
.spg .g-cmp .g-o { color: #ddd; font-family: var(--sans); font-size: 1.192rem; text-align: center; }
.spg .g-cmp .g-i2 { color: #ff8b7d; font-family: var(--sans); font-size: 1.192rem; text-align: center; font-weight: 700; }
.spg table.g-matrix { width: 100%; border-collapse: separate; border-spacing: 0.283rem; }
.spg table.g-matrix th { font-size: 0.825rem; color: var(--text2); font-weight: 600; }
.spg table.g-matrix td { text-align: center; padding: 0.472rem; border-radius: 0.378rem; font-family: var(--sans); font-size: 1.008rem; }
.spg table.g-matrix td:first-child { text-align: left; border-left: 4px solid var(--tc); background: var(--panel); font-family: var(--sans); font-size: 0.917rem; }
.spg td.g-y { background: rgba(201,99,74,.25); color: #ffb3a8; }
.spg td.g-m { background: rgba(166,132,89,.2); color: #f6c983; }
.spg td.g-n { background: rgba(92,184,92,.15); color: #9fd89f; }
.spg .g-mult { font-size: 0.88rem; margin: 0.331rem 0; padding: 0.331rem 0.567rem; background: var(--deep); border-radius: 0.378rem; }
.spg .g-mult b { color: var(--g-amber); font-family: var(--sans); font-size: 1.008rem; margin-right: 0.354rem; }
.spg .g-slots { display: grid; grid-template-columns: repeat(6,minmax(0, 1fr)); gap: 0.472rem; }
.spg .g-slot { background: var(--deep); border-radius: 0.472rem; padding: 0.472rem 0.236rem; display: flex; flex-direction: column; align-items: center; text-align: center; color: var(--g-amber); }
.spg .g-slot b { color: var(--text); font-family: var(--sans); font-size: 1.375rem; }
.spg .g-slot span { font-size: 0.733rem; color: var(--text2); }
.spg .g-warnc { display: block; margin-top: 0.472rem; color: #ff9a8c; font-weight: 600; }
.spg .g-badgebox { display: flex; gap: 0.472rem; margin-top: 0.709rem; flex-wrap: wrap; }
.spg .g-badgebox .g-b { font-family: var(--sans); font-weight: 700; padding: 0.331rem 0.709rem; border-radius: 0.236rem; font-size: 0.917rem; }
.spg .g-b.g-ok { background: #2f7d32; }
.spg .g-b.g-mid { background: #c27c12; }
.spg .g-b.g-ko { background: #b3261e; }
.spg .g-mixflow { display: grid; grid-template-columns: minmax(0, 1.25fr) 2.834rem minmax(0, 1fr) 2.834rem minmax(0, 1.05fr); align-items: center; gap: 0.472rem; }
.spg .g-inp { display: flex; align-items: center; gap: 0.709rem; background: var(--panel); border: 1px solid var(--line); border-radius: 0.591rem; padding: 0.567rem 0.709rem; margin: 0.472rem 0; color: var(--g-amber); }
.spg .g-inp b { color: var(--text); display: block; font-size: 0.917rem; }
.spg .g-inp span { color: var(--text2); font-size: 0.807rem; }
.spg .g-arrowbig { color: var(--g-amber); display: flex; justify-content: center; }
.spg .g-mixer { text-align: center; }
.spg .g-mixer img { width: 100%; max-height: 14.644rem; object-fit: contain; }
.spg .g-out { display: flex; align-items: center; gap: 0.709rem; background: var(--panel); border: 1px solid var(--line); border-radius: 0.591rem; padding: 0.472rem 0.709rem; margin: 0.472rem 0; }
.spg .g-out img { width: 5.669rem; }
.spg .g-out b { display: block; font-family: var(--sans); font-size: 1.192rem; margin-bottom: 0.236rem; }
.spg .g-slabimg { width: 5.669rem; display: flex; justify-content: center; color: #c9c4b8; }
.spg img.g-hud { width: 100%; border-radius: 0.354rem; }
.spg .g-vault { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-vshots { display: grid; gap: 0.709rem; height: 37.32rem; }
.spg .g-vshots img { width: 100%; height: 100%; object-fit: cover; border-radius: 0.591rem; border: 1px solid var(--line); }
.spg .g-dsteps { display: grid; grid-template-columns: repeat(5,minmax(0, 1fr)); gap: 0.709rem; }
.spg .g-dstep { background: var(--panel); border: 1px solid var(--line); border-radius: 0.591rem; padding: 0.709rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.283rem; color: var(--g-amber); position: relative; }
.spg .g-dstep b { color: var(--text); font-family: var(--sans); font-size: 1.1rem; text-transform: uppercase; }
.spg .g-dstep span { color: #c9c4bc; font-size: 0.825rem; }
.spg .g-dn { left: 0.591rem; top: 0.354rem; font-family: var(--sans); font-weight: 800; color: var(--g-accent); font-size: 1.192rem; }
.spg .g-dimg { display: flex; flex-direction: column; gap: 0.472rem; align-items: center; justify-content: center; }
.spg .g-dimg img { width: 100%; max-height: 12.282rem; object-fit: contain; }
.spg .g-dimg img.g-sub { max-height: 10.865rem; object-fit: cover; border-radius: 0.472rem; }
.spg .g-houseimgs { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr) minmax(0, 1.2fr); gap: 0.709rem; align-items: center; margin-bottom: 0.472rem; }
.spg .g-pvrow { display: grid; grid-template-columns: 4.488rem minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr); gap: 0.354rem; margin-top: 0.472rem; font-size: 0.852rem; align-items: center; }
.spg .g-pvrow span { white-space: nowrap; background: var(--deep); border-left: 3px solid var(--tc); padding: 0.283rem 0.472rem; border-radius: 0.236rem; font-family: var(--sans); }
.spg .g-hpstrip { display: flex; align-items: center; gap: 0.945rem; font-size: 0.88rem; color: #d6d1c9; }
.spg .g-hpstrip img { width: 14.644rem; border-radius: 0.354rem; }
.spg .g-hpstrip > span:first-child { color: var(--g-amber); }
.spg .g-houseimgs img { width: 100%; max-height: 9.92rem; object-fit: contain; border-radius: 0.472rem; }
.spg .g-krow { display: grid; grid-template-columns: 9.92rem minmax(0, 1fr); align-items: center; gap: 0.709rem; padding: 0.472rem 0; border-bottom: 1px solid var(--line); font-size: 0.962rem; }
.spg .g-trow { display: flex; align-items: center; gap: 0.945rem; padding: 0.614rem 0; border-bottom: 1px solid var(--line); color: var(--g-amber); }
.spg .g-trow b { color: var(--text); display: block; font-size: 1.008rem; }
.spg .g-trow span { color: var(--text2); font-size: 0.871rem; }
.spg .g-checklist { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-clg { background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; padding: 0.827rem 0.945rem; }
.spg .g-cli { display: flex; gap: 0.591rem; align-items: flex-start; font-size: 0.871rem; margin: 0.425rem 0; }
.spg .g-cli .g-box { flex: none; width: 0.945rem; height: 0.945rem; border: 1.6px solid var(--g-amber); border-radius: 0.189rem; margin-top: 0.094rem; }
.spg svg .g-sl { font: 700 12px var(--sans); }
.spg .g-infi { font-family: var(--sans); font-weight: 700; }
.spg .g-g4 { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0.945rem; align-items: stretch; }
.spg .g-hudmock { background: rgba(10,12,14,.85); border: 1px solid var(--line); border-radius: 0.472rem; display: flex; align-items: center; justify-content: center; gap: 0.378rem; padding: 0.472rem 0.709rem; font-family: var(--sans); }
.spg .g-hudmock span { font-weight: 700; letter-spacing: .8px; font-size: 1.008rem; margin-right: 0.354rem; }
.spg .g-hudmock i { width: 1.417rem; height: 0.614rem; background: var(--line); display: inline-block; }
.spg .g-hudmock i.g-on { background: var(--g-blue); }
.spg .g-hudmock b { font-size: 1.283rem; margin-left: 0.354rem; color: var(--text); }
.spg .g-story { display: flex; align-items: center; gap: 0.472rem; }
.spg .g-story > div { flex: 1; background: var(--deep); border-radius: 0.472rem; padding: 0.567rem 0.709rem; font-size: 0.862rem; }
.spg .g-story > div b:first-child { display: block; font-family: var(--sans); color: var(--g-amber); font-size: 1.1rem; }
.spg .g-story > div span b { color: var(--text); }
.spg .g-example { margin-top: 0.709rem; background: var(--deep); border-left: 3px solid var(--g-amber); border-radius: 0.354rem; padding: 0.567rem 0.709rem; font-size: 0.862rem; color: #d6d1c9; }
.spg .g-hands { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.5fr); gap: 0.945rem; }
.spg .g-hands figure { margin: 0; background: var(--panel); border: 1px solid var(--line); border-radius: 0.472rem; overflow: hidden; }
.spg .g-hands img { width: 100%; height: 6.377rem; object-fit: cover; display: block; }
.spg .g-hands figcaption, .spg .g-palshots figcaption, .spg .g-strip3 figcaption { font-size: 0.779rem; color: var(--text2); padding: 0.236rem 0.472rem; }
.spg .g-vsmall { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 0.709rem; }
.spg .g-vsmall img { width: 100%; height: 7.086rem; object-fit: cover; border-radius: 0.472rem; border: 1px solid var(--line); }
.spg .g-palshots { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0.591rem; margin-bottom: 0.472rem; }
.spg .g-palshots figure { margin: 0; background: var(--deep); border-radius: 0.472rem; overflow: hidden; }
.spg .g-palshots img { width: 100%; height: 8.031rem; object-fit: cover; display: block; }
.spg .g-strip3 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0.709rem; margin-top: 0.945rem; }
.spg .g-strip3 figure { margin: 0; background: var(--panel); border: 1px solid var(--line); border-radius: 0.472rem; overflow: hidden; }
.spg .g-strip3 img { width: 100%; height: 5.669rem; object-fit: cover; display: block; }
.spg .g-soft { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) 1.417rem minmax(0, 1fr); gap: 0.354rem 0; align-items: stretch; margin: 0.236rem 0 0.472rem; }
.spg .g-soft .g-side { padding: 0.472rem; }
.spg .g-soft .g-side.g-out { border-radius: 0.472rem 0 0 0.472rem; }
.spg .g-soft .g-side.g-in { border-radius: 0 0.472rem 0.472rem 0; }
.spg .g-sl2 { display: flex; flex-direction: column; justify-content: center; color: var(--g-amber); padding: 0.354rem 0; }
.spg .g-sl2 b { color: var(--text); font-size: 0.917rem; }
.spg .g-sl2 span { color: var(--text2); font-size: 0.779rem; }
.spg .g-soft .g-o, .spg .g-soft .g-i2 { display: flex; align-items: center; justify-content: center; font-family: var(--sans); font-size: 1.558rem; }
.spg .g-soft .g-o { background: var(--deep); color: #ddd; }
.spg .g-soft .g-i2 { background: rgba(201,99,74,.16); color: #ff8b7d; font-weight: 800; }
.spg .g-tstep img { display: block; width: 100%; height: 5.669rem; object-fit: cover; border-radius: 0.354rem; margin-bottom: 0.472rem; }
.spg .g-dstep > b { color: var(--text); font-family: var(--sans); font-size: 1.1rem; text-transform: uppercase; }
.spg .g-dstep span b { font: inherit; font-weight: 700; color: var(--text); text-transform: none; }
.spg td.g-imm { color: var(--g-accent); letter-spacing: 3px; font-weight: 800; }
.spg tr.g-immune td.g-tn { letter-spacing: 0; font-weight: 600; color: #f1c3bb; }
.spg td.g-pips div { flex-wrap: nowrap; }
.spg td.g-pips i { width: 0.591rem; height: 0.992rem; }
.spg table.g-raid th { white-space: nowrap; }
.spg table.g-raid td { padding: 0.543rem 0.472rem; }
.spg .g-checklist > div.g-stack { display: flex; flex-direction: column; gap: 1.181rem; }
.spg .g-terr > div > .g-card + .g-card { margin-top: 0.945rem; }
.spg .g-vshots { height: auto; }
.spg .g-mixer img { max-height: 11.81rem; }
.spg .g-inp { margin: 0.354rem 0; padding: 0.472rem 0.709rem; }
.spg .g-tier img { height: 9.92rem; }
.spg .g-krow { padding: 0.614rem 0; }
.spg .g-trow { padding: 0.803rem 0; }
.spg svg.g-wheel { max-width: 21.73rem; }
.spg .g-col { display: flex; flex-direction: column; gap: 0.945rem; }
.spg .g-fcol { display: flex; flex-direction: column; }
.spg .g-card.g-fcol > * + * { margin-top: 0.591rem; }
.spg .g-colc { flex-direction: column; gap: 0.709rem; }
.spg .g-capimg { position: relative; width: 100%; border-radius: 0.709rem; overflow: hidden; }
.spg .g-capimg { border: 1px solid var(--line); background: var(--deep); }
.spg .g-capimg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.spg .g-sticker { display: flex; gap: 0.591rem; align-items: flex-start; border-radius: 0.709rem; padding: 0.614rem 0.756rem; font-size: 0.898rem; line-height: 1.32; }
.spg .g-sticker .g-lbl { display: block; font-family: var(--sans); font-weight: 800; text-transform: uppercase; letter-spacing: .7px; font-size: 0.807rem; margin-bottom: 0.142rem; }
.spg .g-sticker.g-why { background: rgba(76,155,232,.11); border: 1px solid rgba(76,155,232,.45); color: #dbe9f7; }
.spg .g-sticker.g-why svg, .spg .g-sticker.g-why .g-lbl { color: #7fbcf5; }
.spg .g-sticker.g-tip { background: rgba(92,184,92,.11); border: 1px solid rgba(92,184,92,.45); color: #dcefdc; }
.spg .g-sticker.g-tip svg, .spg .g-sticker.g-tip .g-lbl { color: #8fd48f; }
.spg .g-sticker.g-trap { background: rgba(201,99,74,.12); border: 1px solid rgba(201,99,74,.5); color: #f6d6d1; }
.spg .g-sticker.g-trap svg, .spg .g-sticker.g-trap .g-lbl { color: #ff8b7d; }
.spg .g-sticker b { color: var(--text); }
.spg .g-good { display: flex; gap: 0.709rem; align-items: center; background: rgba(92,184,92,.09); border: 1px solid rgba(92,184,92,.4); border-radius: 0.709rem; padding: 0.709rem 0.827rem; color: #8fd48f; }
.spg .g-good b { display: block; color: var(--text); font-size: 0.962rem; font-family: var(--sans); }
.spg .g-good span { color: #d4e5d4; font-size: 0.88rem; }
.spg .g-good span b { display: inline; font-family: inherit; font-size: inherit; }
.spg .g-chips3 { display: grid; grid-template-columns: repeat(3,minmax(0, 1fr)); gap: 0.591rem; }
.spg .g-chips3 .g-chip { padding: 0.472rem 0.591rem; gap: 0.472rem; }
.spg .g-chips3 .g-chip .g-v { font-size: 1.467rem; }
.spg .g-chips3 .g-chip .g-l { font-size: 0.697rem; }
.spg .g-bigline { display: flex; gap: 0.472rem; align-items: center; font-size: 0.917rem; }
.spg .g-intro .g-journey { margin-top: 0; }
.spg .g-intro .g-jstep { padding: 1.181rem 0.709rem; }
.spg .g-intro .g-jt { font-size: 1.237rem; }
.spg .g-intro .g-jd { font-size: 0.88rem; }
.spg .g-tocg { display: grid; grid-template-columns: repeat(5,minmax(0, 1fr)); gap: 0.567rem; margin-top: 1.181rem; }
.spg .g-tocg a { display: flex; align-items: center; gap: 0.472rem; background: var(--deep); border: 1px solid var(--line); border-radius: 0.591rem; padding: 0.614rem 0.614rem; color: var(--text); text-decoration: none; font-size: 0.88rem; line-height: 1.15; min-height: 3.071rem; }
.spg .g-tocg .g-tn { font-family: var(--sans); font-weight: 800; color: var(--g-accent); font-size: 1.1rem; min-width: 1.535rem; }
.spg .g-tocg svg { color: var(--g-amber); }
.spg .g-tocg .g-tt { flex: 1; }
.spg .g-tocg .g-tp { color: var(--text2); font-size: 0.752rem; white-space: nowrap; }
.spg .g-gold { margin-top: 1.181rem; display: grid; grid-template-columns: auto repeat(4,minmax(0, 1fr)); gap: 0.591rem; align-items: stretch; }
.spg .g-gh { font-family: var(--sans); font-weight: 800; text-transform: uppercase; color: var(--g-amber); display: flex; align-items: center; gap: 0.472rem; font-size: 1.008rem; padding-right: 0.472rem; }
.spg .g-gr { display: flex; align-items: center; gap: 0.591rem; background: rgba(166,132,89,.09); border: 1px solid rgba(166,132,89,.35); border-radius: 0.591rem; padding: 0.709rem 0.709rem; font-size: 0.88rem; }
.spg .g-gr b { font-family: var(--sans); font-size: 1.833rem; color: var(--g-amber); }
.spg .g-gr em { font-style: normal; font-weight: 700; color: var(--text); }
.spg .g-g3k { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) minmax(0, 1.1fr); gap: 1.181rem; }
.spg .g-keysbar { display: flex; align-items: center; justify-content: space-between; gap: 0.945rem; padding: 0.709rem 0.945rem; }
.spg .g-kb { display: flex; align-items: center; gap: 0.472rem; font-size: 0.917rem; }
.spg .g-kb small { color: var(--text2); font-size: 0.761rem; }
.spg .g-capcol { gap: 0.472rem; }
.spg .g-lg { display: flex; align-items: center; gap: 0.591rem; font-size: 0.917rem; }
.spg .g-dot { width: 1.063rem; height: 1.063rem; border-radius: 50%; flex: none; }
.spg .g-dot.g-g { background: #4fd06a; }
.spg .g-dot.g-r { background: #e0483b; }
.spg .g-bsteps { display: grid; grid-template-columns: repeat(4,minmax(0, 1fr)); gap: 0.945rem; }
.spg .g-bstep { background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; padding: 0.709rem; position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.354rem; }
.spg .g-bstep > b { font-family: var(--sans); font-size: 1.146rem; text-transform: uppercase; margin-top: 0.236rem; }
.spg .g-bstep > span { color: var(--text2); font-size: 0.825rem; }
.spg .g-bn { left: -0.472rem; top: -0.472rem; width: 2.126rem; height: 2.126rem; border-radius: 50%; background: var(--g-accent); color: var(--text); font-family: var(--sans); font-weight: 800; font-size: 1.192rem; display: flex; align-items: center; justify-content: center; z-index: 2; }
.spg .g-dsteps .g-dstep span b { color: var(--text); }
.spg .g-can { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.378rem; }
.spg .g-can span { display: flex; align-items: center; gap: 0.378rem; background: var(--deep); border-radius: 0.378rem; padding: 0.425rem 0.52rem; font-size: 0.843rem; color: #d6d1c9; }
.spg .g-can svg { color: var(--g-amber); }
.spg .g-banner { display: flex; flex-direction: column; }
.spg .g-tstep2 { flex: 1; text-align: center; padding: 0.709rem 0.472rem; border-radius: 0.591rem; background: var(--deep); border: 2px solid var(--tc); }
.spg .g-tstep2 b { display: block; font-family: var(--sans); font-weight: 800; text-transform: uppercase; font-size: 1.192rem; color: var(--tc); }
.spg .g-tstep2 span { font-size: 0.825rem; color: var(--text2); }
.spg .g-hpcard { display: flex; flex-direction: column; gap: 0.472rem; font-size: 0.88rem; }
.spg .g-g3l { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-lvcard { display: flex; flex-direction: column; }
.spg .g-lvcard svg.g-levels { height: 100%; }
.spg svg .g-lv { font: 700 16px var(--sans); fill: var(--text); text-anchor: middle; }
.spg svg .g-ok { font: 700 10px var(--sans); fill: #7fd47f; }
.spg svg .g-ko { font: 700 10px var(--sans); fill: #ff7a6b; }
.spg .g-lsteps { display: flex; flex-direction: column; gap: 0.614rem; }
.spg .g-fcol > .g-lsteps { justify-content: space-between; }
.spg .g-ls { display: flex; align-items: center; gap: 0.709rem; background: var(--deep); border-radius: 0.52rem; padding: 0.709rem 0.803rem; color: var(--g-amber); }
.spg .g-ls b { display: block; color: var(--text); font-size: 1.008rem; }
.spg .g-ls span { color: var(--text2); font-size: 0.871rem; }
.spg .g-ls span b { display: inline; font-size: inherit; }
.spg .g-ln { font-family: var(--sans); font-weight: 800; font-size: 1.467rem; color: var(--g-accent); min-width: 1.181rem; }
.spg .g-leds { display: flex; align-items: center; gap: 0.472rem; font-size: 0.871rem; flex-wrap: wrap; }
.spg .g-led { width: 0.85rem; height: 0.85rem; border-radius: 50%; }
.spg .g-led.g-g { background: #4fd06a; box-shadow: 0 0 6px #4fd06a; }
.spg .g-led.g-r { background: #ff4a3a; box-shadow: 0 0 6px #ff4a3a; margin-left: 0.472rem; }
.spg .g-ladder2 { display: flex; gap: 0.425rem; align-items: center; flex-wrap: wrap; font-size: 0.843rem; }
.spg .g-ladder2 span { border-left: 3px solid var(--tc); background: var(--deep); padding: 0.236rem 0.472rem; border-radius: 0.236rem; font-family: var(--sans); }
.spg .g-ladder2 b { display: flex; align-items: center; gap: 0.236rem; margin-right: 0.236rem; color: var(--g-amber); }
.spg .g-palshots { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0.591rem; }
.spg .g-hshots { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.709rem; }
.spg .g-palshots figure, .spg .g-hshots figure { margin: 0; display: flex; flex-direction: column; }
.spg .g-palshots figcaption, .spg .g-hshots figcaption { font-size: 0.779rem; color: var(--text2); padding: 0.236rem 0.236rem 0; }
.spg .g-mixflow { display: grid; grid-template-columns: minmax(0, 1.2fr) 2.362rem minmax(0, 1.15fr) 2.362rem minmax(0, 1.1fr); align-items: stretch; gap: 0.472rem; }
.spg .g-mixflow .g-inputs, .spg .g-mixflow .g-outputs { display: flex; flex-direction: column; justify-content: center; }
.spg .g-mixflow .g-arrowbig { align-items: center; }
.spg .g-mixer2 .g-center { justify-content: center; display: flex; align-items: center; font-size: 0.917rem; }
.spg .g-out { display: flex; align-items: center; gap: 0.709rem; }
.spg .g-g2r { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 1.181rem; }
.spg svg .g-bt { font: 700 10px var(--sans); fill: var(--text); }
.spg .g-dmg { display: flex; gap: 0.354rem; flex-wrap: wrap; margin: 0.354rem 0; }
.spg .g-dmg span { display: inline-flex; align-items: center; gap: 0.283rem; padding: 0.283rem 0.52rem; border-radius: 0.354rem; font-size: 0.843rem; }
.spg .g-dmg .g-y { background: rgba(201,99,74,.22); color: #ffb3a8; }
.spg .g-dmg .g-n { background: var(--deep); color: var(--text3); text-decoration: line-through; }
.spg .g-dmg .g-sep { color: var(--text2); font-size: 0.788rem; padding: 0.283rem 0.118rem 0.283rem 0; }
.spg table.g-raid.g-big td { padding: 0.779rem 0.472rem; }
.spg .g-calc .g-sum { display: flex; align-items: center; justify-content: center; gap: 0.52rem; margin: 0.236rem 0; }
.spg .g-sum span { font-size: 0.77rem; color: var(--text2); line-height: 1.1; text-align: center; }
.spg .g-sum b { font-family: var(--sans); font-size: 1.833rem; color: var(--text); }
.spg .g-sum i { font-style: normal; font-size: 1.467rem; color: var(--text2); }
.spg .g-sum b.g-tot { color: var(--g-accent); font-size: 2.383rem; }
.spg .g-g2v { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 1.181rem; }
.spg .g-g2v > .g-col:last-child { justify-content: space-between; }
.spg .g-rgrid { display: grid; grid-template-columns: repeat(3,minmax(0, 1fr)); gap: 0.709rem; grid-auto-rows: 1fr; }
.spg .g-rule { background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; padding: 0.709rem; display: flex; flex-direction: column; gap: 0.354rem; color: var(--g-amber); }
.spg .g-rule b { display: block; color: var(--text); font-family: var(--sans); font-size: 1.008rem; text-transform: uppercase; margin-bottom: 0.189rem; }
.spg .g-rule span { color: #c9c4bc; font-size: 0.862rem; }
.spg .g-faq { display: grid; grid-template-columns: repeat(3,minmax(0, 1fr)); gap: 0.827rem; }
.spg .g-qa { background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; overflow: hidden; display: flex; flex-direction: column; }
.spg .g-qa .g-q { display: flex; align-items: center; gap: 0.472rem; padding: 0.709rem 0.803rem; background: rgba(201,99,74,.12); color: #ff8b7d; font-size: 0.962rem; }
.spg .g-qa .g-q b { color: var(--text); }
.spg .g-qa .g-a { padding: 0.709rem 0.803rem; font-size: 0.935rem; color: #d6d1c9; flex: 1; display: flex; align-items: center; }
.spg .g-memo .g-card { justify-content: space-between; }
.spg .g-muted2 { color: var(--text2); font-size: 0.871rem; }
.spg .g-bstep2 { display: flex; gap: 0.827rem; align-items: stretch; background: var(--panel); border: 1px solid var(--line); border-radius: 0.709rem; padding: 0.709rem; position: relative; }
.spg .g-bt2 { display: flex; flex-direction: column; justify-content: center; gap: 0.354rem; }
.spg .g-bt2 b { font-family: var(--sans); font-size: 1.237rem; text-transform: uppercase; }
.spg .g-bt2 span { color: var(--text2); font-size: 0.898rem; }
.spg .g-g2m { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 1.181rem; }
.spg .g-mixflow2 { display: grid; grid-template-columns: minmax(0, .95fr) 1.89rem minmax(0, 1.5fr) 1.89rem minmax(0, .95fr); align-items: stretch; gap: 0.472rem; }
.spg .g-mixflow2 .g-inputs, .spg .g-mixflow2 .g-outputs { display: flex; flex-direction: column; justify-content: center; }
.spg .g-mixflow2 .g-arrowbig { display: flex; align-items: center; justify-content: center; color: var(--g-amber); }
.spg .g-mixflow2 .g-out { flex-direction: row; align-items: center; gap: 0.591rem; margin: 0.354rem 0; padding: 0.472rem 0.591rem; }
.spg .g-mixflow2 .g-out b { font-size: 1.1rem; }
.spg .g-mixer2 { gap: 0.472rem; }
.spg .g-mixer2 > .g-mt3 { margin-top: 0; }
.spg .g-stack2 { display: grid; gap: 0.591rem; }
.spg .g-hgrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.591rem; }
.spg .g-hgrid .g-wide { grid-column: 1 / span 2; }
.spg .g-stack2 figure, .spg .g-hgrid figure { margin: 0; display: flex; flex-direction: column; }
.spg .g-stack2 figcaption, .spg .g-hgrid figcaption { font-size: 0.779rem; color: var(--text2); padding: 0.189rem 0.236rem 0; }
.spg img.g-itm { height: 1.653rem; width: auto; max-width: 2.834rem; object-fit: contain; display: inline-block; vertical-align: middle; filter: drop-shadow(0 0 .7px rgba(255,255,255,.45)) drop-shadow(0 1px 2px rgba(0,0,0,.7)); }
.spg .g-mat.g-withimg { padding: 0.071rem 0.378rem 0.071rem 0.142rem; gap: 0.189rem; background: var(--raised); border-color: var(--line2); }
.spg .g-mat.g-withimg.g-big img.g-itm { height: 2.362rem; max-width: 3.779rem; }
.spg .g-costs .g-mat.g-withimg img.g-itm, .spg .g-machines .g-mat.g-withimg img.g-itm { height: 1.323rem; max-width: 2.126rem; }
.spg .g-legend .g-mat.g-withimg img.g-itm { height: 1.417rem; }
.spg img.g-itm.g-tool { max-width: 3.779rem; }
.spg img.g-itm.g-slotimg { height: 2.598rem; max-width: 3.779rem; margin: 0.236rem 0; }
.spg .g-costs .g-mat.g-withimg { padding: 0.035rem 0.236rem 0.035rem 0.059rem; gap: 0.083rem; margin: 0.047rem 0.106rem 0.047rem 0; }
.spg .g-costs .g-mat.g-withimg img.g-itm { height: 1.464rem; max-width: 1.653rem; }
.spg .g-costs .g-mat.g-withimg b { font-size: 0.871rem; }
.spg .g-machines .g-mat.g-withimg img.g-itm { height: 1.181rem; max-width: 1.464rem; }
.spg .g-legend { gap: 0.142rem 0.709rem; }
.spg .g-legend .g-mat.g-withimg img.g-itm { height: 1.181rem; max-width: 1.535rem; }
.spg .g-trow img.g-itm.g-tool { height: 2.48rem !important; width: 3.543rem; max-width: 3.543rem; }
.spg .g-kitbox img.g-itm.g-tool { height: 3.071rem !important; max-width: 3.071rem; }

/* ── Surcharges web : mise en page fluide, charte du site ───────────────── */

/* Page de guide : colonne large, sommaire en haut de page plutôt qu'en marge */
.wiki-shell.is-wide { grid-template-columns: 248px minmax(0, 1fr); }
.wiki-shell.is-wide .wiki-rail { display: none; }
.wiki-shell.is-wide .wiki-toc-inline { display: block; }
.wiki-shell.is-wide .wiki-meta-inline { display: flex; }
@media (max-width: 900px) { .wiki-shell.is-wide { grid-template-columns: minmax(0, 1fr); } }
.draft-note { border-color: rgba(219, 186, 95, .45); background: rgba(219, 186, 95, .08); color: var(--warn); }

/* Numéro de chapitre dans le titre */
.prose h2 .g-cnum { font-family: var(--sans); font-weight: 800; color: var(--g-accent, #c9634a); margin-right: .45em; letter-spacing: 0; }
.prose h2:has(.g-cnum) { margin-top: 2.6em; padding-top: 1.2em; border-top: 1px solid var(--line); }
.prose > h2:first-child, .prose > .spg:first-child + h2 { margin-top: 1.4em; }

.spg {
  --g-accent: #c9634a; --g-amber: var(--hl-text); --g-blue: #7ea7d1;
  color: var(--text2); font-size: .98rem; line-height: 1.45;
}
.spg .g-lead { color: var(--text2); font-size: 1.05rem; margin: -.2em 0 1.2rem; }
.spg > * + * { margin-top: 1rem; }

/* Neutralise les styles de texte long (.prose) à l'intérieur des blocs du guide */
.prose .spg img { border: 0; border-radius: 0; margin: 0; cursor: default; max-width: 100%; }
.prose .spg img.zoom { cursor: zoom-in; }
.prose .spg h3 { margin: 0 0 .7rem; font-family: var(--sans); font-weight: 700; font-size: 1.02rem; letter-spacing: .03em; text-transform: uppercase; color: var(--text); display: flex; align-items: center; gap: .5rem; }
.prose .spg h3 + * { margin-top: 0; }
.prose .spg ul { padding-left: 0; }
.prose .spg li + li { margin-top: 0; }
.prose .spg li::marker { content: none; }
.prose .spg a { color: inherit; text-decoration: none; }
.prose .spg strong, .prose .spg b { color: var(--text); font-weight: 700; }
.prose .spg table { display: table; width: 100%; font-size: inherit; border-collapse: separate; }
.prose .spg th, .prose .spg td { border-bottom: 0; padding: inherit; }
.spg .g-tscroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Captures : hauteur naturelle (sur le PDF, elles remplissaient une hauteur fixe) */
.spg .g-capimg { position: static; border-radius: var(--radius-sm); }
.spg .g-capimg img { position: static; width: 100%; height: auto; display: block; }
.spg .g-card { border-radius: var(--radius); }
.spg .g-card.g-fcol > .g-capimg { margin-top: .9rem; }

/* Construire : 2 × 2 étapes, capture à gauche, texte à droite (comme sur le PDF) */
.spg .g-bsteps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.spg .g-bstep2 > .g-capimg { flex: 1.6 1 0; min-width: 0; align-self: center; }

/* Couverture */
.spg .g-hero { position: relative; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); background: var(--deep); min-height: 340px; display: flex; align-items: center; }
.spg .g-hero-img { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; }
.spg .g-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17, 19, 19, .96) 30%, rgba(17, 19, 19, .7) 55%, rgba(17, 19, 19, .1) 85%); pointer-events: none; }
.spg .g-hero-text { position: relative; z-index: 1; padding: 34px 38px; max-width: 620px; }
.spg .g-kicker { color: var(--g-accent); font-weight: 700; letter-spacing: .2em; text-transform: uppercase; font-size: .85rem; }
.spg .g-htitle { font-family: var(--title); font-weight: 400; font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1; margin-top: .6rem; letter-spacing: .04em; color: var(--text); }
.spg .g-htitle b { font-weight: 700; color: var(--g-accent); }
.spg .g-tagline { font-size: 1.3rem; margin-top: .7rem; color: var(--text); }
.spg .g-tag2 { color: var(--text2); margin-top: .5rem; }
.spg .g-cover-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 1.1rem; }
.spg .g-cover-tags span { border: 1px solid var(--line2); background: rgba(23, 26, 26, .85); padding: 4px 11px; border-radius: 999px; font-size: .85rem; }
.spg .g-ver { margin-top: 1.1rem; color: var(--text3); letter-spacing: .18em; font-size: .78rem; }

/* Lien vers la partie suivante */
.spg .g-nextpart { display: flex; flex-direction: column; gap: 2px; margin-top: 2.2rem; padding: 16px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); transition: border-color .2s; }
.spg .g-nextpart:hover { border-color: var(--hl); }
.spg .g-nextpart span { color: var(--text3); font-size: .82rem; text-transform: uppercase; letter-spacing: .14em; }
.spg .g-nextpart b { font-size: 1.05rem; }
.spg .g-nextpart b::after { content: ' →'; color: var(--hl-text); }

/* Sommaire et étapes : liens et cartes */
.spg .g-tocg a { transition: border-color .2s; }
.spg .g-tocg a:hover { border-color: var(--hl); }

/* ── Écrans moyens : grilles à 2 colonnes ── */
@media (max-width: 1180px) {
  .spg .g-g3, .spg .g-g3k, .spg .g-g3w, .spg .g-g3l, .spg .g-pieces, .spg .g-faq, .spg .g-rgrid, .spg .g-tiers, .spg .g-palshots, .spg .g-strip3, .spg .g-hands { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .spg .g-tocg, .spg .g-toc { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .spg .g-dsteps, .spg .g-slots { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .spg .g-chips-row, .spg .g-g4, .spg .g-bsteps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .spg .g-gold { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .spg .g-gold .g-gh { grid-column: 1 / -1; }
  .spg .g-journey { flex-wrap: wrap; }
  .spg .g-journey .g-jstep { flex: 1 1 28%; }
  .spg .g-journey .g-jarrow { display: none; }
}
/* ── Téléphones : une colonne ── */
@media (max-width: 760px) {
  .spg [class*="g-g2"], .spg [class*="g-g3"], .spg .g-g4, .spg .g-pieces, .spg .g-faq, .spg .g-rgrid, .spg .g-tiers, .spg .g-vault, .spg .g-checklist,
  .spg .g-palshots, .spg .g-strip3, .spg .g-hands, .spg .g-hshots, .spg .g-hgrid, .spg .g-vsmall, .spg .g-chips-row, .spg .g-bsteps, .spg .g-mixflow, .spg .g-mixflow2,
  .spg .g-window10, .spg .g-houseimgs { grid-template-columns: minmax(0, 1fr); }
  .spg .g-tocg, .spg .g-toc, .spg .g-dsteps, .spg .g-slots, .spg .g-chips4, .spg .g-chips3, .spg .g-gold { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .spg .g-journey .g-jstep { flex: 1 1 40%; }
  .spg .g-mixflow .g-arrowbig, .spg .g-mixflow2 .g-arrowbig { transform: rotate(90deg); }
  .spg .g-hero { min-height: 0; }
  .spg .g-hero-text { padding: 24px 20px; }
  .spg .g-krow { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
  .spg .g-bstep2 { flex-direction: column; }
  .spg .g-softside, .spg .g-soft, .spg .g-pvrow, .spg .g-cmp > div { font-size: .9rem; }
}
@media (max-width: 760px) {
  /* Captures des étapes : pleine largeur, au-dessus du texte */
  .spg .g-bstep2 > .g-capimg { flex: none; width: 100%; }
  /* Tableaux larges : défilement horizontal plutôt que colonnes écrasées */
  .spg .g-tscroll > table.g-costs { min-width: 860px; }
  .spg .g-tscroll > table.g-raid, .spg .g-tscroll > table.g-matrix { min-width: 540px; }
  .spg .g-tscroll { margin-inline: -4px; padding: 0 4px 6px; background: linear-gradient(90deg, transparent 85%, rgba(166, 132, 89, .12)) right / 40px 100% no-repeat; }
  /* Lignes de touches, paliers et calculs : retour à la ligne */
  .spg .g-keysbar, .spg .g-tchain, .spg .g-sum, .spg .g-eq, .spg .g-flow, .spg .g-story, .spg .g-leds, .spg .g-ladder2, .spg .g-dmg { flex-wrap: wrap; }
  .spg .g-tchain .g-tstep2, .spg .g-tchain .g-tstep { flex: 1 1 40%; }
  .spg .g-tchain > svg, .spg .g-story > svg { display: none; }
  .spg .g-keysbar { justify-content: flex-start; }
  .spg .g-sum b.g-tot { font-size: 1.8rem; }
}
/* Téléphones : les grilles d'origine sont plus précises que les règles ci-dessus, d'où !important */
@media (max-width: 760px) {
  .spg .g-g2, .spg .g-g2r, .spg .g-g2v, .spg .g-g2w, .spg .g-g2w.g-r, .spg .g-g3, .spg .g-g3k, .spg .g-g3l, .spg .g-g3w, .spg .g-g4,
  .spg .g-hgrid, .spg .g-mixflow2, .spg .g-window10, .spg .g-tiers, .spg .g-pieces, .spg .g-rgrid, .spg .g-faq, .spg .g-bsteps,
  .spg .g-chips-row, .spg .g-machines { grid-template-columns: minmax(0, 1fr) !important; }
  .spg .g-dsteps, .spg .g-slots, .spg .g-tocg, .spg .g-gold, .spg .g-chips2, .spg .g-chips3, .spg .g-can { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .spg .g-gold .g-gh { grid-column: 1 / -1; }
  .spg .g-mixflow2 .g-arrowbig { transform: rotate(90deg); padding: 4px 0; }
  .spg .g-window10 .g-w-on { border-radius: 10px 10px 0 0; }
  .spg .g-window10 .g-w-off { border-radius: 0 0 10px 10px; border-left: 1px solid var(--line); border-top: 0; }
}
/* Règles du serveur : une dernière carte seule sur sa ligne prend toute la largeur (pas de trou dans la grille) */
.spg .g-rgrid > .g-rule:last-child:nth-child(3n+1) { grid-column: 1 / -1; }
@media (max-width: 1180px) {
  .spg .g-rgrid > .g-rule:last-child:nth-child(3n+1) { grid-column: auto; }
  .spg .g-rgrid > .g-rule:last-child:nth-child(2n+1) { grid-column: 1 / -1; }
}