/*
 * Spectrofuge portal: deliberately styled like the Access database the staff have used for years
 * (Windows buttons, gray form windows, label: field rows, datasheets, record navigator).
 * Larger type than Access for readability.
 */
:root {
	--form: #e9e9eb;        /* matches the background of the Spectrofuge logo on the Access Main Menu */
	--head: #d5d8de;
	--edge: #9ea3aa;
	--ink: #1a1a1a;
	--muted: #555b61;
	--field: #ffffff;
	--field-edge: #7a7a7a;
	--btn: #e1e1e1;
	--btn-edge: #adadad;
	--btn-hover: #e5f1fb;
	--focus: #0078d7;
	--sheet-head: #e4e4e4;
	--sheet-line: #c8c8c8;
	--sel: #cce8ff;
	--blue: #2e6db4;        /* the Spectrofuge logo tiles */
	--bad: #b00020;
	--ok: #1d6b36;
	--warn: #fff4ce;
	--ui: Tahoma, "Segoe UI", Verdana, Arial, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.sfp { margin: 0; background: #c9ccd1; color: var(--ink); font: 16px/1.4 var(--ui); }
a { color: #0645ad; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }

/* ---------- App bar ---------- */
.bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 14px; background: var(--form); border-bottom: 1px solid var(--edge); }
.bar .brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.bar .brand img { height: 46px; width: auto; display: block; }
.bar .who { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; font-size: 15px; color: var(--muted); }
.page { padding: 18px 14px 40px; max-width: 1200px; margin: 0 auto; }

/* ---------- Buttons (Windows / Access command buttons) ---------- */
.btn, button.btn, input.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	min-height: 36px; padding: 6px 16px;
	font: bold 15px var(--ui); color: var(--ink); text-decoration: none; text-align: center;
	background: var(--btn); border: 1px solid var(--btn-edge); border-radius: 0;
	cursor: pointer; white-space: nowrap;
}
.btn:hover { background: var(--btn-hover); border-color: var(--focus); }
.btn:active { background: #cce4f7; border-color: #005499; }
.btn[disabled] { color: #838383; background: #cccccc; border-color: #bfbfbf; cursor: default; }
.btn.default { border: 2px solid var(--focus); }
.btn.small { min-height: 30px; padding: 3px 10px; font-size: 14px; }
.btn.notes-exist { color: #b00020; }

/* ---------- Form window ---------- */
.win { background: var(--form); border: 1px solid var(--edge); box-shadow: 0 1px 3px rgba(0, 0, 0, .25); margin: 0 auto 18px; max-width: 1100px; }
.win.narrow { max-width: 640px; }
.win-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 16px; background: var(--head); border-bottom: 1px solid var(--edge); }
.win-head h1 { margin: 0; font: bold 24px var(--ui); }
.win-head .tools { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.win-body { padding: 16px; }
.win-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 16px; border-top: 1px solid var(--edge); background: var(--head); font-size: 15px; }

/* ---------- Label: field rows ---------- */
.frm { display: grid; gap: 8px 0; }
.frm .row { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 10px; align-items: start; }
.frm .pair { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
.frm .lbl { text-align: right; padding-top: 6px; font-weight: bold; }
.frm .ctl { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.frm .section { margin: 12px 0 2px; padding-bottom: 2px; border-bottom: 1px solid var(--edge); font-weight: bold; font-size: 17px; color: var(--blue); }
.frm .static { padding: 6px 0; font-weight: bold; }

input[type=text], input[type=search], input[type=tel], input[type=time], input[type=number], input[type=date], input[type=email], input[type=month], input:not([type]), select, textarea {
	font: 16px var(--ui); color: var(--ink); background: var(--field);
	border: 1px solid var(--field-edge); border-radius: 0; padding: 5px 7px; min-height: 34px; max-width: 100%;
}
input[disabled], select[disabled], textarea[disabled] { background: #f3f3f3; color: #333; border-color: #b9b9b9; opacity: 1; -webkit-text-fill-color: #333; }
textarea { width: 100%; min-height: 70px; }
input[type=checkbox] { width: 20px; height: 20px; margin: 6px 0; accent-color: var(--focus); }
.w-xs { width: 70px; } .w-s { width: 140px; } .w-m { width: 260px; } .w-l { width: 100%; } .w-n { width: 120px; }
.part-pick { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.part-search { width: 200px; }
.part-label { color: var(--muted); }

/* ---------- Messages ---------- */
.msg { margin: 0 auto 14px; max-width: 1100px; padding: 10px 14px; border: 1px solid var(--edge); background: #fff; font-weight: bold; }
.msg.ok { border-color: var(--ok); color: var(--ok); }
.msg.err { border-color: var(--bad); color: var(--bad); }
.msg.warn { background: var(--warn); border-color: #c19c00; color: #5c4400; font-weight: normal; }

/* ---------- Main Menu (switchboard) ---------- */
.switch { max-width: 860px; }
.switch.wide { max-width: 1640px; } /* menus with many buttons: more columns, so the whole menu fits on one screen */
.switch .sw-top { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; padding: 18px 22px 8px; }
.switch .sw-top img { width: 228px; height: auto; display: block; }
.switch .sw-title { font: bold 46px/1 "Times New Roman", Times, serif; letter-spacing: 1px; margin: 0; }
.switch .sw-title.small { font-size: 34px; }
.sw-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; padding: 16px 22px 22px; }
.sw-buttons .btn { min-height: 58px; font-size: 17px; letter-spacing: .3px; justify-content: flex-start; padding-left: 20px; }
.switch.wide .sw-buttons { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px 14px; padding-top: 10px; }
.switch.wide .sw-buttons .btn { min-height: 50px; font-size: 16px; padding-left: 16px; }
.switch.wide .sw-top { padding-top: 10px; padding-bottom: 0; }
.switch.wide .sw-top img { width: 170px; }
.switch.wide .sw-title { font-size: 38px; }
.switch.wide .sw-title br { display: none; }
@media (max-height: 820px) { .switch.wide .sw-buttons .btn { min-height: 42px; font-size: 15px; } }
@media (max-height: 700px) { .switch.wide .sw-buttons { gap: 8px 12px; } .switch.wide .sw-buttons .btn { min-height: 36px; } .switch.wide .sw-top img { width: 120px; } .switch.wide .sw-title { font-size: 30px; } }
.sw-note { margin: 0 22px; padding: 8px 12px; background: var(--warn); border: 1px solid #c19c00; }
.sw-status { display: flex; gap: 24px; flex-wrap: wrap; padding: 10px 22px 16px; border-top: 1px solid var(--edge); font-size: 15px; }
.sw-status a { font-weight: bold; }
.sw-status .late { color: var(--bad); }
.sw-foot { display: flex; justify-content: space-between; align-items: center; padding: 10px 22px; border-top: 1px solid var(--edge); background: var(--head); }

/* ---------- Datasheets (continuous forms) ---------- */
.find { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 12px; }
.find label { display: flex; flex-direction: column; gap: 3px; font-weight: bold; font-size: 15px; }
.sheet-wrap { overflow-x: auto; background: #fff; border: 1px solid var(--edge); }
table.sheet { border-collapse: collapse; width: 100%; font-size: 15px; background: #fff; }
.sheet th, .sheet td { border: 1px solid var(--sheet-line); padding: 6px 8px; text-align: left; vertical-align: top; }
.sheet th { background: var(--sheet-head); font-weight: bold; white-space: nowrap; position: sticky; top: 0; }
.sheet th a { color: var(--ink); text-decoration: none; }
.sheet th a:hover { text-decoration: underline; }
.sheet tbody tr:nth-child(even) td { background: #f7f7f7; }
.sheet tbody tr.go { cursor: pointer; }
.sheet tbody tr.go:hover td, .sheet tbody tr.go:focus-within td { background: var(--sel); }
.sheet td.r, .sheet th.r { text-align: right; font-variant-numeric: tabular-nums; }
.sheet td a.open { font-weight: bold; }
.sheet input[type=text], .sheet input[type=number], .sheet input[type=date], .sheet select { min-height: 30px; padding: 3px 5px; font-size: 15px; }
.pager { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; font-size: 15px; }

/* ---------- Subforms ---------- */
.sub { margin-top: 14px; }
.sub > .lbl { font-weight: bold; margin-bottom: 4px; }
.sub .sheet td.open-row { background: #fffbe0 !important; font-weight: bold; }
.sub .sheet td.skipped { color: var(--muted); font-style: italic; }
.sub .addline { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.expires { display: flex; gap: 10px; align-items: center; margin-top: 8px; font-weight: bold; }

/* ---------- Record navigator ---------- */
.nav { display: inline-flex; align-items: center; gap: 4px; }
.nav .btn { min-height: 30px; min-width: 38px; padding: 2px 8px; }
.nav .of { padding: 0 8px; }
.position { display: inline-flex; gap: 6px; align-items: center; font-weight: bold; }
.position input { width: 110px; }

/* ---------- Reports ---------- */
.report { background: #fff; color: #000; border: 1px solid var(--edge); max-width: 1100px; margin: 0 auto; padding: 24px 28px; font-family: Arial, Helvetica, sans-serif; }
.report h1 { text-align: center; margin: 0; font-size: 24px; }
.report .rsub { text-align: center; margin: 4px 0 2px; font-size: 16px; }
.report .rdate { text-align: center; color: #444; font-size: 13px; margin-bottom: 14px; }
.report h2 { font-size: 17px; margin: 18px 0 4px; padding-bottom: 2px; border-bottom: 2px solid #000; }
.report table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.report th { text-align: left; border-bottom: 1px solid #000; padding: 3px 5px; white-space: nowrap; }
.report td { padding: 3px 5px; border-bottom: 1px dotted #bbb; vertical-align: top; }
.report .r { text-align: right; font-variant-numeric: tabular-nums; }
.report .total td { font-weight: bold; border-top: 2px solid #000; border-bottom: 0; }
.report .count { margin-top: 14px; font-size: 13px; }
.report .rnote { font-size: 13px; color: #333; margin: 8px 0; }
.sheet-pm { page-break-after: always; break-after: page; border: 1px solid #000; padding: 14px 16px; margin-bottom: 18px; }
.sheet-pm:last-child { page-break-after: auto; break-after: auto; }
.sheet-pm .grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 18px; font-size: 14px; }
.sheet-pm .lines { margin-top: 14px; font-size: 14px; }
.sheet-pm .lines div { border-bottom: 1px solid #000; height: 30px; margin-top: 6px; display: flex; align-items: flex-end; }
.labels { display: grid; grid-template-columns: repeat(3, 2.625in); grid-auto-rows: 1in; column-gap: .125in; justify-content: center; }
.labels .lab { padding: .1in .15in; font: 12px/1.25 Arial, sans-serif; overflow: hidden; }

/* ---------- Sign-in ---------- */
.signin { max-width: 520px; margin: 40px auto; }
.signin .win-body { text-align: center; padding: 26px; }
.signin img { width: 228px; height: auto; }
.btn.ms { min-height: 50px; font-size: 17px; padding: 8px 22px; gap: 10px; }
.btn.ms svg { width: 21px; height: 21px; }

/* ---------- Small screens ---------- */
@media (max-width: 760px) {
	.frm .row { grid-template-columns: 1fr; gap: 2px; }
	.frm .lbl { text-align: left; padding-top: 0; }
	.frm .pair { grid-template-columns: 1fr; gap: 8px; }
	.sw-buttons { grid-template-columns: 1fr; }
	.switch .sw-title { font-size: 34px; }
	.bar .brand img { height: 36px; }
	.win-head h1 { font-size: 20px; }
	.w-m { width: 100%; }
}

/* ---------- Print ---------- */
@media print {
	body.sfp { background: #fff; }
	.bar, .noprint, .win-head .tools, .msg, .pager, .criteria { display: none !important; }
	.page { padding: 0; max-width: none; }
	.report { border: 0; padding: 0; max-width: none; }
	@page { margin: .5in; }
}

/* ---------- Phones: click-to-dial and incoming-call pop-ups ---------- */
a.dial { display: inline-block; margin-left: 4px; padding: 0 5px; text-decoration: none; font-size: 16px; line-height: 1.3; border: 1px solid var(--btn-edge); background: var(--btn); color: var(--ok); }
a.dial:hover { background: var(--btn-hover); border-color: var(--focus); }
.callpops { position: fixed; left: 16px; bottom: 16px; z-index: 2000; display: flex; flex-direction: column; gap: 8px; width: min(380px, calc(100vw - 32px)); }
.callpop { background: #fff; border: 2px solid var(--blue); box-shadow: 0 4px 14px rgba(0,0,0,.35); font-size: 15px; }
.callpop .cp-h { display: flex; justify-content: space-between; align-items: center; padding: 6px 10px; background: var(--blue); color: #fff; font-weight: bold; }
.callpop .cp-h button { background: none; border: 0; color: #fff; font-size: 16px; cursor: pointer; }
.callpop .cp-n { padding: 8px 10px 2px; font-size: 20px; font-weight: bold; }
.callpop .cp-n span { font-size: 15px; font-weight: normal; color: var(--muted); }
.callpop ul { list-style: none; margin: 4px 0; padding: 0 10px; }
.callpop li { padding: 4px 0; border-top: 1px solid #eee; }
.callpop li span { font-size: 13px; color: var(--muted); }
.callpop .btn { margin: 6px 10px 10px; }
td.wrap-notes { min-width: 260px; font-size: 13px; }
td[data-col="phone"], td[data-col="phone1"], td[data-col="phone2"] { white-space: nowrap; }
.sheet-wrap.related { max-height: 460px; overflow: auto; }
.sheet-wrap.related thead th { position: sticky; top: 0; z-index: 1; }

/* ---------- New service call / ticket ---------- */
.call-win .hint { font-size: 13px; color: var(--muted); margin-top: 3px; }
.call-results { display: flex; flex-direction: column; max-height: 340px; overflow: auto; margin-top: 6px; }
.call-results:empty { display: none; }
.call-results .cr { display: grid; grid-template-columns: 110px 1fr; gap: 0 10px; text-align: left; padding: 6px 8px; background: #fff; border: 1px solid var(--sheet-line); border-top: 0; font: 15px var(--ui); cursor: pointer; }
.call-results .cr:first-child { border-top: 1px solid var(--sheet-line); }
.call-results .cr:hover, .call-results .cr:focus { background: var(--btn-hover); outline: 2px solid var(--focus); outline-offset: -2px; }
.call-results .cr-kind { grid-row: span 2; font-size: 12px; font-weight: bold; color: var(--blue); text-transform: uppercase; padding-top: 2px; }
.call-results .cr-label { font-weight: bold; }
.call-results .cr-sub { font-size: 13px; color: var(--muted); }
.call-results .cr-msg { margin: 6px 0; color: var(--muted); }
.call-pick { margin: 6px 0 12px 180px; }
.call-pick .cp-line { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 6px; font-size: 17px; }
.banner { padding: 8px 12px; border: 1px solid; font-size: 15px; line-height: 1.5; }
.banner.ok { background: #e7f4ea; border-color: var(--ok); }
.banner.warn { background: var(--warn); border-color: #b58900; }
.banner.bad { background: #fde8ea; border-color: var(--bad); }
.radios { display: flex; gap: 16px; flex-wrap: wrap; }
.radios label { display: inline-flex; gap: 6px; align-items: center; }
.tk-status { display: inline-block; padding: 2px 10px; border: 1px solid; font-size: 15px; font-weight: bold; margin-left: 10px; vertical-align: middle; }
.tk-status.Pending { background: var(--warn); border-color: #b58900; }
.tk-status.Scheduled { background: #d6e6f8; border-color: var(--blue); }
.tk-status.Complete { background: #d3ecd9; border-color: var(--ok); }
.tk-status.Cancelled { background: #eee; border-color: #888; color: #555; }
.tk-facts { width: 100%; border-collapse: collapse; margin-bottom: 12px; }
.tk-facts th { text-align: right; width: 170px; padding: 4px 10px 4px 0; vertical-align: top; }
.tk-facts td { padding: 4px 0; }
.tk-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 8px 0; }
@media (max-width: 760px) { .call-pick { margin-left: 0; } }
.call-win .section, .win-body > .section { margin: 16px 0 6px; padding-bottom: 2px; border-bottom: 1px solid var(--edge); font-weight: bold; font-size: 17px; color: var(--blue); }
.call-win #c-rate, #t-rate { max-width: 100%; width: 30em; }
.board-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.btn.on { background: #cce4f7; border: 2px solid var(--focus); }
.sheet.bill input[type=text] { width: 100%; min-width: 14em; }
.sheet tfoot td { background: var(--sheet-head); }

/* ---------- Tech tracking (1.8.0) ---------- */
.geo-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.geo-filter input[type=date], .geo-filter select { font: 15px var(--ui); padding: 4px 6px; }
.geo-sum { margin-left: 8px; color: var(--muted); }
.geo-map { height: 480px; border: 1px solid var(--edge); background: #dfe3e8; }
.geo-legend { font-size: 14px; color: var(--muted); display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.geo-legend .lg { display: inline-block; width: 14px; height: 14px; border-radius: 50%; vertical-align: middle; }
.geo-legend .lg.site { background: rgba(46,109,180,.35); border: 3px solid #1f4e8c; box-sizing: border-box; }
.geo-legend .lg.ok { background: #1d6b36; }
.geo-legend .lg.far { background: #b00020; }
.geo-legend .lg.path { border-radius: 0; height: 4px; background: #7b2cbf; }
.geo-warn { color: var(--bad); font-weight: bold; }
tr.geo-flag td { background: #fdecee; }
.geo-panel p { margin: 6px 0; }
.geo-note { font-size: 14px; }

/* ---------- Notifications (1.9.0) ---------- */
.bar .bell { position: relative; text-decoration: none; font-size: 20px; line-height: 1; padding: 4px 6px; color: var(--muted); }
.bar .bell.on { color: var(--ink); }
.bar .bell b { position: absolute; top: -4px; right: -6px; min-width: 18px; padding: 1px 4px; border-radius: 9px; background: var(--bad); color: #fff; font: bold 12px/16px var(--ui); text-align: center; }
.mob-item.nt.new { border-left: 5px solid var(--blue); }
.mob-item.nt.new b::before { content: "● "; color: var(--blue); }
.nt-dev { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 0; border-top: 1px solid var(--sheet-line); }
.nt-prefs fieldset { border: 1px solid var(--sheet-line); margin: 0 0 10px; padding: 6px 10px 10px; }
.nt-prefs legend { font-weight: bold; }
.nt-prefs label { display: inline-block; margin: 6px 16px 0 0; }

/* ---------- Customer requests (2.0.0) ---------- */
.cr-card { border: 1px solid var(--edge); background: #fff; padding: 10px 12px; margin: 0 0 12px; }
.cr-head { margin-bottom: 6px; }
.cr-diff { margin: 6px 0; }

/* ---------- PM schedule (2.1.0) ---------- */
.pm-months label { display: inline-block; margin-right: 6px; }

/* ---------- Calibration (2.2.0) ---------- */
.cal-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin-bottom: 16px; }
.cal-tile { display: block; padding: 12px 14px; background: #fff; border: 1px solid var(--edge); text-decoration: none; color: var(--ink); }
.cal-tile:hover { background: var(--btn-hover); border-color: var(--focus); }
.cal-tile b { font-size: 22px; margin-right: 4px; }
.cal-tile em { color: var(--bad); font-style: normal; font-weight: bold; }
.cal-tile span { display: block; margin-top: 6px; font-weight: bold; color: var(--blue); }
.cal-tile.bad b { color: var(--bad); }
.cal-pts input, .cal-pts select { font: 14px var(--ui); padding: 3px 4px; }
.cal-lim { white-space: nowrap; font-size: 13px; color: #333; }
.cal-how li { margin-bottom: 4px; }

/* ---------- Calibrated equipment grid (2.4.0) ---------- */
.win.wide { max-width: 1600px; }
.cg details { border: 1px solid var(--sheet-line); background: #fff; margin: 0 0 4px; }
.cg summary { padding: 6px 10px; cursor: pointer; font-size: 16px; }
.cg .cg-c { margin: 0 8px 6px 18px; }
.cg .sheet-wrap { margin: 0 8px 8px; }
.cg tr.cg-past td, .cg tr.cg-past:nth-child(n) td { background: #ffff66; }
.cg tr.cg-fail td, .cg tr.cg-fail:nth-child(n) td { background: #ffb3b3; }
.cg tr.cg-soon td, .cg tr.cg-soon:nth-child(n) td { background: #fff7c2; }
.cg-key { display: inline-block; width: 14px; height: 14px; border: 1px solid #999; vertical-align: middle; }
.cg-key.past { background: #ffff66; } .cg-key.fail { background: #ffb3b3; } .cg-key.soon { background: #fff7c2; }
td.cal-in { background: #90ee90; } td.cal-out { background: #ff9c9c; }
body.sf-wide .page { max-width: 1700px; }

/* ---------- Calibration instrument page, labels, trend, dashboard (2.5.0) ---------- */
.win.wide-item { max-width: 1200px; }
.ci-tabs { display: flex; flex-wrap: wrap; gap: 2px; padding: 6px 12px 0; background: var(--head); border-bottom: 1px solid var(--edge); }
.ci-tabs a { padding: 7px 14px; background: var(--btn); border: 1px solid var(--btn-edge); border-bottom: 0; text-decoration: none; color: var(--ink); font-weight: bold; }
.ci-tabs a:hover { background: var(--btn-hover); }
.ci-sec { scroll-margin-top: 10px; margin-bottom: 18px; }
.ci-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ci-main fieldset { border: 1px solid var(--sheet-line); background: #fff; padding: 6px 12px 10px; margin: 0 0 10px; }
.ci-main legend { font-weight: bold; padding: 0 4px; }
.ci-help { font-size: 13px; color: var(--muted); }
.ci-foot { display: flex; flex-wrap: wrap; gap: 8px; }
.ci-maint { border: 1px solid var(--sheet-line); background: #fff; padding: 8px 10px; margin-bottom: 6px; }
.ci-maint.off { opacity: .55; }
.ci-addm { margin: 10px 0; }
.ci-img { max-width: 420px; max-height: 320px; border: 1px solid var(--edge); }
.cal-files { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.cal-files .cf { width: 150px; background: #fff; border: 1px solid var(--sheet-line); padding: 6px; font-size: 13px; display: flex; flex-direction: column; gap: 4px; }
.cal-files .cf img { width: 100%; height: 100px; object-fit: cover; }
.cal-files .cf-doc { display: block; height: 100px; line-height: 100px; text-align: center; font-size: 22px; text-decoration: none; background: #f3f5f8; }
.cal-files .cf form { align-self: flex-end; }
.cal-up { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
svg.trend { width: 100%; max-width: 760px; height: auto; background: #fff; border: 1px solid var(--sheet-line); font: 11px var(--ui); }
svg.trend .band { fill: #e3f4e6; } svg.trend .lim { stroke: #1d6b36; stroke-dasharray: 5 4; } svg.trend .nom { stroke: #888; stroke-dasharray: 2 3; }
svg.trend .ax { stroke: #999; } svg.trend .pf { fill: #2e6db4; } svg.trend .pl { fill: #1d6b36; } svg.trend .bad { fill: #b00020; } svg.trend .nomt { fill: #666; }
.geo-legend .tk { display: inline-block; width: 12px; height: 12px; vertical-align: middle; }
.geo-legend .tk.pf { background: #2e6db4; border-radius: 50%; } .geo-legend .tk.pl { background: #1d6b36; } .geo-legend .tk.bad { background: #b00020; border-radius: 50%; } .geo-legend .tk.band { background: #e3f4e6; border: 1px dashed #1d6b36; } .geo-legend .tk.nom { border-top: 2px dotted #888; height: 0; }
.dash-row { display: flex; flex-wrap: wrap; gap: 12px; }
figure.dash { margin: 0; background: #fff; border: 1px solid var(--sheet-line); padding: 8px; flex: 1 1 320px; max-width: 540px; }
figure.dash figcaption { font-weight: bold; margin-bottom: 4px; }
figure.dash svg { width: 100%; height: auto; font: 11px var(--ui); }
figure.dash .b { fill: #2e6db4; } figure.dash .b.bad { fill: #d4a000; } figure.dash .lb { fill: #555; }
@media (max-width: 800px) { .ci-cols { grid-template-columns: 1fr; } }