@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-mono-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{color-scheme:light;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}body{margin:0}img{max-width:100%}[hidden]{display:none!important}

/* Layout: phone-first field app. Sticky top bar, one content column (max 780px), fixed bottom tab bar.
   Diagrams are soil cross-sections and plan views; where numbers matter they are drawn to scale. */
:root{
  --bg:#eceee9; --surface:#ffffff; --surface-2:#e2e5df; --ink:#1c2226; --muted:#596267; --line:#c8cdc5;
  --accent:#d24a0f; --accent-ink:#ffffff; --accent-soft:#f8dccd;
  --hazard:#f0b400; --hazard-soft:#fbefc4;
  --good:#2b7a2f; --good-soft:#d8ecd6; --bad:#c22a2a; --bad-soft:#f6d6d4; --warn:#9a5a00;
  --sky:#dce8ee; --soil:#b8683f; --soil-2:#93502f; --caliche:#d8c49a; --steel:#6f7d85; --steel-2:#9aa7ae; --spoil:#a35a35; --plan:#c9a77f; --planvoid:#6e3f27;
  --f-display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --f-body:"Barlow","Segoe UI",Roboto,Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --r:10px; --banner:#1c2226; --banner-ink:#eef0eb;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#13181b; --surface:#1c2327; --surface-2:#252d32; --ink:#e6ebe8; --muted:#9ba6aa; --line:#333d42;
  --accent:#ff7a38; --accent-ink:#1a0d05; --accent-soft:#4a2516;
  --hazard:#f5c518; --hazard-soft:#3d3312;
  --good:#6cc070; --good-soft:#1d3a1f; --bad:#f06a63; --bad-soft:#4a1f1d; --warn:#ffb74d;
  --sky:#1d2c35; --soil:#8a4b2d; --soil-2:#6c3a23; --caliche:#7d6d4f; --steel:#9aa8ae; --steel-2:#6f7d85; --spoil:#7a4227; --plan:#5c4632; --planvoid:#2c1a10;
  --banner:#0a0e10; --banner-ink:#e6ebe8;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#13181b; --surface:#1c2327; --surface-2:#252d32; --ink:#e6ebe8; --muted:#9ba6aa; --line:#333d42;
  --accent:#ff7a38; --accent-ink:#1a0d05; --accent-soft:#4a2516;
  --hazard:#f5c518; --hazard-soft:#3d3312;
  --good:#6cc070; --good-soft:#1d3a1f; --bad:#f06a63; --bad-soft:#4a1f1d; --warn:#ffb74d;
  --sky:#1d2c35; --soil:#8a4b2d; --soil-2:#6c3a23; --caliche:#7d6d4f; --steel:#9aa8ae; --steel-2:#6f7d85; --spoil:#7a4227; --plan:#5c4632; --planvoid:#2c1a10; --banner:#0a0e10; --banner-ink:#e6ebe8;
  color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:16px/1.5 var(--f-body);margin:0}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--accent)}
:focus-visible{outline:3px solid var(--hazard);outline-offset:2px}
h1,h2,h3{font-family:var(--f-display);line-height:1.1;text-wrap:balance;margin:0}
h1{font-size:2.1rem;letter-spacing:.01em}
h2{font-size:1.65rem}
h3{font-size:1.2rem;letter-spacing:.02em}
p{margin:0}
.mono{font-family:var(--f-mono)}

/* Top bar */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--banner);color:var(--banner-ink);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:10px 16px}
.top .brand{display:flex;align-items:center;gap:10px;min-width:0;flex:1;text-decoration:none;color:inherit}
.top .mark{width:30px;height:30px;flex:none}
.top .name{font-family:var(--f-display);font-weight:700;font-size:1.25rem;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top .ask{flex:none;background:var(--accent);color:var(--accent-ink);border:0;border-radius:999px;padding:7px 14px;font-weight:700;cursor:pointer}
.top .ask[hidden]{display:none}

.wrap{max-width:780px;margin:0 auto;padding-inline:16px;padding-block:18px 110px}

/* Bottom tabs */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--surface);border-top:1px solid var(--line);display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding-bottom:env(safe-area-inset-bottom,0px)}
.tabs a,.tabs button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 9px;text-decoration:none;color:var(--muted);background:none;border:0;font-size:.78rem;font-weight:600;cursor:pointer}
.tabs svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tabs .on{color:var(--accent)}

