/* Public worksheet pages: the hub, the grade pages and the resource pages. The paper itself is in ws.css. */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-block;font-size:.82rem;font-weight:700;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px 12px;text-decoration:none}
a.chip:hover{border-color:var(--accent)}
.chip.free,.tag.free{color:#fff;background:var(--accent);border-color:var(--accent)}
.chip.prem,.tag.prem{color:var(--note-ink);background:var(--note);border-color:#C9B24A}
.tag.free,.tag.prem{justify-self:start}
.more h3{font-family:var(--display);font-weight:400;font-size:1.02rem;margin:8px 0 0;color:var(--muted)}
.more>p{margin:0}
.more>p a,.more .hint a,.unlock a:not(.btn){color:var(--accent)}
.cards a span+span{font-size:.8rem}
.grades{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.grade{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:grid;gap:8px;align-content:start}
.grade h3{margin:0;font-family:var(--display);font-weight:400;font-size:1.15rem;color:var(--ink)}
.gl{display:flex;justify-content:space-between;align-items:baseline;gap:10px;border:1px solid var(--line);border-radius:9px;padding:8px 12px;font-weight:700;text-decoration:none;color:var(--ink);background:var(--bg);min-height:44px}
a.gl{border-color:var(--accent);color:var(--accent)}
a.gl:hover{background:var(--accent-soft)}
.gl small{font-weight:400;color:var(--muted);font-size:.8rem}
.gl.soon{color:var(--muted);border-style:dashed}
.two{grid-template-columns:1fr;gap:18px}
@media(min-width:760px){.two{grid-template-columns:1fr 1fr}}
.tick,.steps{margin:6px 0 0;padding-left:1.2em;display:grid;gap:6px}
.tick{list-style:none;padding-left:0}
.tick li{padding-left:1.7em;position:relative}
.tick li::before{content:"";position:absolute;left:.2em;top:.45em;width:.6em;height:.32em;border-left:2.5px solid var(--accent);border-bottom:2.5px solid var(--accent);transform:rotate(-45deg)}
.wrap>section.paper,.wrap>.more{padding:20px 18px 18px}
.intro .chips{margin-top:2px}
.wsctl{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:6px}
.wsctl .school{flex:1 1 240px;max-width:360px}
.wsctl input{width:100%}
.sheet{display:block;min-width:0}
.sheet .wspaper{width:100%}
.memo{background:transparent}
.memo>summary{cursor:pointer;font-family:var(--display);font-size:1.15rem;color:var(--ink);background:var(--card);border-radius:10px;padding:12px 16px;box-shadow:0 10px 18px -14px rgba(40,20,0,.7);list-style:none;min-height:44px}
.memo>summary::-webkit-details-marker{display:none}
.memo>summary::before{content:"+";display:inline-block;width:1.2em;color:var(--accent);font-weight:700}
.memo[open]>summary::before{content:"\2212"}
.memo .wspaper{margin-top:12px}
/* a premium resource: a sample of the sheet that fades out, then the way in */
.teaser{position:relative;max-height:430px;overflow:hidden}
.teaser .wspaper{padding-bottom:40px}
.tz p{margin:0 0 8px;line-height:1.55}
.tzlabel{font-weight:700;font-size:.74rem!important;text-transform:uppercase;letter-spacing:.1em;color:#4f5753;margin-top:14px!important}
.teaser .fade{position:absolute;left:0;right:0;bottom:0;height:60%;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 85%);pointer-events:none}
@media(min-width:800px){.teaser .fade{background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 85%);max-width:794px;margin:0 auto}}
.unlock{display:grid;gap:12px;padding:20px 18px 20px}
.unlock p{margin:0;max-width:62ch}
@media print{
  body{background:#fff!important;padding:0!important;margin:0!important}
  .noprint,.intro,.promo,.more,.unlock,footer,.top,.crumbs{display:none!important}
  .wrap{display:block!important;max-width:none!important;margin:0!important}
  .sheet,.memo{display:block!important}
  body[data-print="stu"] #wsMemoBox,body[data-print="memo"] #wsStuBox{display:none!important}
  .memo>summary{display:none!important}
  .memo .wspaper{margin:0}
}