/* Field Works (works.js) — added to the loss-control dashboard */
.badge { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 99px; background: var(--red); color: #fff; font-size: 11px; font-weight: 700; line-height: 17px; text-align: center; margin-left: 3px; }
.fw-nav { margin: 0 0 14px; }
.fw-nav .seg button { padding: 8px 12px; }
.tile.click { cursor: pointer; }
.tile.click:hover { border-color: var(--axis); }
.tile.alert .v { color: var(--crit); }
.risk { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 99px; letter-spacing: .4px; }
.risk.HIGH { background: var(--red-bg); color: var(--red); }
.risk.MEDIUM { background: #fffaeb; color: #b54708; }
.risk.LOW { background: var(--green-bg); color: var(--good-ink); }
.st { display: inline-block; font-size: 12px; font-weight: 600; padding: 1px 8px; border-radius: 6px; background: var(--page); color: var(--ink-2); white-space: nowrap; }
.st.CLOSED { background: var(--green-bg); color: var(--good-ink); }
.st.REJECTED, .st.REFERRED, .st.CANCELLED { background: var(--red-bg); color: var(--red); }
.st.INSTALLED, .st.ESTIMATED { background: #eff8ff; color: #175cd3; }
.st.PENDING { background: #fffaeb; color: #b54708; }
.st.ACTIVE { background: var(--green-bg); color: var(--good-ink); }
.st.SUSPENDED { background: var(--red-bg); color: var(--red); }
.fw-head { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 12px; }
.fw-head h1 { font-size: 22px; margin: 0; }
.fw-head .grow { min-width: 240px; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.flags { display: grid; gap: 8px; }
.flag { border: 1px solid var(--line); border-left: 5px solid var(--muted); border-radius: 10px; padding: 8px 12px; }
.flag.HIGH { border-left-color: var(--crit); }
.flag.MEDIUM { border-left-color: var(--warn); }
.flag b { display: block; }
.flag span { color: var(--ink-2); font-size: 13px; overflow-wrap: anywhere; }
.near4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; margin-top: 8px; }
.near4 .item { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 13px; }
.near4 .item.ILLEGAL { border-left: 5px solid var(--crit); }
.near4 .item.DAMAGE { border-left: 5px solid var(--warn); }
.near4 .item b { font-size: 14px; }
.near4 ul { margin: 6px 0 0; padding-left: 16px; color: var(--ink-2); }
.geo { display: flex; gap: 10px; align-items: center; padding: 10px 14px; border-radius: 12px; border: 1.5px solid; font-weight: 600; margin: 4px 0 10px; }
.geo.in { background: var(--green-bg); border-color: #75e0a7; color: #085d3a; }
.geo.out { background: var(--red-bg); border-color: #fda29b; color: #912018; }
.geo b { font-size: 22px; }
.sketch { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.sketch svg { display: block; width: 100%; height: auto; }
.formgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 14px; }
.formgrid label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 13px; }
.formgrid .wide { grid-column: 1 / -1; }
textarea { font: inherit; color: var(--ink); background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; min-height: 60px; resize: vertical; }
.tpl input { width: 100%; min-width: 60px; padding: 4px 6px; }
.tpl td { padding: 4px; }
.fw-map { height: 380px; border-radius: 10px; overflow: hidden; }
.fw-map.big { height: calc(100vh - 230px); min-height: 420px; }
.chk td:first-child { width: 40px; text-align: center; font-weight: 700; }
.yes { color: var(--good-ink); } .no { color: var(--crit); }
tr.click { cursor: pointer; }
tr.click:hover td { background: var(--page); }
.notice { border: 1px solid var(--line); border-left: 5px solid var(--muted); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; background: var(--card); }
.notice.ALERT { border-left-color: var(--crit); }
.notice.WARN { border-left-color: var(--warn); }
.notice.unread { box-shadow: 0 0 0 1.5px var(--axis); }
.notice b { display: block; }
.notice .row { display: flex; gap: 8px; align-items: center; margin-top: 6px; flex-wrap: wrap; }
.slot { font-size: 11px; font-weight: 700; color: var(--ink-2); text-transform: uppercase; }

/* more tabs in the header since Field Works: keep one line */
.top .tabs button { padding: 8px 8px; font-size: 13.5px; }
@media (max-width: 1560px) { .top .brand span { display: none; } .me { display: none; } }


/* training demo */
.demo-bar { background: #f5a524; color: #1d1300; text-align: center; font-weight: 600; font-size: 13px; padding: 6px 12px; }
.demo-hint { background: #fffaeb; border: 1px solid #fec84b; color: #93370d; border-radius: 10px; padding: 10px 12px; font-size: 13px; text-align: left; line-height: 1.7; }