/* AtariOnline.org light redesign. Loaded only when ao_active(). */

/* ---------- Fonts (self-hosted, latin subset, OFL) ---------- */
@font-face { font-family: "Archivo Black"; font-weight: 400; font-style: normal; font-display: swap; src: url(../fonts/archivo-black-400.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 400; font-style: normal; font-display: swap; src: url(../fonts/barlow-400.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 500; font-style: normal; font-display: swap; src: url(../fonts/barlow-500.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-style: normal; font-display: swap; src: url(../fonts/barlow-600.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 700; font-style: normal; font-display: swap; src: url(../fonts/barlow-700.woff2) format("woff2"); }
@font-face { font-family: "Press Start 2P"; font-weight: 400; font-style: normal; font-display: swap; src: url(../fonts/press-start-2p-400.woff2) format("woff2"); }

/* ---------- Tokens ---------- */
:root {
	--bg: #ffffff;
	--panel: #f6f3ed;
	--panel-2: #ece7de;
	--line: #e2dcd1;
	--line-strong: #cfc7b9;
	--text: #1a1714;
	--text-body: #2b2622;
	--text-2: #4f4840;
	--muted: #6b6358;
	--link: #b3430a;
	--link-hover: #7a2c05;
	--accent: #f07f1e;
	--on-accent: #14110e;
	--stripe-1: #e8221a; /* nudged toward the logo red (#f60000) */
	--stripe-2: #f07f1e;
	--stripe-3: #f6c21a;
	--badge: #f6c21a;
	--heart: #d1291c;
	--screen: #000000;

	--font-display: "Archivo Black", "Arial Black", sans-serif;
	--font-body: "Barlow", "Segoe UI", Helvetica, Arial, sans-serif;
	--font-pixel: "Press Start 2P", ui-monospace, monospace;

	--r-card: 10px;
	--r-panel: 14px;
	--r-ctl: 8px;
	--r-pill: 999px;
	--container: 1200px;
	--gutter: 24px;
	--focus: 0 0 0 3px var(--bg), 0 0 0 5px var(--link);
}

/* ---------- Base ---------- */
body.ao {
	background: var(--bg);
	color: var(--text);
	font-family: var(--font-body);
	font-size: 17px;
	line-height: 1.5;
}
.ao button, .ao input, .ao select, .ao textarea { font-family: var(--font-body); }
.ao a { color: var(--link); }
.ao a:hover, .ao a:focus { color: var(--link-hover); }
.ao :focus-visible { outline: none; box-shadow: var(--focus); border-radius: 4px; }

.ao h1, .ao h2, .ao h3, .ao h4 {
	font-family: var(--font-display);
	font-weight: 400;
	text-transform: uppercase;
	line-height: 1.1;
	color: var(--text);
	letter-spacing: -0.005em;
}
.ao h1 { font-size: clamp(28px, 4vw, 44px); line-height: 1.05; }
.ao h2 { font-size: 28px; }
.ao h3 { font-size: 21px; }
.ao h4 { font-size: 18px; }

.ao .ao-pixel { font-family: var(--font-pixel); font-size: 10px; line-height: 1.4; letter-spacing: 0.04em; text-transform: uppercase; }

/* GeneratePress containers: flat white, no grey page behind boxes */
.ao .site.grid-container { max-width: var(--container); padding-left: var(--gutter); padding-right: var(--gutter); }
.ao.separate-containers .inside-article,
.ao.separate-containers .page-header,
.ao.separate-containers .paging-navigation { background: transparent; padding: 0; }
.ao.separate-containers .site-main { margin: 32px 0 72px; }
.ao .site-content { display: block; }
.ao .content-area { width: 100%; }

/* ---------- Controls ---------- */
.ao-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 44px; padding: 0 20px;
	border-radius: var(--r-ctl); border: 2px solid var(--line-strong);
	background: transparent; color: var(--text);
	font: 700 16px/1 var(--font-body); text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none;
	cursor: pointer;
}
.ao a.ao-btn { color: var(--text); }
.ao-btn:hover, .ao a.ao-btn:hover { border-color: var(--text); color: var(--text); background: transparent; }
.ao-btn--primary, .ao a.ao-btn--primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.ao-btn--primary:hover, .ao a.ao-btn--primary:hover { background: #d96c10; border-color: #d96c10; color: var(--on-accent); }
.ao-btn--quiet { background: var(--panel-2); border-width: 1px; font-size: 15px; font-weight: 600; text-transform: none; letter-spacing: 0; }

.ao-pill, .ao a.ao-pill {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px;
	background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-pill);
	color: var(--text); font-weight: 600; font-size: 15px; text-decoration: none;
}
.ao a.ao-pill:hover { border-color: var(--line-strong); color: var(--link-hover); }

.ao input[type="search"], .ao input[type="text"], .ao input[type="email"], .ao textarea, .ao select {
	background: var(--panel); border: 1px solid var(--line-strong); border-radius: var(--r-ctl);
	color: var(--text); font-size: 16px;
}
.ao input::placeholder { color: var(--muted); opacity: 1; }

.ao-badge {
	display: inline-block; padding: 7px 9px; border-radius: 4px;
	background: var(--badge); color: var(--on-accent);
	font-family: var(--font-pixel); font-size: 9px; line-height: 1; text-transform: uppercase;
}
.ao-badge--soft { background: var(--panel-2); color: var(--text-2); }
.ao-badge--accent { background: var(--accent); }

/* ---------- Rainbow stripe ---------- */
.ao-stripe { display: flex; height: 6px; }
.ao-stripe span { flex: 1; }
.ao-stripe span:nth-child(1) { background: var(--stripe-1); }
.ao-stripe span:nth-child(2) { background: var(--stripe-2); }
.ao-stripe span:nth-child(3) { background: var(--stripe-3); }
.ao-stripe--thin { height: 5px; }

/* ---------- Header ---------- */
.ao .site-header { background: var(--bg); }
.ao .inside-header {
	display: flex; flex-wrap: wrap; align-items: center; gap: 12px 32px;
	max-width: none; padding: 14px 40px;
}
.ao .site-logo { margin: 0; line-height: 0; }
.ao .site-logo img { width: 210px; height: auto; }
.ao #site-navigation { flex: 1 1 0; min-width: 0; margin: 0; background: transparent; }
@media (min-width: 769px) {
	.ao #site-navigation .main-nav > ul { display: flex; flex-wrap: wrap; }
}
.ao #site-navigation .inside-navigation { justify-content: flex-start; padding: 0; }
.ao .main-navigation .main-nav ul li a {
	font-family: var(--font-body); font-weight: 600; font-size: 16px;
	text-transform: uppercase; letter-spacing: 0.06em;
	color: var(--text); background: transparent;
	line-height: 44px; padding: 0 14px; border: 0;
}
.ao .main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
.ao .main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a { color: var(--link); background: transparent; }
.ao .main-navigation .main-nav ul li[class*="current-menu-"] > a { color: var(--link); background: transparent; }
.ao .main-navigation .main-nav > ul > li:first-child > a { padding-left: 0; }
/* Ivory Search's icon-only menu item: the search lives in the header box now */
.ao .main-navigation .astm-search-menu { display: none; }

.ao-header-search { flex: 0 0 260px; margin: 0 0 0 auto; position: relative; }

/* Dropdowns (Games ▾) */
.ao .main-navigation ul ul {
	background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-ctl);
	box-shadow: none; padding: 6px 0; width: 260px;
}
.ao .main-navigation .main-nav ul ul li a,
.ao .main-navigation .main-nav ul ul li:not([class*="current-menu-"]):hover > a {
	background: transparent;
	text-transform: none; letter-spacing: 0; font-size: 16px; font-weight: 600;
	line-height: 1.3; padding: 12px 16px;
}
.ao .main-navigation .dropdown-menu-toggle { padding-right: 0; }

/* Type-ahead search (Ivory Search AJAX form) */
.ao .is-search-form { display: flex; align-items: stretch; width: 100%; margin: 0; position: relative; }
.ao .is-search-form label { flex: 1 1 auto; min-width: 0; margin: 0; }
.ao .is-form-style input.is-search-input {
	width: 100%; height: 44px; padding: 0 18px; margin: 0;
	background: var(--panel); border: 1px solid var(--line-strong); border-right: 0;
	border-radius: var(--r-pill) 0 0 var(--r-pill);
	color: var(--text); font: 400 15px/1 var(--font-body);
}
.ao .is-form-style.is-form-style-3 button.is-search-submit {
	position: static; display: flex; align-items: center; justify-content: center;
	width: 48px; height: 44px; margin: 0; padding: 0;
	background: var(--panel); border: 1px solid var(--line-strong); border-left: 0;
	border-radius: 0 var(--r-pill) var(--r-pill) 0; cursor: pointer;
}
.ao .is-form-style button.is-search-submit .is-search-icon {
	display: flex; align-items: center; justify-content: center; width: auto; height: auto;
	background: transparent; border: 0; padding: 0; color: var(--text);
}
.ao .is-search-form:focus-within { box-shadow: var(--focus); border-radius: var(--r-pill); }
.ao-hero__search .is-search-form:focus-within { border-radius: var(--r-ctl); }
.ao .is-search-form input.is-search-input:focus-visible { box-shadow: none; outline: none; }
.ao .is-search-icon svg { width: 22px; height: 22px; fill: currentColor; }
.ao .is-form-style button.is-search-submit:hover .is-search-icon { color: var(--link); }
.ao .is-ajax-search-result, .ao .is-ajax-search-details {
	border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--bg);
	font-family: var(--font-body); box-shadow: none;
}
.ao .is-ajax-search-post .is-title a, .ao .is-ajax-search-result a { color: var(--text); font-weight: 700; text-transform: none; }
.ao .is-ajax-search-post .is-search-content { color: var(--text-2); }
.ao .is-ajax-search-post a:hover { color: var(--link); }
.ao .is-ajax-search-post { border-bottom: 1px solid var(--line); }
.ao .is-ajax-search-post:hover, .ao .is-ajax-search-post.is-selected { background: var(--panel); }

/* Mobile: GP's hamburger */
.ao .menu-toggle { min-height: 44px; color: var(--text); background: transparent; font-weight: 600; }
.ao .mobile-menu-control-wrapper .menu-toggle,
.ao .mobile-menu-control-wrapper .menu-toggle:hover,
.ao .mobile-menu-control-wrapper .menu-toggle:focus { background: transparent; }
@media (max-width: 768px) {
	.ao .inside-header { padding: 10px var(--gutter); gap: 10px 16px; }
	.ao .site-logo img { width: 170px; }
	.ao .mobile-menu-control-wrapper { margin-left: auto; }
	.ao #site-navigation { flex-basis: 100%; }
	.ao #site-navigation.toggled .main-nav ul li a { padding: 0; border-top: 1px solid var(--line); }
	.ao-header-search { flex: 1 1 100%; order: 10; margin: 0; }
}

/* ---------- Footer ---------- */
.ao .site-footer { margin-top: 0; }
.ao .site-info { background: var(--panel); color: var(--muted); font-size: 15px; }
.ao .inside-site-info { max-width: none; padding: 28px 40px; }
.ao .copyright-bar {
	width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 32px;
	text-align: left;
}
.ao .site-info a { color: var(--text); text-decoration: none; }
.ao .site-info a:hover { color: var(--link); text-decoration: underline; }
.ao-footer-nav { display: flex; flex-wrap: wrap; gap: 0 22px; }
.ao-footer-nav a { display: inline-block; padding: 10px 0; }
@media (max-width: 768px) {
	.ao .inside-site-info { padding: 24px var(--gutter); }
}

/* ---------- Generic pages (about, contact, search, archives) ---------- */
.ao .entry-header { margin-bottom: 20px; }
.ao .entry-content { font-size: 18px; line-height: 1.6; color: var(--text-body); }
.ao .entry-content > * { max-width: 720px; }
.ao .entry-content h2 { margin-top: 1.4em; }
.ao .page-header h1 { font-size: clamp(28px, 4vw, 44px); }

/* ---------- Sections ---------- */
.ao .site-main.ao-home, .ao .site-main.ao-page { margin: 0; }
.ao .site-main .ao-section { margin: 0 0 64px; }
.ao .site-main .ao-section:last-child { margin-bottom: 72px; }
.ao-section-head {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px;
	margin-bottom: 24px; padding-bottom: 14px; border-bottom: 1px solid var(--line);
}
.ao-section-head h2 { margin: 0; font-size: 28px; }
.ao .ao-section-head__link { font-weight: 600; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.ao .ao-section-head__link:hover { text-decoration: underline; }

/* ---------- Game card ---------- */
.ao-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; }
.ao a.ao-card {
	display: flex; flex-direction: column; overflow: hidden;
	background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-card);
	color: var(--text); text-decoration: none;
}
.ao a.ao-card:hover { border-color: var(--line-strong); color: var(--text); }
.ao a.ao-card:hover .ao-card__title { color: var(--link-hover); }
.ao-card__media { display: block; aspect-ratio: 4 / 3; background: var(--screen); overflow: hidden; }
.ao-card__shot { display: block; width: 100%; height: 100%; object-fit: cover; image-rendering: pixelated; }
.ao-card__fallback {
	display: flex; align-items: center; justify-content: center; height: 100%; padding: 16px;
	background: var(--panel-2); color: var(--text-2); text-align: center;
	font-family: var(--font-display); font-size: 18px; line-height: 1.15; text-transform: uppercase;
	border-bottom: 1px solid var(--line);
}
.ao-card__body { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 14px 16px 16px; }
.ao-card__title { font-weight: 700; font-size: 17px; line-height: 1.25; }
.ao-card__why { color: var(--muted); font-size: 14px; line-height: 1.4; }
.ao-card__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; margin-top: auto; }
.ao-card__platform { font-size: 9px; color: var(--muted); }
.ao-card__play { font-weight: 700; font-size: 14px; color: var(--link); text-transform: uppercase; letter-spacing: 0.06em; white-space: nowrap; }
@media (max-width: 480px) {
	.ao-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.ao-card__body { padding: 10px 12px 12px; }
	.ao-card__title { font-size: 16px; }
}

