@import url('https://api.fontshare.com/v2/css?f[]=satoshi@400,500,700,900&display=swap');
/* ACSM brand tokens, taken from acsm.org (Elementor kit): primary #212621, accent #53C8E9, purple #754DB4, lime #D4FA21, blue #007DB3.
   acsm.org uses the licensed "tenon" typeface (Adobe Fonts kit); Satoshi is the fallback when the kit is not licensed for this domain. */
:root{
  --ink:#212621; --ink-2:#54595F; --ink-3:#6B6B6B; --line:#DADADA; --line-soft:#ECEDEC;
  --bg:#FFFFFF; --bg-soft:#F5F6F5; --bg-dark:#212621; --bg-darker:#101110;
  --cyan:#53C8E9; --cyan-soft:#73C5E4; --blue:#007DB3; --purple:#754DB4; --purple-deep:#583282;
  --lime:#D4FA21; --green:#4C8113; --red:#B3261E; --amber:#B26A00;
  --font:'tenon','Satoshi',system-ui,-apple-system,'Segoe UI',sans-serif;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
  --t-xs:.75rem;--t-sm:.875rem;--t-base:1rem;--t-lg:1.125rem;--t-xl:1.375rem;--t-2xl:2rem;--t-3xl:clamp(2.25rem,4.5vw,3.75rem);
  --radius:0px; /* acsm.org uses square buttons and cards */
  --shadow:0 1px 2px rgba(33,38,33,.06),0 4px 14px rgba(33,38,33,.06);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:var(--t-base);line-height:1.55;color:var(--ink);background:var(--bg)}
h1,h2,h3,h4,h5{font-family:var(--font);font-weight:700;line-height:1.1;margin:0 0 var(--s3);letter-spacing:-.01em}
h1{font-size:var(--t-3xl);font-weight:900} h2{font-size:var(--t-2xl)} h3{font-size:var(--t-xl)} h4{font-size:var(--t-lg)}
p{margin:0 0 var(--s4)} a{color:var(--blue)} a:hover{color:var(--purple)}
img{max-width:100%}
:focus-visible{outline:3px solid var(--purple);outline-offset:2px}
.num{font-variant-numeric:tabular-nums lining-nums}
.eyebrow{font-size:var(--t-sm);font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--blue)}
.container{width:min(1200px,100% - 2*var(--s5));margin-inline:auto}
/* buttons: cyan fill, dark text, 2px border, square corners (as on acsm.org) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);font:700 var(--t-base)/1.2 var(--font);padding:12px 22px;border:2px solid var(--cyan);background:var(--cyan);color:var(--ink);border-radius:var(--radius);cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.btn:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn-outline{background:transparent;border-color:var(--ink);color:var(--ink)} .btn-outline:hover{background:var(--ink);color:#fff}
.btn-dark{background:var(--ink);border-color:var(--ink);color:#fff} .btn-dark:hover{background:var(--purple);border-color:var(--purple)}
.btn-purple{background:var(--purple);border-color:var(--purple);color:#fff} .btn-purple:hover{background:var(--purple-deep);border-color:var(--purple-deep)}
.btn-sm{padding:8px 14px;font-size:var(--t-sm)} .btn-block{display:flex;width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed}
/* surfaces */
.card{background:#fff;border:1px solid var(--line);padding:var(--s5)}
.card.raise{box-shadow:var(--shadow)}
.badge{display:inline-block;font-size:var(--t-xs);font-weight:700;padding:3px 8px;background:var(--bg-soft);color:var(--ink);border:1px solid var(--line);letter-spacing:.02em}
.badge.ok{background:#E6F4D7;border-color:#B9DB93;color:#2F5B07}
.badge.warn{background:#FFF1D6;border-color:#EBC77A;color:#7A4A00}
.badge.bad{background:#FBE4E2;border-color:#EBB0AB;color:#8A1C14}
.badge.info{background:#DDF3FA;border-color:#9ED9EE;color:#00587D}
.badge.purple{background:#ECE4F7;border-color:#C8B3E6;color:#4A2C80}
.badge.illus{background:#fff;border:1px dashed var(--ink-3);color:var(--ink-3)}
/* forms */
label{display:block;font-weight:700;font-size:var(--t-sm);margin-bottom:var(--s1)}
input,select,textarea{font:inherit;width:100%;padding:10px 12px;border:1px solid #8a8f8a;border-radius:0;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:3px solid var(--cyan);outline-offset:0;border-color:var(--ink)}
.field{margin-bottom:var(--s4)} .hint{font-size:var(--t-sm);color:var(--ink-3)}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--purple)}
/* tables */
table{width:100%;border-collapse:collapse;font-size:var(--t-sm)}
th{text-align:left;font-weight:700;padding:10px 12px;border-bottom:2px solid var(--ink);white-space:nowrap}
td{padding:10px 12px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
tbody tr:hover{background:var(--bg-soft)}
td.r,th.r{text-align:right}
.table-wrap{overflow-x:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.prototype-bar{background:var(--lime);color:var(--ink);font-size:var(--t-sm);font-weight:700;text-align:center;padding:6px 12px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
