/**
 * dbi services · Neve Child Theme
 * eggs/retro/retro.css — Retro mode (eggs/retro/retro.php,
 * eggs/retro/retro.js, enhancements #49).
 *
 * The whole skin hangs on html.dbi-retro. The site's colours are
 * variables (tokens.css reads Neve's --nv-* ones), so the first block
 * re-points them to 1999: navy, white, grey, blue links, purple once
 * visited. The rest squares every corner, swaps the fonts for Times
 * and Verdana, turns the card grid into a striped table, dithers the
 * pictures to the web-safe palette (an SVG filter retro.js injects),
 * and styles the trimmings the script adds: the dial-up dialog, the
 * loading sheet, the marquee, the hit counter, the badges, the
 * webring, the status bar.
 *
 * Contrast: black or navy on white and grey, white or yellow on navy;
 * #0000ee links on white (8:1), #cc0000 badges carry yellow (5.4:1).
 * Blinking stops after five seconds (WCAG 2.2.2); the marquee pauses
 * on hover and focus; under prefers-reduced-motion nothing moves.
 *
 * Removing retro.php's require in eggs/eggs.php unloads this file.
 */

/* ── Tokens ──────────────────────────────────────────────── */
:root {
	--f-retro:     'Times New Roman', Times, serif;
	--f-retro-ui:  Verdana, Geneva, Tahoma, sans-serif;
}
html.dbi-retro {
	--nv-primary-accent:   #000080;
	--nv-secondary-accent: #000080;
	--nv-site-bg:          #ffffff;
	--nv-light-bg:         #c0c0c0;
	--nv-dark-bg:          #000080;
	--nv-text-color:       #000000;
	--nv-text-dark-bg:     #ffffff;
	--nv-c-1:              #333333;
	--nv-c-2:              #ffffcc;
	--retro-navy:  #000080;
	--retro-grey:  #c0c0c0;
	--retro-link:  #0000ee;
	--retro-visited: #551a8b;
	--retro-cream: #ffffcc;
}
html.dbi-retro .dbi-scope {
	--teal-mid:   #ffffcc;
	--border:     #808080;
	--divider:    #808080;
	--faint:      #555555;
	--faint-on-dark: #dddddd;
	--f-display:  var( --f-retro );
	--f-body:     var( --f-retro );
	--ease:       linear;
	--t:          0ms;
}

