/* ==========================================================================
   WHAT IS ON THE CARDS

   Generated by tools/cardart.py - do not hand-edit the data URIs.

   Every card grows a sprig out of its top-left corner and the same sprig,
   turned half a circle, out of its bottom-right. They are clipped by the
   card's own rounded corner, so each one reads as foliage coming in from
   behind the paper rather than a sticker placed on it.

   Under both, a pinch of grain, which is the difference between cream paper
   and a cream rectangle.
   ========================================================================== */

.card,
.tl {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22140%22%20height%3D%22140%22%3E%3Cfilter%20id%3D%22g%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.9%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeColorMatrix%20type%3D%22saturate%22%20values%3D%220%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22140%22%20height%3D%22140%22%20filter%3D%22url%28%23g%29%22%20opacity%3D%220.55%22%2F%3E%3C%2Fsvg%3E");
  background-size: 140px 140px;
  background-blend-mode: multiply;
  background-color: var(--card-g);
}

.card::before, .card::after,
.tl::after, .tl::marker {
  pointer-events: none;
}

.card::before,
.tl::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -14px; left: -18px;
  width: 150px; height: 150px;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20150%20150%22%20width%3D%22150%22%20height%3D%22150%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23a98a4a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20d%3D%22M2%204%20C46%2026%2074%2062%20104%20132%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23b9c39b%22%3E%3Cpath%20d%3D%22M11.0%208.8%20C5.9%2012.6%2012.0%2022.4%2021.5%2030.9%20C21.0%2018.2%2017.2%207.3%2011.0%208.8%20Z%22%2F%3E%3Cpath%20d%3D%22M38.3%2028.6%20C38.3%2034.5%2049.0%2035.2%2060.5%2032.6%20C50.6%2026.1%2040.4%2023.1%2038.3%2028.6%20Z%22%2F%3E%3Cpath%20d%3D%22M62.0%2054.9%20C56.9%2056.7%2059.3%2066.2%2064.9%2075.4%20C67.7%2065.0%2067.5%2055.2%2062.0%2054.9%20Z%22%2F%3E%3Cpath%20d%3D%22M83.7%2089.5%20C81.6%2094.0%2089.4%2098.4%2099.0%20100.5%20C93.9%2092.0%2087.4%2086.0%2083.7%2089.5%20Z%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%239aa878%22%3E%3Cpath%20d%3D%22M20.6%2014.8%20C21.7%2020.9%2032.9%2019.7%2044.4%2014.8%20C33.0%2010.0%2021.8%208.7%2020.6%2014.8%20Z%22%2F%3E%3Cpath%20d%3D%22M29.6%2021.3%20C24.4%2024.4%2029.2%2034.3%2037.3%2043.2%20C38.1%2031.1%2035.6%2020.4%2029.6%2021.3%20Z%22%2F%3E%3Cpath%20d%3D%22M46.5%2036.5%20C41.3%2038.9%2044.7%2048.7%2051.5%2057.9%20C53.5%2046.6%2052.2%2036.3%2046.5%2036.5%20Z%22%2F%3E%3Cpath%20d%3D%22M54.4%2045.3%20C53.5%2050.8%2063.3%2053.2%2074.4%2052.6%20C66.3%2045.0%2057.3%2040.5%2054.4%2045.3%20Z%22%2F%3E%3Cpath%20d%3D%22M69.4%2065.4%20C67.8%2070.5%2076.6%2074.1%2087.0%2075.1%20C80.6%2066.8%2072.8%2061.4%2069.4%2065.4%20Z%22%2F%3E%3Cpath%20d%3D%22M76.6%2076.9%20C71.7%2078.3%2073.3%2087.3%2078.0%2096.3%20C81.4%2086.7%2081.8%2077.6%2076.6%2076.9%20Z%22%2F%3E%3Cpath%20d%3D%22M90.7%20103.1%20C86.0%20104.1%2087.2%20112.6%2091.2%20121.2%20C94.8%20112.4%2095.5%20103.8%2090.7%20103.1%20Z%22%2F%3E%3Cpath%20d%3D%22M97.7%20117.8%20C95.3%20121.8%20102.1%20126.6%20110.8%20129.5%20C107.0%20121.1%20101.4%20114.9%2097.7%20117.8%20Z%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23a98a4a%22%20stroke-width%3D%220.7%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.55%22%3E%3Cpath%20d%3D%22M11.6%2010.2%20L20.3%2028.3%22%2F%3E%3Cpath%20d%3D%22M22.0%2014.8%20L41.5%2014.8%22%2F%3E%3Cpath%20d%3D%22M30.1%2022.6%20L36.4%2040.6%22%2F%3E%3Cpath%20d%3D%22M39.6%2028.8%20L57.8%2032.1%22%2F%3E%3Cpath%20d%3D%22M46.8%2037.8%20L50.9%2055.3%22%2F%3E%3Cpath%20d%3D%22M55.6%2045.7%20L72.0%2051.7%22%2F%3E%3Cpath%20d%3D%22M62.2%2056.1%20L64.6%2072.9%22%2F%3E%3Cpath%20d%3D%22M70.5%2066.0%20L84.9%2073.9%22%2F%3E%3Cpath%20d%3D%22M76.7%2078.1%20L77.8%2094.0%22%2F%3E%3Cpath%20d%3D%22M84.6%2090.1%20L97.1%2099.2%22%2F%3E%3Cpath%20d%3D%22M90.8%20104.1%20L91.2%20119.1%22%2F%3E%3Cpath%20d%3D%22M98.5%20118.5%20L109.3%20128.1%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23dcb9ad%22%3E%3Cpath%20d%3D%22M60.6%2012.9%20C59.2%2017.2%2063.3%2017.9%2068.5%2016.2%20C66.1%2011.3%2062.7%208.9%2060.6%2012.9%20Z%22%2F%3E%3Cpath%20d%3D%22M58.6%2014.1%20C54.1%2014.1%2054.7%2018.2%2057.9%2022.6%20C61.8%2018.8%2063.0%2014.9%2058.6%2014.1%20Z%22%2F%3E%3Cpath%20d%3D%22M56.8%2012.6%20C55.4%208.3%2051.7%2010.1%2048.5%2014.5%20C53.3%2017.0%2057.4%2017.0%2056.8%2012.6%20Z%22%2F%3E%3Cpath%20d%3D%22M57.7%2010.4%20C61.3%207.8%2058.5%204.8%2053.3%203.1%20C52.4%208.5%2053.7%2012.4%2057.7%2010.4%20Z%22%2F%3E%3Cpath%20d%3D%22M60.1%2010.6%20C63.7%2013.2%2065.7%209.6%2065.7%204.2%20C60.3%204.9%2057.0%207.4%2060.1%2010.6%20Z%22%2F%3E%3Cpath%20d%3D%22M89.7%2068.9%20C86.9%2070.7%2088.8%2073.0%2092.5%2074.5%20C93.5%2070.7%2092.7%2067.7%2089.7%2068.9%20Z%22%2F%3E%3Cpath%20d%3D%22M88.0%2068.7%20C85.5%2066.6%2083.9%2069.1%2083.6%2073.1%20C87.5%2072.8%2090.1%2071.2%2088.0%2068.7%20Z%22%2F%3E%3Cpath%20d%3D%22M87.7%2067.0%20C88.9%2063.9%2086.0%2063.2%2082.1%2064.1%20C83.6%2067.8%2086.0%2069.8%2087.7%2067.0%20Z%22%2F%3E%3Cpath%20d%3D%22M89.3%2066.2%20C92.5%2066.4%2092.3%2063.4%2090.2%2060.0%20C87.2%2062.6%2086.1%2065.4%2089.3%2066.2%20Z%22%2F%3E%3Cpath%20d%3D%22M90.5%2067.4%20C91.3%2070.6%2094.1%2069.5%2096.7%2066.4%20C93.3%2064.3%2090.3%2064.1%2090.5%2067.4%20Z%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23c8a24f%22%3E%3Ccircle%20cx%3D%2258.8%22%20cy%3D%2212.1%22%20r%3D%222.5%22%2F%3E%3Ccircle%20cx%3D%2289.0%22%20cy%3D%2267.6%22%20r%3D%221.9%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") center / contain no-repeat;
  opacity: .30;
}

