/* ==========================================================================
   AMPC Port Scanner
   ==========================================================================

   Everything is scoped under #ampc-ps and every class carries the ampc-ps-
   prefix. That is not tidiness: this drops into an Enfold page whose stylesheet
   is 440KB, and a major site redesign is still ahead of it. A self-contained
   panel survives both without needing to be revisited.

   Dark by deliberate choice. The panel reads as an instrument embedded in the
   page rather than as more page, and the port map is only legible on a dark
   ground.
   ========================================================================== */

#ampc-ps {
	--ampc-ink:       #0a0e14;
	--ampc-panel:     #111722;
	--ampc-panel-2:   #18202e;
	--ampc-line:      #232d3f;
	--ampc-line-soft: #1a2231;

	--ampc-text:  #e8eef7;
	--ampc-muted: #8a99ad;
	--ampc-faint: #5a6879;

	--ampc-accent:     #4cc9f0;
	--ampc-accent-dim: #1d5f78;

	/* Status colours describe, they do not grade. "Answered" gets the
	   attention colour because it is the row worth reading, not because the
	   visitor failed something. There is no green tick anywhere in this tool. */
	--ampc-open:     #ff7043;
	--ampc-closed:   #5b8dd9;
	--ampc-noreply:  #3f7d6a;
	--ampc-untested: #6b7684;
	--ampc-pending:  #1b2433;

	position: relative;
	margin: 2rem 0;
	background: var(--ampc-ink);
	border: 1px solid var(--ampc-line);
	border-radius: 14px;
	overflow: hidden;
	color: var(--ampc-text);
	font-size: 15px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}

#ampc-ps *,
#ampc-ps *::before,
#ampc-ps *::after { box-sizing: border-box; }

#ampc-ps::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 420px;
	background: radial-gradient(120% 100% at 12% 0%, rgba(76,201,240,.10), transparent 60%);
	pointer-events: none;
}

#ampc-ps .ampc-ps-mono {
	font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
	font-variant-numeric: tabular-nums;
}

/* --- Head --------------------------------------------------------------- */

#ampc-ps .ampc-ps-head {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
	align-items: flex-start;
	justify-content: space-between;
	padding: 1.6rem 1.9rem 1.4rem;
	border-bottom: 1px solid var(--ampc-line-soft);
}

#ampc-ps .ampc-ps-title {
	margin: 0;
	padding: 0;
	color: var(--ampc-text);
	font-size: 1.32rem;
	font-weight: 620;
	letter-spacing: -.015em;
	border: none;
}

#ampc-ps .ampc-ps-subtitle {
	margin: .3rem 0 0;
	color: var(--ampc-muted);
	font-size: .93rem;
	max-width: 46ch;
}

#ampc-ps .ampc-ps-whoami { text-align: right; min-width: 210px; }

#ampc-ps .ampc-ps-lbl {
	display: block;
	font-size: .68rem;
	text-transform: uppercase;
	letter-spacing: .13em;
	color: var(--ampc-faint);
	margin-bottom: .3rem;
}

#ampc-ps .ampc-ps-addr { font-size: 1.02rem; letter-spacing: -.01em; word-break: break-all; }
#ampc-ps .ampc-ps-net  { display: block; font-size: .8rem; color: var(--ampc-muted); margin-top: .2rem; }
/* The address's reverse-DNS name, when it has one. Faint on purpose: it is
   context for the question below, not a result. */
#ampc-ps .ampc-ps-name { display: block; font-size: .74rem; color: var(--ampc-faint); margin-top: .15rem; word-break: break-all; }

/* --- Notice ------------------------------------------------------------- */

#ampc-ps .ampc-ps-notice {
	display: flex;
	gap: .85rem;
	align-items: flex-start;
	margin: 1.3rem 1.9rem 0;
	padding: .85rem 1rem;
	background: rgba(255,112,67,.055);
	border: 1px solid rgba(255,112,67,.22);
	border-radius: 9px;
	font-size: .89rem;
	color: #f0d9cf;
}
#ampc-ps .ampc-ps-notice svg { flex-shrink: 0; margin-top: .18rem; color: #ff8f6d; }
#ampc-ps .ampc-ps-notice strong { color: #ffb59c; font-weight: 600; }

