/* upper-limb/ landing page: additions to ../truncal/landing.css (three page cards, rapid-fire rules, the "what each
   block costs" list, region headings in the operation chooser, and the arm coverage map from
   ../shared/regional/js/figures/arm.js). Prefix ul-. */
.ul-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.tb-res-grid--text{grid-template-columns:minmax(0,1fr)}

/* rapid fire */
.ul-rules{list-style:none;counter-reset:r;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px;border-top:1px solid var(--ink)}
.ul-rules li{counter-increment:r;display:grid;grid-template-columns:34px minmax(0,1fr);gap:4px;padding:14px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.55;color:var(--ink-soft)}
.ul-rules li::before{content:counter(r,decimal-leading-zero);font:500 13px/1.9 var(--mono);color:var(--wine)}
.ul-rules strong{color:var(--ink);font-weight:600}
.ul-cost{margin:36px 0 0;max-width:880px}
.ul-cost h3{font:400 24px/1.25 var(--serif);letter-spacing:-.01em;margin:0 0 10px!important}
.ul-cost dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px;border-top:1px solid var(--line)}
.ul-cost dl>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.5}
.ul-cost dt{font-weight:600}
.ul-cost dd{margin:0;color:var(--ink-soft)}
.ul-cost .ul-w{color:#a12a1c;font-weight:600}
.ul-cost .ul-ok{color:#2f6b3a;font-weight:600}

/* chooser */
.ul-ops-region{font:500 12px/1.5 var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--wine);margin:16px 0 6px!important;grid-column:1/-1}
.ul-ops-region:first-child{margin-top:10px!important}
.ul-line{display:grid;gap:2px;margin:0 0 22px!important;padding:12px 16px;background:var(--inset);border-left:3px solid var(--wine);font:500 17px/1.5 var(--sans);max-width:72ch}
.ul-line-k{font:500 12px/1.5 var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.ul-dd{font-size:15px;line-height:1.55}
.ul-opt-dose{margin-top:4px!important;font:500 14px/1.5 var(--mono);color:var(--ink)}
.ul-opt-k{font:500 12px/1.5 var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-right:6px}
.ul-opt-pg{font-weight:400;color:var(--muted)}
.tb-opt-h.ul-opt-h--no{color:#a12a1c}
.ul-miss li::marker{color:#a12a1c}
.ul-more{margin-top:14px;border-top:1px solid var(--line);padding-top:4px}

/* Coverage map from ../shared/regional/js/figures/arm.js (regional.css is not loaded on this page). */
.tb-app .tb-cov{margin:0;max-width:420px}
.tb-app .tb-cov-stage{border:1px solid var(--line);background:#fbf9f4;padding:8px}
.tb-app .ul-cov-views{display:grid;gap:6px;align-items:start;grid-template-columns:repeat(2,minmax(0,1fr))}
.tb-app .ul-cov-views--1{grid-template-columns:minmax(0,1fr);max-width:200px;margin:0 auto}
.tb-app .ul-cov-view{min-width:0}
.tb-app .ul-cov-svg{display:block;width:100%;height:auto}
.tb-app .ul-cov-vname{margin:2px 0 0!important;font-size:14px;line-height:1.3;color:var(--muted);text-align:center}
.tb-app .tb-cov-legend{list-style:none;margin:10px 0 0;padding:0}
.tb-app .tb-cov-legend li{display:flex;align-items:center;gap:10px;margin:0 0 6px;font-size:15px;line-height:1.4}
.tb-app .tb-cov-sw{flex:none;width:28px;height:18px;border:1px solid #1d4f7c}
.tb-app .tb-cov-sw--dense{background:rgba(44,116,179,.78)}
.tb-app .tb-cov-sw--moderate{background:repeating-linear-gradient(45deg,#1d4f7c 0 2px,rgba(44,116,179,.32) 2px 6px)}
.tb-app .tb-cov-sw--patchy{background:radial-gradient(circle,#1d4f7c 1.1px,transparent 1.4px) 0 0/6px 6px,rgba(44,116,179,.12)}
.tb-app .ul-cov-sw--deep{background:repeating-linear-gradient(-45deg,#183f63 0 1px,transparent 1px 4px),rgba(44,116,179,.25);border:1.5px solid #183f63}
.tb-app .tb-cov-note{color:var(--muted);font-size:14px}
.tb-app .ul-cov-zones{list-style:none;margin:8px 0 0;padding:8px 0 0;border-top:1px solid var(--line)}
.tb-app .ul-cov-zones li{font-size:15px;line-height:1.5;margin:0 0 4px;color:var(--ink-soft)}
.tb-app .ul-cov-zones strong{font-weight:600;color:var(--ink)}

@media (max-width:1180px){.ul-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .ul-cards{grid-template-columns:1fr}
  .ul-rules,.ul-cost dl{grid-template-columns:1fr}
}
@media (max-width:760px){
  .ul-ops-region{margin-top:12px!important}
  .ul-cost dl>div{grid-template-columns:1fr;gap:2px}
  .tb-app .tb-cov{max-width:none}
}
.ul-nowrap{white-space:nowrap}
.tb-app #chooser,.tb-app #tb-res-title{scroll-margin-top:96px}
