/* Ribi (the .bo rig). The layout box is the whole drawing (viewBox -80 -122 160 210): size it with width. */
.bo {
  position: relative;
  width: var(--bo, 160px);
  aspect-ratio: 160 / 210;
  pointer-events: none;
  /* lines are a deeper shade of the skin, not near-black, to sit with the clean painted scenery (William): --bink for the
     silhouette and limbs, the darker --bface for the features that must read small (mouth, shut eyes, brows) */
  --bink: color-mix(in srgb, var(--b3) 75%, var(--bline));
  --bface: color-mix(in srgb, var(--b3) 35%, var(--bline));
}
.bo svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  display: block;
}
/* outline pass: the body and every limb filled and stroked in the line colour, under all the fills */
.bo .boOut {
  opacity: 1;
}
.bo .boOut path,
.bo .boOut ellipse {
  fill: var(--bink);
  stroke: var(--bink);
  stroke-width: 2.8;
  stroke-linejoin: round;
}
.bo .boOut .boCrease,
.bo .boOut .boEdge {
  display: none;
}
.bo .boEdge {
  fill: none;
  stroke: var(--bink);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.6;
}
.bo .boCrease {
  fill: none;
  stroke: var(--b3);
  stroke-width: 1.5;
  stroke-linecap: round;
  opacity: 0.6;
}
.bo .boShade {
  opacity: 0.5;
}
.bo .boVolume {
  display: none;
}
.bo .boRim {
  fill: var(--rimKey, #ffe6a8);
}
.bo .boRimSoft {
  fill: var(--rimKey, #ffe6a8);
}
.bo .boRimFill {
  fill: var(--rimFill, #8ceebb);
}
.bo .boAmb {
  fill: var(--amb, #347051);
  opacity: 0.1;
  mix-blend-mode: multiply;
}
.bo .boCore {
  opacity: 0.55;
}
.bo .boSheen {
  fill: #fff;
  opacity: 0.42;
}
.bo .boArm {
  fill: var(--bo-limb, var(--b2));
}
.bo .boArm + .boEdge {
  opacity: 0.7;
}
.bo .boPupil {
  fill: #10200f;
}
.bo .boSclera {
  fill: var(--biris, #fffdf4);
  stroke: color-mix(in srgb, var(--b3) 45%, #fff);
  stroke-width: 1.2;
}
.bo .boBelly {
  fill: var(--bbelly, #fff4d6);
  opacity: 0.92;
}
.bo .boSpots {
  fill: var(--bink);
  opacity: 0.16;
}
.bo .boSac {
  fill: color-mix(in srgb, var(--bbelly, #fff4d6) 75%, var(--b1));
}
.bo .boLid {
  fill: none;
  stroke: var(--bface);
  stroke-width: 3.2;
  stroke-linecap: round;
}
.bo .boThigh {
  fill: var(--bo-limb, var(--b2));
}
.bo .boFoot {
  fill: color-mix(in srgb, var(--b2) 75%, var(--b3));
}
.bo .boGlint {
  fill: #fff;
}
.bo .boGlint2 {
  fill: #fff;
  opacity: 0.85;
}
.bo .boArc {
  fill: none;
  stroke: var(--bface);
  stroke-width: 3.6;
  stroke-linecap: round;
}
.bo .boBrow {
  fill: none;
  stroke: var(--bface);
  stroke-width: 1.7;
  stroke-linecap: round;
  opacity: 0.55;
}
.bo .boMouth {
  fill: #6a2a2c;
  stroke: var(--bface);
  stroke-width: 2.1;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.bo .boTongue {
  fill: #ff7aa8;
}
.bo .boCheek {
  fill: var(--bcheek);
  opacity: var(--blush, 0.2);
}
.bo .boShadow {
}
.bo .bx {
  opacity: 0;
  transition: opacity 0.25s ease;
}
.bo .bx.on {
  opacity: 1;
}
.bo .bx text {
  fill: #eafcf4;
  font:
    800 18px 'Baloo 2',
    system-ui,
    sans-serif;
  stroke: var(--bface);
  stroke-width: 1.2;
  paint-order: stroke;
}
.bo[data-skin='neon'] .boOut path,
.bo[data-skin='neon'] .boOut ellipse {
  stroke-width: 3.5;
}
.bo[data-skin='neon'] svg {
  filter: drop-shadow(0 0 6px #56fff0aa);
}
.bo[data-skin='golden'] .boSheen {
  opacity: 0.75;
}

.bo .boGlint,
.bo .boGlint2 {
  opacity: var(--go, 1);
}
.bo .boRim {
  filter: blur(0.7px);
}
.bo .boTuft path {
  fill: color-mix(in srgb, var(--b1) 45%, var(--b2));
  stroke: var(--bink);
  stroke-width: 1.6;
  stroke-linejoin: round;
  opacity: 0.95;
}
/* glass frog: a see-through jelly body (the scenery shows through), a ghost of a belly and a few glinting specks */
.bo[data-skin='mint'] .boBody {
  fill-opacity: 0.62;
}
.bo[data-skin='mint'] .boBelly {
  opacity: 0.45;
}
.bo[data-skin='mint'] .boArm,
.bo[data-skin='mint'] .boThigh,
.bo[data-skin='mint'] .boFoot {
  fill-opacity: 0.72;
}
.bo[data-skin='mint'] .boSpots {
  fill: #fff;
  opacity: 0.55;
}
.bo[data-skin='mint'] .boSheen {
  opacity: 0.8;
}
.bo[data-skin='mint'] .boOut path,
.bo[data-skin='mint'] .boOut ellipse {
  fill: none;
}
/* End of src/bo/bo.css */

/* End of dist-static/assets/bo-Db18kuUP.css */
