/* The Masons' Lodge (School Launch Geometry side path): the figures inside each station. The shared engine styles are
   in /courses/shared/shop-game-v2/shop-game.css; this file only adds the lodge's picture pieces and the streak pill.
   No style attributes anywhere. Every text color here keeps at least 4.5:1 contrast on the background it sits on. */
.noscript{font:18px Georgia,serif;padding:24px;color:#1E1B17;background:#EEE8DC}
.sg-app .sg-title{letter-spacing:.01em}
.fg-svg{display:block;width:100%;height:auto;max-width:460px;margin:0 auto}
#sg-visual .fg-svg{max-width:460px}
#sg-visual .fg-svg.fg-wide{max-width:580px}
#sg-visual .fg-grid{max-width:400px}
.fg-gridwrap{max-width:400px;margin:0 auto}
.fg-grid{max-width:400px}
.sg-app .sg-choices{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.sg-app .sg-choices:not(.sg-choices-wide) .sg-choice{white-space:nowrap}
.sg-app .sg-choices-wide{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.fg-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fg-center{justify-content:center;text-align:center}
.fg-cap{margin:8px 0 0;font-size:21px;font-weight:700;color:#1E1B17;text-align:center;font-variant-numeric:tabular-nums}
.fg-note{margin:8px 0 0;font-size:16px;font-weight:700;color:#4A4239;text-align:center}
/* two lines on the grid: the key */
.fg-key{display:inline-flex;align-items:center;gap:6px;font-size:17px;font-weight:700;color:#1E1B17;background:#FFFDF6;border:2px solid #CFC3AE;border-radius:999px;padding:4px 12px;margin-top:8px}
.fg-swatch{display:inline-block;width:22px;height:5px;border-radius:3px}
.fg-sw-red{background:#A8441C}.fg-sw-blue{background:#24496A}
/* the streak, beside the stars */
.sg-pill.ml-streak{background:#E6DCC6;color:#1E1B17;font-weight:700}
@media (max-width:560px){
  .fg-cap{font-size:18px}
  .fg-note{font-size:15px}
}
