/* The pages of the small 1997 web (web.js), as the browser shows them. Each site has a look,
   and its rules hang on `.page.site-<look>`: nothing here reaches the rest of the desktop. */

.page {
  flex: 1 1 auto;
  min-height: 0;
  padding: 14px 16px 22px;
  overflow: auto;
  background: #fff;
  color: #000;
  font: 15px/1.45 "Times New Roman", Times, serif;
}

.page h1 { margin: 0 0 6px; font: bold 28px/1.15 "Times New Roman", Times, serif; }
.page h2 { margin: 16px 0 6px; font: bold 19px/1.2 "Times New Roman", Times, serif; }
.page h3 { margin: 14px 0 8px; font: bold 23px/1.2 "Times New Roman", Times, serif; }
.page p { margin: 10px 0; }
.page ul { margin: 10px 0; padding-left: 26px; }
.page hr { height: 2px; margin: 12px 0; border: 1px inset #999; }
.page a { color: #0000ee; text-decoration: underline; cursor: pointer; }
.page a.seen { color: #551a8b; }
.page img { image-rendering: pixelated; vertical-align: middle; }
.page table { border-collapse: collapse; }
.page th { text-align: left; }
.page .small, .page .tiny { font-size: 12px; }
.page address { font-style: italic; }

/* Boxes to type in and buttons to press, as a browser of the time drew them. */
.page input:not([type="radio"]), .page select { padding: 2px 4px; background: #fff; color: #000; border: 2px inset #aaa; border-radius: 0; font: 13px/1.2 "Noto Sans", Geneva, Verdana, sans-serif; }
.page button { padding: 2px 12px; background: #c6c6c6; color: #000; border: 2px outset #e4e4e4; border-radius: 0; font: 13px/1.3 "Noto Sans", Geneva, Verdana, sans-serif; cursor: pointer; }
.page button:active { border-style: inset; }
.page label { cursor: pointer; }

/* A counter of visitors. */
.counter { display: inline-flex; gap: 2px; margin-top: 4px; }
.counter b { width: 20px; padding: 2px 0; background: #000; border: 2px outset #777; color: #3f3; font: bold 18px/1.2 "Courier New", monospace; text-align: center; }

/* A line that runs across, and a rule made of an animation. */
.marquee { overflow: hidden; background: #d00000; color: #ffff00; font: bold 15px/26px "Times New Roman", Times, serif; white-space: nowrap; }
.marquee span { display: inline-block; animation: scroll-half 30s linear infinite; }
.rule-gif { height: 40px; margin: 14px 0; background: url("assets/homepage/hazard.gif") repeat-x center / auto 40px; image-rendering: pixelated; }

/* ------------------------------------------------------------ plain: what a server says by itself */
/* (Not found, forbidden, search results: black Times on white.) */
.site-plain .results { margin: 0; padding: 0; list-style: none; }
.site-plain .results li { margin: 0 0 12px; }
.site-plain .results a { font-size: 17px; }
.site-plain .results small { color: #555; font: 12px/1.3 "Courier New", monospace; }

/* ------------------------------------------------------------ Paloma Online, and the Visitors Bureau */
.site-portal { background: #c6c6c6; }
.site-portal h1 { color: #000080; font-size: 34px; text-align: center; }
.site-portal h1 i { color: #c00000; }
.site-portal .tag { margin-top: 0; font-style: italic; text-align: center; }
.site-portal form { text-align: center; }
.site-portal form + .small { margin-top: 4px; text-align: center; }
.site-portal h2 { padding: 2px 6px; background: #000080; color: #fff; font-size: 16px; }
.site-portal .directory { width: 100%; }
.site-portal .directory th { width: 34%; padding: 3px 6px; vertical-align: top; }
.site-portal .directory td { padding: 3px 0; }

/* ------------------------------------------------------------ Pizza Slut */
.site-pizza {
  background:
    radial-gradient(circle, #fff 0 1px, transparent 1.5px) 0 0 / 90px 80px,
    radial-gradient(circle, #ff6 0 1px, transparent 1.5px) 40px 50px / 130px 110px,
    #000036;
  color: #ffff66;
  /* (The real thing where a visitor has it.) */
  font: 15px/1.5 "Comic Sans MS", "Comic Neue", "Chalkboard SE", "Times New Roman", serif;
  text-align: center;
}

.site-pizza p { margin: 12px 0; }
.site-pizza h3 { color: #ff4040; }
.site-pizza .logo { display: block; margin: 6px auto 10px; image-rendering: auto; }
.site-pizza a { color: #00ffff; }
.site-pizza a.seen { color: #ff66ff; }
.site-pizza .row { display: flex; align-items: center; justify-content: center; gap: 22px; }
.site-pizza .float-left { float: left; height: 78px; margin: 0 12px 4px 4px; }
.site-pizza .links { clear: both; }
.site-pizza .tiny { color: #9f9; }
.site-pizza .menu { width: min(100%, 360px); margin: 0 auto; text-align: left; }
.site-pizza .menu th { padding-top: 10px; color: #ff9a3c; font-weight: bold; }
.site-pizza .menu th + td { padding-top: 10px; text-align: right; }

/* ------------------------------------------------------------ the police */
.site-police h1 { margin: -14px -16px 0; padding: 14px 16px 10px; background: #0a246a; color: #fff; font-size: 24px; letter-spacing: .04em; text-align: center; }
.site-police .motto { margin: 0 -16px; padding: 0 16px 10px; background: #0a246a; color: #ffd84a; font-style: italic; text-align: center; }
.site-police h2 { color: #0a246a; }
.site-police .figures th { padding: 3px 18px 3px 0; font-weight: normal; }
.site-police .figures td { padding: 3px 0; font-weight: bold; }
.site-police .wanted td { padding: 8px 12px 8px 0; vertical-align: top; }
.site-police .mugshot { display: grid; place-items: center; width: 74px; height: 86px; background: #b9b9b9; border: 2px inset #999; color: #555; font: bold 11px/1.2 "Courier New", monospace; text-align: center; }
.site-police .stars { color: #c00000; white-space: nowrap; }

/* ------------------------------------------------------------ the Starlite Motel */
.site-motel { background: #0b0718; color: #f3ecd9; font: 15px/1.5 "Courier New", Courier, monospace; text-align: center; }
.site-motel h1 { color: #ff6ec8; font: bold 32px/1.1 "Courier New", Courier, monospace; letter-spacing: .12em; text-shadow: 0 0 10px #ff6ec8; }
.site-motel h2 { color: #3ce6f0; font: bold 17px/1.2 "Courier New", Courier, monospace; }
.site-motel .neon { display: inline-block; margin: 6px 0; padding: 2px 14px; border: 2px solid #3ce6f0; color: #3ce6f0; font-weight: bold; letter-spacing: .3em; text-shadow: 0 0 8px #3ce6f0; animation: vacancy 1.6s steps(1) infinite; }
@keyframes vacancy { 0%, 70% { opacity: 1; } 71%, 78% { opacity: .25; } 79%, 100% { opacity: 1; } }
.site-motel hr { border-color: #ff6ec8; }
.site-motel a { color: #ffe14a; }
.site-motel a.seen { color: #ffaa3c; }
.site-motel .rates { margin: 0 auto; text-align: left; }
.site-motel .rates th { padding: 2px 26px 2px 0; color: #ffe14a; }
.site-motel ul { display: inline-block; margin: 12px auto; text-align: left; }

/* ------------------------------------------------------------ Paloma Paging */
.site-paging { background: #e9e6da; font-family: "Noto Sans", Geneva, Verdana, sans-serif; font-size: 13px; }
.site-paging h1 { font: bold 26px/1.1 "Noto Sans", Geneva, Verdana, sans-serif; letter-spacing: .06em; }
.site-paging h2 { font: bold 15px/1.2 "Noto Sans", Geneva, Verdana, sans-serif; }
.site-paging .lcd { display: inline-block; padding: 8px 12px 6px; background: #a3b63c; border: 3px solid #23262b; border-radius: 4px; color: #20280c; font: 16px/1 "Hotwire Pixel", monospace; -webkit-font-smoothing: none; }
.site-paging .rates th, .site-paging .rates td { padding: 4px 16px 4px 0; border-bottom: 1px solid #999; }

/* ------------------------------------------------------------ what every home page may have */

/* A vehicle as the game draws it, from above. */
.page .sprite { width: 32px; height: auto; image-rendering: pixelated; }

/* A guestbook's entries. */
.page .entry { margin: 6px auto; padding: 4px 8px; max-width: 380px; border: 1px dashed currentColor; text-align: left; overflow-wrap: anywhere; }

/* The ring that joins the home pages. */
.page .ring { margin: 16px auto; padding: 8px; max-width: 420px; border: 3px double currentColor; text-align: center; }

/* The little signs at the foot of a page, 88 by 31 as they always were, in the game's letters. */
.page .badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.badge { display: grid; place-items: center; width: 88px; height: 31px; padding-top: 1px; border: 2px outset #fff; font: 8px/11px "Hotwire Pixel", monospace; letter-spacing: 0; text-align: center; text-transform: uppercase; -webkit-font-smoothing: none; }
.badge.joy { background: #2b2140; border-color: #3ce6f0; color: #3ce6f0; }
.badge.member { background: #ff6ec8; border-color: #ffe14a; color: #2b2140; }
.badge.made { background: #ffe14a; border-color: #ffaa3c; color: #2b2140; }

/* ------------------------------------------------------------ the Homesteads: Paloma Online's home pages */
/* In the game's own colours and letters. (Classes only: the home pages shown small inside it
   must keep their own looks.) */
.site-homes { background: #2b2140; color: #f3ecd9; font: 13px/1.45 "Noto Sans", Geneva, Verdana, sans-serif; }
.site-homes a { color: #3ce6f0; }
.site-homes a.seen { color: #ff6ec8; }
.site-homes .hub-name { margin: 4px 0 6px; color: #ffe14a; font: 24px/1 "Hotwire Pixel", monospace; font-weight: normal; letter-spacing: 0; text-align: center; -webkit-font-smoothing: none; }
.site-homes .hub-name b { color: #ff6ec8; font-weight: normal; }
.site-homes .hub-tag { margin: 0 auto 14px; max-width: 460px; text-align: center; }
.site-homes .hub-crumb { font: 16px/1 "Hotwire Pixel", monospace; text-transform: uppercase; -webkit-font-smoothing: none; }
.site-homes .hub-plate { display: flex; align-items: baseline; gap: 12px; margin: 18px 0 10px; padding: 6px 8px 4px; background: #14102b; color: #a99fc4; border-left: 4px solid #ffaa3c; font: 16px/1 "Hotwire Pixel", monospace; font-weight: normal; text-transform: uppercase; -webkit-font-smoothing: none; }
.site-homes .hub-plate b { color: #f3ecd9; font-size: 24px; font-weight: normal; }
.site-homes .hub-lots { display: grid; grid-template-columns: repeat(auto-fill, minmax(204px, 1fr)); gap: 12px; }
.site-homes .lot { display: grid; align-content: start; gap: 4px; padding: 6px 6px 8px; background: #171232; border: 2px solid #3ce6f0; color: #f3ecd9; text-decoration: none; }
/* (A lot that has been called at keeps its colours, and has a pink line round it.) */
.site-homes .lot.seen { color: #f3ecd9; border-color: #ff6ec8; }
.site-homes .lot:hover, .site-homes .lot:focus-visible { border-color: #ffe14a; box-shadow: 4px 4px 0 #ff6ec8; outline: 0; }
.site-homes .thumb { position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #000; border: 1px solid #3ce6f0; }
/* (The page is 640 across and shown at the width of its frame: see --small, set in app.js.) */
.site-homes .thumb .page { position: absolute; top: 0; left: 0; flex: none; width: 640px; height: 480px; overflow: hidden; transform: scale(var(--small, .3125)); transform-origin: 0 0; pointer-events: none; }
.site-homes .lot-place { margin-top: 4px; color: #ffaa3c; font: 16px/1 "Hotwire Pixel", monospace; text-transform: uppercase; -webkit-font-smoothing: none; }
.site-homes .lot-name { color: #ffe14a; font-size: 14px; }
.site-homes .lot-about { font-size: 12px; line-height: 1.35; }
.site-homes .lot small { color: #a99fc4; font-size: 11px; overflow-wrap: anywhere; }
.site-homes .hub-vacant { color: #a99fc4; font: 16px/1.5 "Hotwire Pixel", monospace; text-transform: uppercase; -webkit-font-smoothing: none; }
.site-homes .hub-vacant a { color: #a99fc4; }
.site-homes .hub-none { margin: 30px 0; color: #ffe14a; text-align: center; }
.site-homes .hub-search { margin: 0 0 10px; text-align: center; }
.site-homes .hub-today { margin: 0 0 6px; color: #ffaa3c; font: 16px/1.3 "Hotwire Pixel", monospace; text-align: center; text-transform: uppercase; -webkit-font-smoothing: none; }
.site-homes .hub-more { margin: 0 2px; font-size: 14px; }
.site-homes .hub-results { margin: 18px auto; padding: 0; max-width: 520px; list-style: none; }
.site-homes .hub-results li { display: grid; gap: 2px; margin: 0 0 14px; padding-left: 10px; border-left: 4px solid #ffaa3c; }
.site-homes .hub-results a { font-size: 15px; font-weight: bold; }
.site-homes .hub-results small { color: #a99fc4; font-size: 11px; }
.site-homes .hub-text { margin: 0 auto; max-width: 500px; font-size: 14px; line-height: 1.55; }
.site-homes .hub-text li { margin-bottom: 6px; }
.site-homes .hub-foot { margin-top: 22px; text-align: center; }

/* ------------------------------------------------------------ the home pages */

/* Dune's surf report: on the game's own sand. */
.site-surf { background: url("assets/web/sand.jpg"); color: #3a2410; font: 15px/1.5 "Comic Sans MS", "Comic Neue", "Chalkboard SE", sans-serif; text-align: center; }
.site-surf h1 { color: #0a6c7c; font: bold 26px/1.2 "Comic Sans MS", "Comic Neue", "Chalkboard SE", sans-serif; text-shadow: 2px 2px 0 #fff; }
.site-surf h2 { color: #b0302a; font: bold 18px/1.2 "Comic Sans MS", "Comic Neue", "Chalkboard SE", sans-serif; }
.site-surf .report { margin: 0 auto; background: rgba(255, 255, 255, .6); text-align: left; }
.site-surf .report th, .site-surf .report td { padding: 3px 10px; border: 2px solid #0a6c7c; }
.site-surf .report th { color: #0a6c7c; }
.site-surf .catch { display: flex; justify-content: center; gap: 22px; padding: 10px; background: url("assets/homepage/water.gif"); border: 2px solid #0a6c7c; }
.site-surf .catch .sprite { transform: rotate(18deg); }
.site-surf a { color: #0a3c9c; }

/* The truth. */
.site-truth { background: #000; color: #39ff14; font: 14px/1.5 "Courier New", Courier, monospace; text-align: center; }
.site-truth h1 { color: #ff2a2a; font: bold 26px/1.2 "Courier New", Courier, monospace; letter-spacing: .08em; }
.site-truth h2 { margin-top: 22px; color: #fff; font: bold 17px/1.2 "Courier New", Courier, monospace; text-align: left; }
.site-truth p { text-align: left; }
.site-truth h1 + p, .site-truth > p:first-child, .site-truth p:has(> img:only-child) { text-align: center; }
.site-truth b { color: #ff2a2a; }
.site-truth a { color: #ff0; }
.site-truth hr { border-color: #39ff14; }
.site-truth .sprite { width: 40px; }
.site-truth .sprite.blimp { width: 76px; transform: rotate(90deg); margin: -36px 0; }
.site-truth .ring { border-color: #39ff14; }

/* The Yacht Club. */
.site-yacht { background: #0a1d3f; color: #f1e6c0; font: 15px/1.5 Georgia, "Times New Roman", serif; text-align: center; }
.site-yacht h1 { color: #e2c15a; font: italic 30px/1.2 Georgia, "Times New Roman", serif; font-weight: normal; }
.site-yacht h2 { color: #e2c15a; font: 17px/1.2 Georgia, "Times New Roman", serif; letter-spacing: .14em; text-transform: uppercase; }
.site-yacht .est { margin-top: 0; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; }
.site-yacht hr { width: 60%; border-color: #e2c15a; }
.site-yacht a { color: #e2c15a; }
.site-yacht .told { color: #ff9a8a; font-style: italic; }

/* The Gulls. */
.site-gulls { background: #fff; color: #10224a; text-align: center; }
.site-gulls h1 { color: #e0601a; font-size: 34px; }
.site-gulls h2 { margin-top: 18px; padding: 2px; background: #10224a; color: #fff; font-size: 16px; }
.site-gulls .sub { margin-top: 0; font-style: italic; }
.site-gulls .score { margin: 0 auto; }
.site-gulls .score th, .site-gulls .score td { padding: 4px 12px; border: 2px solid #10224a; text-align: center; }
.site-gulls .score th { background: #e0601a; color: #fff; font-size: 12px; }
.site-gulls .score td { font: bold 26px/1.1 "Courier New", monospace; }

/* KPAL. */
.site-kpal { background: #1a0b2e repeating-linear-gradient(45deg, transparent 0 14px, rgba(255, 255, 255, .04) 14px 28px); color: #f6e84a; font: 14px/1.5 "Courier New", Courier, monospace; text-align: center; }
.site-kpal h1 { color: #ff6ec8; font: bold 40px/1 "Courier New", Courier, monospace; letter-spacing: -.04em; transform: rotate(-2deg); }
.site-kpal .shows { margin: 12px auto; text-align: left; }
.site-kpal .shows th { padding: 4px 12px 4px 0; color: #3ce6f0; vertical-align: top; white-space: nowrap; }
.site-kpal .shows td { padding: 4px 0; color: #fff; }
.site-kpal a { color: #3ce6f0; }

/* The Comet Drive-In. */
.site-comet {
  background:
    radial-gradient(circle, #fff 0 1px, transparent 1.5px) 0 0 / 70px 60px,
    radial-gradient(circle, #9cf 0 1px, transparent 1.5px) 30px 40px / 110px 90px,
    #06102e;
  color: #e8eefc;
  font: 15px/1.5 "Noto Sans", Geneva, Verdana, sans-serif;
  text-align: center;
}
.site-comet h1 { color: #ffe14a; font: bold 34px/1.1 "Noto Sans", Geneva, Verdana, sans-serif; font-style: italic; letter-spacing: .06em; text-shadow: 3px 3px 0 #e0368f; }
.site-comet h2 { color: #3ce6f0; font: bold 16px/1.2 "Noto Sans", Geneva, Verdana, sans-serif; letter-spacing: .1em; }
.site-comet .where { margin-top: 0; font-size: 12px; }
.site-comet .bill { margin: 14px auto; padding: 8px 10px; max-width: 320px; background: #f4f1e4; border: 6px solid #ffe14a; color: #111; font: bold 13px/1.2 "Courier New", monospace; letter-spacing: .1em; }
.site-comet .bill p { margin: 4px 0; }
.site-comet .bill .film { font-size: 30px; letter-spacing: .16em; }
.site-comet ul { display: inline-block; margin: 0 auto; text-align: left; }
.site-comet a { color: #ffe14a; }

/* The pawnbroker. */
.site-pawn { background: #0d3b22; color: #f3e9b8; text-align: center; }
.site-pawn h1 { color: #ffd84a; font-size: 28px; text-shadow: 2px 2px 0 #000; }
.site-pawn h2 { color: #fff; font-size: 17px; text-decoration: underline; }
.site-pawn .sub { color: #fff; font-weight: bold; letter-spacing: .08em; }
.site-pawn .stock { margin: 0 auto; text-align: left; }
.site-pawn .stock td { padding: 3px 10px; border-bottom: 1px dotted #ffd84a; }
.site-pawn .stock td:first-child { color: #ffd84a; font-weight: bold; }
.site-pawn a { color: #9ff; }

/* The arcade: the game's own letters. */
.site-arcade { background: #000; color: #f3ecd9; font: 16px/1.6 "Hotwire Pixel", monospace; text-align: center; text-transform: uppercase; -webkit-font-smoothing: none; }
.site-arcade h1 { color: #ff6ec8; font: 32px/1.2 "Hotwire Pixel", monospace; font-weight: normal; text-shadow: 3px 3px 0 #3ce6f0; }
.site-arcade .coin { color: #ffe14a; animation: vacancy 1s steps(1) infinite; }
.site-arcade .scores { margin: 10px auto; font-size: 24px; line-height: 1.5; }
.site-arcade .scores th { padding: 0 18px; color: #3ce6f0; font-size: 16px; font-weight: normal; text-align: center; }
.site-arcade .scores td { padding: 0 18px; text-align: center; }
.site-arcade .scores tr:nth-child(2) td { color: #ffe14a; }
.site-arcade .scores tr.you td { color: #3ce6f0; }
.site-arcade .rules { color: #ffaa3c; }
.site-arcade a { color: #3ce6f0; }
.site-arcade .ring { border-color: #ff6ec8; }
.site-arcade img { image-rendering: auto; }

/* The Chill: peach stucco and teal neon, as the building is painted. */
.site-chill { background: #2a1a24; color: #f6d9c4; font: 15px/1.55 Georgia, "Times New Roman", serif; text-align: center; }
.site-chill h1 { margin-top: 16px; color: #46e0d0; font: italic 46px/1.1 Georgia, "Times New Roman", serif; font-weight: normal; letter-spacing: .06em; text-shadow: 0 0 6px #46e0d0, 0 0 18px #1aa89a; }
.site-chill .where { margin-top: 0; color: #f2b08c; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; }
.site-chill hr { width: 50%; border-color: #f2b08c; }
.site-chill .open { display: inline-block; padding: 4px 14px; border: 2px solid #ff6ec8; color: #ff6ec8; font: bold 13px/1.4 "Courier New", monospace; letter-spacing: .2em; text-shadow: 0 0 8px #ff6ec8; }

/* The gun shop: a price list, stencilled. */
.site-guns { background: #3d4a2c; color: #e9e4c8; font: bold 15px/1.5 "Courier New", Courier, monospace; text-align: center; }
.site-guns h1 { display: inline-block; margin-top: 10px; padding: 4px 18px; border: 4px solid #e9e4c8; font: bold 34px/1.1 "Courier New", Courier, monospace; letter-spacing: .2em; }
.site-guns .where { margin-top: 4px; font-weight: normal; }
.site-guns .list { margin: 14px auto; min-width: 280px; background: #2c3620; text-align: left; }
.site-guns .list th, .site-guns .list td { padding: 4px 14px; border-bottom: 1px dashed #8b9670; }
.site-guns .list td { color: #ffe14a; text-align: right; }
.site-guns p { font-weight: normal; }

/* The respray. */
.site-respray { background: #e7e3d6; color: #1c1c22; font: 15px/1.5 "Noto Sans", Geneva, Verdana, sans-serif; text-align: center; }
.site-respray h1 { margin: 0 -16px; padding: 14px 10px 10px; background: repeating-linear-gradient(135deg, #1c1c22 0 14px, #ffd400 14px 28px); color: #fff; font: 900 30px/1.1 "Noto Sans", Geneva, Verdana, sans-serif; letter-spacing: .04em; text-shadow: 2px 2px 0 #1c1c22, -2px -2px 0 #1c1c22, 2px -2px 0 #1c1c22, -2px 2px 0 #1c1c22; }
.site-respray .where { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.site-respray .price { margin: 4px 0; color: #9a2a2a; font: 900 54px/1 "Noto Sans", Geneva, Verdana, sans-serif; }
.site-respray .swatches { display: flex; justify-content: center; gap: 6px; }
.site-respray .swatches i { width: 34px; height: 34px; border: 2px solid #1c1c22; border-radius: 50%; }

/* The car buyer: a shipping bill. */
.site-export { background: #f4f1e4; color: #14213d; font: 14px/1.5 "Courier New", Courier, monospace; text-align: center; }
.site-export h1 { padding: 8px 0; border-top: 6px double #14213d; border-bottom: 6px double #14213d; font: bold 26px/1.2 "Courier New", Courier, monospace; letter-spacing: .1em; }
.site-export h2 { margin-top: 18px; font: bold 16px/1.2 "Courier New", Courier, monospace; text-decoration: underline; }
.site-export .where { margin-top: 0; font-size: 12px; }
.site-export .stamp { display: inline-block; padding: 4px 12px; border: 3px solid #c1121f; color: #c1121f; font-weight: bold; letter-spacing: .12em; transform: rotate(-3deg); }
.site-export .lot { display: flex; align-items: flex-end; justify-content: center; gap: 14px; padding: 10px; background: #8d8d86; border: 2px solid #14213d; }
.site-export ul { display: inline-block; margin: 0 auto; text-align: left; }

/* Al's clocks. */
.site-clocks { background: #ffd400; color: #111; font: bold 15px/1.5 "Noto Sans", Geneva, Verdana, sans-serif; text-align: center; }
.site-clocks h1 { font: 900 30px/1.1 "Noto Sans", Geneva, Verdana, sans-serif; letter-spacing: .02em; }
.site-clocks h2 { display: inline-block; padding: 2px 10px; background: #111; color: #ffd400; font: bold 15px/1.3 "Noto Sans", Geneva, Verdana, sans-serif; }
.site-clocks .sub { margin-top: 0; font-weight: normal; }
.site-clocks p b { font-weight: 900; }
.site-clocks p { font-weight: normal; }
.site-clocks a { color: #a00000; }

/* Kev. */
.site-kev { background: #000; color: #39ff14; font: 15px/1.5 "Comic Sans MS", "Comic Neue", "Chalkboard SE", sans-serif; text-align: center; }
.site-kev h1 { color: #ff0; font: bold 26px/1.2 "Comic Sans MS", "Comic Neue", "Chalkboard SE", sans-serif; }
.site-kev h2 { color: #f0f; font: bold 19px/1.2 "Comic Sans MS", "Comic Neue", "Chalkboard SE", sans-serif; }
.site-kev a { color: #0ff; }
.site-kev a.seen { color: #f9f; }
.site-kev .cars { width: 100%; text-align: left; }
.site-kev .cars th, .site-kev .cars td { padding: 3px 6px; border: 2px ridge #39ff14; vertical-align: middle; }
.site-kev .cars th { color: #ff0; }
.site-kev .cars td:first-child { background: #3a3a3a; text-align: center; }
.site-kev .cars td:nth-child(3) { color: #fff; text-align: center; white-space: nowrap; }
.site-kev .stat, .site-kev .entry, .site-kev .ring { color: #fff; }
.site-kev .entry { border-color: #f0f; }
.site-kev .entry b { color: #ff0; }
.site-kev .ring { border-color: #0ff; }
.site-kev .tiny { color: #9f9; }

@media (prefers-reduced-motion: reduce) {
  .marquee span, .site-motel .neon, .site-arcade .coin { animation: none; }
}