@charset "utf-8";
/* Northern lights: a night of ice and snow under a slowly waving aurora, penguins sliding. */
:root[data-theme="arctic"] {
  --bg: #071a2c; --panel: #f3f9ff; --ink: #0e2a40; --muted: #5d7a8f; --line: #d3e6f5;
  --accent: #19a69c; --accent-ink: #ffffff; --mover: #e6f7f4; --die: #ffffff; --die-edge: #9fd3ea;
  --pip: #0e2a40; --held: #7cf0c8; --field: #ffffff; --good: #138a6c; --bad: #d1495b;
  --title: #c9fff0; --title-font: "Chewy", "Comic Sans MS", cursive; --name-font: "Chewy", "Comic Sans MS", cursive;
  --page-ink: #e8f7ff; --page-muted: #a6c7dc; --radius: 16px; --mark: "🐧";
  --pattern: radial-gradient(1px 1px at 30px 40px, #fff 50%, transparent 52%) 0 0 / 170px 170px,
    radial-gradient(1px 1px at 120px 110px, #cfeaff 50%, transparent 52%) 0 0 / 170px 170px, linear-gradient(#0b2440, #071a2c 60%);
  --pattern-size: 170px 170px, 170px 170px, 100% 100%;
}
[data-theme="arctic"] h1 { font-size: 46px; font-weight: 400; text-shadow: 0 0 16px rgba(124, 240, 200, .7); }
[data-theme="arctic"] .tray-head .name, [data-theme="arctic"] .tray-head .total { font-weight: 400; }
[data-theme="arctic"] .tray-head .total { font-size: 27px; color: #19a69c; }
[data-theme="arctic"] .die:not(.blank) { box-shadow: inset 0 -4px 0 rgba(159, 211, 234, .4); }
[data-theme="arctic"] .die.held { box-shadow: 0 0 0 3px var(--held), 0 0 14px rgba(124, 240, 200, .8); }
/* The aurora, waving. */
[data-theme="arctic"] body::before {
  content: ""; position: fixed; left: -10%; right: -10%; top: 0; height: 55vh; z-index: 0; pointer-events: none; opacity: .55; filter: blur(18px);
  background: linear-gradient(100deg, transparent 10%, rgba(80, 255, 170, .7) 25%, transparent 38%, rgba(120, 140, 255, .55) 52%, transparent 65%, rgba(80, 255, 200, .6) 78%, transparent 90%);
  transform-origin: 50% 0; animation: aurora 10s ease-in-out infinite alternate;
}
@keyframes aurora { 0% { transform: skewX(-12deg) scaleY(.85); } 100% { transform: skewX(14deg) scaleY(1.1) translateX(4%); } }
/* Snow and ice along the bottom. */
[data-theme="arctic"] body::after {
  content: ""; position: fixed; left: 0; right: 0; bottom: 0; height: 60px; z-index: 0; pointer-events: none;
  background: radial-gradient(ellipse 50% 100% at 25% 100%, #eaf6ff 0 60%, transparent 61%), radial-gradient(ellipse 45% 100% at 78% 100%, #d9eefc 0 60%, transparent 61%);
}
[data-theme="arctic"] .ambient .a1 { display: block; bottom: 30px; left: -50px; font-size: 32px; animation: slide 16s linear infinite 2s; }
[data-theme="arctic"] .ambient .a1::before { content: "🐧"; display: inline-block; transform: rotate(-70deg); }
@keyframes slide { 0% { transform: translateX(0); } 30%, 100% { transform: translateX(calc(100vw + 100px)); } }
[data-theme="arctic"] .ambient .a2 { display: block; bottom: 34px; right: 4%; font-size: 52px; }
[data-theme="arctic"] .ambient .a2::before { content: "🐻‍❄️"; }
[data-theme="arctic"] .ambient .a3 { display: block; top: 8%; left: 30%; font-size: 22px; animation: star-blink 3s ease-in-out infinite; }
[data-theme="arctic"] .ambient .a3::before { content: "✨"; }
@keyframes star-blink { 50% { opacity: .2; transform: scale(.7); } }