/* GENERATED by scripts/build-craps-guide.mjs — do not edit; re-run the script.
   The Craps felt's own style.css rules (only those its markup uses) + the "Felt"
   board scheme's tokens, for the guide pages. */
.cg-page {
  --pgr-bg: radial-gradient(135% 120% at 50% -10%,#21724f 0%,#155538 55%,#0c3b27 100%);
  --pgr-seat: rgba(0,0,0,.20);
  --pgr-panel: rgba(0,0,0,.22);
  --pgr-line: rgba(255,255,255,.13);
  --pgr-txt: #f4f0e2;
  --pgr-dim: rgba(244,240,226,.62);
  --pgr-track: rgba(0,0,0,.3);
  --pgr-sel: oklch(.86 .16 92);
  --pgr-btn: linear-gradient(180deg,#d2a85d,#b88f43);
  --pgr-btnTxt: #2a2111;
  --pgr-bubbleBg: #fbf6ea;
  --pgr-bubbleTxt: #2c2415;
  --pgr-selBg: oklch(.86 .16 92 / .2);
  --pgr-gold: #f0d68c;
  --pgr-solid: #17573b;
  --pgr-goldBg: color-mix(in oklch, #f0d68c 16%, transparent);
}
.crp-board { position: relative; flex: 1 1 auto; min-width: 0px; background: var(--pgr-panel,rgba(255,255,255,.05)); border: 2px solid var(--pgr-line,rgba(255,255,255,.12)); border-radius: 18px; padding: 10px; display: flex; flex-direction: column; gap: 8px; font-family: "Playfair Display", Georgia, serif; }
.crp-row { display: flex; gap: 6px; min-width: 0px; }
.crp-places { display: grid; grid-template-columns: repeat(6, minmax(0px, 1fr)); gap: 6px; }
.crp-props { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 6px; }
.crp-zone { position: relative; background: var(--pgr-seat,rgba(0,0,0,.2)); border: 2px solid var(--pgr-line,rgba(255,255,255,.12)); border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; cursor: pointer; user-select: none; min-width: 0px; padding: 6px 4px; transition: border-color 0.15s, opacity 0.2s; }
.crp-big { font-weight: 900; font-size: clamp(22px, 5.6vw, 32px); letter-spacing: 0.08em; white-space: nowrap; }
.crp-mid { font-style: italic; font-weight: 700; font-size: clamp(13px, 3vw, 16px); white-space: nowrap; min-width: 0px; overflow: hidden; text-overflow: ellipsis; }
.crp-redink { color: color-mix(in oklch, var(--pgr-sel,#1D9E75) 65%, var(--pgr-txt,#fff)); }
.crp-pay { font-family: var(--pgr-font,'Outfit',sans-serif); font-style: italic; font-size: 10px; color: var(--pgr-dim,#83858b); white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.crp-place { min-height: 58px; }
.crp-place-num { font-style: italic; font-weight: 800; font-size: clamp(16px, 4.6vw, 24px); letter-spacing: 0.02em; white-space: nowrap; }
.crp-place-word { font-size: clamp(11px, 3.2vw, 15px); }
.crp-tilepuck { position: absolute; top: -8px; left: 8px; background: var(--pgr-sel,#1D9E75); color: var(--pgr-solid,#0d0e11); font-family: var(--pgr-font,'Outfit',sans-serif); font-weight: 800; font-size: 9px; letter-spacing: 0.1em; padding: 2px 7px; border-radius: 999px; box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 6px; }
.crp-comerow { min-height: 56px; }
.crp-come { flex: 1 1 0%; }
.crp-cecol { display: flex; flex-direction: column; justify-content: center; gap: 6px; flex: 0 0 auto; }
.crp-ce { width: 44px; height: 44px; flex: 0 0 auto; border-radius: 50%; padding: 0px; }
.crp-ce-letter { font-weight: 800; font-size: 18px; color: var(--pgr-sel,#1D9E75); }
.crp-passrow { align-items: stretch; }
.crp-passcol { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: 6px; }
.crp-passcol .crp-pass { flex: 1 1 0%; }
.crp-field { min-height: 56px; flex-flow: wrap; gap: 10px; padding: 8px 10px; }
.crp-field-word { font-style: italic; font-weight: 900; font-size: clamp(16px, 4.4vw, 22px); color: var(--pgr-sel,#1D9E75); }
.crp-field-nums { font-weight: 800; font-size: clamp(13px, 3.4vw, 17px); letter-spacing: 0.12em; white-space: nowrap; }
.crp-dontrow .crp-dontpass { flex: 2 1 0%; min-height: 38px; }
.crp-dontrow .crp-dontcome { flex: 1 1 0%; min-height: 38px; }
.crp-pass { min-height: 54px; }
.crp-odds { min-height: 38px; flex-direction: row; gap: 10px; border-style: dashed; }
.crp-odds-word { font-style: normal; font-weight: 800; letter-spacing: 0.14em; }
.crp-prop { padding: 5px 3px; gap: 2px; }
.crp-prop-name { font-style: normal; font-weight: 700; color: var(--pgr-txt,#e9e8e4); opacity: 0.85; }
.crp-prop-odds { margin-top: -1px; }
.crp-prop-dice { display: flex; gap: 5px; align-items: center; }
.crp-prop-dice .dr-die { flex: 0 0 auto; }
.crp-chip { position: absolute; top: -8px; right: -4px; z-index: 5; min-width: 28px; height: 28px; padding: 0px 5px; border-radius: 50%; background: var(--pgr-sel,#1D9E75); color: var(--pgr-solid,#0d0e11); display: flex; align-items: center; justify-content: center; font-family: var(--pgr-font,'Outfit',sans-serif); font-weight: 800; font-size: 11px; border: 2px dashed rgba(255, 255, 255, 0.75); box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 6px; }
.crp-chip.crp-chip-lay { right: 26px; background: var(--pgr-panel,#181b22); color: var(--pgr-sel,#1D9E75); border: 2px solid var(--pgr-sel,#1D9E75); }
.crp-riding { position: absolute; bottom: -8px; right: -4px; z-index: 5; display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 0px; font-family: var(--pgr-font,'Outfit',sans-serif); pointer-events: none; }
.crp-ridechip { min-width: 24px; height: 24px; padding: 0px 4px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 10px; box-shadow: rgba(0, 0, 0, 0.45) 0px 2px 6px; }
.crp-riding > .crp-ride-odds, .crp-riding > .crp-ride-dont { margin-bottom: -13px; }
.crp-ride-come { background: var(--pgr-sel,#1D9E75); color: var(--pgr-solid,#0d0e11); border: 2px solid rgba(255, 255, 255, 0.9); }
.crp-ride-odds { background: var(--pgr-panel,#181b22); color: var(--pgr-sel,#1D9E75); border: 2px solid var(--pgr-sel,#1D9E75); }
.crp-ride-dont { background: rgb(27, 29, 36); color: rgb(207, 210, 218); border: 2px solid rgba(207, 210, 218, 0.55); }
.crp-ride-dont::after { content: ""; position: absolute; left: 3px; right: 3px; height: 2px; background: rgba(207, 210, 218, 0.75); transform: rotate(-38deg); border-radius: 2px; }
.crp-ridechip { position: relative; }
@keyframes dr-bop { 
  0%, 100% { transform: translateY(0px) rotate(-2.5deg) scale(1); }
  50% { transform: translateY(-10px) rotate(2.5deg) scale(1.06); }
}
@keyframes dr-land { 
  0% { transform: scale(1.15) rotate(2deg); }
  55% { transform: scale(0.94) rotate(-1deg); }
  80% { transform: scale(1.03) rotate(0.4deg); }
  100% { transform: scale(1) rotate(0deg); }
}
@keyframes dr-gentle { 
  0% { transform: rotate(-13deg) scale(0.91); filter: blur(1px); }
  22% { transform: rotate(9deg) scale(0.95); filter: blur(1.6px); }
  44% { transform: rotate(-8deg) scale(0.93); filter: blur(1.4px); }
  66% { transform: rotate(6deg) scale(0.95); filter: blur(1.1px); }
  88% { transform: rotate(-4deg) scale(0.97); filter: blur(0.6px); }
  100% { transform: rotate(-13deg) scale(0.91); filter: blur(1px); }
}
@keyframes dr-spin { 
  0% { transform: rotate(-26deg) scale(0.88); filter: blur(2px); }
  20% { transform: rotate(22deg) scale(0.93); filter: blur(3px); }
  40% { transform: rotate(-18deg) scale(0.9); filter: blur(2.6px); }
  60% { transform: rotate(14deg) scale(0.93); filter: blur(2px); }
  80% { transform: rotate(-8deg) scale(0.96); filter: blur(1px); }
  100% { transform: rotate(-26deg) scale(0.88); filter: blur(2px); }
}
@keyframes dr-tumble { 
  0% { transform: rotate(-44deg) scale(0.86); filter: blur(3px); }
  25% { transform: rotate(38deg) scale(0.92); filter: blur(4.5px); }
  50% { transform: rotate(-32deg) scale(0.88); filter: blur(4px); }
  75% { transform: rotate(26deg) scale(0.92); filter: blur(3.5px); }
  100% { transform: rotate(-44deg) scale(0.86); filter: blur(3px); }
}
@keyframes dr-tumble-t1 { 
  0% { transform: rotate(-6deg) scale(0.97); opacity: 0.11; }
  25% { transform: rotate(-44deg) scale(0.92); opacity: 0.07; }
  50% { transform: rotate(20deg) scale(0.94); opacity: 0.1; }
  75% { transform: rotate(-10deg) scale(0.96); opacity: 0.07; }
  100% { transform: rotate(-6deg) scale(0.97); opacity: 0.11; }
}
@keyframes dr-tumble-t2 { 
  0% { transform: rotate(20deg) scale(0.94); opacity: 0.07; }
  25% { transform: rotate(-16deg) scale(0.93); opacity: 0.05; }
  50% { transform: rotate(40deg) scale(0.91); opacity: 0.07; }
  75% { transform: rotate(24deg) scale(0.93); opacity: 0.05; }
  100% { transform: rotate(20deg) scale(0.94); opacity: 0.07; }
}
@keyframes dr-flip { 
  0% { transform: scaleX(1) rotate(0deg) scale(1); filter: blur(0px); }
  16% { transform: scaleX(0) rotate(7deg) scale(0.92); filter: blur(1.5px); }
  33% { transform: scaleX(-1) rotate(-5deg) scale(0.91); filter: blur(0.5px); }
  50% { transform: scaleX(0) rotate(4deg) scale(0.93); filter: blur(1.5px); }
  67% { transform: scaleX(1) rotate(-3deg) scale(0.96); filter: blur(0.4px); }
  84% { transform: scaleX(0) rotate(2deg) scale(0.98); filter: blur(1px); }
  100% { transform: scaleX(1) rotate(0deg) scale(1); filter: blur(0px); }
}
@keyframes dr-wobble { 
  0% { transform: skewX(-16deg) scale(0.92); filter: blur(2px); }
  25% { transform: skewX(14deg) scale(0.95); filter: blur(3px); }
  50% { transform: skewX(-11deg) scale(0.93); filter: blur(2.5px); }
  75% { transform: skewX(9deg) scale(0.96); filter: blur(1.5px); }
  100% { transform: skewX(-16deg) scale(0.92); filter: blur(2px); }
}
@keyframes dr-fade { 
  0% { transform: rotate(-10deg) scale(0.93); filter: blur(1.5px); opacity: 0.72; }
  25% { transform: rotate(8deg) scale(0.96); filter: blur(2.5px); opacity: 0.4; }
  50% { transform: rotate(-7deg) scale(0.94); filter: blur(2px); opacity: 0.66; }
  75% { transform: rotate(5deg) scale(0.96); filter: blur(1.5px); opacity: 0.44; }
  100% { transform: rotate(-10deg) scale(0.93); filter: blur(1.5px); opacity: 0.72; }
}
@keyframes dr-bounce { 
  0% { transform: translateY(0px) rotate(-6deg) scale(1.07, 0.93); }
  14% { transform: translateY(-5px) rotate(-2deg) scale(0.96, 1.05); }
  50% { transform: translateY(-15px) rotate(9deg) scale(1); }
  86% { transform: translateY(-5px) rotate(2deg) scale(0.96, 1.05); }
  100% { transform: translateY(0px) rotate(-6deg) scale(1.07, 0.93); }
}
@keyframes dr-shake { 
  0% { transform: translateX(-4px) rotate(-5deg); }
  25% { transform: translateX(3px) rotate(4deg); }
  50% { transform: translateX(-3px) rotate(-3deg); }
  75% { transform: translateX(4px) rotate(5deg); }
  100% { transform: translateX(-4px) rotate(-5deg); }
}
@keyframes dr-jelly { 
  0% { transform: scale(1.14, 0.86); }
  25% { transform: scale(0.92, 1.08); }
  50% { transform: scale(0.86, 1.14); }
  75% { transform: scale(1.08, 0.92); }
  100% { transform: scale(1.14, 0.86); }
}
@keyframes dr-orbit { 
  0% { transform: translate(7px, 0px) rotate(0deg); }
  25% { transform: translate(0px, 7px) rotate(90deg); }
  50% { transform: translate(-7px, 0px) rotate(180deg); }
  75% { transform: translate(0px, -7px) rotate(270deg); }
  100% { transform: translate(7px, 0px) rotate(360deg); }
}
@keyframes dr-glitch { 
  0% { transform: translate(0px, 0px); opacity: 1; }
  17% { transform: translate(3px, -1px) skewX(8deg); opacity: 0.75; }
  33% { transform: translate(-4px, 1px); opacity: 1; }
  50% { transform: translate(1px, 2px) skewX(-10deg); opacity: 0.55; }
  67% { transform: translate(-2px, -2px) scale(1.04); opacity: 1; }
  83% { transform: translate(4px, 0px) skewX(5deg); opacity: 0.8; }
  100% { transform: translate(0px, 0px); opacity: 1; }
}
@keyframes dr-land-bounce { 
  0% { transform: translateY(-16px); }
  38% { transform: translateY(0px) scale(1.14, 0.84); }
  58% { transform: translateY(-6px) scale(0.95, 1.05); }
  78% { transform: translateY(0px) scale(1.04, 0.96); }
  100% { transform: none; }
}
@keyframes dr-land-shake { 
  0% { transform: scale(1.2); }
  38% { transform: scale(0.9) translateX(3px); }
  52% { transform: scale(1.02) translateX(-3px); }
  70% { transform: translateX(1.5px); }
  100% { transform: none; }
}
@keyframes dr-land-jelly { 
  0% { transform: scale(1.22, 0.78); }
  28% { transform: scale(0.84, 1.16); }
  48% { transform: scale(1.09, 0.91); }
  68% { transform: scale(0.96, 1.04); }
  86% { transform: scale(1.02, 0.98); }
  100% { transform: none; }
}
@keyframes dr-land-orbit { 
  0% { transform: translate(9px, -9px) rotate(120deg) scale(0.82); }
  100% { transform: none; }
}
@keyframes dr-land-glitch { 
  0% { transform: translate(4px, 0px) skewX(12deg); opacity: 0.6; }
  20% { transform: translate(-4px, 1px); opacity: 1; }
  40% { transform: translate(2px, -1px) skewX(-8deg); opacity: 0.7; }
  60% { transform: translate(-1px, 0px); opacity: 1; }
  100% { transform: none; opacity: 1; }
}
@keyframes dr-gentle2 { 
  0% { transform: rotate(-15deg) translateY(0px) scale(1.04, 0.96); filter: blur(0.5px); }
  25% { transform: rotate(0deg) translateY(-6px) scale(0.98, 1.02); filter: blur(0.9px); }
  50% { transform: rotate(15deg) translateY(0px) scale(1.04, 0.96); filter: blur(0.5px); }
  75% { transform: rotate(0deg) translateY(-6px) scale(0.98, 1.02); filter: blur(0.9px); }
  100% { transform: rotate(-15deg) translateY(0px) scale(1.04, 0.96); filter: blur(0.5px); }
}
@keyframes dr-land-gentle { 
  0% { transform: rotate(-9deg) translateY(-7px); }
  55% { transform: rotate(3deg) translateY(0px) scale(1.05, 0.95); }
  78% { transform: rotate(-1deg) scale(0.98, 1.02); }
  100% { transform: none; }
}
@keyframes dr-wobble2 { 
  0% { transform: perspective(170px) rotateX(24deg) rotateY(0deg); }
  25% { transform: perspective(170px) rotateX(0deg) rotateY(24deg); }
  50% { transform: perspective(170px) rotateX(-24deg) rotateY(0deg); }
  75% { transform: perspective(170px) rotateX(0deg) rotateY(-24deg); }
  100% { transform: perspective(170px) rotateX(24deg) rotateY(0deg); }
}
@keyframes dr-land-wobble { 
  0% { transform: perspective(170px) rotateX(22deg) rotateY(0deg); }
  16% { transform: perspective(170px) rotateX(0deg) rotateY(17deg); }
  29% { transform: perspective(170px) rotateX(-13deg) rotateY(0deg); }
  40% { transform: perspective(170px) rotateX(0deg) rotateY(-10deg); }
  49% { transform: perspective(170px) rotateX(7deg) rotateY(0deg); }
  57% { transform: perspective(170px) rotateX(0deg) rotateY(5deg); }
  63% { transform: perspective(170px) rotateX(-3deg) rotateY(0deg); }
  68% { transform: perspective(170px) rotateX(0deg) rotateY(2deg); }
  72% { transform: perspective(170px) rotateX(1deg) rotateY(0deg); }
  100% { transform: perspective(170px) rotateX(0deg) rotateY(0deg); }
}
@keyframes dr-fade2 { 
  0% { opacity: 1; transform: translateY(0px) scale(1); }
  50% { opacity: 0.22; transform: translateY(-4px) scale(0.9); }
  100% { opacity: 1; transform: translateY(0px) scale(1); }
}
@keyframes dr-land-fade { 
  0% { opacity: 0; transform: scale(1.22); filter: brightness(1.9); }
  45% { opacity: 1; transform: scale(0.97); filter: brightness(1.35); }
  72% { transform: scale(1.02); filter: brightness(1.05); }
  100% { opacity: 1; transform: none; filter: none; }
}
@keyframes dr-spin2 { 
  0% { transform: rotate(0deg) scale(0.92); }
  50% { transform: rotate(180deg) scale(0.96); }
  100% { transform: rotate(360deg) scale(0.92); }
}
@keyframes dr-land-spin { 
  0% { transform: rotate(-200deg) scale(0.93); }
  72% { transform: rotate(9deg) scale(1.03); }
  88% { transform: rotate(-3deg); }
  100% { transform: none; }
}
@keyframes dr-shrinkout { 
  0% { transform: scale(1) rotate(0deg); }
  14% { transform: scale(1.1, 0.9) rotate(0deg); }
  32% { transform: scale(0.42) rotate(-14deg); }
  50% { transform: scale(0.48) rotate(10deg); }
  68% { transform: scale(0.38) rotate(-9deg); }
  84% { transform: scale(0.45) rotate(6deg); }
  100% { transform: scale(0.4) rotate(0deg); }
}
@keyframes dr-shrinkout-loop { 
  0% { transform: scale(0.42) rotate(-12deg); }
  50% { transform: scale(0.47) rotate(10deg); }
  100% { transform: scale(0.42) rotate(-12deg); }
}
@keyframes dr-land-shrinkout { 
  0% { transform: scale(0.4); }
  36% { transform: scale(1.24, 1.16); }
  52% { transform: scale(0.86, 1.14); }
  68% { transform: scale(1.09, 0.92); }
  84% { transform: scale(0.97, 1.03); }
  100% { transform: none; }
}
@keyframes dr-drift1 { 
  0% { transform: translateX(-40%) rotate(-5deg); }
  50% { transform: translateX(36%) rotate(6deg); }
  100% { transform: translateX(-40%) rotate(-5deg); }
}
@keyframes dr-drift2 { 
  0% { transform: translateX(32%) rotate(7deg); }
  50% { transform: translateX(-30%) rotate(-6deg); }
  100% { transform: translateX(32%) rotate(7deg); }
}
@keyframes dr-pulse { 
  0%, 100% { box-shadow: 0 0 6px var(--g1),0 0 13px var(--g2); }
  50% { box-shadow: 0 0 11px var(--g1),0 0 24px var(--g2); }
}
@keyframes dr-glint { 
  0%, 80%, 100% { opacity: 0; transform: scale(0.15) rotate(-15deg); }
  87% { opacity: 1; transform: scale(1) rotate(0deg); }
  94% { opacity: 0; transform: scale(0.3) rotate(15deg); }
}
@keyframes dr-hue { 
  0% { --dr-h: 0; }
  100% { --dr-h: 360; }
}
.dr-die { will-change: transform; transition: box-shadow 0.2s, border-color 0.2s, background 0.2s; }