/* --- Controls ----------------------------------------------------------- */

#ampc-ps .ampc-ps-controls { padding: 1.3rem 1.9rem 1.6rem; }

#ampc-ps .ampc-ps-field-label {
	display: block;
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .13em;
	color: var(--ampc-faint);
	margin-bottom: .55rem;
	font-weight: 400;
}

#ampc-ps .ampc-ps-entry { display: flex; gap: .7rem; flex-wrap: wrap; }
#ampc-ps .ampc-ps-spec-wrap { position: relative; flex: 1 1 300px; min-width: 0; }

#ampc-ps input[type=text] {
	width: 100%;
	margin: 0;
	padding: .78rem 5.5rem .78rem .95rem;
	background: var(--ampc-panel-2);
	border: 1px solid var(--ampc-line);
	border-radius: 9px;
	color: var(--ampc-text);
	font-size: .98rem;
	line-height: 1.4;
	box-shadow: none;
	transition: border-color .15s, box-shadow .15s;
}
#ampc-ps input[type=text]::placeholder { color: var(--ampc-faint); }
#ampc-ps input[type=text]:focus {
	outline: none;
	border-color: var(--ampc-accent-dim);
	box-shadow: 0 0 0 3px rgba(76,201,240,.13);
}

#ampc-ps .ampc-ps-count {
	position: absolute;
	right: .8rem;
	top: 50%;
	transform: translateY(-50%);
	font-size: .74rem;
	color: var(--ampc-faint);
	pointer-events: none;
}
#ampc-ps .ampc-ps-count.is-over { color: var(--ampc-open); }

#ampc-ps button {
	font: inherit;
	cursor: pointer;
	border: none;
	border-radius: 9px;
	text-transform: none;
	letter-spacing: normal;
	transition: background .15s, border-color .15s, color .15s, opacity .15s;
}

#ampc-ps .ampc-ps-go {
	padding: .78rem 1.7rem;
	background: var(--ampc-accent);
	color: #04222e;
	font-weight: 640;
	white-space: nowrap;
}
#ampc-ps .ampc-ps-go:hover { background: #6ad5f5; color: #04222e; }
#ampc-ps .ampc-ps-go:disabled { opacity: .4; cursor: not-allowed; }

#ampc-ps .ampc-ps-stop {
	padding: .78rem 1.4rem;
	background: transparent;
	border: 1px solid var(--ampc-line);
	color: var(--ampc-muted);
}
#ampc-ps .ampc-ps-stop:hover { border-color: var(--ampc-open); color: var(--ampc-open); }

#ampc-ps .ampc-ps-presets { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .95rem; }

#ampc-ps .ampc-ps-preset {
	padding: .38rem .8rem;
	background: var(--ampc-panel);
	border: 1px solid var(--ampc-line);
	border-radius: 999px;
	color: var(--ampc-muted);
	font-size: .82rem;
}
#ampc-ps .ampc-ps-preset:hover {
	border-color: var(--ampc-accent-dim);
	color: var(--ampc-text);
	background: var(--ampc-panel-2);
}
#ampc-ps .ampc-ps-preset[aria-pressed=true] {
	border-color: var(--ampc-accent-dim);
	color: var(--ampc-accent);
	background: rgba(76,201,240,.07);
}

/* --- Stage -------------------------------------------------------------- */

#ampc-ps .ampc-ps-stage { padding: 0 1.9rem 1.6rem; }

#ampc-ps .ampc-ps-progress-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: .7rem;
	font-size: .85rem;
	color: var(--ampc-muted);
}
#ampc-ps .ampc-ps-pct { color: var(--ampc-text); }

#ampc-ps .ampc-ps-bar {
	height: 3px;
	background: var(--ampc-line-soft);
	border-radius: 999px;
	overflow: hidden;
	margin-bottom: 1.4rem;
}
#ampc-ps .ampc-ps-bar span {
	display: block;
	height: 100%;
	width: 0;
	background: var(--ampc-accent);
	transition: width .25s linear;
}

/* The port map. One cell per port asked for, in numeric order, filling in as
   results land. It is the overview AND the honesty guarantee: every port
   tested is on screen and nothing is summarised away. */
