/* The Lighthouse and Chart Room (School Launch Trigonometry side path): the pictures inside each station. The shared engine
   styles are in /courses/shared/shop-game-v2/shop-game.css; this file only adds the chart room's picture pieces. 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:#172029;background:#ECEEE6}
.sg-app .sg-title{letter-spacing:.01em}
.lh-svg{display:block;width:100%;height:auto;margin:0 auto}
.lh-it{font-style:italic}
.lh-wrap{max-width:440px;margin:0 auto}
.lh-wrap.lh-wide{max-width:600px}
.lh-wrap.lh-sq{max-width:360px}
.lh-cap{margin:4px 0 10px;font-size:20px;font-weight:700;color:#172029;text-align:center;font-variant-numeric:tabular-nums}
.lh-note{margin:10px 0 0;font-size:16px;font-weight:700;color:#3E4A52;text-align:center}
.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))}
/* the logbook: ink on ruled chart paper */
.lh-log{background:#FBF6EA;border:2px solid #5E3B22;border-left:10px solid #5E3B22;border-radius:10px;padding:12px 18px 14px;color:#172029;max-width:640px;margin:0 auto;background-image:repeating-linear-gradient(transparent 0 33px,#DCE5E1 33px 34px)}
.lh-log-title{font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#1F4E66;margin-bottom:6px}
.lh-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.lh-lines li{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;border-bottom:1px dashed #C3CBC6;padding-bottom:6px}
.lh-lines li:last-child{border-bottom:0}
.lh-move{flex:0 1 150px;font-size:15px;font-weight:700;color:#1F4E66}
.lh-res{flex:1 1 260px;font-size:20px;font-weight:700;color:#172029;font-variant-numeric:tabular-nums}
.lh-log-note{margin:10px 0 0;font-size:15px;color:#3E4A52}
@media (max-width:560px){
  .lh-cap{font-size:17px}
  .lh-res{font-size:17px}
  .lh-move{flex-basis:100%}
}