/* modwiki-build.css — interactive 3D example builds on mod wiki pages (phase 1b; markup pages/funktions/modwiki_build.php,
   script assets/js/modwiki/build.js). Prefix .mwb; dark tokens of header.php with fallbacks. 3D view + tools on the left,
   step list and materials on the right at >= 900 px; one column below. */
.mwb{margin:24px 0;padding:12px;border-radius:16px;background:var(--surface,#121a15);border:1px solid var(--border2,#24302a);color:var(--text,#e8efe9)}
.mwb__body{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
@media (min-width:900px){.mwb__body{grid-template-columns:minmax(0,1fr) 300px}}
.mwb__stage{min-width:0}
.mwb__view{position:relative;height:clamp(300px,52vh,500px);border-radius:12px;overflow:hidden;border:1px solid var(--border2,#24302a);background:radial-gradient(120% 120% at 50% 0%,#1d2a22,#0a0f0c);touch-action:none}
.mwb__ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;text-align:center;color:var(--muted,#9fb0a6);font-size:14px}
.mwb__ph i{font-size:44px;color:var(--lime,#8bdc4a);opacity:.7}
.mwb__tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}
.mwb__tb{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:6px 11px;border-radius:10px;border:1px solid var(--border2,#24302a);background:var(--surface2,#18221c);color:var(--text,#e8efe9);font-family:inherit;font-size:13px;font-weight:600;line-height:1.2;cursor:pointer}
.mwb__tb i{font-size:17px}
.mwb__tb:hover{border-color:var(--green,#34e29b)}
.mwb__tb[aria-pressed="true"]{border-color:var(--green,#34e29b);color:var(--green,#34e29b);background:rgba(52,226,155,.08)}
.mwb__layer{display:inline-flex;align-items:center;gap:8px;margin-left:auto;font-size:13px;color:var(--muted,#9fb0a6)}
.mwb__layer input{width:140px;accent-color:var(--green,#34e29b)}
.mwb__pick{margin:8px 0 0;min-height:1.4em;color:var(--muted,#9fb0a6);font-size:13.5px}
.mwb__side{min-width:0;display:flex;flex-direction:column;gap:12px}
.mwb__steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.mwb__step{border-radius:12px;border:1px solid var(--border2,#24302a);background:var(--bg2,#0e1511)}
.mwb__step button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;background:none;color:inherit;font-family:inherit;font-size:14px;font-weight:600;line-height:1.3;text-align:left;cursor:pointer;border-radius:12px}
.mwb__step button:focus-visible{outline:2px solid var(--green,#34e29b);outline-offset:-2px}
.mwb__step p{margin:0;padding:0 12px 10px 46px;color:var(--muted,#9fb0a6);font-size:13.5px;line-height:1.55}
.mwb__step:not(.is-cur) p{display:none}
.mwb__step.is-cur{border-color:rgba(52,226,155,.45);background:rgba(52,226,155,.06)}
.mwb__no{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--surface2,#18221c);color:var(--muted,#9fb0a6);font:700 12.5px var(--font-mono,monospace)}
.mwb__no i{font-size:15px}
.mwb__step.is-cur .mwb__no{background:var(--green,#34e29b);color:#06120c}
.mwb__mats{border-radius:12px;border:1px solid var(--border2,#24302a);padding:8px 10px}
.mwb__mats summary{cursor:pointer;font-weight:700;font-size:14px}
.mwb__mats summary small{margin-left:6px;color:var(--muted,#9fb0a6);font-weight:500}
.mwb__mats ul{list-style:none;margin:8px 0 2px;padding:0;display:flex;flex-direction:column;gap:6px}
.mwb__mats li{display:flex;align-items:center;gap:10px;min-width:0}
.mwb__mn{flex:1 1 auto;min-width:0;font-size:13.5px;line-height:1.25;overflow-wrap:anywhere}
.mwb__mn a{color:var(--green,#34e29b);text-decoration:none}.mwb__mn a:hover{text-decoration:underline}
.mwb__mn small{display:block;color:var(--muted,#9fb0a6);font-size:11.5px}
.mwb__mats b{flex:none;color:var(--lime,#8bdc4a);font:700 13px var(--font-mono,monospace)}
.mwb-ic{flex:none;display:inline-block;vertical-align:middle;image-rendering:pixelated}
.mwb-ic--r{image-rendering:auto}
.mwb-ic--none{display:inline-grid;place-items:center;width:var(--s,28px);height:var(--s,28px);border-radius:7px;background:linear-gradient(150deg,#2b4636,#16241c);color:#cfe9d8;font:700 13px/1 var(--font-mono,monospace)}
.mwb__cap{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;margin:12px 2px 2px;color:var(--text,#e8efe9);font-size:14px}
.mwb__unv{display:inline-flex;align-items:center;gap:5px;color:#ffd24a;font-size:13px}
.mwb__cr{flex-basis:100%;color:var(--muted,#9fb0a6);font-size:12px}
/* layer plan (build.js): one layer as a grid of item icons, north up; cells of later steps fade, the current step is outlined */
.mwb__plan{margin-top:14px;padding:12px;border-radius:12px;border:1px solid var(--border2,#24302a);background:var(--bg2,#0e1511)}
.mwb__planhd{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:10px}
.mwb__planhd b{display:inline-flex;align-items:center;gap:6px;font-size:14px}
.mwb__planhd b i{font-size:17px;color:var(--lime,#8bdc4a)}
.mwb__planhd small{color:var(--muted,#9fb0a6);font-size:12.5px}
.mwb__lys{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.mwb__lys button{min-width:36px;min-height:32px;padding:4px 8px;border-radius:8px;border:1px solid var(--border2,#24302a);background:var(--surface2,#18221c);color:var(--text,#e8efe9);font:700 12.5px var(--font-mono,monospace);cursor:pointer}
.mwb__lys button:hover{border-color:var(--green,#34e29b)}
.mwb__lys button[aria-pressed="true"]{background:var(--green,#34e29b);border-color:var(--green,#34e29b);color:#06120c}
.mwb__pl{display:grid;grid-template-columns:repeat(var(--w,5),minmax(0,1fr));gap:3px;width:100%;max-width:calc(var(--w,5) * 46px)}
.mwb__plph{grid-column:1/-1;margin:0;color:var(--muted,#9fb0a6);font-size:13.5px}
.mwb__c{position:relative;aspect-ratio:1;border-radius:5px;background:rgba(255,255,255,.035);display:grid;place-items:center;min-width:0}
.mwb__c img{width:90%;height:90%;object-fit:contain}
.mwb__c .mwb-ic--none{--s:80%!important;width:80%;height:80%;font-size:clamp(9px,2.6vw,13px)}
.mwb__c.is-later{opacity:.2}
.mwb__c.is-cur{background:rgba(52,226,155,.14)}
.mwb__c.is-cur::after{content:"";position:absolute;inset:0;border:2px solid var(--green,#34e29b);border-radius:5px;pointer-events:none}
.mwb__leg{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 0 0;padding:0}
.mwb__leg li{display:inline-flex;align-items:center;gap:6px;font-size:13px;line-height:1.25}
.mwb__leg img,.mwb__leg .mwb-ic--none{width:24px;height:24px;--s:24px}
.mwb__leg b{color:var(--lime,#8bdc4a);font:700 12.5px var(--font-mono,monospace)}
@media (max-width:600px){.mwb{padding:8px}.mwb__view{height:62vw;min-height:260px}.mwb__layer{margin-left:0}.mwb__plan{padding:10px 8px}}
@media (pointer:coarse){.mwb__tb{min-height:44px}}