#ampc-ps .ampc-ps-map {
	display: grid;
	gap: 3px;
	margin-bottom: .85rem;
	align-items: stretch;
}
#ampc-ps .ampc-ps-map.is-medium { gap: 4px; }
#ampc-ps .ampc-ps-map.is-sparse { gap: 6px; }
#ampc-ps .ampc-ps-map.is-dense  { padding-top: 1.35rem; }

/* Row gutter. A fixed column count is what makes this possible: with auto-fill
   the browser decides how many cells per row and nothing lines up. Each label
   is the RANGE that row covers, because a bare first port sitting beside eight
   squares reads as a label for all eight of them. */
#ampc-ps .ampc-ps-rowlabel {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding-right: .55rem;
	font-size: .68rem;
	color: var(--ampc-faint);
	white-space: nowrap;
	user-select: none;
}

#ampc-ps .ampc-ps-cell {
	position: relative;
	aspect-ratio: 1;
	border-radius: 2px;
	background: var(--ampc-pending);
	transition: background .3s ease, transform .18s ease;
}
#ampc-ps .ampc-ps-map.is-sparse .ampc-ps-cell,
#ampc-ps .ampc-ps-map.is-medium .ampc-ps-cell {
	border-radius: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .68rem;
	color: transparent;
	aspect-ratio: auto;
	min-height: 30px;
}
#ampc-ps .ampc-ps-map.is-sparse .ampc-ps-cell { min-height: 40px; font-size: .78rem; }

/* Reveal the in-cell port number. These selectors must out-specify the
   colour: transparent rules above, which carry three classes each. */
#ampc-ps .ampc-ps-map.is-sparse .ampc-ps-cell.is-done,
#ampc-ps .ampc-ps-map.is-medium .ampc-ps-cell.is-done {
	color: #fff;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	font-weight: 600;
}

#ampc-ps .ampc-ps-cell[data-s=open]     { background: var(--ampc-open); }
#ampc-ps .ampc-ps-cell[data-s=closed]   { background: var(--ampc-closed); }
#ampc-ps .ampc-ps-cell[data-s=noreply]  { background: var(--ampc-noreply); }
#ampc-ps .ampc-ps-cell[data-s=untested] { background: var(--ampc-untested); }

/* An answering port has to be findable in a field of a thousand cells. */
#ampc-ps .ampc-ps-cell[data-s=open] {
	box-shadow: 0 0 0 1.5px rgba(255,112,67,.95), 0 0 10px 1px rgba(255,112,67,.4);
	z-index: 1;
}
#ampc-ps .ampc-ps-cell.is-done { cursor: pointer; }
#ampc-ps .ampc-ps-cell:hover { transform: scale(1.35); z-index: 3; }
#ampc-ps .ampc-ps-map.is-sparse .ampc-ps-cell:hover,
#ampc-ps .ampc-ps-map.is-medium .ampc-ps-cell:hover { transform: scale(1.06); }

/* Cross-highlight: hovering a result card dims the field except its cell,
   which is the only practical way to find one port among a thousand. */
#ampc-ps .ampc-ps-map.is-focusing .ampc-ps-cell { opacity: .16; }
#ampc-ps .ampc-ps-map.is-focusing .ampc-ps-cell.is-hi {
	opacity: 1;
	transform: scale(1.6);
	z-index: 4;
	box-shadow: 0 0 0 2px var(--ampc-accent), 0 0 14px 2px rgba(76,201,240,.55);
}
#ampc-ps .ampc-ps-map.is-sparse.is-focusing .ampc-ps-cell.is-hi,
#ampc-ps .ampc-ps-map.is-medium.is-focusing .ampc-ps-cell.is-hi { transform: scale(1.08); }

/* Exception tags. At dense sizes a cell is under 20px, so a four-digit port
   cannot fit inside it at any readable size. The label sits outside the cell
   and overflows across its neighbours, which is safe precisely because those
   neighbours carry the dominant result and no label of their own. */