.card::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -14px; right: -18px;
  width: 150px; height: 150px;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20150%20150%22%20width%3D%22150%22%20height%3D%22150%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23a98a4a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20d%3D%22M2%204%20C46%2026%2074%2062%20104%20132%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23b9c39b%22%3E%3Cpath%20d%3D%22M11.0%208.8%20C5.9%2012.6%2012.0%2022.4%2021.5%2030.9%20C21.0%2018.2%2017.2%207.3%2011.0%208.8%20Z%22%2F%3E%3Cpath%20d%3D%22M38.3%2028.6%20C38.3%2034.5%2049.0%2035.2%2060.5%2032.6%20C50.6%2026.1%2040.4%2023.1%2038.3%2028.6%20Z%22%2F%3E%3Cpath%20d%3D%22M62.0%2054.9%20C56.9%2056.7%2059.3%2066.2%2064.9%2075.4%20C67.7%2065.0%2067.5%2055.2%2062.0%2054.9%20Z%22%2F%3E%3Cpath%20d%3D%22M83.7%2089.5%20C81.6%2094.0%2089.4%2098.4%2099.0%20100.5%20C93.9%2092.0%2087.4%2086.0%2083.7%2089.5%20Z%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%239aa878%22%3E%3Cpath%20d%3D%22M20.6%2014.8%20C21.7%2020.9%2032.9%2019.7%2044.4%2014.8%20C33.0%2010.0%2021.8%208.7%2020.6%2014.8%20Z%22%2F%3E%3Cpath%20d%3D%22M29.6%2021.3%20C24.4%2024.4%2029.2%2034.3%2037.3%2043.2%20C38.1%2031.1%2035.6%2020.4%2029.6%2021.3%20Z%22%2F%3E%3Cpath%20d%3D%22M46.5%2036.5%20C41.3%2038.9%2044.7%2048.7%2051.5%2057.9%20C53.5%2046.6%2052.2%2036.3%2046.5%2036.5%20Z%22%2F%3E%3Cpath%20d%3D%22M54.4%2045.3%20C53.5%2050.8%2063.3%2053.2%2074.4%2052.6%20C66.3%2045.0%2057.3%2040.5%2054.4%2045.3%20Z%22%2F%3E%3Cpath%20d%3D%22M69.4%2065.4%20C67.8%2070.5%2076.6%2074.1%2087.0%2075.1%20C80.6%2066.8%2072.8%2061.4%2069.4%2065.4%20Z%22%2F%3E%3Cpath%20d%3D%22M76.6%2076.9%20C71.7%2078.3%2073.3%2087.3%2078.0%2096.3%20C81.4%2086.7%2081.8%2077.6%2076.6%2076.9%20Z%22%2F%3E%3Cpath%20d%3D%22M90.7%20103.1%20C86.0%20104.1%2087.2%20112.6%2091.2%20121.2%20C94.8%20112.4%2095.5%20103.8%2090.7%20103.1%20Z%22%2F%3E%3Cpath%20d%3D%22M97.7%20117.8%20C95.3%20121.8%20102.1%20126.6%20110.8%20129.5%20C107.0%20121.1%20101.4%20114.9%2097.7%20117.8%20Z%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23a98a4a%22%20stroke-width%3D%220.7%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.55%22%3E%3Cpath%20d%3D%22M11.6%2010.2%20L20.3%2028.3%22%2F%3E%3Cpath%20d%3D%22M22.0%2014.8%20L41.5%2014.8%22%2F%3E%3Cpath%20d%3D%22M30.1%2022.6%20L36.4%2040.6%22%2F%3E%3Cpath%20d%3D%22M39.6%2028.8%20L57.8%2032.1%22%2F%3E%3Cpath%20d%3D%22M46.8%2037.8%20L50.9%2055.3%22%2F%3E%3Cpath%20d%3D%22M55.6%2045.7%20L72.0%2051.7%22%2F%3E%3Cpath%20d%3D%22M62.2%2056.1%20L64.6%2072.9%22%2F%3E%3Cpath%20d%3D%22M70.5%2066.0%20L84.9%2073.9%22%2F%3E%3Cpath%20d%3D%22M76.7%2078.1%20L77.8%2094.0%22%2F%3E%3Cpath%20d%3D%22M84.6%2090.1%20L97.1%2099.2%22%2F%3E%3Cpath%20d%3D%22M90.8%20104.1%20L91.2%20119.1%22%2F%3E%3Cpath%20d%3D%22M98.5%20118.5%20L109.3%20128.1%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23dcb9ad%22%3E%3Cpath%20d%3D%22M60.6%2012.9%20C59.2%2017.2%2063.3%2017.9%2068.5%2016.2%20C66.1%2011.3%2062.7%208.9%2060.6%2012.9%20Z%22%2F%3E%3Cpath%20d%3D%22M58.6%2014.1%20C54.1%2014.1%2054.7%2018.2%2057.9%2022.6%20C61.8%2018.8%2063.0%2014.9%2058.6%2014.1%20Z%22%2F%3E%3Cpath%20d%3D%22M56.8%2012.6%20C55.4%208.3%2051.7%2010.1%2048.5%2014.5%20C53.3%2017.0%2057.4%2017.0%2056.8%2012.6%20Z%22%2F%3E%3Cpath%20d%3D%22M57.7%2010.4%20C61.3%207.8%2058.5%204.8%2053.3%203.1%20C52.4%208.5%2053.7%2012.4%2057.7%2010.4%20Z%22%2F%3E%3Cpath%20d%3D%22M60.1%2010.6%20C63.7%2013.2%2065.7%209.6%2065.7%204.2%20C60.3%204.9%2057.0%207.4%2060.1%2010.6%20Z%22%2F%3E%3Cpath%20d%3D%22M89.7%2068.9%20C86.9%2070.7%2088.8%2073.0%2092.5%2074.5%20C93.5%2070.7%2092.7%2067.7%2089.7%2068.9%20Z%22%2F%3E%3Cpath%20d%3D%22M88.0%2068.7%20C85.5%2066.6%2083.9%2069.1%2083.6%2073.1%20C87.5%2072.8%2090.1%2071.2%2088.0%2068.7%20Z%22%2F%3E%3Cpath%20d%3D%22M87.7%2067.0%20C88.9%2063.9%2086.0%2063.2%2082.1%2064.1%20C83.6%2067.8%2086.0%2069.8%2087.7%2067.0%20Z%22%2F%3E%3Cpath%20d%3D%22M89.3%2066.2%20C92.5%2066.4%2092.3%2063.4%2090.2%2060.0%20C87.2%2062.6%2086.1%2065.4%2089.3%2066.2%20Z%22%2F%3E%3Cpath%20d%3D%22M90.5%2067.4%20C91.3%2070.6%2094.1%2069.5%2096.7%2066.4%20C93.3%2064.3%2090.3%2064.1%2090.5%2067.4%20Z%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23c8a24f%22%3E%3Ccircle%20cx%3D%2258.8%22%20cy%3D%2212.1%22%20r%3D%222.5%22%2F%3E%3Ccircle%20cx%3D%2289.0%22%20cy%3D%2267.6%22%20r%3D%221.9%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") center / contain no-repeat;
  transform: rotate(180deg);
  opacity: .30;
}

/* the timeline's line already lives in ::before, so it only gets the one */
.tl::after { top: auto; left: auto; bottom: -14px; right: -18px; transform: rotate(180deg); }

/* the accordion rows are small - a sprig would swallow the question */
.acc details { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22140%22%20height%3D%22140%22%3E%3Cfilter%20id%3D%22g%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.9%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeColorMatrix%20type%3D%22saturate%22%20values%3D%220%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22140%22%20height%3D%22140%22%20filter%3D%22url%28%23g%29%22%20opacity%3D%220.55%22%2F%3E%3C%2Fsvg%3E"); background-size: 140px 140px;
               background-blend-mode: multiply; background-color: var(--card-g); }

/* mirrored, so the sprigs still come in from behind the outer corners */
.invitation[dir="rtl"] .card::before { left: auto; right: -18px; transform: scaleX(-1); }
.invitation[dir="rtl"] .card::after  { right: auto; left: -18px; transform: rotate(180deg) scaleX(-1); }
.invitation[dir="rtl"] .tl::after    { right: auto; left: -18px; transform: rotate(180deg) scaleX(-1); }

/* the inputs sit above the foliage, never under it */
.card > * { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) { .card::before, .card::after { opacity: .22; } }