/* crimemap (UX redesign 2026-10-06): Crime Map page, ui/crimemap.js. Two columns on wide windows (list 44% | map + detail 56%), one column on phones. */
.cmScr { --cmIn:linear-gradient(180deg,#123a72,#0e2d5c); }
html.lay-desk .pgScr.cmScr { max-width:1320px; }
.cmBar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; }
.cmScr .cmChips { display:flex; flex-wrap:wrap; flex:1 1 auto; min-width:0; margin:0; padding:3px 0 10px; overflow:visible; }
.cmSort { display:flex; align-items:center; gap:6px; flex:none; padding-bottom:10px; }
.cmSort span { font:400 13px var(--fh); color:#fff; text-shadow:var(--so2); }
.cmSort select { min-height:36px; padding:4px 10px; border:2.5px solid var(--ol); border-radius:12px; background:#0b2448; color:#fff; font:800 13px var(--fb); }

.cmGrid { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; align-items:start; }
.cmScr { container:pg / inline-size; } /* M2: see loadout.css */
@container pg (min-width:820px) { .cmGrid { grid-template-columns:minmax(0,44fr) minmax(0,56fr); } .cmRight { position:sticky; top:8px; } }
.cmLeft { display:flex; flex-direction:column; gap:10px; min-width:0; }
.cmRight { display:flex; flex-direction:column; gap:12px; min-width:0; }

/* pinned Drop In */
.cmDrop, .cmJob { position:relative; display:flex; align-items:center; gap:10px; width:100%; text-align:left; color:#fff; cursor:pointer;
  border:3px solid var(--ol); border-radius:16px; background:var(--panelBg); box-shadow:var(--panelSh); padding:10px 12px; transition:transform .07s; }
.cmDrop:active, .cmJob:active { transform:translateY(2px); }
.cmDrop { padding:12px 14px; }
.cmDrop.on, .cmJob.on { box-shadow:var(--panelSh), 0 0 0 3px var(--yl2); }
.cmDrop .cmDi, .cmDh .cmDi { font-size:34px; line-height:1; flex:none; filter:drop-shadow(0 2px 0 rgba(0,0,0,.35)); }
.cmDrop .cmJm b { font:400 24px/1 var(--fh); text-shadow:var(--so); }
.cmDrop small { display:block; margin-top:3px; color:var(--mut); font:800 12.5px var(--fb); }
.cmSel { margin-left:auto; flex:none; padding:5px 10px; border:2.5px solid var(--ol); border-radius:11px; background:linear-gradient(180deg,#2a6cbc,#1a4c90); font:400 13px var(--fh); text-shadow:var(--so2); }
.cmDrop.on .cmSel { background:linear-gradient(180deg,var(--yl1),var(--yl2) 60%,var(--yl3)); }

/* challenge / task sections */
.cmSec { border:3px solid var(--ol); border-radius:16px; background:var(--cmIn); box-shadow:var(--panelSh); padding:0 10px; }
.cmSec > summary { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:10px 2px; cursor:pointer; list-style:none; }
.cmSec > summary::-webkit-details-marker { display:none; }
.cmSec > summary::before { content:"▸"; color:var(--mut); transition:transform .15s; }
.cmSec[open] > summary::before { transform:rotate(90deg); }
.cmSec > summary b { font:400 16px var(--fh); text-shadow:var(--so2); }
.cmSec > summary small { color:var(--mut); font:700 11.5px var(--fb); }
.cmN { margin-left:auto; padding:2px 8px; border-radius:9px; border:2px solid var(--ol); background:linear-gradient(180deg,var(--gr1),var(--gr2)); font:400 12px var(--fh); font-style:normal; text-shadow:var(--so2); }
.cmSec .jList { padding-bottom:10px; }
.cmSec .jSec { margin-top:0; }

/* jobs */
.cmJobs { display:flex; flex-direction:column; gap:8px; }
.cmH { font:400 16px var(--fh); text-shadow:var(--so2); margin:4px 2px 0; }
.cmGrp { display:flex; flex-direction:column; gap:7px; padding:8px; border:3px solid var(--ol); border-radius:16px; background:linear-gradient(180deg,color-mix(in srgb,var(--c,#5f7896) 26%,#123a72),#0e2d5c); }
.cmGh { display:flex; align-items:center; gap:8px; padding:0 2px 2px; }
.cmGh b { font:400 17px var(--fh); text-shadow:var(--so2); }
.cmGh em { font:400 15px var(--fh); font-style:normal; color:var(--mut); text-shadow:var(--so2); }
.cmGh em.st-friendly, .cmGh em.st-trusted, .cmGh em.st-connected { color:var(--grn); }
.cmGh em.st-neutral { color:var(--gold); }
.cmGh em.st-wary { color:#ffb35a; } .cmGh em.st-hostile { color:var(--red); }
.cmJob { border-left:6px solid var(--c,#5f7896); }
.cmJob.lock { filter:saturate(.45) brightness(.82); }
.cmJi { flex:none; width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:24px; background:#0b2448; border:2.5px solid var(--ol); }
.cmJm { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:3px; }
.cmJn { font:400 16px/1.1 var(--fh); text-shadow:var(--so2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cmJr { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.cmTag { display:inline-block; padding:1px 8px 2px; border:2px solid var(--ol); border-radius:9px; background:#3a5fa8; font:400 11.5px/1.3 var(--fh); text-transform:capitalize; text-shadow:var(--so2); }
.cmTag.t-heist { background:#c0479b; } .cmTag.t-delivery { background:#1f9c8a; } .cmTag.t-hunt { background:#c4542c; }
.cmTag.t-recovery { background:#4f8a2c; } .cmTag.t-sabotage { background:#7a4fc4; } .cmTag.t-supply { background:#2b7bd1; }
.cmSk { display:inline-flex; gap:1px; font-size:13px; line-height:1; }
.cmSk i { font-style:normal; color:#3b5d92; text-shadow:0 1px 0 var(--ol); }
.cmSk i.on { color:var(--gold); }
.cmPay { display:inline-flex; align-items:center; gap:4px; font:400 15px var(--fh); color:var(--gold); text-shadow:var(--so2); }
.cmPay .coin { width:1em; height:1em; }
.cmXp { font:400 13px var(--fh); color:var(--blue); text-shadow:var(--so2); }
.cmWhy { color:#ffcf9a; font:800 11.5px var(--fb); }
.cmJc { flex:none; display:flex; flex-direction:column; align-items:center; gap:2px; max-width:86px; text-align:center; }
.cmJc small { font:800 10px/1.1 var(--fb); color:var(--mut); }
.cmEmb { width:34px; height:34px; flex:none; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#0b1a33; border:3px solid var(--c); color:#fff; font:700 17px/1 system-ui,sans-serif; box-shadow:0 2px 0 rgba(0,0,0,.35); }

/* map */
.cmMap { position:relative; aspect-ratio:4 / 3; border:3px solid var(--ol); border-radius:16px; overflow:hidden; background:#1e5f8a; box-shadow:var(--panelSh); }
.cmMap canvas { position:absolute; inset:0; width:100%; height:100%; display:block; }
.cmWait { position:absolute; inset:0; display:none; align-items:center; justify-content:center; color:var(--mut); font:800 14px var(--fb); }
.cmMap.wait .cmWait { display:flex; }

/* detail card */
.cmCard { margin:0; display:flex; flex-direction:column; gap:10px; }
.cmDh { display:flex; align-items:center; gap:12px; }
.cmDh .cmEmb { width:46px; height:46px; font-size:22px; }
.cmDh h2 { font:400 26px/1.05 var(--fh); text-shadow:var(--so); }
.cmDh small { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:3px; color:var(--mut); font:800 12.5px var(--fb); }
.cmFacts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.cmFacts > div { padding:9px 10px; border:2.5px solid var(--ol); border-radius:12px; background:var(--cmIn); font:800 12.5px/1.3 var(--fb); }
.cmBrief { font:700 13.5px/1.4 var(--fb); color:#e6f1ff; }
.cmLockNote { padding:7px 10px; border:2.5px solid var(--ol); border-radius:12px; background:rgba(255,120,60,.22); color:#ffd9b8; font:800 12.5px var(--fb); }
.cmKvs { display:grid; grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); gap:7px; }
.cmKv { padding:7px 10px; border:2.5px solid var(--ol); border-radius:12px; background:var(--cmIn); }
.cmKv small { display:block; color:var(--mut); font:800 10.5px var(--fb); text-transform:uppercase; letter-spacing:.3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cmKv b { font:400 16px var(--fh); text-shadow:var(--so2); }
.cmKv.up b { color:var(--grn); } .cmKv.down b { color:var(--red); }

/* loadout strip + launch */
.cmStrip { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:8px 10px; border:2.5px solid var(--ol); border-radius:12px; background:#0b2448; font:800 13px var(--fb); }
.cmCar { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--mut); }
.cmCar b { color:#fff; }
.cmIns { display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.cmIns input { width:18px; height:18px; accent-color:var(--grn); }
.cmProt { color:var(--grn); }
.cmEdit { border:0; background:none; padding:4px 2px; color:var(--blue); font:800 13px var(--fb); text-decoration:underline; cursor:pointer; }
.cmGo { width:100%; }
/* C1 (review 2026-10-07): launch bar pinned to the bottom of the page: job name + payout + START HEIST, never below the fold */
.cmGoBar { position:sticky; bottom:0; z-index:5; display:flex; align-items:center; gap:12px; margin:12px -4px 0; padding:10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
  background:linear-gradient(180deg,rgba(9,24,52,.94),#091834); border:3px solid #061226; border-radius:16px 16px 0 0; box-shadow:0 -6px 18px rgba(0,0,0,.35); }
.cmGoBar .cmGoInfo { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.cmGoBar .cmGoInfo b { font:400 20px/1.1 var(--fh); letter-spacing:.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cmGoBar .cmGoInfo small { font:700 13px/1.25 var(--fb); color:#bcd3f5; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cmGoBar .cmGo { width:auto; flex:0 0 auto; min-width:min(46%, 280px); }
.cmGoBar .cmGo:disabled { filter:grayscale(.7) brightness(.8); }
.cmGoBar .cmSandbox { flex:0 0 auto; background:#16181d; color:#7ff05a; border:2px solid #7ff05a; }
@media (max-width:1000px) { .cmGoBar .cmSandbox { padding-left:12px; padding-right:12px; } .cmGoBar .cmSandbox span { display:none; } } /* phones and tablets: the icon alone, DROP IN keeps its room */
.cmGoBar .cmLockGo { background:rgba(255,255,255,.06); color:var(--mut, #b9b2a6); border:1px solid rgba(255,255,255,.14); font-size:.85em; white-space:normal; }

@media (max-width:520px) {
  .cmFacts { grid-template-columns:1fr; }
  .cmJc small { display:none; }
  .cmDrop .cmJm b { font-size:21px; }
  .cmScr .cmChips { flex-wrap:nowrap; overflow-x:auto; margin:0 -12px; padding:3px 12px 10px; }
  .cmSort { width:100%; }
  .cmSort select { flex:1; }
}
.cmShort { color:#ffb43c; } .cmShort .btn { margin-left:6px; vertical-align:middle; }
.cmWarn { margin:0; padding:8px 10px; border-radius:10px; background:rgba(255,120,60,.14); border:2px solid rgba(255,140,80,.5); font:700 13px/1.35 var(--fb); color:#ffd2b8; } /* C5 */