#ampc-ps .ampc-ps-tag {
	position: absolute;
	left: 50%;
	bottom: calc(100% + 3px);
	transform: translateX(-50%);
	padding: 1px 4px;
	background: #060a10;
	border: 1px solid var(--ampc-line);
	border-radius: 3px;
	font-size: .63rem;
	line-height: 1.4;
	color: var(--ampc-text);
	white-space: nowrap;
	pointer-events: none;
	z-index: 6;
}
#ampc-ps .ampc-ps-cell.is-tag-below .ampc-ps-tag { bottom: auto; top: calc(100% + 3px); }
#ampc-ps .ampc-ps-cell[data-s=open] .ampc-ps-tag { border-color: rgba(255,112,67,.65); color: #ffb59c; }
#ampc-ps .ampc-ps-map.is-focusing .ampc-ps-tag { opacity: 0; }
#ampc-ps .ampc-ps-map.is-focusing .ampc-ps-cell.is-hi .ampc-ps-tag { opacity: 1; }

/* Pinned readout. The map's answer to touch, which never gets a tooltip. */
#ampc-ps .ampc-ps-pin {
	display: flex;
	align-items: center;
	gap: .75rem;
	flex-wrap: wrap;
	min-height: 2.5rem;
	padding: .5rem .85rem;
	margin-bottom: 1.1rem;
	background: var(--ampc-panel);
	border: 1px solid var(--ampc-line-soft);
	border-radius: 8px;
	font-size: .87rem;
	color: var(--ampc-faint);
}
#ampc-ps .ampc-ps-pin.has-pin { border-color: var(--ampc-line); color: var(--ampc-text); }
#ampc-ps .ampc-ps-pin .ampc-ps-pport { font-size: 1.05rem; }
#ampc-ps .ampc-ps-pin .ampc-ps-psvc { color: var(--ampc-muted); }
#ampc-ps .ampc-ps-pin a { margin-left: auto; color: var(--ampc-accent); text-decoration: none; font-size: .84rem; }
#ampc-ps .ampc-ps-pin a:hover { text-decoration: underline; color: var(--ampc-accent); }

#ampc-ps .ampc-ps-legend { display: flex; flex-wrap: wrap; gap: 1.1rem; font-size: .79rem; color: var(--ampc-muted); }
#ampc-ps .ampc-ps-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: .42rem; }
#ampc-ps .ampc-ps-legend i[data-s=open]     { background: var(--ampc-open); }
#ampc-ps .ampc-ps-legend i[data-s=closed]   { background: var(--ampc-closed); }
#ampc-ps .ampc-ps-legend i[data-s=noreply]  { background: var(--ampc-noreply); }
#ampc-ps .ampc-ps-legend i[data-s=untested] { background: var(--ampc-untested); }

/* --- Results ------------------------------------------------------------ */

#ampc-ps .ampc-ps-results { padding: 0 1.9rem 2rem; }

#ampc-ps .ampc-ps-tally {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 1px;
	background: var(--ampc-line-soft);
	border: 1px solid var(--ampc-line-soft);
	border-radius: 11px;
	overflow: hidden;
	margin: 1.6rem 0 1.3rem;
}
#ampc-ps .ampc-ps-tally > div { background: var(--ampc-panel); padding: 1rem 1.1rem; }
#ampc-ps .ampc-ps-tally .ampc-ps-n { display: block; font-size: 1.75rem; line-height: 1.1; letter-spacing: -.02em; }
#ampc-ps .ampc-ps-tally .ampc-ps-k {
	display: block;
	font-size: .72rem;
	text-transform: uppercase;
	letter-spacing: .11em;
	color: var(--ampc-faint);
	margin-top: .35rem;
}
#ampc-ps .ampc-ps-tally [data-s=open]     .ampc-ps-n { color: var(--ampc-open); }
#ampc-ps .ampc-ps-tally [data-s=closed]   .ampc-ps-n { color: var(--ampc-closed); }
#ampc-ps .ampc-ps-tally [data-s=noreply]  .ampc-ps-n { color: var(--ampc-noreply); }
#ampc-ps .ampc-ps-tally [data-s=untested] .ampc-ps-n { color: var(--ampc-untested); }