/* Home */
.hello{display:grid;gap:10px;margin-bottom:18px}
.hello .eyebrow{font:600 .78rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.hello p{color:var(--muted);max-width:60ch}
.meter{height:8px;background:var(--surface-2);border-radius:99px;overflow:hidden}
.meter i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .3s}
.progress{display:flex;justify-content:space-between;font-size:.85rem;color:var(--muted);gap:8px}
.group{margin-top:22px}
.group>h3{text-transform:uppercase;font-size:1rem;letter-spacing:.08em;color:var(--muted);margin-bottom:8px}
.mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.mod{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;text-decoration:none;color:var(--ink);min-width:0}
.mod:hover{border-color:var(--accent)}
.mod .n{font:600 .8rem var(--f-mono);color:var(--muted);width:2ch;text-align:right}
.mod b{font-weight:600;line-height:1.25}
.mod small{display:block;color:var(--muted);font-size:.82rem;line-height:1.3}
.mod .dot{width:10px;height:10px;border-radius:50%;border:2px solid var(--line)}
.mod .dot.done{background:var(--good);border-color:var(--good)}

/* Module page */
.crumb{font:600 .78rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.rule{background:var(--banner);color:var(--banner-ink);border-radius:var(--r);padding:16px;margin:14px 0;display:grid;gap:8px;border-left:8px solid var(--hazard)}
.rule p{font-family:var(--f-display);font-size:1.45rem;line-height:1.15;font-weight:700}
.cites{display:flex;flex-wrap:wrap;gap:6px}
.cite{font:600 .74rem var(--f-mono);background:var(--surface-2);color:var(--ink);border-radius:4px;padding:2px 6px;white-space:nowrap}
.rule .cite{background:rgba(127,127,127,.25);color:inherit}
.sec{margin-top:22px;display:grid;gap:10px}
.sec>h3{border-bottom:2px solid var(--accent);padding-bottom:4px}
.lead{font-size:1.05rem}
ul.pts,ol.pts{margin:0;padding-left:1.2em;display:grid;gap:6px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;min-width:0}
.callout{background:var(--hazard-soft);border-radius:var(--r);padding:12px 14px;display:grid;gap:4px}
.callout.bad{background:var(--bad-soft)}
.callout.good{background:var(--good-soft)}
.callout b{font-weight:700}

details.deep{background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
details.deep>summary{cursor:pointer;list-style:none;padding:12px 14px;font-weight:700;display:flex;justify-content:space-between;gap:8px;align-items:center}
details.deep>summary::-webkit-details-marker{display:none}
details.deep>summary::after{content:"+";font:700 1.3rem var(--f-mono);color:var(--accent)}
details.deep[open]>summary::after{content:"\2212"}
details.deep .body{padding:0 14px 14px;display:grid;gap:10px}
details.deep .body h4{margin:6px 0 0;font-size:1rem}

/* Diagram */
.viz{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;display:grid;gap:10px;min-width:0}
.viz svg{width:100%;height:auto;display:block}
.viz .cap{font-size:.85rem;color:var(--muted)}
.controls{display:grid;gap:10px}
.ctl{display:grid;gap:4px}
.ctl label{display:flex;justify-content:space-between;font-weight:600;font-size:.92rem}
.ctl output{font-family:var(--f-mono);color:var(--accent)}
input[type=range]{width:100%;accent-color:var(--accent)}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.field{display:grid;gap:4px;font-size:.9rem;font-weight:600}
.field input{border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:9px 10px;width:100%;font-family:var(--f-mono)}
.readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.readout div{background:var(--surface-2);border-radius:8px;padding:8px 10px}
.readout small{display:block;color:var(--muted);font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.readout b{font:600 1.15rem var(--f-mono)}
.verdict{border-radius:8px;padding:10px 12px;font-weight:700}
.verdict.ok{background:var(--good-soft);color:var(--good)}
.verdict.no{background:var(--bad-soft);color:var(--bad)}
.verdict.hm{background:var(--hazard-soft);color:var(--warn)}

/* SVG paint */
.s-sky{fill:var(--sky)} .s-soil{fill:var(--soil)} .s-soil2{fill:var(--soil-2)} .s-cal{fill:var(--caliche)} .s-spoil{fill:var(--spoil)}
.s-steel{fill:var(--steel)} .s-steel2{fill:var(--steel-2)} .s-plan{fill:var(--plan)} .s-planvoid{fill:var(--planvoid)} .s-surf{fill:var(--surface)}
.s-haz{fill:var(--hazard)} .s-acc{fill:var(--accent)} .s-bad{fill:var(--bad)} .s-good{fill:var(--good)}
.k-ink{stroke:var(--ink);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.k-mut{stroke:var(--muted);fill:none;stroke-width:1}
.k-acc{stroke:var(--accent);fill:none;stroke-width:2}
.k-bad{stroke:var(--bad);fill:none;stroke-width:1.6}
.k-good{stroke:var(--good);fill:none;stroke-width:1.6}
.k-haz{stroke:var(--hazard);fill:none;stroke-width:3}
.k-dash{stroke-dasharray:4 3}
.t{fill:var(--ink);font:600 12px var(--f-body)}
.t-s{fill:var(--muted);font:500 11px var(--f-body)}
.t-a{fill:var(--accent);font:700 12px var(--f-body)}
.halo{paint-order:stroke;stroke:var(--surface);stroke-width:3.5px;stroke-linejoin:round}
.t-b{fill:var(--bad);font:700 10.5px var(--f-body)}
.t-m{fill:var(--ink);font:600 10.5px var(--f-mono)}
.hot{cursor:pointer}
.hot circle{fill:var(--accent);stroke:var(--surface);stroke-width:2}
.hot text{fill:var(--accent-ink);font:700 11px var(--f-mono);text-anchor:middle;pointer-events:none}
.hot.on circle{fill:var(--ink)} .hot.on text{fill:var(--bg)}
.hot:focus{outline:none} .hot:focus-visible circle{stroke:var(--hazard);stroke-width:3}
.hotinfo{background:var(--surface-2);border-radius:8px;padding:10px 12px;min-height:3.2em}
.hotinfo b{display:block}
.hotkeys{display:flex;flex-wrap:wrap;gap:6px}

/* Checklists */
.checks{display:grid;gap:6px}
.chk{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 12px;cursor:pointer;text-align:left}
.chk input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--good)}
.chk:has(input:checked){background:var(--good-soft);border-color:transparent}
.chk span{min-width:0}

/* Reviewer rows */
.rev{display:grid;gap:8px}
.row{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;display:grid;gap:6px}
.row.ok{border-color:var(--good);background:var(--good-soft)}
.row.flag{border-color:var(--bad);background:var(--bad-soft)}
.row h4{margin:0;font-size:1rem}
.row .g{font-size:.9rem}
.row .g b{color:var(--good)} .row .r b{color:var(--bad)}
.row .r{font-size:.9rem}
.seg{display:flex;gap:6px;flex-wrap:wrap}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:7px 14px;font-weight:600;cursor:pointer;color:var(--ink)}
.btn:hover{border-color:var(--accent)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.sm{padding:4px 11px;font-size:.88rem}
.btn.okb[aria-pressed=true]{background:var(--good);border-color:var(--good);color:var(--surface)}
.btn.flb[aria-pressed=true]{background:var(--bad);border-color:var(--bad);color:var(--surface)}
.btnrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.summary{position:sticky;bottom:72px;z-index:5;background:var(--banner);color:var(--banner-ink);border-radius:var(--r);padding:10px 14px;display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;font-weight:600}

/* Table */
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:.92rem;min-width:520px}
th{background:var(--surface-2);text-align:left;padding:8px 10px;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
td{border-top:1px solid var(--line);padding:8px 10px;vertical-align:top}
td:first-child{font-weight:600}
td.num{font-family:var(--f-mono);font-weight:600;white-space:nowrap}
.search{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:9px 14px;width:100%}

/* Glossary */
.terms{display:grid;gap:6px}
.term{background:var(--surface);border:1px solid var(--line);border-radius:8px}
.term summary{padding:10px 12px;font-weight:700;cursor:pointer}
.term .body{padding:0 12px 12px;display:grid;gap:8px}

/* Swatches */
.sw{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.sw div{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px}
.sw i{width:26px;height:26px;border-radius:6px;flex:none;border:1px solid var(--line)}
.sw b{display:block;font-size:.9rem} .sw small{color:var(--muted);font-size:.8rem;line-height:1.2;display:block}

/* Quiz / games */
.q{display:grid;gap:10px}
.q .qtext{font-weight:700;font-size:1.08rem}
.opts{display:grid;gap:6px}
.opt{text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:8px;padding:10px 12px;cursor:pointer;color:var(--ink)}
.opt:hover:not(:disabled){border-color:var(--accent)}
.opt.right{background:var(--good-soft);border-color:var(--good)}
.opt.wrong{background:var(--bad-soft);border-color:var(--bad)}
.opt:disabled{cursor:default}
.why{background:var(--surface-2);border-radius:8px;padding:10px 12px}
.score{font:700 2.4rem var(--f-display)}

/* Photo drills */
.photo{border-radius:var(--r);overflow:hidden;background:var(--surface-2)}
.photo img{display:block;width:100%;max-height:520px;object-fit:cover}

/* Steps */
.steps{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.steps button{flex:none;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 12px;font-weight:600;cursor:pointer;color:var(--ink)}
.steps button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pager{display:flex;justify-content:space-between;gap:8px;margin-top:28px}
.pager a{flex:1;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;text-decoration:none;color:var(--ink);min-width:0}
.pager a small{display:block;color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.pager a.nx{text-align:right}

/* Coach */
.coach{position:fixed;inset:0;z-index:40;display:flex;flex-direction:column;background:var(--bg);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.coach header{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--banner);color:var(--banner-ink)}
.coach header b{font-family:var(--f-display);font-size:1.3rem;letter-spacing:.03em;text-transform:uppercase;flex:1}
.coach header button{background:none;border:1px solid rgba(127,127,127,.5);color:inherit;border-radius:999px;padding:5px 12px;cursor:pointer}
.chat{flex:1;overflow-y:auto;padding:14px 16px;display:grid;align-content:start;gap:10px;max-width:780px;width:100%;margin:0 auto}
.msg{border-radius:12px;padding:10px 12px;max-width:92%;min-width:0;overflow-wrap:anywhere}
.msg.me{justify-self:end;background:var(--accent);color:var(--accent-ink)}
.msg.ai{justify-self:start;background:var(--surface);border:1px solid var(--line)}
.msg.ai p+p,.msg.ai p+ul,.msg.ai ul+p,.msg.ai p+ol,.msg.ai ol+p{margin-top:8px}
.msg.ai ul,.msg.ai ol{margin:6px 0 0;padding-left:1.2em}
.msg.ai h4{margin:8px 0 2px}
.msg img{max-width:160px;border-radius:8px;display:block;margin-bottom:6px}
.msg.note{justify-self:center;background:none;color:var(--muted);font-size:.85rem;text-align:center}
.thinking{color:var(--muted);font-style:italic}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 12px;font-size:.88rem;cursor:pointer;text-align:left;color:var(--ink)}
.chip:hover{border-color:var(--accent)}
a.chip{text-decoration:none;display:inline-block}
.composer{border-top:1px solid var(--line);background:var(--surface);padding:10px 16px}
.composer .in{max-width:780px;margin:0 auto;display:grid;gap:8px}
.composer textarea{width:100%;min-height:52px;max-height:160px;resize:vertical;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--bg)}
.composer .bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.composer .grow{flex:1}
.attach{display:flex;align-items:center;gap:8px;font-size:.85rem}
.attach img{width:44px;height:44px;object-fit:cover;border-radius:6px}
.fine{font-size:.78rem;color:var(--muted)}
.ctabs{display:flex;gap:6px;padding:8px 16px;background:var(--surface);border-bottom:1px solid var(--line);overflow-x:auto}
.ctabs button{flex:none;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:6px 14px;font-weight:600;cursor:pointer}
.ctabs button.on{background:var(--banner);color:var(--banner-ink);border-color:var(--banner)}
.cview{flex:1;display:flex;flex-direction:column;min-height:0}
.lib{flex:1;overflow-y:auto;padding:14px 16px 28px}
.lib .in{max-width:780px;margin:0 auto;display:grid;gap:10px}
.lib .term .body p+p,.lib .term .body p+ul,.lib .term .body ul+p,.lib .term .body p+ol{margin-top:6px}
.lib .term .body ul,.lib .term .body ol{margin:4px 0 0;padding-left:1.2em}
.handoff{display:grid;gap:8px}
.handoff textarea{width:100%;min-height:70px;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--bg)}
a.btn{text-decoration:none;display:inline-block}
.pcnew{display:grid;gap:10px}
.pcpick{text-align:center;padding:14px;font-size:1.05rem}
.pcprev img{width:100%;max-height:340px;object-fit:contain;border-radius:8px;background:var(--surface-2)}
.pcnote{width:100%;min-height:64px;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--bg)}
.pclist{display:grid;gap:6px}
.pcrow{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:8px;text-decoration:none;color:var(--ink);min-width:0}
.pcrow img{width:56px;height:56px;object-fit:cover;border-radius:6px}
.pcrow b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcrow small{color:var(--muted);font-size:.8rem}
.pcrow span{min-width:0}
.pill{font:700 .72rem var(--f-mono);letter-spacing:.04em;border-radius:999px;padding:3px 9px;background:var(--surface-2);color:var(--muted);white-space:nowrap;text-transform:uppercase}
.pill.no,.pill.bad{background:var(--bad);color:var(--surface)} .pill.hm,.pill.warn{background:var(--hazard);color:#1c2226} .pill.ok{background:var(--good);color:var(--surface)} .pill.low{background:var(--surface-2);color:var(--ink)}
.pcverdict{display:grid;gap:2px;font-size:1.25rem;font-family:var(--f-display);letter-spacing:.03em;margin-top:12px}
.pcverdict small{font-family:var(--f-body);font-size:.95rem;font-weight:600;letter-spacing:0}
.hz{background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--line);border-radius:10px;padding:12px;display:grid;gap:6px}
.hz.bad{border-left-color:var(--bad)} .hz.warn{border-left-color:var(--hazard)} .hz.low{border-left-color:var(--steel-2)}
.hzh{display:flex;justify-content:space-between;gap:8px;align-items:center}
.pcchat{display:grid;gap:8px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}
@media (min-width:700px){h1{font-size:2.6rem}.rule p{font-size:1.7rem}}

/* ---- Mission Critical additions ---- */
.stick{position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
.stick .top{position:static}
.brandtxt{display:grid;line-height:1.05;min-width:0}
.brandtxt b{font-family:var(--f-display);font-weight:700;font-size:1.12rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brandtxt small{font-size:.78rem;opacity:.8;letter-spacing:.02em;white-space:nowrap}
.craftbar{background:var(--surface);border-bottom:1px solid var(--line);padding:8px 16px}
.craftbar .in{max-width:780px;margin:0 auto;display:flex;align-items:center;gap:8px}
.craftbar label{font:600 .72rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.craftbar select{flex:1;min-width:0;border:1.5px solid var(--accent);background:var(--bg);border-radius:10px;padding:9px 10px;font-weight:600;color:var(--ink)}
.badge{font:700 .72rem var(--f-mono);letter-spacing:.04em;border-radius:999px;padding:4px 10px;text-transform:uppercase}
.badge.draft{background:var(--hazard-soft);color:var(--warn)}
.badge.ok{background:var(--good-soft);color:var(--good)}
.mod .n{width:2.2ch}
.libmod{grid-template-columns:auto 1fr auto}
.libscope{display:flex;gap:6px;flex-wrap:wrap}
.wmount+.wmount{margin-top:12px}
details.deep .wmount{margin-top:4px}
select.search{border-radius:10px}
.foot{margin-top:28px;text-align:center}
.foot a{color:var(--muted);font-size:.85rem}
/* ---- offline bar, install tip, toast ---- */
.netbar{position:fixed;left:50%;transform:translateX(-50%);top:calc(env(safe-area-inset-top,0px) + 58px);z-index:30;background:var(--banner);color:var(--banner-ink);border:1px solid var(--hazard);border-radius:999px;padding:6px 14px;font-size:.82rem;font-weight:600;max-width:calc(100% - 32px);text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.tip{position:fixed;left:12px;right:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 70px);z-index:25;max-width:756px;margin:0 auto;background:var(--surface);border:2px solid var(--hazard);border-radius:12px;padding:12px 14px;display:grid;gap:8px;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.tip b{font-family:var(--f-display);font-size:1.15rem}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 74px);z-index:35;background:var(--good);color:var(--surface);border-radius:999px;padding:8px 16px;font-weight:700;font-size:.88rem;max-width:calc(100% - 32px);text-align:center}
/* ---- account, organization console, error banner ---- */
.top .acct{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--banner-ink);border:1.5px solid rgba(255,255,255,.35);position:relative}
.top .acct svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}
.top .acct.in::after{content:"";position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;background:var(--good);border:2px solid var(--banner)}
.signin{display:grid;gap:10px}
.signin .or{text-align:center}
.field select,.field textarea{width:100%}
.field input[readonly]{opacity:.85}
.captcha:empty{display:none}
.balance{display:grid;gap:10px}
.readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.orgrow{grid-template-columns:auto 1fr auto}
.orgrow .btnrow{flex-wrap:nowrap}
.packs .btn{flex:1 1 auto}
.danger{display:grid;gap:10px;border-color:var(--bad)}
textarea.secret{font-family:var(--f-mono);font-size:.8rem;min-height:90px}
.tbl select.search{padding:5px 8px;border-radius:8px;min-width:8.5em}
.errbar{position:fixed;left:12px;right:12px;top:calc(env(safe-area-inset-top,0px) + 8px);z-index:60;max-width:756px;margin:0 auto;background:var(--bad-soft);color:var(--ink);border:2px solid var(--bad);border-radius:12px;padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.errbar .errtxt{flex:1 1 220px;font-weight:600}
/* Private test mode: until gate.js opens the app, only the brand header and the gate screen show. */
body.gating .craftbar,body.gating .tabs,body.gating #topAsk,body.gating #topAcct,body.gating .coach,body.gating .tip{display:none!important}
#gate{display:grid;gap:14px;max-width:520px}

/* ---------- Photo Check report ---------- */
.pcv{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;border-radius:var(--r);padding:14px;margin-top:12px;border:1px solid var(--pcline);background:var(--pcbg);color:var(--pcink)}
.pcv svg{width:44px;height:44px;display:block}
.pcv svg .m{stroke:var(--pcbg);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pcv svg circle.m{fill:var(--pcbg);stroke:none}
.pcv b{display:block;font-family:var(--f-display);font-size:1.55rem;line-height:1.05;letter-spacing:.03em;text-transform:uppercase}
.pcv span{display:block;font-size:.95rem;font-weight:600;margin-top:3px;color:var(--ink)}
.pcv.v-stop{--pcbg:var(--bad-soft);--pcink:var(--bad);--pcline:var(--bad)}
.pcv.v-fix{--pcbg:var(--hazard-soft);--pcink:var(--warn);--pcline:var(--hazard)}
.pcv.v-ok{--pcbg:var(--good-soft);--pcink:var(--good);--pcline:var(--good)}
.pcv.v-unclear{--pcbg:var(--surface-2);--pcink:var(--muted);--pcline:var(--line)}
.pcsum{font-size:1.02rem}
.pcgrid{display:grid;gap:10px}
.hzc{background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--line);border-radius:10px;padding:12px;display:grid;gap:8px;min-width:0}
.hzc.sev-high{border-left-color:var(--bad)} .hzc.sev-medium{border-left-color:var(--hazard)} .hzc.sev-low{border-left-color:var(--muted)}
.hzc header{display:flex;gap:8px;align-items:center;min-width:0}
.hzc .hzn{font:700 .8rem var(--f-mono);width:24px;height:24px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;flex:none}
.hzc header b{flex:1;font-size:1.05rem;line-height:1.2;min-width:0;overflow-wrap:anywhere}
.hzl{display:grid;grid-template-columns:7.2em 1fr;gap:8px;font-size:.95rem;line-height:1.4}
.hzk{font:600 .72rem var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding-top:3px}
@media (max-width:340px){.hzl{grid-template-columns:1fr;gap:2px}}
button.hzcite{border:0;cursor:pointer;justify-self:start;background:var(--accent-soft);color:var(--ink);white-space:normal;text-align:left}
button.hzcite:hover{text-decoration:underline}
.pctodo{display:grid;gap:8px}
.pctodo label{display:flex;gap:10px;align-items:flex-start;font-size:.98rem;cursor:pointer}
.pctodo input{margin-top:4px;flex:none;width:18px;height:18px;accent-color:var(--accent)}
.pctodo input:checked+span{color:var(--muted);text-decoration:line-through}
.pclist{margin:0;padding-left:1.2em;display:grid;gap:4px;font-size:.95rem}
.pclesson h4{font-family:var(--f-display);font-size:1.2rem;margin:0 0 6px}
.pcmore[hidden]{display:none}

/* ---------- Desktop background photos (one per craft group) ----------
   body[data-bg] is set by render() from the current craft's group. Only at 1000px and
   wider: phones never load these files. Dark mode dims the photo so text stays readable. */
@media (min-width:1000px){
  body[data-bg]{background:var(--bg-photo,none) center / cover no-repeat fixed var(--bg)}
  body[data-bg] .wrap{background:var(--bg);box-shadow:0 0 0 1px var(--line),0 0 48px rgba(0,0,0,.22)}
  body[data-bg]::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:rgba(10,14,16,0)}
  :root:not([data-theme="light"]) body[data-bg]::before{background:rgba(10,14,16,.38)}
  body[data-bg="site"]{--bg-photo:url(bg/site.jpg)}
  body[data-bg="lifting"]{--bg-photo:url(bg/lifting.jpg)}
  body[data-bg="power"]{--bg-photo:url(bg/power.jpg)}
  body[data-bg="mechanical"]{--bg-photo:url(bg/mechanical.jpg)}
  body[data-bg="logistics"]{--bg-photo:url(bg/logistics.jpg)}
  body[data-bg="emergency"]{--bg-photo:url(bg/emergency.jpg)}
  body[data-bg="semi"]{--bg-photo:url(bg/semi.jpg)}
}
@media (min-width:1000px) and (prefers-color-scheme: dark){:root:not([data-theme="light"]) body[data-bg]::before{background:rgba(10,14,16,.38)}}
@media (min-width:1000px) and (prefers-color-scheme: light){:root:not([data-theme="dark"]) body[data-bg]::before{background:rgba(10,14,16,0)}}