/* ---------- News card ---------- */
.ao-news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.ao a.ao-news {
	display: flex; flex-direction: column; gap: 12px; padding: 24px;
	background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-card);
	color: var(--text); text-decoration: none;
}
.ao a.ao-news:hover { border-color: var(--line-strong); }
.ao-news__tag { font-size: 9px; color: var(--link); }
.ao-news__title { font-weight: 700; font-size: 20px; line-height: 1.25; }
.ao a.ao-news:hover .ao-news__title { color: var(--link-hover); }
.ao-news__more { margin-top: auto; color: var(--muted); font-size: 15px; }

/* ---------- Home hero ---------- */
.ao-hero {
	max-width: 1120px; margin: 0 auto; padding: 72px 0 56px;
	display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center;
}
.ao-hero__kicker { margin: 0; font-size: 11px; color: var(--link); }
.ao .ao-hero__title { margin: 0; font-size: clamp(38px, 6vw, 72px); line-height: 1.02; }
.ao-hero__lead { margin: 0; max-width: 620px; color: var(--text-2); font-size: 19px; }
.ao-hero__search { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; width: 100%; max-width: 680px; margin: 0; text-align: left; }
.ao-hero__search .is-search-form { flex: 1 1 360px; width: auto; }
.ao-hero__search .is-form-style input.is-search-input {
	height: 56px; padding: 0 20px; border: 2px solid var(--line-strong); border-right: 0;
	border-radius: var(--r-ctl) 0 0 var(--r-ctl); font-size: 17px;
}
.ao-hero__search .is-form-style.is-form-style-3 button.is-search-submit {
	width: 64px; height: 56px; background: var(--accent); border: 2px solid var(--accent);
	border-radius: 0 var(--r-ctl) var(--r-ctl) 0;
}
.ao-hero__search .is-form-style button.is-search-submit .is-search-icon,
.ao-hero__search .is-form-style button.is-search-submit:hover .is-search-icon { color: var(--on-accent); }
.ao-hero__search .ao-btn { min-height: 56px; padding: 0 26px; }
.ao-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.ao-about .ao-prose { max-width: 720px; font-size: 18px; line-height: 1.6; color: var(--text-body); }
@media (max-width: 600px) {
	.ao-hero { padding: 40px 0 40px; gap: 18px; }
	.ao-hero__search .is-search-form { flex-basis: 100%; }
	.ao-hero__search .ao-btn { flex: 1 1 100%; }
}