/* ── Surfaces ────────────────────────────────────────────── */
html.dbi-retro {
	scrollbar-color: #c0c0c0 #e8e8e8;
}
html.dbi-retro ::-webkit-scrollbar { width: 16px; height: 16px; }
html.dbi-retro ::-webkit-scrollbar-track { background: #e8e8e8; }
html.dbi-retro ::-webkit-scrollbar-thumb { background: #c0c0c0; border: 2px outset #ffffff; }
html.dbi-retro ::selection { background: #000080; color: #ffffff; }

html.dbi-retro body {
	background-color: #ffffff;
	background-image: url( "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8'><rect width='8' height='8' fill='%23f4f4ee'/><rect x='0' y='0' width='1' height='1' fill='%23d8d8d0'/><rect x='4' y='4' width='1' height='1' fill='%23d8d8d0'/></svg>" );
	font-family: var( --f-retro );
	color: #000;
	padding-bottom: 30px; /* room for the status bar */
}
/* The under-construction stripe along the top. */
html.dbi-retro body::before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 10px;
	z-index: 2147481998;
	pointer-events: none;
	background: repeating-linear-gradient( 135deg, #ffcc00 0 14px, #000 14px 28px );
}

html.dbi-retro a { color: #0000ee; }
html.dbi-retro a:visited { color: #551a8b; }

/* ── Header ──────────────────────────────────────────────── */
html.dbi-retro .header-main {
	--rowbcolor: #000080;
	background: #ffffff !important;
	border-bottom: 3px solid #000080;
}
html.dbi-retro .site-logo img {
	image-rendering: pixelated;
	filter: url( #dbi-retro-posterize ) contrast( 1.1 );
}
html.dbi-retro .header--row a.button-primary,
html.dbi-retro .dbi-btn-expert,
html.dbi-retro .search-submit,
.dbi-retro-button {
	background: #c0c0c0 !important;
	color: #000 !important;
	border: 2px outset #ffffff !important;
	border-radius: 0 !important;
	box-shadow: 1px 1px 0 #000;
	font: 13px var( --f-retro-ui ) !important;
	padding: 4px 14px !important;
	text-decoration: none !important;
	cursor: pointer;
}
html.dbi-retro .header--row a.button-primary:hover,
html.dbi-retro .dbi-btn-expert:hover,
.dbi-retro-button:hover {
	transform: none;
	background: #d4d4d4 !important;
}
html.dbi-retro .header--row a.button-primary:active,
html.dbi-retro .dbi-btn-expert:active,
.dbi-retro-button:active {
	border-style: inset !important;
}
html.dbi-retro .dbi-btn-expert svg { display: none; }
html.dbi-retro .dbi-btn-expert::before { content: "✉ "; }

/* ── Marquee (script-made, under the header) ─────────────── */
.dbi-retro-marquee {
	overflow: hidden;
	white-space: nowrap;
	background: #000080;
	color: #ffff00;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	font: bold 13px/26px var( --f-retro-ui );
}
.dbi-retro-marquee span {
	display: inline-block;
	padding-left: 100%;
	animation: dbi-retro-marquee 28s linear infinite;
}
.dbi-retro-marquee:hover span,
.dbi-retro-marquee:focus-within span {
	animation-play-state: paused;
}
@keyframes dbi-retro-marquee {
	to { transform: translateX( -100% ); }
}

/* ── Hero: a navy table cell ─────────────────────────────── */
html.dbi-retro .dbi-hero {
	background: #000080 !important;
	border: 4px ridge #c0c0c0;
	padding: 28px 24px 24px !important;
	overflow: visible;
}
html.dbi-retro .dbi-hero::before { display: none; }
html.dbi-retro .dbi-hero-inner { max-width: 800px; }
html.dbi-retro .dbi-hero-inner::before {
	content: "!! UNDER CONSTRUCTION !!";
	display: inline-block;
	margin-bottom: 14px;
	padding: 2px 10px;
	background: #ffcc00;
	color: #000;
	border: 2px dashed #000;
	font: bold 11px/1.6 var( --f-retro-ui );
	letter-spacing: .08em;
}
html.dbi-retro .dbi-hero-h1 {
	font: bold clamp( 1.9rem, 4vw, 2.6rem ) / 1.15 var( --f-retro );
	color: #fff;
	text-shadow: 2px 2px 0 #000;
	letter-spacing: 0;
}
html.dbi-retro .dbi-hero-h1 em {
	font-style: normal;
	color: #ffff00;
	animation: dbi-retro-blink 1s steps( 2, start ) 5;
}
html.dbi-retro .dbi-hero-sub {
	font: 12px/1.7 var( --f-retro-ui );
	color: #fff;
	max-width: none;
	opacity: 1;
}
html.dbi-retro .dbi-hero-proof,
html.dbi-retro .dbi-hero-proof a,
html.dbi-retro .dbi-hero-proof .dbi-site-reads {
	font-family: var( --f-retro-ui );
	font-size: 12px;
	color: #fff !important;
	letter-spacing: 0;
}
html.dbi-retro .dbi-hero-proof a {
	color: #ffff00 !important;
	text-decoration: underline;
	text-decoration-thickness: auto;
	text-decoration-color: currentColor;
}
html.dbi-retro .dbi-hero-proof a::after { display: none; }
@keyframes dbi-retro-blink {
	50% { visibility: hidden; }
}

/* The hit counter (script-made, after the proof line). */
.dbi-retro-counter {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 16px auto 0;
	padding: 4px 8px;
	background: #c0c0c0;
	border: 2px inset #808080;
	color: #000;
	font: bold 11px var( --f-retro-ui );
}
html.dbi-retro .dbi-hero-inner { text-align: left; }
.dbi-retro-digits { display: inline-flex; gap: 2px; }
.dbi-retro-digits b {
	display: inline-block;
	min-width: 14px;
	padding: 1px 2px;
	background: #000;
	color: #00ff00;
	border: 1px solid #808080;
	font: bold 18px/1.2 'Courier New', Courier, monospace;
	text-align: center;
}
.dbi-retro-counter.is-ticked .dbi-retro-digits b:last-child {
	animation: dbi-retro-tick .5s steps( 4, end );
}
@keyframes dbi-retro-tick {
	from { transform: translateY( -100% ); opacity: 0; }
	to   { transform: none; opacity: 1; }
}

/* ── Filter bar: a row of links with pipes ───────────────── */
html.dbi-retro .dbi-filter-bar,
html.dbi-retro body.dbi-scope .dbi-filter-bar {
	position: static !important;
	background: #c0c0c0 !important;
	border: 2px outset #ffffff;
	box-shadow: none;
	backdrop-filter: none;
}
html.dbi-retro .dbi-filter-bar .dbi-filter-inner {
	max-width: 800px;
	margin: 0 auto;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0;
	-webkit-mask: none;
	        mask: none;
	overflow: visible;
}
html.dbi-retro .dbi-filter-bar .dbi-filter-inner li + li::before {
	content: "|";
	color: #000;
	font: 12px var( --f-retro-ui );
	padding: 0 2px;
}
html.dbi-retro .dbi-filter-bar .dbi-filter-inner a {
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 2px 4px !important;
	color: #0000ee !important;
	font: 12px var( --f-retro-ui ) !important;
	text-decoration: underline !important;
}
html.dbi-retro .dbi-filter-bar .dbi-filter-inner a[aria-current],
html.dbi-retro .dbi-filter-bar .current-menu-item a {
	color: #000 !important;
	font-weight: bold !important;
	text-decoration: none !important;
}
html.dbi-retro .dbi-filter-bar .dbi-filter-count {
	background: none !important;
	color: #333 !important;
	font: 10px var( --f-retro-ui ) !important;
	padding: 0 !important;
}
html.dbi-retro .dbi-filter-bar .dbi-filter-count::before { content: "("; }
html.dbi-retro .dbi-filter-bar .dbi-filter-count::after  { content: ")"; }
html.dbi-retro .dbi-filter-bar .dbi-filter-edge { display: none !important; }

/* ── The grid becomes a striped table ────────────────────── */
html.dbi-retro .dbi-grid-section {
	background: transparent;
	padding: 24px 16px 48px !important;
}
html.dbi-retro .dbi-grid-section > .wp-block-query {
	max-width: 800px;
	background: #fff;
	border: 1px solid #000;
}
html.dbi-retro .dbi-grid-section ul.wp-block-post-template {
	display: block !important;
	gap: 0 !important;
}
html.dbi-retro .dbi-grid-section ul.wp-block-post-template > li {
	display: block !important;
	border: 0 !important;
	border-bottom: 1px dashed #808080 !important;
	border-radius: 0 !important;
	background: #fff !important;
	box-shadow: none !important;
	transform: none !important;
	overflow: visible !important;
	transition: none;
}
html.dbi-retro .dbi-grid-section ul.wp-block-post-template > li:nth-child( even ) {
	background: #f0f0f0 !important;
}
html.dbi-retro .dbi-card-body {
	padding: 12px 14px 10px !important;
	display: block !important;
}
html.dbi-retro .dbi-card-body > .wp-block-group__inner-container {
	display: block;
}
html.dbi-retro .dbi-grid-section .wp-block-post-terms {
	font: 10px var( --f-retro-ui );
	text-transform: none;
	letter-spacing: 0;
}
html.dbi-retro .dbi-grid-section .wp-block-post-terms a {
	color: #333 !important;
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
	text-decoration: none;
}
html.dbi-retro .dbi-grid-section .wp-block-post-terms a::before { content: "["; }
html.dbi-retro .dbi-grid-section .wp-block-post-terms a::after  { content: "]"; }
html.dbi-retro .dbi-grid-section .wp-block-spacer { display: none; }
html.dbi-retro .dbi-grid-section .wp-block-post-title {
	font: bold 18px/1.3 var( --f-retro );
	margin: 2px 0 4px;
}
html.dbi-retro .dbi-grid-section .wp-block-post-title a {
	color: #0000ee !important;
	text-decoration: underline;
	background: none;
}
html.dbi-retro .dbi-grid-section .wp-block-post-title a:visited { color: #551a8b !important; }
html.dbi-retro .dbi-grid-section .wp-block-post-title a:hover { color: #ff0000 !important; }
html.dbi-retro li.dbi-retro-new .wp-block-post-title::before {
	content: "NEW!";
	display: inline-block;
	margin-right: 6px;
	padding: 0 4px;
	background: #cc0000;
	color: #ffff00;
	border: 1px solid #000;
	font: bold 10px/1.6 var( --f-retro-ui );
	vertical-align: middle;
	animation: dbi-retro-blink 1s steps( 2, start ) 5;
}
html.dbi-retro .dbi-grid-section .wp-block-post-excerpt__excerpt,
html.dbi-retro .dbi-grid-section .wp-block-post-excerpt p {
	font: 14px/1.5 var( --f-retro );
	color: #000;
	-webkit-line-clamp: unset;
	margin: 0 0 6px;
}
html.dbi-retro .dbi-grid-section .wp-block-post-featured-image {
	width: 160px;
	margin: 4px 0 6px !important;
	border: 1px solid #000;
	border-radius: 0;
	background: #fff;
	padding: 2px;
}
html.dbi-retro .dbi-grid-section .wp-block-post-featured-image a { position: relative; }
html.dbi-retro .dbi-grid-section .wp-block-post-featured-image img {
	aspect-ratio: 4 / 3;
	filter: url( #dbi-retro-posterize );
	transform: none !important;
	transition: none;
}
/* Dither: a 2px checker over every picture. */
html.dbi-retro .dbi-grid-section .wp-block-post-featured-image a::after,
html.dbi-retro .wp-block-avatar__link::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: repeating-conic-gradient( transparent 0 25%, rgba( 255, 255, 255, .22 ) 0 50% ) 0 0 / 2px 2px;
}
html.dbi-retro .dbi-author-row {
	margin-top: 4px;
	gap: 8px;
	align-items: center;
}
html.dbi-retro .wp-block-avatar { overflow: visible; }
html.dbi-retro .wp-block-avatar__link { position: relative; display: block; }
html.dbi-retro .wp-block-avatar img,
html.dbi-retro .avatar {
	width: 32px !important;
	height: 32px !important;
	border-radius: 0 !important;
	border: 1px solid #000;
	box-shadow: none;
	filter: url( #dbi-retro-posterize ) contrast( 1.15 );
}
html.dbi-retro .dbi-author-meta .wp-block-post-author-name,
html.dbi-retro .dbi-author-meta .wp-block-post-author-name a {
	font: 11px var( --f-retro-ui );
	color: #0000ee !important;
	text-decoration: underline;
}
html.dbi-retro .dbi-author-meta .wp-block-post-date {
	font: 10px var( --f-retro-ui );
	color: #333;
}

/* Pagination: [1] [2] [Next >>] */
html.dbi-retro .dbi-grid-section .wp-block-query-pagination {
	margin-top: 16px;
	font: 12px var( --f-retro-ui );
}
html.dbi-retro .dbi-grid-section .wp-block-query-pagination .page-numbers,
html.dbi-retro .dbi-grid-section .wp-block-query-pagination-next,
html.dbi-retro .dbi-grid-section .wp-block-query-pagination-previous {
	border: 0 !important;
	background: none !important;
	border-radius: 0 !important;
	color: #0000ee !important;
	text-decoration: underline;
	padding: 0 4px !important;
	box-shadow: none !important;
}
html.dbi-retro .dbi-grid-section .page-numbers.current {
	color: #000 !important;
	font-weight: bold;
	text-decoration: none;
}
html.dbi-retro .dbi-grid-section .page-numbers.dots { text-decoration: none; color: #000 !important; }

/* ── CTA: the guestbook box ──────────────────────────────── */
html.dbi-retro .dbi-cta-interrupt,
html.dbi-retro .dbi-cta {
	background: #ffffcc !important;
	border: 3px double #000080;
	border-radius: 0 !important;
	color: #000;
	padding: 14px 16px !important;
	margin: 10px;
	opacity: 1 !important;
	transform: none !important;
}
html.dbi-retro .dbi-cta-interrupt::before { display: none; }
html.dbi-retro .dbi-cta-label {
	font: bold 11px var( --f-retro-ui );
	color: #000080 !important;
	letter-spacing: 0;
	text-align: center;
}
html.dbi-retro .dbi-cta-label::before { display: none; }
html.dbi-retro .dbi-cta-h2 {
	font: bold 20px/1.3 var( --f-retro );
	color: #000 !important;
	text-align: center;
}
html.dbi-retro .dbi-cta-h2 em { color: #000080; font-style: italic; }
html.dbi-retro .dbi-cta-body {
	font: 13px/1.5 var( --f-retro );
	color: #000 !important;
	opacity: 1;
	text-align: center;
}
html.dbi-retro .dbi-cta-action { text-align: center; }

/* ── Most read: the HOT box ──────────────────────────────── */
html.dbi-retro .dbi-most-read {
	background: #fff !important;
	border: 2px solid #000080;
	border-radius: 0 !important;
	box-shadow: none;
	padding: 12px 14px !important;
	margin: 10px;
	opacity: 1 !important;
	transform: none !important;
	animation: none !important;
}
html.dbi-retro .dbi-most-read-label {
	font: bold 18px var( --f-retro );
	color: #cc0000;
	letter-spacing: 0;
	text-transform: none;
}
html.dbi-retro .dbi-most-read-label::before { display: none; }
html.dbi-retro .dbi-most-read-stat,
html.dbi-retro .dbi-most-read-stat span,
html.dbi-retro .dbi-most-read-lead,
html.dbi-retro .dbi-most-read-kicker {
	font-family: var( --f-retro-ui );
	color: #000;
	letter-spacing: 0;
}
html.dbi-retro .dbi-most-read-stat { font-size: 11px; }
html.dbi-retro .dbi-most-read-lead { font-size: 12px; }
html.dbi-retro .dbi-most-read-kicker {
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	color: #000080;
}
html.dbi-retro .dbi-most-read-list {
	list-style: decimal !important;
	padding-left: 22px !important;
	font: 14px/1.5 var( --f-retro );
}
html.dbi-retro .dbi-most-read-list li::before { display: none; }
html.dbi-retro .dbi-most-read-list li { display: list-item; padding-left: 0 !important; }
html.dbi-retro .dbi-most-read-list a {
	color: #0000ee;
	text-decoration: underline;
	font-weight: normal;
}
html.dbi-retro .dbi-most-read-list a:visited { color: #551a8b; }
html.dbi-retro .dbi-most-read-count {
	font: 10px var( --f-retro-ui );
	color: #333;
}

/* ── Footer: grey with badges and a webring ──────────────── */
html.dbi-retro .site-footer,
html.dbi-retro .site-footer .footer--row,
html.dbi-retro .site-footer .footer--row-inner,
html.dbi-retro .site-footer .footer-main,
html.dbi-retro .site-footer .footer-bottom {
	background: #c0c0c0 !important;
	color: #000 !important;
	border-top: 2px solid #000080;
	font: 12px/1.6 var( --f-retro-ui );
}
html.dbi-retro .site-footer .container { max-width: 832px; }
html.dbi-retro .site-footer .dbi-footer-brand {
	font: bold 16px var( --f-retro );
	color: #000080;
}
html.dbi-retro .site-footer .dbi-footer-blurb,
html.dbi-retro .site-footer .footer-bottom p,
html.dbi-retro .site-footer .footer-bottom .cr div {
	color: #000 !important;
	font: 12px/1.6 var( --f-retro-ui );
}
html.dbi-retro .site-footer .widget-title {
	color: #000;
	font: bold 12px var( --f-retro-ui );
	text-transform: none;
	letter-spacing: 0;
}
html.dbi-retro .site-footer a,
html.dbi-retro .site-footer .widget ul a,
html.dbi-retro .site-footer .footer-main a,
html.dbi-retro .site-footer .footer-bottom a,
html.dbi-retro .site-footer .footer-menu a {
	color: #0000ee !important;
	text-decoration: underline;
}
html.dbi-retro .site-footer a:visited { color: #551a8b !important; }

.dbi-retro-footer {
	max-width: 800px;
	margin: 0 auto;
	padding: 12px 16px 16px;
	text-align: center;
	font: 11px/1.6 var( --f-retro-ui );
	color: #000;
}
.dbi-retro-webring {
	display: inline-block;
	margin: 0 0 12px;
	padding: 8px 14px;
	background: #fff;
	border: 2px groove #808080;
}
.dbi-retro-webring strong { font-size: 12px; }
.dbi-retro-webring a { color: #0000ee; }
.dbi-retro-webring span { color: #808080; }
.dbi-retro-badges {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin: 0 0 10px;
}
.dbi-retro-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 88px;
	height: 31px;
	padding: 0 4px;
	box-sizing: border-box;
	border: 1px solid #000;
	font: bold 9px/1.1 var( --f-retro-ui );
	letter-spacing: .02em;
	text-align: center;
	text-decoration: none !important;
	text-transform: uppercase;
	image-rendering: pixelated;
}
.dbi-retro-badge.is-navy  { background: #000080; color: #fff !important; }
.dbi-retro-badge.is-lime  { background: #000; color: #00ff00 !important; }
.dbi-retro-badge.is-grey  { background: #c0c0c0; color: #000 !important; border: 2px outset #fff; }
.dbi-retro-badge.is-red   { background: #cc0000; color: #ffff00 !important; }
.dbi-retro-badge.is-teal  { background: #008080; color: #fff !important; }
.dbi-retro-badge.is-swiss { background: #ff0000; color: #fff !important; }
.dbi-retro-badge.is-swiss::before { content: "+ "; font-size: 12px; }
a.dbi-retro-badge:hover { outline: 2px dotted #000; }
.dbi-retro-updated { margin: 0; color: #333; }

/* ── Status bar (script-made, fixed at the bottom) ───────── */
.dbi-retro-statusbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2147481999;
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 3px 4px;
	background: #c0c0c0;
	border-top: 2px outset #ffffff;
	color: #000;
	font: 11px/1.4 var( --f-retro-ui );
}
.dbi-retro-status-cell {
	padding: 1px 8px;
	border: 1px inset #808080;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.dbi-retro-status-cell.is-wide { flex: 1; min-width: 0; }
.dbi-retro-statusbar .dbi-retro-button { margin-left: auto; padding: 1px 10px !important; font-size: 11px !important; }
.dbi-retro-button:focus-visible { outline: 2px dotted #000; outline-offset: 1px; }
@media ( max-width: 560px ) {
	.dbi-retro-status-cell:not( .is-wide ) { display: none; }
}

/* ── Mouse trail ─────────────────────────────────────────── */
.dbi-retro-trail {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 2147482003;
	pointer-events: none;
	color: #000080;
	font-size: 12px;
	line-height: 1;
	transform: translate( -50%, -50% );
	animation: dbi-retro-fade .7s linear forwards;
}
@keyframes dbi-retro-fade {
	to { opacity: 0; transform: translate( -50%, 30% ) scale( .4 ); }
}

/* ── The dial-up dialog ──────────────────────────────────── */
.dbi-retro-dial {
	position: fixed;
	inset: 0;
	z-index: 2147482000;
	display: grid;
	place-items: center;
	background: #008080;
	font: 11px var( --f-retro-ui );
	color: #000;
}
.dbi-retro-dialog {
	width: min( 380px, calc( 100vw - 32px ) );
	background: #c0c0c0;
	border: 2px outset #ffffff;
	box-shadow: 2px 2px 0 #000;
}
.dbi-retro-titlebar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 3px 4px 3px 8px;
	background: linear-gradient( 90deg, #000080, #1084d0 );
	color: #fff;
	font-weight: bold;
}
.dbi-retro-titlebar-x {
	width: 16px;
	height: 14px;
	background: #c0c0c0;
	color: #000;
	border: 1px outset #fff;
	font: bold 11px/12px var( --f-retro-ui );
	text-align: center;
}
.dbi-retro-dialog-body { padding: 14px 14px 12px; }
.dbi-retro-dial-line {
	margin: 0 0 10px;
	min-height: 1.5em;
	font: 11px/1.5 var( --f-retro-ui );
}
.dbi-retro-dial-line::before { content: "☎ "; }
.dbi-retro-progress {
	height: 16px;
	background: #fff;
	border: 1px inset #808080;
	overflow: hidden;
}
.dbi-retro-progress span {
	display: block;
	height: 100%;
	width: 0;
	background: repeating-linear-gradient( 90deg, #000080 0 10px, transparent 10px 12px );
}
.dbi-retro-progress.is-filling span {
	animation: dbi-retro-fill 1s steps( 12, end ) forwards;
}
@keyframes dbi-retro-fill {
	to { width: 100%; }
}
.dbi-retro-dialog-row {
	display: flex;
	justify-content: flex-end;
	margin-top: 12px;
}

/* ── The loading sheet: the page comes in line by line ───── */
.dbi-retro-reveal {
	position: fixed;
	inset: 0;
	z-index: 2147481999;
	background: #fff;
	pointer-events: none;
}
.dbi-retro-reveal.is-loading {
	animation: dbi-retro-load 1.8s steps( 14, end ) forwards;
}
@keyframes dbi-retro-load {
	to { transform: translateY( 100% ); }
}

/* ── Hint: the fly (retro.js, before the mode is on) ─────── */
.dbi-retro-fly {
	position: fixed;
	left: 50%;
	top: 45%;
	width: 20px;
	height: 20px;
	margin: -10px 0 0 -10px;
	pointer-events: none;
	z-index: 2147481990;
}
/* The outer box flies the path and turns; the sprite inside trembles. */
.dbi-retro-fly svg {
	display: block;
	width: 100%;
	height: 100%;
	animation: dbi-retro-tremor .14s ease-in-out infinite alternate;
}
.dbi-retro-fly-wing {
	animation: dbi-retro-buzz .08s steps( 1, end ) infinite;
}
@keyframes dbi-retro-tremor {
	from { transform: translate( -1px, 1px ) rotate( -7deg ); }
	to   { transform: translate( 1px, -1px ) rotate( 6deg ); }
}
@keyframes dbi-retro-buzz {
	50% { opacity: .35; }
}

@media ( prefers-reduced-motion: reduce ) {
	.dbi-retro-marquee span,
	html.dbi-retro .dbi-hero-h1 em,
	html.dbi-retro li.dbi-retro-new .wp-block-post-title::before,
	.dbi-retro-counter.is-ticked .dbi-retro-digits b:last-child,
	.dbi-retro-trail,
	.dbi-retro-progress.is-filling span,
	.dbi-retro-reveal.is-loading {
		animation: none !important;
	}
	.dbi-retro-fly {
		display: none;
	}
	.dbi-retro-marquee span { padding-left: 0; }
	.dbi-retro-marquee { white-space: normal; text-align: center; padding: 0 12px; }
}
