/* ============================================================
   Grade-set and Sources pages.
   Tokens, header, nav and footer come from /assets/site.css.
   ============================================================ */

:root{
  /* a narrower measure than the home page — these are dense reading pages */
  --frame:1000px; --gutter:20px;
  --gold:#c08a3e; --gold-tint:#faf3e3;
  --xw:#a2568f;
}
body{line-height:1.62;}
button,input{font-family:var(--face-body);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ---------- masthead ---------- */
.band-masthead{background:var(--paper);padding:64px 0 0;}
.band-masthead h1{
  font-family:var(--face-display);font-weight:400;
  font-size:clamp(2.1rem,4.4vw,54px);line-height:1.16;letter-spacing:-.02em;
  color:var(--ink);margin:20px 0 0;
}
.band-lede{margin:20px 0 0;font-size:17.5px;line-height:1.6;color:var(--muted-2);max-width:72ch;}
.band-lede strong{color:var(--ink);font-weight:700;}
.band-meta{
  margin:12px 0 0;font-family:var(--face-serif);font-weight:400;font-size:17px;
  color:var(--muted);letter-spacing:.02em;
}
.mastrules{margin-top:34px;border-top:1px solid var(--line-deep);border-bottom:3px solid var(--accent);height:6px;}

/* ---------- breadcrumb ---------- */
.crumbs{
  margin:26px 0 30px;font-family:var(--face-serif);font-size:17px;color:var(--muted);
}
.crumbs a{color:var(--accent);}
.crumbs a:hover{color:var(--accent-dark);}
.crumbs span[aria-hidden]{margin:0 8px;color:var(--muted-light);}

/* ---------- toolbar ---------- */
.toolbar{display:flex;gap:24px;flex-wrap:wrap;align-items:baseline;margin-bottom:8px;}
.toolbar input[type=search]{
  flex:1;min-width:240px;border:none;border-bottom:1px solid var(--line-deep);
  background:transparent;padding:9px 2px;font-size:16.5px;color:var(--ink);outline:none;
  transition:border-color .2s ease;
}
.toolbar input[type=search]::placeholder{color:var(--muted-light);}
.toolbar input[type=search]:focus{border-bottom-color:var(--accent);}
.viewtoggle{display:flex;gap:18px;}
.viewtoggle button{
  border:none;background:none;padding:3px 0;cursor:pointer;
  font-family:var(--face-serif);font-size:17px;font-weight:400;
  color:var(--muted);border-bottom:2px solid transparent;transition:color .2s ease;
}
.viewtoggle button:hover{color:var(--accent);}
.viewtoggle button.active{color:var(--accent);border-bottom-color:var(--accent);font-weight:700;}
.nores{margin:22px 0 0;font-size:17px;color:var(--muted);}

/* ---------- grade groups ---------- */
.gradeblock{scroll-margin-top:24px;}
.gradeblock.hidden{display:none;}
h2.gradehead{
  font-family:var(--face-serif);font-weight:600;
  font-size:30px;line-height:1.2;letter-spacing:-.02em;
  margin:54px 0 4px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;color:var(--ink);
}
h2.gradehead .chip{
  font-family:var(--face-body);font-weight:700;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);
  padding:2px 9px;border-radius:999px;
}
p.gradesub{color:var(--muted);font-size:16.5px;line-height:1.6;margin:0 0 18px;}

p.graderes{margin:0 0 24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.res-link{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--face-body);font-weight:700;font-size:15px;letter-spacing:.02em;
  color:var(--accent);border-bottom:1px solid rgba(191,77,105,.35);padding-bottom:2px;
  transition:gap .2s ease,color .2s ease,border-color .2s ease;
}
.res-link:hover{gap:13px;color:var(--accent-dark);border-bottom-color:var(--accent-dark);}
.res-link:focus-visible{outline:3px solid rgba(191,77,105,.35);outline-offset:4px;border-radius:3px;}
.res-hint{font-size:15px;color:var(--muted-light);}