#ampc-ps .ampc-ps-verdict {
	padding: 1.15rem 1.3rem;
	background: var(--ampc-panel);
	border: 1px solid var(--ampc-line);
	border-left: 3px solid var(--ampc-accent-dim);
	border-radius: 0 10px 10px 0;
	margin-bottom: 1.5rem;
}
#ampc-ps .ampc-ps-verdict h3 {
	margin: 0 0 .45rem;
	padding: 0;
	font-size: .72rem;
	text-transform: uppercase;
	letter-spacing: .13em;
	color: var(--ampc-faint);
	font-weight: 600;
	border: none;
}
#ampc-ps .ampc-ps-verdict p { margin: 0 0 .6rem; color: #d5dfeb; }
#ampc-ps .ampc-ps-verdict p:last-child { margin-bottom: 0; }

/* The autoblock flag (§9.2). Marked out from the findings because it is about
   whether the findings can be trusted, and it sits above them. Deliberately
   quieter than .ampc-ps-notice: this is a caveat, not an alarm, and the copy
   is careful never to assert that autoblock happened. */
#ampc-ps .ampc-ps-verdict p.ampc-ps-flag {
	padding: .7rem .85rem;
	margin-bottom: .8rem;
	background: rgba(255,112,67,.055);
	border-left: 2px solid rgba(255,112,67,.45);
	border-radius: 0 6px 6px 0;
	color: #f0d9cf;
}

#ampc-ps .ampc-ps-cards { display: flex; flex-direction: column; gap: .7rem; margin-bottom: 1.4rem; }

#ampc-ps .ampc-ps-card {
	display: flex;
	gap: 1.1rem;
	align-items: center;
	padding: .95rem 1.15rem;
	background: var(--ampc-panel);
	border: 1px solid var(--ampc-line);
	border-left: 3px solid var(--ampc-closed);
	border-radius: 0 10px 10px 0;
}
#ampc-ps .ampc-ps-card.is-open {
	border-left-color: var(--ampc-open);
	background: linear-gradient(90deg, rgba(255,112,67,.06), var(--ampc-panel) 55%);
}
#ampc-ps .ampc-ps-card .ampc-ps-port { font-size: 1.3rem; min-width: 4.6rem; letter-spacing: -.02em; }
#ampc-ps .ampc-ps-card .ampc-ps-meta { flex: 1; min-width: 0; }
#ampc-ps .ampc-ps-card .ampc-ps-svc  { font-weight: 600; }
#ampc-ps .ampc-ps-card .ampc-ps-note { display: block; color: var(--ampc-muted); font-size: .87rem; margin-top: .15rem; }

#ampc-ps .ampc-ps-pill {
	padding: .22rem .62rem;
	border-radius: 999px;
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	font-weight: 650;
	white-space: nowrap;
}
#ampc-ps .ampc-ps-pill[data-s=open]     { background: rgba(255,112,67,.15); color: #ff9573; }
#ampc-ps .ampc-ps-pill[data-s=closed]   { background: rgba(91,141,217,.15); color: #8fb3e8; }
#ampc-ps .ampc-ps-pill[data-s=noreply]  { background: rgba(63,125,106,.18); color: #6fb69c; }
#ampc-ps .ampc-ps-pill[data-s=untested] { background: rgba(107,118,132,.2); color: #9aa6b4; }

#ampc-ps .ampc-ps-card a {
	color: var(--ampc-accent);
	text-decoration: none;
	font-size: .85rem;
	white-space: nowrap;
	border-bottom: 1px solid transparent;
}
#ampc-ps .ampc-ps-card a:hover { border-bottom-color: var(--ampc-accent); color: var(--ampc-accent); }

#ampc-ps .ampc-ps-footnote {
	padding-top: 1.1rem;
	margin: 0;
	border-top: 1px solid var(--ampc-line-soft);
	color: var(--ampc-faint);
	font-size: .84rem;
}

/* --- The pre-scan question --------------------------------------------- */

/* Shaped like the halt box below but carrying the accent rather than the
   warning colour: it is a question, not a refusal. The institutional form
   swaps the home paragraph for the organisation one and reveals the checkbox;
   the plain form never shows either. */
