/* The Clockmaker’s Shop (School Launch Algebra II 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 workshop'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:#1E1A16;background:#F2EADB}
.sg-app .sg-title{letter-spacing:.01em}
.ck-svg{display:block;width:100%;height:auto;max-width:640px;margin:0 auto}
.ck-gridwrap{max-width:400px;margin:0 auto}
.ck-gridwrap.ck-tri{max-width:340px}
.ck-grid{max-width:400px}
.ck-nlwrap{margin:4px 0}
.ck-nl-small{display:block;width:100%;max-width:300px;height:auto}
.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))}
.ck-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ck-center{justify-content:center;text-align:center}
.ck-cap{margin:0 0 10px;font-size:22px;font-weight:700;color:#1F1A15;text-align:center;font-variant-numeric:tabular-nums}
.ck-note{margin:10px 0 0;font-size:17px;font-weight:700;color:#4D4239;text-align:center}
.ck-hl{background:#F3E0A8;padding:2px 10px;border-radius:10px;border:2px solid #6B4A08;color:#1F1A15}
/* the slate: chalk on a dark slate board */
.ck-slate{background:#2F3B3A;border:6px solid #8C6A3E;border-radius:14px;padding:12px 18px 14px;color:#F4F1E8;box-shadow:inset 0 0 0 2px #1C1712;max-width:640px;margin:0 auto}
.ck-slate-title{font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#D9E2D6;margin-bottom:6px}
.ck-slate-big{margin:4px 0 8px;font-size:26px;font-weight:700;color:#FFFFFF;font-variant-numeric:tabular-nums}
.ck-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ck-lines li{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;border-bottom:1px dashed #6E7F7C;padding-bottom:6px}
.ck-lines li:last-child{border-bottom:0}
.ck-move{flex:0 1 240px;font-size:15px;font-weight:700;color:#D9E2D6}
.ck-res{font-size:22px;font-weight:700;color:#FFFFFF;font-variant-numeric:tabular-nums}
.ck-chalk-note{margin:10px 0 0;font-size:15px;color:#D9E2D6}
/* systems: the key to the two lines */
.ck-key{display:inline-flex;align-items:center;gap:6px;font-size:18px;font-weight:700;color:#1F1A15;background:#FFFDF6;border:2px solid #CDBEA6;border-radius:999px;padding:4px 12px;margin-bottom:8px}
.ck-swatch{display:inline-block;width:22px;height:5px;border-radius:3px}
.ck-sw-red{background:#A8441C}.ck-sw-blue{background:#24496A}
/* exponents written out factor by factor */
.ck-facrow{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px 4px}
.ck-fac{display:inline-block;min-width:26px;padding:2px 6px;border-radius:8px;background:#F0C29A;border:2px solid #8A3410;color:#1F1A15;font-size:19px;font-weight:700;text-align:center}
.ck-fac-b{background:#CFDCE6;border-color:#24496A}
.ck-cancel{position:relative;opacity:.55}
.ck-cancel::after{content:"";position:absolute;left:-2px;right:-2px;top:48%;height:3px;background:#1F1A15;transform:rotate(-24deg)}
.ck-dot,.ck-op{font-size:20px;font-weight:700;color:#1F1A15}
.ck-op{margin:0 8px}
.ck-frac{display:inline-flex;flex-direction:column;align-items:center;gap:6px;width:100%}
.ck-bar{height:3px;width:min(100%,420px);background:#1F1A15;border-radius:2px}
/* the box method */
.ck-area{margin:0 auto;border-collapse:separate;border-spacing:4px;font-size:22px;font-weight:700;color:#1F1A15;font-variant-numeric:tabular-nums}
.ck-area th{padding:6px 14px;color:#4D4239;font-size:20px}
.ck-area td{min-width:84px;height:62px;text-align:center;border:3px solid #1C1712;border-radius:8px;padding:4px 10px}
.ck-a1{background:#F0C29A}.ck-a2{background:#EBD397}.ck-a3{background:#C6DDB0}
.ck-corner{color:#4D4239}
/* factor pairs */
.ck-pairs{margin:0 auto;border-collapse:collapse;font-size:18px;font-weight:700;color:#1F1A15;font-variant-numeric:tabular-nums}
.ck-pairs th,.ck-pairs td{padding:5px 14px;border:2px solid #CDBEA6;text-align:center}
.ck-pairs th{background:#F3E9D6}
.ck-pairs tr.ck-hit td{background:#C6DDB0;border-color:#2E5824}
/* perfect squares */
.ck-sq{display:inline-block;min-width:44px;padding:6px 8px;border-radius:10px;border:2px solid #CDBEA6;background:#FFFFFF;color:#1F1A15;font-size:19px;font-weight:700;text-align:center}
.ck-sq-also{border-color:#24496A;background:#E6EEF4}
.ck-sq-on{border-color:#8A3410;background:#F0C29A;border-width:3px}
@media (max-width:560px){
  .ck-cap{font-size:19px}
  .ck-res{font-size:19px}
  .ck-area td{min-width:64px;height:52px}
  .ck-area{font-size:19px}
  .ck-nlwrap svg text{font-size:21px}
}
/* clockmaker additions */
.ck-gridwrap.ck-small{max-width:300px}
.ck-svg.ck-gears{max-width:560px}
.ck-note .ck-hl{display:inline-block;white-space:nowrap}
.ck-sw-grey{background:#4A4038}
/* synthetic division */
.ck-syn{margin:0 auto;border-collapse:collapse;font-size:21px;font-weight:700;color:#1F1A15;font-variant-numeric:tabular-nums}
.ck-syn td,.ck-syn th{min-width:52px;height:42px;padding:2px 8px;text-align:center}
.ck-syn tr:last-child td{border-top:3px solid #1C1712}
.ck-syn-a{border-right:3px solid #1C1712;color:#24496A;background:#E6EEF4;border-radius:8px 0 0 8px}
.ck-syn-mid{color:#4D4239}
.ck-syn-r{outline:3px solid #8A3410;outline-offset:-4px;background:#F0C29A;border-radius:6px}
/* powers ladder */
.ck-rung{display:inline-block;padding:6px 10px;border-radius:10px;border:2px solid #CDBEA6;background:#FFFFFF;color:#1F1A15;font-size:17px;font-variant-numeric:tabular-nums}
.ck-rung b{color:#24496A}
.ck-rung-on{border-color:#8A3410;background:#F0C29A;border-width:3px}
.ck-rung-t{border-style:dashed;border-color:#24584A;background:#C4DED3;font-weight:700}
.ck-svgwrap{max-width:600px;margin:0 auto}
.ck-svgwrap.ck-gearwrap{max-width:540px}
.ck-gridwrap .ck-svgwrap{max-width:none}
