/* Avlory Engine /engine/sculpt: the chapter demos. Scoped to main.xp.eg; shared parts are in engine-core.css. */
.eg .demo2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
@media (max-width:900px){.eg .demo2{grid-template-columns:1fr}}
.eg .demo-view{padding:20px;display:grid;gap:10px;place-items:center;align-content:center;background:radial-gradient(80% 80% at 50% 40%,#25252c,#121215);min-width:0}
.eg .demo-view.light{background:var(--paper)}
.eg .demo-view canvas{display:block;width:100%;max-width:440px;height:auto;border-radius:14px;touch-action:none;outline:none}
.eg .demo-view canvas:focus-visible{box-shadow:0 0 0 2px var(--acc)}
.eg .demo-view svg{display:block;width:100%;max-width:440px;height:auto}
.eg .demo-view > .note{text-align:center;max-width:52ch}
.eg .demo-side{padding:20px;display:grid;gap:12px;align-content:start;border-left:1px solid var(--border);min-width:0}
@media (max-width:900px){.eg .demo-side{border-left:0;border-top:1px solid var(--border)}}
.eg .btnrow{display:flex;gap:8px;flex-wrap:wrap}
.eg .fchk{display:flex;gap:8px;align-items:center}
.eg .rng{display:grid;gap:6px;font-size:12.5px;color:var(--muted)}
.eg .rng > span{display:flex;justify-content:space-between}
.eg .rng b{color:var(--text);font-weight:600}
.eg input[type=range]{width:100%;accent-color:var(--acc)}
.eg input[type=checkbox]{accent-color:var(--acc)}
.eg .seg button[aria-pressed="true"]{background:color-mix(in srgb,var(--acc) 22%,transparent);color:var(--text)}
.eg .hist{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:12.5px;max-height:132px;overflow:auto}
.eg .hist li{display:flex;justify-content:space-between;gap:8px;padding:5px 8px;border-radius:8px;background:var(--surface-1)}
.eg .hist li span{font:500 11px var(--f-mono);color:var(--faint)}
.eg .hist li.undone{color:var(--faint);text-decoration:line-through}
.eg .hist li.empty{background:none;color:var(--faint);padding-left:0}

/* fillet */
.eg .fld{display:grid;gap:6px;font-size:12.5px;color:var(--muted)}
.eg .inp{display:flex;align-items:center;gap:8px;background:var(--field);border:1px solid var(--border-strong);border-radius:12px;padding:0 12px}
.eg .inp input{flex:1;min-width:0;background:none;border:0;color:var(--text);font:600 15px var(--f-body);padding:10px 0;font-variant-numeric:tabular-nums}
.eg .inp input:focus-visible{outline:none}
.eg .inp:focus-within{outline:2px solid var(--acc);outline-offset:1px}
.eg .inp span{color:var(--faint);font-size:13px}
.eg .diag{display:grid;gap:8px;padding:14px 16px;border-radius:14px;background:rgba(255,93,115,.07);border-left:3px solid var(--danger)}
.eg .diag h3{font:700 14px var(--f-body);letter-spacing:0;color:var(--text)}
.eg .diag p{font-size:13px;color:var(--text);text-wrap:pretty}
.eg .diag p.note{color:var(--muted)}
.eg .okmsg{font-size:13px;color:var(--ok)}
.eg .okmsg:empty{display:none}

/* paint */
.eg .swatches{display:flex;gap:6px;flex-wrap:wrap}
.eg .swatches button{width:28px;height:28px;border-radius:50%;border:2px solid transparent;padding:0;background:var(--sw)}
.eg .swatches button[aria-pressed="true"]{border-color:var(--text);box-shadow:0 0 0 2px var(--card)}
.eg .layers{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:12px;color:var(--muted)}
.eg .layers li{padding:6px 9px;border-radius:8px;border:1px solid var(--border)}
.eg .layers b{color:var(--text);font-weight:600}

/* rig */
.eg .rigcheck{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13px}
.eg .rigcheck li{display:grid;grid-template-columns:16px 1fr auto;gap:8px;align-items:baseline}
.eg .rigcheck li span{color:var(--faint);font-size:12px}
.eg .rigcheck li.bad{color:var(--danger)}
.eg .rigcheck li.bad span{color:var(--danger)}
.eg .rigcheck li::before{content:""}
.eg .rigcheck li.good::before{content:"✓";color:var(--ok)}
.eg .rigcheck li.bad::before{content:"✕"}
.eg #sc-rig .bone{stroke:#d9d9e3;stroke-width:3;stroke-linecap:round}
.eg #sc-rig .bone.bad{stroke:var(--danger)}
.eg #sc-rig .bone.sel{stroke:var(--acc);stroke-width:4.5}
.eg #sc-rig .skin{fill:#d99a7c}
.eg #sc-rig .ring{fill:none;stroke:var(--warn);stroke-width:2}
.eg #sc-rig .joint{fill:#0d0d10;stroke:#d9d9e3;stroke-width:1.5}

/* import report and game-ready */
.eg .demo-view.report{place-items:stretch;align-content:start;background:var(--card-2)}
.eg .rp-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.eg .rp-counts{list-style:none;margin:0;padding:0;display:flex;gap:16px;flex-wrap:wrap;font-size:13px}
.eg .rp-counts li{display:flex;gap:6px;align-items:center}
.eg .rp-counts li::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.eg .rp-counts b{font-variant-numeric:tabular-nums}
.eg .st-exact{color:var(--ok)}
.eg .st-approx{color:var(--warn)}
.eg .st-no{color:var(--danger)}
.eg .rp-lines{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13px}
.eg .rp-lines li{padding:8px 10px;border-radius:10px;background:var(--surface-1);border-left:2px solid currentColor;color:var(--muted)}
.eg .rp-lines li b{display:block;font:600 11px var(--f-mono);margin-bottom:2px}
.eg .gr{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13px}
.eg .gr li{display:grid;grid-template-columns:40px 1fr;gap:2px 10px;padding:8px 10px;border-radius:10px;background:var(--surface-1)}
.eg .gr li i{font:700 10.5px/1.6 var(--f-body);font-style:normal;text-transform:uppercase;letter-spacing:.06em;grid-row:span 2}
.eg .gr li i.pass{color:var(--ok)}
.eg .gr li i.warn{color:var(--warn)}
.eg .gr li i.fail{color:var(--danger)}
.eg .gr li span{color:var(--text)}
.eg .gr li small{color:var(--muted);font-size:12px}
.eg .conv{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font-size:12.5px}
.eg .conv dt{color:var(--faint)}
.eg .conv dd{margin:0;color:var(--text)}

/* fillet cross-section (a light page, like a CAD drawing) */
.eg #sc-fillet-svg .solid{fill:#d9d3c7;stroke:var(--ink);stroke-width:1.5}
.eg #sc-fillet-svg .solid.bad{fill:rgba(255,93,115,.22);stroke:#b3263c}
.eg #sc-fillet-svg .lbl{font:600 13px var(--f-body);fill:#55555c}
.eg #sc-fillet-svg .lbl.small{font-size:11.5px;fill:#0a6b6b}
.eg #sc-fillet-svg .dim{fill:none;stroke:#55555c;stroke-width:1}
.eg #sc-fillet-svg .dimh{fill:#55555c}
.eg #sc-fillet-svg .dimt{font:600 12.5px var(--f-mono);fill:var(--ink)}
.eg #sc-fillet-svg .ghost{fill:none;stroke:#b3263c;stroke-width:2;stroke-dasharray:5 4}
.eg #sc-fillet-svg .tight{fill:none;stroke:#c98a00;stroke-width:2.5}
.eg #sc-fillet-svg .edge{fill:#0a8f8f;stroke:#fff;stroke-width:1.5}
.eg #sc-fillet-svg .edge.bad{fill:#b3263c}
.eg #sc-rig .skinl polyline{stroke:#d99a7c;opacity:.9}
.eg #sc-rig .rlbl{font:600 12px var(--f-mono);fill:var(--muted)}
.eg #sc-rig .rlbl.bad{fill:var(--danger)}

/* 02: Avlory's own CAD engine */
.eg .part{display:grid;gap:14px;margin-top:40px;padding-top:32px;border-top:1px solid var(--border)}
.eg .part-head{display:grid;gap:8px;max-width:70ch}
.eg .part-head h3{font-size:clamp(22px,3vw,30px);font-weight:800;text-wrap:balance}
.eg .part-head h3 em{font-style:normal;color:var(--acc)}
.eg .part-head p{color:var(--muted)}
.eg .part table.t caption{caption-side:top;text-align:left;padding:14px 16px 0;font-size:12.5px;color:var(--muted)}
.eg .part table.t tbody th{font:600 13px var(--f-body);letter-spacing:0;text-transform:none;color:var(--text);min-width:130px}
.eg .part table.t td{color:var(--muted)}
.eg .part table.t td.y{color:var(--ok)}
.eg .cad-card{padding:22px;border-radius:20px;display:grid;gap:10px;align-content:start}
.eg .cad-card h4{font:700 15px var(--f-body)}
.eg .cad-card p{font-size:13px;color:var(--muted);text-wrap:pretty}

/* 07: the translation layer */
.eg .pipe{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.eg .pipe li{position:relative;display:grid;gap:4px;align-content:start;padding:14px 16px;border-radius:16px;border:1px solid var(--border);background:var(--card)}
.eg .pipe li:nth-child(3){border-color:color-mix(in srgb,var(--acc) 55%,transparent)}
.eg .pipe li b{font:600 14px var(--f-body);color:var(--text)}
.eg .pipe li > span:last-child{font-size:12.5px;color:var(--muted);text-wrap:pretty}
.eg .pipe li + li::before{content:"→"/"";position:absolute;left:-17px;top:50%;transform:translateY(-50%);color:var(--acc);font-weight:700}
@media (max-width:900px){
  .eg .pipe{grid-template-columns:1fr;gap:20px}
  .eg .pipe li + li::before{content:"↓"/"";left:22px;top:-19px;transform:none}
}
.eg .tl-mode{font:600 11px var(--f-body);padding:4px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--ok) 50%,transparent);color:var(--ok)}
.eg .tl-mode.raw{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 50%,transparent)}
.eg #sc-tl-svg{display:block;width:100%;max-width:none;height:auto;border-radius:12px;background:var(--surface-1)}
.eg #sc-tl-svg .ground{stroke:var(--border-strong);stroke-width:1.5}
.eg #sc-tl-svg .body{fill:color-mix(in srgb,var(--acc) 28%,var(--card));stroke:var(--acc);stroke-width:2;stroke-linejoin:round}
.eg #sc-tl-svg .body.raw{fill:rgba(242,184,75,.16);stroke:var(--warn)}
.eg #sc-tl-svg .hole{fill:var(--surface-1);stroke:var(--acc);stroke-width:1.5}
.eg #sc-tl-svg .person{fill:var(--muted)}
.eg #sc-tl-svg .dim{fill:none;stroke:var(--muted);stroke-width:1}
.eg #sc-tl-svg text{font:12px var(--f-body);fill:var(--muted)}
.eg #sc-tl-svg text.big{font:600 13px var(--f-mono);fill:var(--text)}
.eg #sc-tl-svg text.warn{fill:var(--warn)}
.eg #sc-tl-svg .axis{stroke:var(--faint);stroke-width:1.5;marker-end:none}
.eg .rp-lines li .nt{display:block;color:var(--faint);font-size:12px;margin-top:2px}

/* Status: the marketplace note */
.eg .mk-ti{margin-top:14px;border-style:dashed}
.eg .mk-ti p{font-size:13px;max-width:90ch}
.eg .mk-ti a{color:var(--accent-text,var(--text))}
@media (max-width:600px){
  .eg #sc-tl-svg text{font-size:17px}
  .eg #sc-tl-svg text.big{font-size:18px}
}