/* student-common: ONE look for the signed-in student pages (round 2, lane CONSIST).
   Load after tokens, app.css and shell.css, before the page css. No content max width here: shell.css decides it. */

/* page frame: one top spacing, pages fill the content area, left aligned */
.app-content{padding-top:var(--s-7)}
.s12,.g13,.s14,.acct,.s18,.s19,.ds8 .stack{width:100%;margin:0;padding:0;color:var(--color-body)}

/* heading block: no eyebrow pill, h1 2xl, lede 62ch, then the content */
.app-content h1,.ds5-welcome{margin:0 0 var(--s-2);font-family:var(--font-head);font-size:var(--t-2xl);font-weight:800;line-height:1.15;color:var(--color-ink);letter-spacing:0}
.sc-lede,.s12 .lede,.g13 .lead,.s14 .sub,.s19 .sub,.acct .acct-lede,.ds8 .lead .lede{margin:0 0 var(--s-6);max-width:62ch;font-size:var(--t-base);line-height:1.55;color:var(--color-muted)}
.s12 .lede,.ds8 .lead .lede{color:var(--color-body)}
.ds5-welcome{margin-bottom:var(--s-5)}

/* narrow reading and form pages: 720px, left aligned beside the menu */
.s12,.acct,.s18,.s19-done,.s14-done,.ds8 .stack{max-width:720px}

/* card: radius, 1px border, the token shadow, padding s-5 */
.s12-card,.g13-item,.g13-box,.s14-hero,.s14-box,.s14-done,.s14-mail,.s14-stats .st,.acct-card,.s18-course,.s18-box,.s19-box,.ds8 .card,.ds8 .steps li{
  background:var(--color-card);border:1px solid var(--color-line);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--s-5)}
.s14-hero,.s18-course{background:#fffaf6;border-left:4px solid var(--color-accent)}
.ds8 .lead{border-left:4px solid var(--color-accent)}
.s14-stats .st{padding:var(--s-3) var(--s-4)}

/* buttons: primary = .btn-primary, secondary = .btn-ghost (also .btn-line), text link = .btn-text / plain link */
.btn-line,.s14 .btn-ghost,.acct .btn-line{background:transparent;color:var(--color-accent-text);border:1.5px solid var(--color-line);cursor:pointer;text-decoration:none}
.btn-line:hover,.btn-ghost:hover{border-color:var(--color-accent-text);text-decoration:none}
.btn-text{background:none;border:0;color:var(--color-accent-text);font-weight:700;cursor:pointer}
button.btn{font-family:var(--font-head);cursor:pointer}

/* section spacing */
.app-content h2{margin-top:0}
.s12-card + .s12-card,.acct-card,.s18-box,.s14-box{margin-bottom:var(--s-5)}

@media(max-width:720px){
  .app-content h1,.ds5-welcome{font-size:var(--t-xl)}
  .s12-card,.g13-item,.g13-box,.s14-hero,.s14-box,.s14-done,.s14-mail,.acct-card,.s18-course,.s18-box,.s19-box,.ds8 .card,.ds8 .steps li{padding:var(--s-4)}
}