/* Not Among Us: shared by the TV and the phones. The table is the sky over Burrard Inlet seen
   from the ferry: a starry night with the North Shore (the Lions' two peaks) and city lights in
   dark, a bright day crossing in light. Dark rules first, then the light theme. */
:root {
  --nau-font: "Avenir Next Condensed", "AvenirNextCondensed-Heavy", "Roboto Condensed", "sans-serif-condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --nau-mono: "SF Mono", "Roboto Mono", Menlo, Consolas, monospace;
  --nau-navy: #13294b; --nau-blue: #1f6fb2; --nau-cyan: #38c6e8; --nau-yellow: #ffc527;
  --nau-red: #e5383b; --nau-green: #2fbf71; --nau-ink: #16233a;
}
.nau-bean { display: block; width: 100%; height: 100%; overflow: visible; }
.nau-ico { width: 1em; height: 1em; flex: none; display: inline-block; vertical-align: -0.14em; }

/* ---- the logo: NOT stamped over AMONG US ---- */
.nau-logo { display: inline-flex; align-items: center; gap: .18em; font-family: var(--nau-font); font-weight: 900; line-height: .9; letter-spacing: .01em; white-space: nowrap; }
.nau-not { font-size: .36em; letter-spacing: .16em; color: #fff; background: var(--nau-red); padding: .22em .3em .2em .42em; border-radius: .18em; transform: rotate(-8deg) translateY(-.2em); box-shadow: 0 .12em .3em rgba(0,0,0,.25); }
.nau-word { font-size: 1em; color: var(--nau-text, #fff); font-style: italic; text-shadow: .045em .045em 0 var(--nau-red), .09em .09em 0 rgba(0,0,0,.25); }
.nau-word b { color: var(--nau-yellow); margin-left: .12em; font-weight: 900; }
/* Store edition: FIND THE over IMPOSTOR, no NOT tag. */
.nau-logo.st .nau-word { display: inline-flex; flex-direction: column; align-items: flex-start; }
.nau-logo.st .nau-word small { font-size: .36em; letter-spacing: .14em; margin: 0 0 .08em .1em; }
.nau-logo.st .nau-word b { margin-left: 0; }

/* ---- the table: night sky over the North Shore ---- */
.tbl-ferry {
  --tbl-edge: #050a16; --tbl-rim: #24406b; --tbl-glow: rgba(140,200,255,.10);
  --nau-ridge: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 240' preserveAspectRatio='none'><path d='M0 240 V158 L90 140 L170 150 L250 118 L310 128 L370 98 L430 110 L478 82 L510 92 L548 46 L566 66 L590 40 L616 76 L690 96 L770 86 L850 106 L930 80 L1000 100 L1090 88 L1170 114 L1250 98 L1330 120 L1410 104 L1490 124 L1570 108 L1650 130 L1730 118 L1810 134 L1920 124 V240 Z' fill='%23091327'/><path d='M0 240 V196 H1920 V240 Z' fill='%23060d1d'/><g fill='%23ffd27a' opacity='.8'><rect x='120' y='188' width='3' height='3'/><rect x='260' y='184' width='3' height='3'/><rect x='420' y='190' width='3' height='3'/><rect x='640' y='186' width='3' height='3'/><rect x='820' y='189' width='3' height='3'/><rect x='980' y='185' width='3' height='3'/><rect x='1150' y='190' width='3' height='3'/><rect x='1330' y='186' width='3' height='3'/><rect x='1500' y='189' width='3' height='3'/><rect x='1690' y='185' width='3' height='3'/><rect x='1850' y='190' width='3' height='3'/></g></svg>");
  background:
    var(--nau-ridge) bottom / 100% 240px no-repeat,
    radial-gradient(1.6px 1.6px at 30px 40px, rgba(255,255,255,.9) 50%, transparent 52%) 0 0 / 190px 170px,
    radial-gradient(1.2px 1.2px at 120px 110px, rgba(255,255,255,.7) 50%, transparent 52%) 0 0 / 230px 210px,
    radial-gradient(1px 1px at 70px 150px, rgba(190,220,255,.8) 50%, transparent 52%) 0 0 / 150px 260px,
    radial-gradient(ellipse 60% 40% at 78% 18%, rgba(70,110,200,.25), transparent 70%),
    radial-gradient(ellipse 50% 50% at 15% 85%, rgba(56,198,232,.10), transparent 70%),
    linear-gradient(180deg, #0a1430 0%, #0b1838 55%, #102552 100%);
}
[data-theme="light"] .tbl-ferry {
  --tbl-edge: #ffffff; --tbl-rim: #b8d0ea; --tbl-glow: rgba(255,255,255,.4);
  --nau-ridge: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 240' preserveAspectRatio='none'><path d='M0 240 V158 L90 140 L170 150 L250 118 L310 128 L370 98 L430 110 L478 82 L510 92 L548 46 L566 66 L590 40 L616 76 L690 96 L770 86 L850 106 L930 80 L1000 100 L1090 88 L1170 114 L1250 98 L1330 120 L1410 104 L1490 124 L1570 108 L1650 130 L1730 118 L1810 134 L1920 124 V240 Z' fill='%239fbcd8'/><path d='M548 46 L566 66 L590 40 L604 58 L585 54 L566 72 L552 56 Z' fill='%23ffffff' opacity='.9'/><path d='M0 240 V196 H1920 V240 Z' fill='%237fb4dc'/><path d='M0 206 H1920' stroke='%23ffffff' stroke-width='2' opacity='.5'/></svg>");
  background:
    var(--nau-ridge) bottom / 100% 240px no-repeat,
    radial-gradient(ellipse 22% 9% at 18% 22%, rgba(255,255,255,.95), transparent 70%),
    radial-gradient(ellipse 16% 7% at 26% 19%, rgba(255,255,255,.9), transparent 70%),
    radial-gradient(ellipse 20% 8% at 76% 30%, rgba(255,255,255,.85), transparent 70%),
    radial-gradient(ellipse 50% 50% at 85% 0%, rgba(255,236,170,.55), transparent 70%),
    linear-gradient(180deg, #bfe0f7 0%, #dcedf9 55%, #eef6fc 100%);
}