/* ---------- Simple index page ---------- */
.ao-page__head { margin: 40px 0 32px; max-width: 720px; }
.ao-page__head h1 { margin: 0 0 12px; }
.ao-page__lead { color: var(--text-2); }
.ao-page { margin-bottom: 72px; }
.ao.home .featured-image.page-header-image { display: none; }

/* ---------- Game page ---------- */
.ao .site-main.ao-game { margin: 28px 0 0; }
.ao-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-bottom: 16px; font-size: 14px; color: var(--muted); }
.ao .ao-crumbs a { color: var(--muted); text-decoration: none; display: inline-flex; align-items: center; min-height: 32px; }
.ao .ao-crumbs a:hover { color: var(--link); text-decoration: underline; }
.ao-game__head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.ao-game__head h1 { margin: 0; font-size: clamp(28px, 4vw, 44px); }
.ao-game__intro { max-width: 820px; margin: 14px 0 28px; color: var(--text-2); font-size: 18px; line-height: 1.55; }

.ao-game__layout { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; }
.ao-game__main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 24px; }

/* Emulator panel */
.ao-emu { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 16px; }
.ao .ao-emu__title { margin: 0 0 12px; font-size: 15px; font-family: var(--font-body); font-weight: 700; letter-spacing: 0.06em; color: var(--text-2); }
.ao-emu__screen { background: var(--screen); border-radius: var(--r-ctl); padding: 12px 0; overflow: hidden; }
.ao-emu__screen #javatari { width: 100%; margin: 0 auto; text-align: center; }
.ao-emu__screen noscript p { color: #fff; padding: 24px; }
.ao-emu__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding-top: 14px; }
.ao-emu__bar[hidden] { display: none; }
.ao-emu__spacer { flex-grow: 1; }
.ao .ao-btn--quiet { color: var(--text); }
.ao .ao-btn--quiet:hover { background: var(--line); border-color: var(--line-strong); }