#ampc-ps .ampc-ps-confirm {
	margin: 0 1.9rem 1.9rem;
	padding: 1.2rem 1.35rem;
	background: var(--ampc-panel);
	border: 1px solid var(--ampc-line);
	border-left: 3px solid var(--ampc-accent);
	border-radius: 0 10px 10px 0;
}
#ampc-ps .ampc-ps-confirm h3 { margin: 0 0 .5rem; padding: 0; font-size: 1rem; color: var(--ampc-text); border: none; }
#ampc-ps .ampc-ps-confirm p  { margin: 0 0 .6rem; color: var(--ampc-muted); font-size: .92rem; }
#ampc-ps .ampc-ps-confirm p .ampc-ps-mono { color: var(--ampc-text); }
#ampc-ps .ampc-ps-confirm-inst,
#ampc-ps .ampc-ps-confirm-ack { display: none; }
#ampc-ps .ampc-ps-confirm.is-inst .ampc-ps-confirm-home { display: none; }
#ampc-ps .ampc-ps-confirm.is-inst .ampc-ps-confirm-inst { display: block; color: #f0d9cf; }
#ampc-ps .ampc-ps-confirm.is-inst .ampc-ps-confirm-ack {
	display: flex;
	gap: .6rem;
	align-items: flex-start;
	margin: .2rem 0 .9rem;
	font-size: .92rem;
	color: var(--ampc-text);
	cursor: pointer;
}
#ampc-ps .ampc-ps-confirm-ack input { margin: .3rem 0 0; flex-shrink: 0; accent-color: var(--ampc-accent); }
#ampc-ps .ampc-ps-confirm-actions { display: flex; gap: .7rem; flex-wrap: wrap; margin-top: .4rem; }

/* --- Blocking states ---------------------------------------------------- */

#ampc-ps .ampc-ps-halt {
	margin: 1.3rem 1.9rem 1.9rem;
	padding: 1.2rem 1.35rem;
	background: var(--ampc-panel);
	border: 1px solid var(--ampc-line);
	border-left: 3px solid var(--ampc-open);
	border-radius: 0 10px 10px 0;
}
#ampc-ps .ampc-ps-halt h3 { margin: 0 0 .5rem; padding: 0; font-size: 1rem; color: var(--ampc-text); border: none; }
#ampc-ps .ampc-ps-halt p  { margin: 0; color: var(--ampc-muted); font-size: .92rem; }

#ampc-ps .ampc-ps-noscript { padding: 1.3rem 1.9rem; color: var(--ampc-muted); }

.ampc-scanner-unavailable { margin: 1.5rem 0; }

/* --- Narrow screens ----------------------------------------------------- */

