@charset "utf-8";
/* Jungle: deep green under the canopy, vines hanging from the top, a monkey swinging on
   one, a parrot flying past and eyes blinking in the bushes. */
:root[data-theme="jungle"] {
  --bg: #123d23; --panel: #fbf7e6; --ink: #1f2d14; --muted: #66714f; --line: #e2dbb8;
  --accent: #2f8a3a; --accent-ink: #ffffff; --mover: #fff4c9; --die: #fff8e0; --die-edge: #8a5a2b;
  --pip: #2e5d1f; --held: #ffd23f; --field: #fffdf2; --good: #2f8a3a; --bad: #c0392b;
  --title: #ffd23f; --title-font: "Lilita One", "Arial Black", sans-serif; --name-font: "Lilita One", "Arial Black", sans-serif;
  --page-ink: #fbf7e6; --page-muted: #bfdcae; --radius: 14px; --mark: "🐾";
  --pattern:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='190'%3E%3Ctext x='8' y='46' font-size='34' opacity='.16'%3E🌿%3C/text%3E%3Ctext x='130' y='120' font-size='28' opacity='.14'%3E🍃%3C/text%3E%3Ctext x='60' y='176' font-size='24' opacity='.12'%3E🌱%3C/text%3E%3C/svg%3E"),
    radial-gradient(ellipse 60% 40% at 20% 0%, #1f5a2f, transparent 70%),
    radial-gradient(ellipse 60% 50% at 90% 100%, #0b2c18, transparent 70%);
  --pattern-size: 220px 190px, 100% 100%, 100% 100%;
}
[data-theme="jungle"] body { padding-top: 46px; }
[data-theme="jungle"] h1 { font-size: 46px; font-weight: 400; letter-spacing: .5px; text-shadow: 3px 3px 0 #0b2c18; }
[data-theme="jungle"] .tray-head .name { font-size: 19px; font-weight: 400; }
[data-theme="jungle"] .tray-head .total { font-size: 27px; font-weight: 400; color: #2f8a3a; }
[data-theme="jungle"] .sheet thead th, [data-theme="jungle"] .sheet tr.total th, [data-theme="jungle"] .sheet tr.total td { font-weight: 400; }
[data-theme="jungle"] .card { border: 3px solid #8a5a2b; box-shadow: 0 4px 0 #0b2c18; }
[data-theme="jungle"] .die:not(.blank) {
  border-radius: 10px;
  background: repeating-linear-gradient(100deg, transparent 0 7px, rgba(138, 90, 43, .08) 7px 9px), var(--die);
}
[data-theme="jungle"] .die.held { box-shadow: 0 0 0 3px var(--held), 0 0 12px rgba(255, 210, 63, .8); }
[data-theme="jungle"] button.primary { box-shadow: 0 3px 0 #1d5a25; }
/* Vines hanging from the top, swaying. */
[data-theme="jungle"] body::before {
  content: ""; position: fixed; top: 0; left: -20px; right: -20px; height: 110px; z-index: 0; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='110'%3E%3Cg fill='none' stroke='%232f7d32' stroke-width='3'%3E%3Cpath d='M20 0C30 30 10 50 22 80'/%3E%3Cpath d='M90 0C80 20 100 35 88 60'/%3E%3Cpath d='M170 0C185 35 160 70 175 105'/%3E%3C/g%3E%3Cg fill='%2346a04a'%3E%3Cellipse cx='16' cy='30' rx='7' ry='4' transform='rotate(-30 16 30)'/%3E%3Cellipse cx='26' cy='60' rx='7' ry='4' transform='rotate(30 26 60)'/%3E%3Cellipse cx='94' cy='25' rx='7' ry='4' transform='rotate(25 94 25)'/%3E%3Cellipse cx='168' cy='45' rx='8' ry='4' transform='rotate(-25 168 45)'/%3E%3Cellipse cx='180' cy='85' rx='8' ry='4' transform='rotate(30 180 85)'/%3E%3C/g%3E%3Crect width='240' height='10' fill='%231f5a2f'/%3E%3C/svg%3E") 0 0 / 240px 110px repeat-x;
  transform-origin: 50% 0; animation: vines 6s ease-in-out infinite;
}
@keyframes vines { 50% { transform: skewX(2deg); } }
[data-theme="jungle"] body::after {
  content: "🌴"; position: fixed; left: -14px; bottom: -10px; font-size: 110px; z-index: 0; pointer-events: none; opacity: .5;
}
/* A monkey swings on its vine; a parrot flies past; eyes blink in the bushes. */
[data-theme="jungle"] .ambient .a1 { display: block; top: 0; right: 9%; width: 2px; height: 150px; background: #2f7d32; transform-origin: top center; animation: swing 3.2s ease-in-out infinite; }
[data-theme="jungle"] .ambient .a1::after { content: "🐒"; position: absolute; bottom: -26px; left: -15px; font-size: 32px; }
@keyframes swing { 0%, 100% { transform: rotate(18deg); } 50% { transform: rotate(-18deg); } }
[data-theme="jungle"] .ambient .a2 { display: block; top: 22%; left: -60px; font-size: 30px; animation: parrot-fly 24s linear infinite 5s; }
[data-theme="jungle"] .ambient .a2::before { content: "🦜"; display: inline-block; animation: wing .3s ease-in-out infinite alternate; }
@keyframes parrot-fly { 0% { transform: translate(0, 0); } 12% { transform: translate(40vw, -24px); } 24%, 100% { transform: translate(calc(100vw + 120px), 10px); } }
@keyframes wing { to { transform: translateY(-3px) scaleY(.85); } }
[data-theme="jungle"] .ambient .a3 { display: block; right: 3%; bottom: 8px; font-size: 26px; animation: eyes 7s steps(1) infinite; }
[data-theme="jungle"] .ambient .a3::before { content: "👀"; }
@keyframes eyes { 0%, 40%, 44%, 100% { opacity: .9; } 42% { opacity: 0; } 70% { transform: translateX(-10px); } }