/* ---------- standards ---------- */
.std{border-top:1px solid var(--line);}
.std.hidden{display:none;}
.std-head{
  display:flex;align-items:baseline;gap:18px;width:100%;
  padding:17px 4px;cursor:pointer;text-align:left;
  background:none;border:none;font-family:inherit;
}
.std-head:hover .std-title{color:var(--accent-dark);}
.std-head:focus-visible{outline:3px solid rgba(191,77,105,.35);outline-offset:-3px;border-radius:4px;}
.std-code{
  flex-shrink:0;font-family:var(--face-body);font-weight:700;font-size:13px;
  letter-spacing:.08em;color:var(--accent);min-width:74px;
}
.std-title{font-weight:300;font-size:17.5px;line-height:1.5;color:var(--ink);transition:color .2s ease;}
.std-caret{margin-left:auto;color:var(--muted-light);transition:transform .2s;flex-shrink:0;font-size:11px;align-self:center;}
.std.open .std-caret{transform:rotate(90deg);}
.std-body{display:none;padding:0 4px 24px 92px;}
.std.open .std-body{display:block;}
.std-body ul.elements{margin:2px 0 0;padding:0;list-style:none;}
.std-body ul.elements li{padding:4px 0 4px 32px;position:relative;font-size:16.5px;line-height:1.6;}
.std-body ul.elements li::before{
  content:"(" attr(data-letter) ")";position:absolute;left:2px;top:4px;
  color:var(--accent);font-family:var(--face-body);font-size:13px;font-weight:700;
}

/* ---------- panels ---------- */
.panel{padding:10px 0 4px 18px;margin-top:16px;font-size:16.5px;line-height:1.6;}
.panel .ptitle{
  font-family:var(--face-body);font-weight:700;font-size:11.5px;text-transform:uppercase;
  letter-spacing:.16em;margin-bottom:6px;color:var(--muted);
}
.panel.student{border-left:3px solid var(--accent);}
.panel.teacher{border-left:3px solid var(--gold);margin:0 0 20px;}
.panel.xwalk{border-left:3px solid var(--xw);}
body.view-student .panel.teacher{display:none;}
body.view-teacher .panel.student{display:none;}
body.view-student .panel.xwalk{display:none;}
.xw{padding:4px 0;font-size:16px;line-height:1.6;}
.xw a{color:var(--xw);border-bottom:1px solid rgba(162,86,143,.35);}
.xw a:hover{color:#8a4278;}
.xw-tag{
  display:inline-block;font-family:var(--face-body);color:var(--xw);border:1px solid #c79ab8;
  border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.08em;
  padding:1px 9px;margin-right:9px;text-transform:uppercase;
}

/* ---------- sources ---------- */
.srcblock{border-top:1px solid var(--line);padding:6px 0 16px;margin-bottom:10px;}
.srcblock:first-of-type{border-top:0;}
.srcblock .gradehead{margin:26px 0 6px;font-size:26px;}
ul.srclist{margin:12px 0 0 2px;padding:0;list-style:none;}
ul.srclist li{padding:5px 0 5px 22px;position:relative;font-size:16.5px;line-height:1.6;}
ul.srclist li::before{content:"\\2197";position:absolute;left:0;color:var(--accent);font-weight:700;}
ul.srclist a{color:var(--accent-dark);border-bottom:1px solid rgba(148,55,79,.3);}
ul.srclist a:hover{color:var(--accent);}

/* ---------- prev / next ---------- */
.band-next{
  display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  margin:72px 0 96px;padding-top:26px;border-top:1px solid var(--line-deep);
}
.bn{
  display:flex;flex-direction:column;gap:4px;
  background:var(--white);border:1px solid var(--line);border-radius:16px;
  padding:18px 24px;min-width:15rem;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.bn:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(83,43,54,.08);border-color:rgba(191,77,105,.5);}
.bn.next{text-align:right;}
.bn-k{
  font-family:var(--face-body);font-weight:700;font-size:11.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted-light);
}
.bn-t{font-family:var(--face-serif);font-weight:600;font-size:21px;color:var(--ink);}
.bn:hover .bn-t{color:var(--accent-dark);}

/* ---------- footer measure ---------- */
footer.site .page-frame{padding-top:64px;padding-bottom:56px;}

@media (max-width:720px){
  .band-masthead{padding-top:44px;}
  .crumbs{margin:20px 0 24px;font-size:15px;}
  h2.gradehead{font-size:24px;margin-top:42px;}
  .std-body{padding-left:6px;}
  .std-head{padding:15px 2px;}
  .band-next{margin:52px 0 72px;}
  .bn{min-width:0;flex:1 1 100%;}
  .bn.next{text-align:left;}
}