@font-face { font-family: "Carey Type"; src: url("/fonts/carey-type-webfont.woff2") format("woff2"), url("/fonts/carey-type-webfont.woff") format("woff"); font-display: swap; }
/* mobile.muggstech.net (Sean, Oct 30): the course as a phone app, built for
   reading. Solid backgrounds behind all text, full-width reading, larger type
   and looser lines, buttons sized for a thumb. Only the mobile pages load it. */
body.m { margin: 0; background: #1F3D2B; color: #F5F1E8; font: 1.08rem/1.6 "Atkinson Hyperlegible", "Segoe UI", system-ui, sans-serif; -webkit-text-size-adjust: 100%; }
body.m .board, body.m .bb-board { display: none !important; }
.m-main { max-width: 640px; margin: 0 auto; padding: calc(16px + env(safe-area-inset-top)) 16px 96px; }
.m-head { display: flex; gap: 14px; align-items: center; margin: 8px 0 20px; }
.m-head img { border-radius: 12px; }
.m-head h1 { margin: 0; font-family: "Carey Type", Impact, sans-serif; font-weight: 400; font-size: 2rem; line-height: 1; text-transform: uppercase; color: #F5F1E8; }
.m-head p { margin: .2rem 0 0; color: #D4A017; font-size: .95rem; }
.m-save { background: #0D2818; border: 2px solid #D4A017; border-radius: 10px; padding: 14px; margin: 0 0 22px; }
.m-big { width: 100%; min-height: 54px; font: 700 1.1rem "Atkinson Hyperlegible", system-ui, sans-serif; color: #1B1B1B; background: #D4A017; border: 0; border-radius: 8px; cursor: pointer; }
.m-big:disabled { opacity: .7; }
.m-note { margin: .6rem 0 0; font-size: .95rem; color: #E8E2D2; }
.m-bar { margin-top: .6rem; height: 10px; background: #1F3D2B; border-radius: 5px; overflow: hidden; }
.m-bar i { display: block; height: 100%; width: 0; background: #D4A017; transition: width .2s; }
.m-week { margin: 0 0 12px; background: #0D2818; border-radius: 10px; }
.m-week summary { list-style: none; cursor: pointer; padding: 14px 16px; font: 700 1.15rem "Atkinson Hyperlegible", system-ui, sans-serif; display: flex; justify-content: space-between; }
.m-week summary::-webkit-details-marker { display: none; }
.m-week summary::after { content: "+"; color: #D4A017; font-size: 1.4rem; line-height: 1; }
.m-week[open] summary::after { content: "−"; }
.m-days { list-style: none; margin: 0; padding: 0 12px 12px; display: grid; gap: 12px; }
.m-day { background: #F3EEE2; color: #1B1B1B; border-radius: 10px; padding: 12px 14px 14px; }
.m-when { margin: 0; font: 500 .8rem "IBM Plex Mono", monospace; letter-spacing: .06em; text-transform: uppercase; color: #C2622F; }
.m-day h3 { margin: .15rem 0 .6rem; font-size: 1.15rem; line-height: 1.3; }
.m-go { display: grid; gap: 8px; }
.m-btn { display: grid; grid-template-columns: 5.2rem 1fr; align-items: center; gap: 10px; min-height: 52px; padding: 8px 12px; background: #fff; color: #1B1B1B; border: 2px solid #1B1B1B; border-radius: 8px; text-decoration: none; }
.m-btn b { font-size: 1.05rem; }
.m-btn span { font-size: .92rem; color: #5A5A52; line-height: 1.3; }
.m-btn.bench { background: #F5E3A6; }
.m-fine { margin: 20px 0 0; font-size: .9rem; color: #E8E2D2; }
.m-btn-s { min-height: 44px; padding: 0 18px; font: 700 1rem "Atkinson Hyperlegible", system-ui, sans-serif; background: #D4A017; color: #1B1B1B; border: 0; border-radius: 8px; }
body.m .codes { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 12px; }
body.m .code-row { background: #F3EEE2; color: #1B1B1B; border-radius: 10px; padding: 12px 14px; border: 0; }

/* Readings in the app: the rules phone.css applies under 700px, at any width. */
body.read.m main { max-width: 680px; padding: 4rem 0 6rem; gap: 14px; }
body.read.m .rkick { padding: 0 16px; font-size: .78rem; }
body.read.m .rpage, body.read.m .rpage.act, body.read.m .rpage:has(> .rtry) { grid-template-columns: minmax(0, 1fr); }
body.read.m .rtext, body.read.m .rtry { position: static; height: auto; max-height: none; border-left: 0; border-right: 0; box-shadow: none; padding: 1.1rem 16px 1.3rem; font-size: 1.12rem; line-height: 1.65; }
body.read.m .text-title { font-size: 1.55rem; line-height: 1.1; }
body.read.m .bench-back { position: absolute; }
body.m .bb { padding-bottom: 6rem !important; }

/* Benches on a phone (audit Oct 30: every bench fits; only these were small). */
body.m .jk-tab { min-width: 44px; min-height: 44px; }
body.m .jk-code { overflow-x: auto; -webkit-overflow-scrolling: touch; }
body.m [class$="-mini"], body.m [class*="-mini "], body.m [class$="-crumb"], body.m [class*="-crumb "] { min-height: 40px; padding-top: .45rem; padding-bottom: .45rem; }
body.m .bb input[type="text"], body.m .bb input:not([type]) { min-height: 40px; font-size: 16px; }
body.m .jk-btn, body.m .jk-choice, body.m .jk-chip, body.m [class*="-side-item"], body.m [class*="-choice"], body.m .bb input { min-height: 44px; }
body.m .jk-chip { min-width: 44px; }
/* Tap-a-symbol jobs: a lone "/" or "{" gets a thumb-size target. */
body.m .jk-tok { min-width: 30px; min-height: 40px; padding-left: 6px; padding-right: 6px; }
body.m .jk-refbtn { min-height: 44px; }

/* "Put it on your home screen" link and page: hidden once the app is on the home screen. */
.m-install { display: block; margin: 0 0 20px; color: #D4A017; font-weight: 700; text-decoration: none; min-height: 44px; line-height: 44px; }
@media (display-mode: standalone) { .m-install[href="/add"] { display: none; } }
.m-how { background: #F3EEE2; color: #1B1B1B; border-radius: 10px; padding: 14px 16px; margin: 0 0 14px; }
.m-how h2 { margin: 0 0 .5rem; font-size: 1.15rem; }
.m-how ol, .m-how ul { margin: 0; padding-left: 1.3rem; }
.m-how li { margin: .45rem 0; }
.m-how .m-note { color: #5A5A52; }
.m-refresh { margin-left: auto; width: 48px; height: 48px; border-radius: 50%; border: 2px solid #D4A017; background: #0D2818; color: #D4A017; font-size: 1.5rem; line-height: 1; cursor: pointer; }
/* Download the course sits at the bottom of the home page (Sean, Oct 30). */
.m-save { margin-top: 22px; }
/* The Phone check card at the top of the home page (Sean, Oct 30). */
.m-check { background: #F5E3A6; color: #1B1B1B; border-radius: 10px; padding: 14px 16px; margin: 0 0 16px; }
.m-check h2 { margin: 0 0 .3rem; font-size: 1.2rem; }
.m-check p { margin: 0 0 .7rem; }
.m-check-go { display: grid; place-items: center; text-decoration: none; }
/* The I Do questions in the phone app: the day's I Do bench (IDO-<code>) under the passage, with its claim code. */
body.read.m .m-ido { margin-top: 4px; }
body.read.m .m-ido .bb { min-height: 0; padding: 12px 16px 24px !important; }