@media (max-width: 640px) {
	#ampc-ps { margin-left: -1rem; margin-right: -1rem; border-radius: 0; border-left: none; border-right: none; font-size: 14.5px; }
	#ampc-ps .ampc-ps-head,
	#ampc-ps .ampc-ps-controls,
	#ampc-ps .ampc-ps-stage,
	#ampc-ps .ampc-ps-results { padding-left: 1rem; padding-right: 1rem; }
	#ampc-ps .ampc-ps-notice,
	#ampc-ps .ampc-ps-confirm,
	#ampc-ps .ampc-ps-halt { margin-left: 1rem; margin-right: 1rem; }
	#ampc-ps .ampc-ps-confirm-actions .ampc-ps-go,
	#ampc-ps .ampc-ps-confirm-actions .ampc-ps-stop { width: auto; flex: 1 1 auto; }

	#ampc-ps .ampc-ps-head { padding: 1.2rem 1rem 1.1rem; gap: .9rem; }
	#ampc-ps .ampc-ps-title { font-size: 1.2rem; }
	#ampc-ps .ampc-ps-subtitle { max-width: none; font-size: .89rem; }
	#ampc-ps .ampc-ps-whoami {
		text-align: left;
		min-width: 0;
		width: 100%;
		padding-top: .85rem;
		border-top: 1px solid var(--ampc-line-soft);
	}

	/* Full-width button under a full-width field. Side by side leaves the port
	   box too narrow to read a range like 8000-8100 while typing it. */
	#ampc-ps .ampc-ps-entry { flex-direction: column; gap: .6rem; }
	#ampc-ps .ampc-ps-spec-wrap { flex: none; width: 100%; }
	#ampc-ps .ampc-ps-go,
	#ampc-ps .ampc-ps-stop { width: 100%; padding: .85rem 1rem; }
	#ampc-ps .ampc-ps-preset { padding: .42rem .75rem; font-size: .8rem; }

	#ampc-ps .ampc-ps-rowlabel { font-size: .56rem; padding-right: .38rem; }
	#ampc-ps .ampc-ps-map.is-dense { padding-top: 1.2rem; }
	#ampc-ps .ampc-ps-map.is-sparse .ampc-ps-cell { min-height: 34px; font-size: .72rem; }
	#ampc-ps .ampc-ps-map.is-medium .ampc-ps-cell { min-height: 26px; font-size: .62rem; }
	#ampc-ps .ampc-ps-tag { font-size: .58rem; padding: 1px 3px; }

	#ampc-ps .ampc-ps-tally { grid-template-columns: repeat(2, 1fr); }
	#ampc-ps .ampc-ps-tally .ampc-ps-n { font-size: 1.45rem; }
	/* "could not test" only renders when non-zero, so the tally is usually
	   three tiles. In two columns that leaves an empty quarter, which reads as
	   a missing number rather than as spacing. */
	#ampc-ps .ampc-ps-tally > div:last-child:nth-child(odd) { grid-column: 1 / -1; }

	#ampc-ps .ampc-ps-card { flex-wrap: wrap; gap: .5rem .8rem; padding: .85rem .95rem; }
	#ampc-ps .ampc-ps-card .ampc-ps-port { min-width: 0; font-size: 1.15rem; }
	#ampc-ps .ampc-ps-card .ampc-ps-meta { flex: 1 0 100%; order: 3; }
	#ampc-ps .ampc-ps-card .ampc-ps-pill { margin-left: auto; }
	#ampc-ps .ampc-ps-card a { flex: 0 0 auto; order: 4; }

	#ampc-ps .ampc-ps-pin { font-size: .84rem; gap: .5rem; }
	#ampc-ps .ampc-ps-pin a { margin-left: 0; flex: 1 0 100%; }

	#ampc-ps .ampc-ps-legend { gap: .6rem .9rem; font-size: .76rem; }
	#ampc-ps .ampc-ps-verdict { padding: 1rem 1.05rem; }
	#ampc-ps .ampc-ps-footnote { font-size: .8rem; }
}

@media (max-width: 380px) {
	#ampc-ps .ampc-ps-head,
	#ampc-ps .ampc-ps-controls,
	#ampc-ps .ampc-ps-stage,
	#ampc-ps .ampc-ps-results { padding-left: .8rem; padding-right: .8rem; }
	#ampc-ps .ampc-ps-notice,
	#ampc-ps .ampc-ps-confirm,
	#ampc-ps .ampc-ps-halt { margin-left: .8rem; margin-right: .8rem; }
	#ampc-ps .ampc-ps-rowlabel { font-size: .52rem; }
	#ampc-ps input[type=text] { padding-right: 4.6rem; font-size: .92rem; }
	#ampc-ps .ampc-ps-count { font-size: .68rem; right: .6rem; }
}

@media (prefers-reduced-motion: reduce) {
	#ampc-ps .ampc-ps-cell,
	#ampc-ps .ampc-ps-bar span { transition: none; }
	#ampc-ps .ampc-ps-cell:hover { transform: none; }
}

/* ==========================================================================
   Mock mode bar
   ==========================================================================

   Only ever rendered when AMPC_SCANNER_PROBE_BASE is 'mock' (design.md §10).
   Loud on purpose, and the same discipline as the local build's red ribbon:
   a screenshot of this tool WITHOUT this bar is showing real results. Do not
   tone it down, and do not make it dismissible.
   ========================================================================== */

.ampc-ps .ampc-ps-mockbar {
  margin: 0 0 14px;
  padding: 10px 14px;
  border: 1px solid #b4341f;
  border-left: 4px solid #e0492c;
  border-radius: 6px;
  background: #2a1410;
  color: #ffd9d0;
  font-size: 13px;
  line-height: 1.45;
}

.ampc-ps .ampc-ps-mockbar strong {
  color: #ff8a6b;
  letter-spacing: .02em;
  text-transform: uppercase;
}