/* Key strip */
.ao-keys { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 0; padding: 16px 20px; list-style: none;
	background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-card); font-size: 15px; color: var(--text-2); }
.ao-keys li { display: flex; align-items: center; gap: 8px; margin: 0; }
.ao kbd { font-family: var(--font-body); font-weight: 700; font-size: 13px; color: var(--text); padding: 4px 9px;
	background: var(--line); border: 0; border-bottom: 3px solid var(--line-strong); border-radius: 5px; box-shadow: none; }

/* Rating + favorite row */
.ao-rate { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 28px;
	padding: 14px 20px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-card); }
.ao .ao-rate .rmp-widgets-container { margin: 0; padding: 0; text-align: left; }
.ao .ao-rate .rmp-rating-widget { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; }
.ao .ao-rate .rmp-heading--title,
.ao .ao-rate .rmp-heading--subtitle,
.ao .ao-rate .rmp-rating-widget__hover-text:empty { display: none; }
.ao .ao-rate .rmp-rating-widget__hover-text { margin: 0; font-size: 14px; color: var(--muted); }
.ao .ao-rate .rmp-rating-widget__icons { margin: 0; }
.ao .ao-rate .rmp-rating-widget__icons-list { margin: 0; padding: 0; display: flex; }
.ao .ao-rate .rmp-rating-widget__icons-list__icon { min-width: 36px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.ao .ao-rate .rmp-icon--ratings { font-size: 28px; color: var(--line-strong); }
.ao .ao-rate .rmp-icon--trophy:before { content: "\f005"; } /* the plugin font's star */
.ao .ao-rate .rmp-icon--full-highlight, .ao .ao-rate .rmp-icon--full-highlight:before { color: var(--link); }
.ao .ao-rate .rmp-icon--half-highlight, .ao .ao-rate .rmp-icon--half-highlight:before {
	background: linear-gradient(90deg, var(--link) 50%, var(--line-strong) 50%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.ao .ao-rate .rmp-icon--hovered, .ao .ao-rate .rmp-icon--hovered:before { color: var(--link-hover); -webkit-text-fill-color: var(--link-hover); background: none; }
.ao .ao-rate .rmp-rating-widget__results { margin: 0; font-size: 15px; color: var(--muted); }
.ao .ao-rate .rmp-rating-widget__not-rated { margin: 0; font-size: 15px; color: var(--muted); }
.ao .ao-rate .rmp-rating-widget__not-rated--hidden, .ao .ao-rate .rmp-rating-widget__results--hidden { display: none; }
.ao .ao-rate .rmp-rating-widget__msg:empty { display: none; }
.ao .ao-rate .rmp-btn { min-height: 44px; border-radius: var(--r-ctl); background: var(--accent); color: var(--on-accent); font-weight: 700; }

.ao-fav { display: inline-flex; align-items: center; gap: 0; min-height: 48px; border: 2px solid var(--heart); border-radius: var(--r-pill); }
.ao .ao-fav .simplefavorite-button {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 0; padding: 0 6px 0 18px;
	background: transparent; border: 0; box-shadow: none; color: var(--text);
	font: 700 16px/1 var(--font-body); font-size: 0; cursor: pointer;
}
.ao .ao-fav .simplefavorite-button::before { content: "♡"; font-size: 20px; line-height: 1; color: var(--heart); }
.ao .ao-fav .simplefavorite-button::after { content: "Add to favorites"; font-size: 16px; }
.ao .ao-fav .simplefavorite-button.active::before { content: "♥"; }
.ao .ao-fav .simplefavorite-button.active::after { content: "In your favorites"; }
.ao .ao-fav .simplefavorite-button i { display: none; }
.ao-fav__count { padding: 0 18px 0 4px; font-weight: 700; color: var(--text); }
.ao-fav__count::before { content: "· "; color: var(--muted); }

/* Text */
.ao .ao-game__text { max-width: 720px; }
.ao .ao-game__text .entry-content { font-size: 18px; line-height: 1.65; color: var(--text-body); }
.ao .ao-game__text .entry-content h2 { font-size: 24px; margin: 1.6em 0 0.6em; }
.ao .ao-game__text .entry-content h2:first-child { margin-top: 0.4em; }
.ao .ao-game__text .entry-content h3 { font-size: 19px; }
.ao .ao-game__text .entry-content ul { margin-left: 1.2em; }

/* Facts card */
.ao-facts { flex: 1 1 280px; min-width: 0; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); overflow: hidden; }
.ao-facts__inner { padding: 20px 22px 8px; }
.ao .ao-facts h2 { margin: 0 0 6px; font-size: 18px; }
.ao-facts dl { margin: 0; }
.ao-facts__row { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.ao-facts__row:last-child { border-bottom: 0; }
.ao-facts dt { color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ao-facts dd { margin: 0; font-weight: 600; text-align: right; }
.ao .ao-facts dd a { text-decoration: none; }
.ao .ao-facts dd a:hover { text-decoration: underline; }

.ao-similar { margin-top: 56px; }
.ao-grid--wide { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
@media (max-width: 480px) {
	.ao-grid--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.ao-emu { padding: 10px; }
	.ao-emu__screen { padding: 6px 0; }
	.ao-rate { padding: 12px 14px; }
}

/* ---------- Article ---------- */
.ao .site-main.ao-article { max-width: 1120px; margin: 56px auto 0; }
.ao-article__head { max-width: 820px; display: flex; flex-direction: column; gap: 18px; margin-bottom: 40px; }
.ao-article__labels { display: flex; flex-wrap: wrap; gap: 10px; }
.ao a.ao-badge { text-decoration: none; color: var(--on-accent); }
.ao a.ao-badge:hover { background: #d96c10; color: var(--on-accent); }
.ao .ao-article__head h1 { margin: 0; font-size: clamp(30px, 4.6vw, 54px); line-height: 1.05; }
.ao-article__meta { margin: 0; color: var(--muted); font-size: 16px; }

.ao-article__layout { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; }
.ao-article__body { flex: 999 1 560px; min-width: 0; max-width: 720px; }
.ao .ao-article__text { font-size: 19px; line-height: 1.65; color: var(--text-body); }
.ao .ao-article__text > * { max-width: none; }
.ao .ao-article__text > p:first-child { font-size: 22px; line-height: 1.5; color: var(--text); }
.ao .ao-article__text h2 { font-size: 28px; line-height: 1.15; margin: 1.6em 0 0.5em; scroll-margin-top: 24px; }
.ao .ao-article__text h3 { font-size: 21px; margin: 1.4em 0 0.4em; }
.ao .ao-article__text ul, .ao .ao-article__text ol { margin-left: 1.2em; }

/* Figures */
.ao .ao-article__text figure.wp-block-image { margin: 32px 0; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.ao .ao-article__text figure.wp-block-image img { display: block; width: 100%; height: auto; image-rendering: pixelated; }
.ao .ao-article__text figure.wp-block-image figcaption { margin: 0; padding: 14px 18px; font-size: 15px; line-height: 1.4; color: var(--text-2); text-align: left; }
.ao .ao-article__text figure.ao-figure--play figcaption { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.ao-figure__caption { flex: 1 1 260px; }
.ao .ao-article__text a.ao-figure__play { min-height: 44px; padding: 0 16px; font-size: 13px; text-decoration: none; }

/* Tables */
.ao .ao-article__text figure.wp-block-table { margin: 32px 0; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; -webkit-overflow-scrolling: touch; }
.ao .ao-article__text .wp-block-table table { width: 100%; min-width: 520px; margin: 0; border: 0; border-collapse: collapse; font-size: 16px; line-height: 1.4; }
.ao .ao-article__text .wp-block-table th { padding: 14px 18px; background: var(--panel-2); border: 0; text-align: left; font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--link); }
.ao .ao-article__text .wp-block-table td { padding: 13px 18px; border: 0; vertical-align: top; }
.ao .ao-article__text .wp-block-table tbody tr:nth-child(odd) { background: var(--bg); }
.ao .ao-article__text .wp-block-table tbody tr:nth-child(even) { background: var(--panel); }
.ao .ao-article__text .wp-block-table figcaption { padding: 10px 18px; font-size: 14px; color: var(--muted); }

/* Tags */
.ao-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 32px 0 0; padding: 16px 0 0; list-style: none; border-top: 1px solid var(--line); }
.ao-tags li { margin: 0; }

/* Table of contents */
.ao-toc-wrap { flex: 1 1 240px; min-width: 0; position: sticky; top: 24px; }
.ao-toc { padding: 20px 22px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; }
.ao-toc summary { cursor: pointer; font-size: 10px; color: var(--muted); min-height: 24px; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.ao-toc summary::-webkit-details-marker { display: none; }
.ao-toc summary::after { content: "\25BE"; font-family: var(--font-body); font-size: 14px; }
.ao-toc[open] summary::after { content: "\25B4"; }
.ao-toc ol { margin: 10px 0 0; padding: 0; list-style: none; font-size: 15px; line-height: 1.35; }
.ao-toc li { margin: 0; border-bottom: 1px solid var(--line); }
.ao-toc li:last-child { border-bottom: 0; }
.ao .ao-toc a { display: block; padding: 11px 0 11px 10px; margin-left: -10px; color: var(--text-body); text-decoration: none; border-left: 3px solid transparent; }
.ao .ao-toc a:hover { color: var(--link); }
.ao .ao-toc a.is-current { color: var(--link); font-weight: 600; border-left-color: var(--accent); }
@media (min-width: 901px) {
	.ao-toc summary { pointer-events: none; }
	.ao-toc summary::after { display: none; }
}
@media (max-width: 900px) {
	.ao-article__layout { gap: 24px; }
	.ao-toc-wrap { order: -1; flex-basis: 100%; position: static; }
	.ao-toc { padding: 14px 18px; }
	.ao .ao-article__text { font-size: 18px; }
	.ao .ao-article__text > p:first-child { font-size: 20px; }
	.ao .site-main.ao-article { margin-top: 32px; }
}

.ao-mentioned { margin-top: 64px; }

/* Previous / next */
.ao-postnav { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; margin: 0 0 72px; }
.ao a.ao-postnav__link { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-card); color: var(--text); font-weight: 700; font-size: 17px; line-height: 1.3; text-decoration: none; }
.ao a.ao-postnav__link:hover { border-color: var(--line-strong); color: var(--link-hover); }
.ao-postnav__link .ao-pixel { font-size: 9px; color: var(--muted); font-weight: 400; }
.ao-postnav__link--next { text-align: right; }
.ao .ao-article__text figure.wp-block-image a { display: block; }
.ao .site-main .ao-section.ao-mentioned { margin-top: 64px; }
.ao .site-main .ao-postnav { margin-bottom: 72px; }
@media (max-width: 900px) {
	.ao-toc summary { min-height: 44px; }
}
.ao .ao-article__text .wp-block-table thead, .ao .ao-article__text .wp-block-table tfoot { border: 0; }
.ao .ao-article__text figcaption a.ao-figure__play { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }

/* ---------- My Favorites ---------- */
.ao .site-main.ao-favs { margin: 56px 0 72px; }
.ao-favs__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 32px; }
.ao .ao-favs__head h1 { margin: 0 0 8px; font-size: clamp(34px, 5vw, 56px); }
.ao-favs__lead { margin: 0; color: var(--text-2); }
.ao-favs__tools { display: flex; align-items: center; gap: 12px; font-size: 15px; }
.ao-favs__count { color: var(--muted); }
.ao .ao-favs__tools select { height: 44px; padding: 0 14px; font-size: 15px; }

.ao-favcard { position: relative; display: flex; }
.ao-favcard > .ao-card { flex: 1; }
.ao-favcard__heart { position: absolute; top: 10px; right: 10px; }
.ao .ao-favcard__heart .simplefavorite-button {
	display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0;
	border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.94); box-shadow: none; cursor: pointer;
	font-size: 0; color: var(--heart);
}
.ao .ao-favcard__heart .simplefavorite-button i { display: none; }
.ao .ao-favcard__heart .simplefavorite-button::before { content: "\2661"; font-size: 22px; line-height: 1; color: var(--heart); }
.ao .ao-favcard__heart .simplefavorite-button.active::before { content: "\2665"; }
.ao .ao-favcard__heart .simplefavorite-button:hover { background: #fff; }

.ao-empty {
	display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 56px 24px; text-align: center;
	border: 2px dashed var(--line-strong); border-radius: 16px;
}
.ao-empty__icon { display: flex; align-items: center; justify-content: center; width: 88px; height: 88px; border-radius: 50%; background: var(--panel); color: var(--heart); }
.ao .ao-empty h2 { margin: 0; font-size: 26px; }
.ao-empty p { margin: 0; max-width: 480px; color: var(--text-2); }
.ao-empty__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.ao-empty__actions .ao-btn { min-height: 52px; padding: 0 24px; }
.ao .site-main .ao-section.ao-favs__start { margin: 56px 0 0; }
@media (max-width: 600px) {
	.ao .site-main.ao-favs { margin-top: 32px; }
	.ao-empty { padding: 40px 18px; }
}
.ao .ao-favcard__heart button.simplefavorite-button,
.ao .ao-favcard__heart button.simplefavorite-button:hover,
.ao .ao-favcard__heart button.simplefavorite-button:focus,
.ao .ao-favcard__heart button.simplefavorite-button.active { background: #fff; opacity: 1; color: var(--heart); border: 1px solid var(--line); }
.ao .ao-favcard__heart button.simplefavorite-button::before { color: var(--heart); -webkit-text-fill-color: var(--heart); }

/* Short pages: footer stays at the bottom */
body.ao { display: flex; flex-direction: column; min-height: 100vh; }
.ao .site.grid-container { flex: 1 0 auto; width: 100%; }
.ao .entry-content pre, .ao .wp-block-code { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-ctl); color: var(--text); font-size: 15px; white-space: pre-wrap; word-break: break-word; }

/* ---------- Archives and search ---------- */
.ao .site-main.ao-archive { margin: 48px 0 72px; }
.ao-archive__head { max-width: 820px; margin-bottom: 32px; }
.ao .ao-archive__head h1 { margin: 0 0 14px; font-size: clamp(30px, 4.6vw, 52px); }
.ao-archive__desc { font-size: 17px; line-height: 1.6; color: var(--text-body); }
.ao-archive__desc p { margin: 0 0 0.9em; }
.ao-rows { display: flex; flex-direction: column; gap: 16px; }
.ao-row { display: flex; gap: 20px; align-items: stretch; margin: 0; padding: 0; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; }
.ao .ao-row__media { flex: 0 0 220px; display: block; aspect-ratio: 4 / 3; background: var(--screen); text-decoration: none; }
.ao-row__media img { display: block; width: 100%; height: 100%; object-fit: cover; image-rendering: pixelated; }
.ao-row__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: 16px 20px 16px 0; }
.ao .ao-row__title { margin: 0; font-family: var(--font-body); font-weight: 700; font-size: 20px; line-height: 1.25; text-transform: none; letter-spacing: 0; }
.ao .ao-row__title a { color: var(--text); text-decoration: none; }
.ao .ao-row__title a:hover { color: var(--link-hover); }
.ao-row__excerpt { margin: 0; font-size: 16px; line-height: 1.5; color: var(--text-2); }
.ao .ao-row__play { margin-top: auto; align-self: flex-start; min-height: 32px; display: inline-flex; align-items: center; font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none; }
@media (max-width: 600px) {
	.ao-row { flex-direction: column; gap: 0; }
	.ao .ao-row__media { flex-basis: auto; }
	.ao-row__body { padding: 14px 16px 16px; }
	.ao .site-main.ao-archive { margin-top: 28px; }
}

/* Pagination */
.ao .navigation.pagination { margin: 40px 0 0; }
.ao .nav-links { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ao .nav-links .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); color: var(--text); font-weight: 600; text-decoration: none; }
.ao .nav-links a.page-numbers:hover { border-color: var(--line-strong); color: var(--link-hover); }
.ao .nav-links .page-numbers.current { background: var(--text); border-color: var(--text); color: var(--bg); }
.ao .nav-links .page-numbers.dots { background: transparent; border-color: transparent; }
.ao h2.ao-news__title { margin: 0; font-family: var(--font-body); font-weight: 700; font-size: 20px; line-height: 1.25; text-transform: none; letter-spacing: 0; color: var(--text); }

/* ---------- Atari 7800 test page ---------- */
.ao-7800-pick { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.ao-7800-pick label { font-weight: 700; }
.ao-7800-pick select { min-height: 44px; padding: 0 12px; flex: 1 1 260px; max-width: 420px; }
.ao-7800-region { display: flex; flex-wrap: wrap; gap: 8px; }
.ao-7800-region[hidden] { display: none; }
.ao .ao-7800-region .ao-pill { cursor: pointer; font-family: var(--font-body); }
.ao .ao-7800-region .ao-pill[aria-pressed="true"] { background: var(--text); border-color: var(--text); color: var(--bg); }
.ao-emu__screen--7800 { padding: 0; }
.ao-emu__screen--7800 #ao-7800-target { width: 100%; }
.ao-7800-status { margin: 0; font-size: 14px; color: var(--muted); }

/* ---------- Click to play ---------- */
.ao-emu__poster { position: relative; display: flex; align-items: center; justify-content: center; max-width: 640px; margin: 0 auto; aspect-ratio: 640 / 446; background: var(--screen); }
.ao-emu__poster-img { display: block; width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; opacity: 0.55; }
.ao .ao-play {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
	display: inline-flex; align-items: center; gap: 12px; min-height: 64px; padding: 0 28px 0 22px;
	border: 0; border-radius: var(--r-pill); background: var(--accent); color: var(--on-accent);
	font: 700 18px/1.2 var(--font-body); text-transform: uppercase; letter-spacing: 0.06em; cursor: pointer;
	max-width: calc(100% - 32px); text-align: left;
}
.ao .ao-play:hover { background: #d96c10; color: var(--on-accent); }
.ao .ao-play:focus-visible { box-shadow: 0 0 0 3px var(--screen), 0 0 0 6px #fff; }
.ao .ao-play svg { flex: 0 0 auto; }
.ao .ao-play.is-loading { opacity: 0.85; cursor: progress; }
.ao .ao-play.is-loading span::after { content: "…"; }
#javatari[hidden] { display: none; }
@media (max-width: 600px) {
	.ao .ao-play { min-height: 56px; font-size: 15px; padding: 0 20px 0 16px; }
}

/* ---------- Atari 7800 game page ---------- */
.ao-region { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.ao .ao-region .ao-pill { cursor: pointer; font-family: var(--font-body); }
.ao .ao-region .ao-pill[aria-pressed="true"] { background: var(--text); border-color: var(--text); color: var(--bg); }
.ao-7800-target[hidden] { display: none; }
.ao-7800-target { width: 100%; }
.ao-emu__status { margin: 10px 0 0; font-size: 14px; color: var(--muted); }
.ao-emu__status:empty { display: none; }