/* Layout v2 (from eng/hq-layout-v1 e616615/eecca31/c162f3f look; owner box left out, Name matches replaces it). SCREEN ONLY: the whole
   file sits in @media screen, so print output is exactly live (fix 1). */
@media screen{
/* D-plumeform-layout-20261103 (TEST SITE ONLY): HaulQuote layout v1 for the home page and the report page.
   Own CSS; layout idea only (navy hero band, pill header, centred search card, rounded light cards). No copied code, text, images or fonts.
   Colours sampled from /workspace/haulquote/brand logos: navy #172946, white #FEFEFE (used as #FFFFFF), orange #F79B07.
   Text is always dark navy on white/light grey cards, or white on navy; orange is only a fill under navy text or a stat on navy.
   Every tap target >= 48px. Loaded last (server.js) on body.hm-home.gl and body.report-page.qpage only; HQ_LAYOUT=off leaves it out. */
:root{--ly-navy:#172946;--ly-white:#FFFFFF;--ly-orange:#F79B07;--ly-page:#EEF1F5;--ly-line:#C9D1DD;--ly-text:#172946;--ly-muted:#2A3850;--ly-ink:#0F1D33;--ly-r:20px;--ly-sh:0 2px 10px rgba(23,41,70,.10)}
body.hm-home.gl,body.report-page.qpage{background:var(--ly-page);color:var(--ly-text);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
/* header: navy pill bar, 48px menu button */
body.hm-home.gl .hq-hd,body.report-page.qpage .hq-hd{background:var(--ly-navy);margin:10px 10px 0;border-radius:999px;padding:6px 8px 6px 14px;min-height:60px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between}
body.hm-home.gl .hq-hd .hq-logo,body.report-page.qpage .hq-hd .hq-logo{color:var(--ly-white);min-height:48px;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
body.hm-home.gl .hq-hd .hq-logo span,body.report-page.qpage .hq-hd .hq-logo span{color:var(--ly-orange)}
body.hm-home.gl .hq-mb,body.report-page.qpage .hq-mb{background:var(--ly-white);color:var(--ly-navy);border:0;border-radius:999px;min-height:48px;min-width:48px;padding:0 18px;font-weight:700}
body.hm-home.gl .hq-mb .hq-ico i,body.report-page.qpage .hq-mb .hq-ico i{background:var(--ly-navy)}
body.hm-home.gl .hq-menu a,body.report-page.qpage .hq-menu a{min-height:48px;display:flex;align-items:center}
/* ---------- home ---------- */
body.hm-home.gl .hq-top{background:var(--ly-navy);color:var(--ly-white);margin:10px 10px 0;border-radius:var(--ly-r) var(--ly-r) 0 0;padding:28px 18px 8px}
body.hm-home.gl .hq-top .hq-h1{color:var(--ly-white);font-size:30px;line-height:1.15;font-weight:800;letter-spacing:-.01em;max-width:860px;margin:0 auto;text-align:center}
body.hm-home.gl .hq-top .hq-h1 .hq-h1-red{color:var(--ly-orange)}
body.hm-home.gl .hq-top .hq-h1sub,body.hm-home.gl .hq-top .eb{color:var(--ly-white);text-align:center}
body.hm-home.gl .hq-srch{background:var(--ly-navy);margin:0 10px;border-radius:0 0 var(--ly-r) var(--ly-r);padding:12px 14px 22px}
body.hm-home.gl .hq-srch .h-search{background:var(--ly-white);border-radius:var(--ly-r);box-shadow:var(--ly-sh);padding:14px;max-width:560px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px}
body.hm-home.gl .hq-srch .h-search input{min-height:52px;flex:1 1 200px;border:1.5px solid var(--ly-line);border-radius:14px;padding:0 14px;font-size:16px;color:var(--ly-text);background:var(--ly-white)}
body.hm-home.gl .hq-srch .h-search .btn{min-height:52px;flex:1 1 160px;border:0;border-radius:999px;background:var(--ly-orange);color:var(--ly-ink);font-weight:800;font-size:16px}
body.hm-home.gl .hq-srch .hint,body.hm-home.gl .hq-srch p{color:var(--ly-white)}
body.hm-home.gl .hq-srch .chips{justify-content:center}
body.hm-home.gl .hq-srch .chips span{background:var(--ly-white);color:var(--ly-navy);border-radius:999px;padding:6px 12px}
body.hm-home.gl .hq-srch .lead{color:var(--ly-white)}
body.hm-home.gl .gl-hero .btn,body.hm-home.gl .gl-pills a{min-height:48px}
body.hm-home.gl section.alt{background:transparent}
body.hm-home.gl section.alt .grid{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:900px){body.hm-home.gl section.alt .grid{grid-template-columns:repeat(3,1fr)}}
body.hm-home.gl section.alt .card{background:var(--ly-white);color:var(--ly-text);border:1px solid var(--ly-line);border-radius:var(--ly-r);box-shadow:var(--ly-sh);padding:18px;min-height:48px}
body.hm-home.gl section.alt .card .n{color:var(--ly-muted);font-weight:700;letter-spacing:.04em}
body.hm-home.gl section.alt .card b{color:var(--ly-text);font-size:20px}
body.hm-home.gl section.alt .card span{color:var(--ly-muted)}
body.hm-home.gl .hv-ex,body.hm-home.gl #actionPlan{background:var(--ly-white);border:1px solid var(--ly-line);border-radius:var(--ly-r);box-shadow:var(--ly-sh)}
body.hm-home.gl .hq-src{color:var(--ly-muted)}
@media (min-width:1024px){body.hm-home.gl .hq-top{max-width:1180px;margin:14px auto 0;padding:56px 32px 12px}body.hm-home.gl .hq-top .hq-h1{font-size:48px}
 body.hm-home.gl .hq-srch{max-width:1180px;margin:0 auto;padding:16px 32px 40px}body.hm-home.gl .hq-hd,body.report-page.qpage .hq-hd{max-width:1180px;margin:14px auto 0}}
/* ---------- report ---------- */
body.report-page.qpage .report-head.rh-top{background:var(--ly-navy);color:var(--ly-white);border-radius:var(--ly-r);padding:22px 18px;margin:10px 0 14px;text-align:center}
body.report-page.qpage .report-head.rh-top h1{color:var(--ly-white);font-size:28px;line-height:1.15;letter-spacing:.01em}
body.report-page.qpage .report-head.rh-top .eyebrow,body.report-page.qpage .report-head.rh-top .muted,body.report-page.qpage .report-head.rh-top .rh-src{color:var(--ly-white)}
body.report-page.qpage .report .card{background:var(--ly-white);color:var(--ly-text);border:1px solid var(--ly-line);border-radius:var(--ly-r);box-shadow:var(--ly-sh)}
body.report-page.qpage .report .card h2{color:var(--ly-text)}
body.report-page.qpage .report .muted{color:var(--ly-muted)}
body.report-page.qpage .report-head.rh-top .muted{color:var(--ly-white)}
body.report-page.qpage .btn,body.report-page.qpage button,body.report-page.qpage summary,body.report-page.qpage .navsearch input,body.report-page.qpage .navsearch button{min-height:48px;box-sizing:border-box}
body.report-page.qpage .rn-actions .btn,body.report-page.qpage .uw-btns button{border-radius:999px}
body.report-page.qpage .btn.primary,body.report-page.qpage .btn-primary{background:var(--ly-orange);color:var(--ly-ink);border-color:var(--ly-orange)}
body.report-page.qpage .tip-i,body.report-page.qpage button[aria-label]{min-width:48px}
body.report-page.qpage input[type=checkbox]{width:24px;height:24px}
body.report-page.qpage label:has(input[type=checkbox]){min-height:48px;display:inline-flex;align-items:center;gap:8px}
body.report-page.qpage details>summary{display:flex;align-items:center}
@media (min-width:1024px){body.report-page.qpage .report.wrap{max-width:1180px}}
/* home: lead line, search button width, the two top pills, the example card and the page column */
body.hm-home.gl .hq-srch .lead{text-align:center;max-width:560px;margin:12px auto 0}
body.hm-home.gl .hq-srch .h-search .btn{max-width:none;padding:0 18px}
body.hm-home.gl .gl-pills{background:transparent;display:flex;flex-wrap:wrap;gap:10px;padding:14px 10px 0;max-width:1180px;margin:0 auto;box-sizing:border-box}
body.hm-home.gl .gl-pills .gl-pill{flex:1 1 220px;min-height:52px;display:flex;align-items:center;justify-content:center;border-radius:999px;font-weight:800;text-decoration:none;box-sizing:border-box}
body.hm-home.gl .gl-pills .gl-pill.p1{background:var(--ly-orange);color:var(--ly-ink);border:0}
body.hm-home.gl .gl-pills .gl-pill.p2{background:var(--ly-white);color:var(--ly-navy);border:2px solid var(--ly-navy)}
body.hm-home.gl main{max-width:1180px;margin:0 auto;padding:0 10px;box-sizing:border-box}
body.hm-home.gl .hv-ex{background:var(--ly-white);color:var(--ly-text);border:1px solid var(--ly-line);border-radius:var(--ly-r);box-shadow:var(--ly-sh);padding:16px 18px;margin:14px 0}
body.hm-home.gl .hv-ex h2{color:var(--ly-text)}
body.hm-home.gl .hv-ex a{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--ly-line);border-radius:14px;padding:0 14px;color:var(--ly-text);background:var(--ly-white);text-decoration:none}
body.hm-home.gl .hv-ex a span{color:var(--ly-muted)}
body.hm-home.gl section.alt{padding:8px 0 0}
body.hm-home.gl section.alt .eb{color:var(--ly-muted)}
body.hm-home.gl .hq-src a{padding:16px 0} /* inline link: the padding makes the tap area 48px+ without moving the line */
body.report-page.qpage .report-head.rh-top .eyebrow.dark{background:var(--ly-orange);color:var(--ly-ink);border:0}
/* Try a change "Count this" toggles: the 48px tap area is the whole label; the box itself is 24px */
body.report-page.qpage label.sim-on{min-height:48px;min-width:48px;display:inline-flex;align-items:center;gap:8px}
body.report-page.qpage label.sim-on input.simOn{width:24px;height:24px;margin:0}
body.report-page.qpage #sim .sim-item>.sim-on{min-height:48px!important;min-width:48px}
body.report-page.qpage #sim .sim-item>.sim-on input{width:24px!important;height:24px!important}
/* 0.2.169 status tags in navy/white/orange only (Zach via CoS 4:00 PM: "Make the status tags navy and orange").
   Shapes keep statuses apart: filled navy = OK status, orange outline = needs a look, navy outline = not OK, plain = neutral.
   Compliance: no colour meaning on revocations, crashes or insurance figures, so those rows/tips/lines are one neutral style. */
body.report-page.qpage .report .chip{background:var(--ly-white);color:var(--ly-navy);border:1px solid var(--ly-line)}
body.report-page.qpage .report .chip.good{background:var(--ly-navy);color:var(--ly-white);border:1px solid var(--ly-navy)}
body.report-page.qpage .report .chip.warn{background:var(--ly-white);color:var(--ly-navy);border:2px solid var(--ly-orange)}
body.report-page.qpage .report .chip.bad{background:var(--ly-white);color:var(--ly-navy);border:2px solid var(--ly-navy)}
body.report-page.qpage .report .chip-note{color:var(--ly-muted)}
body.report-page.qpage .eyebrow.dark{background:var(--ly-orange);color:var(--ly-ink)}
body.report-page.qpage #sim .eyebrow,body.report-page.qpage #sim .eyebrow.dark{background:transparent}
body.report-page.qpage .rn-naa{background:var(--ly-white);color:var(--ly-navy);border:1px solid var(--ly-navy)}
body.report-page.qpage .report .rt .good,body.report-page.qpage .report .rt .warn,body.report-page.qpage .report .rt .bad,
body.report-page.qpage .report b.good,body.report-page.qpage .report b.warn,body.report-page.qpage .report b.bad,
body.report-page.qpage .report span.good,body.report-page.qpage .report span.warn,body.report-page.qpage .report span.bad{color:var(--ly-navy)}
body.report-page.qpage .report .tip,body.report-page.qpage .report .tip.good,body.report-page.qpage .report .tip.bad,body.report-page.qpage .report .tip.info{background:var(--ly-white);border-color:var(--ly-navy);color:var(--ly-text)}
body.report-page.qpage .report .tip *{color:inherit}
body.report-page.qpage .report .bipd-line{background:var(--ly-white);border:1px solid var(--ly-line)}
body.report-page.qpage .report .bipd-line>span:first-child{color:var(--ly-navy)}
body.report-page.qpage .report .bipd-line b,body.report-page.qpage .report .bipd-line span{color:var(--ly-navy)}
body.report-page.qpage .report .src-tags .src{background:var(--ly-page);color:var(--ly-navy);border:1px solid var(--ly-line)}
body.report-page.qpage #sim .src-tags .src{background:transparent;color:var(--ly-white)}
body.report-page.qpage .term{color:var(--ly-navy)}
body.report-page.qpage .next-steps .btn.ns-another{color:var(--ly-navy);background:var(--ly-white);border:2px solid var(--ly-navy)}
body.report-page.qpage .uw-soon-btn{background:var(--ly-white);color:var(--ly-navy);border:1px solid var(--ly-line)}
/* 0.2.170 contrast (Zach via CoS 4:11 PM: "Improve the color contast to make it easy to read"): AAA 7:1 target.
   Text on orange uses deep navy --ly-ink #0F1D33 (7.76:1, brand navy #172946 was 6.69:1); the home hero/search band is deep navy
   so the orange stat phrase reads 7.76:1; muted grey darkened toward navy (#2A3850: 11.9:1 on white, 10.4:1 on #EEF1F5). */
body.hm-home.gl .hq-top,body.hm-home.gl .hq-srch{background:var(--ly-ink)}
body.hm-home.gl .hq-hd,body.report-page.qpage .hq-hd{background:var(--ly-ink)} /* logo dot orange on deep navy 7.76:1 */
body.report-page.qpage .tools a{min-height:48px;display:inline-flex;align-items:center;box-sizing:border-box} /* Save as PDF / Print links (inspection section) 44 -> 48px */
/* QA c162f3f F1: print = d7e8bc8 print. The table toggle stays hidden (lib/safety/section.js print rule) and the report head is left-aligned. */
/* ---- Phone Check c162f3f fixes (UX, 4:43 PM) ---- */
/* 1) HOME_HQDEMO=1 demo card: white card, navy text, navy dial needle + hub (7:1+); behaviour and layout unchanged */
body.hm-home.gl .hqd{background:var(--ly-white);color:var(--ly-text);border:1px solid var(--ly-line);border-radius:var(--ly-r);box-shadow:var(--ly-sh)}
body.hm-home.gl .hqd .hqd-grid{display:none}
body.hm-home.gl .hqd h2.hqd-h,body.hm-home.gl .hqd .hqd-h,body.hm-home.gl .hqd .hqd-u,body.hm-home.gl .hqd .hqd-num,body.hm-home.gl .hqd .hqd-map,body.hm-home.gl .hqd .hqd-row label{color:var(--ly-text)}
body.hm-home.gl .hqd .hqd-co,body.hm-home.gl .hqd .hqd-hist,body.hm-home.gl .hqd .hqd-ends,body.hm-home.gl .hqd .hqd-chip,body.hm-home.gl .hqd .hqd-sc .hqd-tag{color:var(--ly-muted)}
body.hm-home.gl .hqd .hqd-btn{background:var(--ly-white);color:var(--ly-text);border-color:var(--ly-navy)}
body.hm-home.gl .hqd .hqd-pri{background:var(--ly-navy);color:var(--ly-white);border-color:var(--ly-navy);box-shadow:none}
body.hm-home.gl .hqd .hqd-nd{stroke:var(--ly-navy)}
body.hm-home.gl .hqd .hqd-nc{fill:var(--ly-navy)}
body.hm-home.gl .hqd .hqd-rt{stroke:var(--ly-line)}
body.hm-home.gl .hqd .hqd-bar{background:var(--ly-line)}
body.hm-home.gl .hqd .hqd-mark{background:var(--ly-navy)}
body.hm-home.gl .hqd .hqd-row input[type=range]::-webkit-slider-runnable-track{background:var(--ly-line)}
body.hm-home.gl .hqd .hqd-row input[type=range]::-moz-range-track{background:var(--ly-line)}
body.hm-home.gl .hqd .hqd-row input[type=range]:focus-visible{outline-color:var(--ly-navy)}
/* 2) long carrier names never force sideways scroll (280-430px) */
/* 4) tag outlines #767676 or darker (orange outline was 2.1:1, so the orange outline is replaced): plain = 1px #3D4A5C, needs-a-look = 2px dashed navy, not-OK = 2px solid navy, OK = filled navy */
body.report-page.qpage .report .chip{border:1px solid #3D4A5C}
body.report-page.qpage .report .chip.good{border:1px solid var(--ly-navy)}
body.report-page.qpage .report .chip.warn{border:2px dashed var(--ly-navy)}
body.report-page.qpage .report .chip.bad{border:2px solid var(--ly-navy)}
body.report-page.qpage .rn-naa,body.report-page.qpage .report .src-tags .src{border-color:#3D4A5C}
body.hm-home.gl .hqd :where(*):not(.hqd-pri):not(.hqd-pri *){color:var(--ly-text)} /* every demo text navy on the white card (was white/#C9D1E3 for the dark card) */

/* fix 4: long carrier names wrap instead of pushing the page sideways */
body.report-page.qpage h1,body.report-page.qpage h2,body.report-page.qpage h3,body.report-page.qpage .report-head,body.report-page.qpage .nm-head,body.report-page.qpage .card td{overflow-wrap:anywhere;min-width:0}body.report-page.qpage .card th{overflow-wrap:break-word;word-break:normal;min-width:0}
/* Nov 3 2026 phone check: "anywhere" on the label cells split normal words ("Classificati / on"). Labels (th) now use break-word, which only breaks a word too long for a line on its own; value cells (td, where long carrier names land) keep anywhere so they still wrap with no sideways scroll. */
}
/* D-dials-match-home (Zach Nov 3 2026 9:19 PM, screenshot of the home 'Try a change' gauge): the report's HQ Score dial uses the same light
   look as the home gauge: white card, blue / slate / red arc (colours as sim-hq.css), dark navy needle, dark 'N of 100', muted 'Lower score' / 'Higher score'. Screen only; words unchanged. */
@media screen{
body.report-page.qpage #sim .sim-score.sim-hq{background:var(--ly-white);color:var(--ly-text);border:1px solid var(--ly-line);border-radius:16px;padding:14px 12px 12px;box-shadow:var(--ly-sh)}
body.report-page.qpage #sim .sim-hq .sim-cap{color:var(--ly-text)}
body.report-page.qpage #sim .sim-hq .sim-tk{stroke:var(--ly-line)}
body.report-page.qpage #sim .sim-hq .sim-nd{stroke:var(--ly-ink)}
body.report-page.qpage #sim .sim-hq .sim-nc{fill:var(--ly-ink)}
body.report-page.qpage #sim .sim-hq .sim-dends,body.report-page.qpage #sim .sim-hq .gauge span,body.report-page.qpage #sim .sim-hq .gauge small,body.report-page.qpage #sim .sim-hq small,body.report-page.qpage #sim .sim-hq p{color:var(--ly-muted)}
body.report-page.qpage #sim .sim-hq .gauge b,body.report-page.qpage #sim .sim-hq .gauge.neutral b{color:var(--ly-ink)}
body.report-page.qpage #sim .sim-hq .sim-madeup{color:var(--ly-ink);font-weight:700}
body.report-page.qpage #sim .sim-hq .delta,body.report-page.qpage #sim .sim-hq #simDelta{color:var(--ly-muted)}
body.report-page.qpage #sim .sim-hq a,body.report-page.qpage #sim .sim-hq .fp-ref{color:var(--ly-navy)}
}
