[hidden]{display:none!important}
/* Site chrome for the non-module pages (home, dashboard, feedback, report, guide, course leader). Uses tokens from np.css. */
.topbar{background:var(--hero);color:var(--hero-ink)}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block:14px;flex-wrap:wrap}
.brand{font-family:var(--serif);font-weight:700;font-size:20px;color:var(--hero-ink);text-decoration:none}
.brand small{display:block;font-family:var(--sans);font-weight:500;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#C9A84C}
.topnav{display:flex;gap:6px;flex-wrap:wrap}
.topnav a,.topnav button{font:inherit;font-size:14px;color:#C9D6D5;background:transparent;border:1px solid #3B4D4F;border-radius:8px;padding:6px 12px;text-decoration:none;cursor:pointer}
.topnav a[aria-current="page"]{background:#C9A84C;border-color:#C9A84C;color:#1E2D2F;font-weight:600}
.page{padding-block:36px 72px;display:flex;flex-direction:column;gap:28px}
.lead{font-size:19px;color:var(--muted);max-width:62ch}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column;gap:14px;min-width:0}
.form{display:grid;gap:12px;max-width:460px}
.form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px}
.form input,.form select,select.inp,input.inp{font:inherit;font-size:16px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.err{color:var(--rust);font-size:14px}
.ok{color:var(--teal);font-size:14px}
.modgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.mod{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px}
.mod:hover{border-color:var(--teal)}
.mod .n{font-family:var(--serif);font-size:34px;font-weight:700;color:var(--teal);line-height:1}
.mod h3{font-size:20px}
.mod p{font-size:15px;color:var(--muted)}
.badges{display:flex;gap:6px;flex-wrap:wrap}
.badge{font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;background:var(--line);color:var(--ink)}
.badge.on{background:var(--teal);color:#fff}
.progress{height:10px;background:var(--line);border-radius:99px;overflow:hidden}
.progress i{display:block;height:100%;background:var(--teal);width:0;transition:width .4s}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.features div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:6px}
.features h3{font-size:18px}
.features p{font-size:15px;color:var(--muted)}
.notice{font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:12px;max-width:80ch}

.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.toolbar select{max-width:100%;min-width:0;flex:1 1 220px}
select{max-width:100%}
.typing{color:var(--muted);font-size:14px}
.counter{font-size:13px;color:var(--muted)}
.btn.ghost{background:transparent;color:var(--teal);border:1px solid var(--teal)}
.small{font-size:14px;color:var(--muted)}

/* access + report list */
.access{display:flex;flex-direction:row;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between}
.access b{font-family:var(--serif);font-size:28px;color:var(--teal)}
.access.warn b{color:var(--rust)}
.rlist{display:flex;flex-direction:column;gap:8px}
.rlist a{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--bg)}
.rlist a:hover{border-color:var(--teal)}
.rlist small{color:var(--muted);grid-column:1}
.rlist .level{grid-row:1/span 2;grid-column:2}

/* submission form */
.critbox{border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--bg)}
.critbox h3{font-size:18px}
.critbox p{font-size:15px;color:var(--muted)}
.critbox textarea{font:inherit;font-size:16px;line-height:1.5;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 12px;min-height:130px;resize:vertical;width:100%}
.critbox .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.critbox select{font:inherit;font-size:14px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px 8px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}

/* report */
.level{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:6px;padding:3px 8px;white-space:nowrap}
.level.L1{background:var(--rust-soft);color:var(--rust)}.level.L2{background:var(--gold-soft);color:var(--gold)}.level.L3{background:var(--teal-soft);color:var(--teal)}.level.L4{background:var(--teal);color:#fff}
.rhead{display:flex;flex-direction:row;padding-block:0;border:0;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:flex-start}
.rhead>div:first-child{flex:1 1 420px;min-width:0}
.rhead h1{font-size:clamp(28px,5vw,40px)}
.meta{font-size:14px;color:var(--muted)}
.overview{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.overview div{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:6px;background:var(--bg)}
.overview span{font-size:13px;color:var(--muted)}
.rcrit{display:flex;flex-direction:column;gap:12px}
.rcrit h2{display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap;font-size:24px}
.rcrit h3{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.rcrit ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.rcrit q{display:block;font-style:italic;color:var(--muted);font-size:15px;margin-top:2px}
.rcrit q::before,.rcrit q::after{content:""}
.revise{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.revise a,.revise div.read{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:8px;padding:10px 12px;background:var(--bg);font-size:15px}
.revise div.read{border-left-color:var(--gold)}
.revise small{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.revise span{color:var(--muted);font-size:14px}
.revise .read a{all:unset;color:var(--teal);font-weight:600;cursor:pointer;font-size:14px}
.calib{font-size:14px;color:var(--muted)}
.tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.tiles div{border-radius:10px;padding:10px 6px;text-align:center;font-size:13px;border:1px solid var(--line);color:var(--muted)}
.tiles div b{display:block;font-family:var(--serif);font-size:24px}
.tiles div.on{background:var(--teal-soft);border-color:var(--teal);color:var(--teal)}
.flag{border-left:4px solid var(--rust);background:var(--rust-soft);border-radius:8px;padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.flag.good{border-left-color:var(--teal);background:var(--teal-soft)}
.flag a{color:var(--teal);font-weight:600}
.review{border:2px solid var(--gold);border-radius:12px;padding:16px;background:var(--gold-soft);display:flex;flex-direction:column;gap:8px}
.disclaimer{font-size:13px;color:var(--muted)}
details.yourtext summary{cursor:pointer;font-weight:600}
details.yourtext pre{white-space:pre-wrap;font:inherit;font-size:15px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;margin-top:8px}

/* course leader */
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px}
table.adm{border-collapse:collapse;width:100%;font-size:14px;min-width:760px}
table.adm th,table.adm td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.adm th{background:var(--bg);font-weight:600}
table.adm button{font:inherit;font-size:13px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:6px;padding:3px 8px;cursor:pointer;margin:0 4px 4px 0}
.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tabs button{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:6px 14px;cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--teal);border-color:var(--teal);color:#fff}

/* guide */
.guide h2{margin-top:10px;scroll-margin-top:16px}
.guide p{max-width:72ch}

@media print{
  .topbar,.noprint,.lmsbar{display:none!important}
  body{background:#fff;color:#111}
  .page{padding:0;gap:14px}
  .panel,.critbox{border-color:#ccc}
  .revise>a,.revise>div,.rcrit li,.flag,.overview div,h2,h3{break-inside:avoid-page}
  h2,h3{break-after:avoid-page}
  a{color:#111}
  .revise>a::after{content:" (" attr(data-url) ")";font-size:11px;color:#555;word-break:break-all}
}
@media (max-width:640px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.panel{padding:16px}}
a.btn{text-decoration:none;display:inline-block}

/* certificate (end of each report) */
@font-face{font-family:"NL Signature";src:url("great-vibes.woff2") format("woff2");font-display:block} /* Great Vibes, SIL Open Font License 1.1 */
.certificate{margin-top:28px;display:flex;flex-direction:column;gap:10px}
.cert-in{background:#FFFDF8;color:#1E2D2F;border:2px solid #C9A84C;outline:8px solid #FFFDF8;box-shadow:0 0 0 10px #1E2D2F inset,0 0 0 12px #C9A84C inset;border-radius:6px;padding:56px 52px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.cert-brand{font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:#028090}
.cert-kind{font-family:var(--serif);font-size:clamp(28px,4.4vw,40px);font-weight:700;color:#1E2D2F;margin-top:6px}
.cert-small{font-size:14px;color:#5C6B6D;line-height:1.5}
.cert-name{font-family:var(--serif);font-size:clamp(30px,5vw,46px);font-weight:600;color:#028090;border-bottom:1px solid #E2DCD2;padding:4px 24px 10px;margin:4px 0 6px}
.cert-course{font-family:var(--serif);font-size:clamp(20px,3vw,26px);font-weight:600}
.cert-hours{font-size:15px;font-weight:600;color:#9A7A22}
.cert-desc{font-size:14.5px;color:#3C4A4C;max-width:62ch;line-height:1.6;margin-top:6px}
.cert-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;width:100%;margin-top:22px;text-align:left}
.cert-sign{min-width:240px}
.cert-signature{font-family:"NL Signature","Great Vibes","Snell Roundhand","Apple Chancery",cursive;font-size:44px;line-height:1;color:#1E2D2F;padding:0 6px}
.cert-line{border-top:1px solid #1E2D2F;width:260px;margin:4px 0 6px}
.cert-meta{display:flex;flex-direction:column;gap:4px;font-size:13.5px;color:#3C4A4C}
.cert-meta span{display:inline-block;min-width:104px;color:#5C6B6D}
.cert-id{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:#1E2D2F}
.cert-contact{font-size:12.5px;color:#5C6B6D;margin-top:18px;border-top:1px solid #E2DCD2;padding-top:12px;width:100%}
.cert-verify{font-size:14px;color:var(--muted);text-align:center}
@media (max-width:640px){.cert-in{padding:34px 20px}.cert-signature{font-size:36px}.cert-line{width:200px}.cert-foot{justify-content:center;text-align:center}.cert-meta span{min-width:0;margin-right:6px}}
@media print{.certificate{margin-top:0}.cert-in{box-shadow:0 0 0 10px #1E2D2F inset,0 0 0 12px #C9A84C inset;-webkit-print-color-adjust:exact;print-color-adjust:exact}}

.cert-steps{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.cert-steps li{font-size:16px;color:var(--muted)}
.cert-steps li.ok{color:var(--teal);font-weight:600}
.modstat{font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px}
.modstat.sent{background:var(--teal);color:#fff}.modstat.reply{background:var(--gold-soft);color:var(--gold)}
.final-card{border-left:6px solid var(--gold)}
/* course leader: learner detail */
.adm-detail{display:flex;flex-direction:column;gap:16px}
.ci{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:var(--bg);display:flex;flex-direction:column;gap:8px}
.ci h3{font-size:18px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ci .meta{font-size:13.5px}
.ci blockquote{margin:0;padding:8px 12px;border-left:3px solid var(--line);color:var(--ink);font-size:15px;white-space:pre-wrap}
.ci textarea,.finalbox textarea{font:inherit;font-size:15px;width:100%;min-height:80px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--surface);color:var(--ink)}
.finalbox{border:2px solid var(--gold);border-radius:14px;padding:16px 18px;background:var(--gold-soft);display:flex;flex-direction:column;gap:10px}
.mstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.mstats>div{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--bg);display:flex;flex-direction:column;gap:6px}
.mstats ul{margin:0;padding-left:18px;font-size:14px}

/* review: marking guide and suggestions */
.rv-crit{display:flex;flex-direction:column;gap:10px}
.rv-row{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--bg);display:flex;flex-direction:column;gap:6px}
.rv-head{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.rv-head select{max-width:200px}
.rv-desc{font-size:14.5px;color:var(--ink);border-left:3px solid var(--teal);padding-left:10px}
.rv-sg summary,.rv-guide summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--teal)}
.sg{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;border-bottom:1px dashed var(--line);padding:8px 0}
.sg p{font-size:14.5px;margin:0}
.sg span{display:flex;gap:6px;flex-shrink:0}
.sg button,.sg-all button{font:inherit;font-size:13px;border:1px solid var(--teal);background:var(--surface);color:var(--teal);border-radius:6px;padding:3px 9px;cursor:pointer}
.sg-all{padding-top:8px}
.rv-sg-overall{background:var(--teal-soft);border-radius:12px;padding:10px 14px}
.guide-tbl td{min-width:150px}

/* brand logo */
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:40px;height:40px;flex:none}
/* resubmission */
.resub{border:2px solid var(--rust);background:var(--rust-soft)}
.resub h2{margin-top:2px}
.resub .eyebrow{color:var(--rust)}
.resub.soft{border-color:var(--gold);background:var(--gold-soft)}
.resub.soft .eyebrow{color:var(--gold)}
.resub.done{border-color:var(--teal);background:var(--teal-soft)}
.badge.warnb{background:var(--rust);color:#fff}
.modstat.ask{background:var(--rust);color:#fff}
.capnote{border-left:4px solid var(--teal);background:var(--teal-soft);padding:12px 16px;border-radius:0 10px 10px 0}
.capnote p{margin-top:4px}
.resub-note{border:2px solid var(--gold);background:var(--gold-soft);border-radius:12px;padding:12px 16px;font-size:15px;line-height:1.55}
.resub-note details{margin-top:6px}
.rv-outcome{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:14px 0 6px}
.rv-outcome .small{flex:1 1 260px}
label.chk{display:flex;align-items:center;gap:8px;margin-top:6px;cursor:pointer}
label.chk input{width:18px;height:18px;accent-color:var(--rust)}
/* certificate logo */
.cert-logo{width:min(300px,70%);height:auto;margin-bottom:4px}
.ok-line{color:var(--teal);font-weight:600}
/* version 2: field-study badges, back-to-session link, continue card */
.modstat.fsb{background:var(--gold-soft);color:var(--gold);border-color:var(--gold)}
.mod .mod-dom{margin-top:6px;font-size:13.5px}
.backto{margin:22px 0 -6px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.backto .btn{text-decoration:none}
.resume-card{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin-top:18px}
.resume-card h2{font-size:20px;flex:1;min-width:220px;margin:0}
.resume-card .eyebrow{flex-basis:100%;margin:0}
.resume-card .btn{text-decoration:none}

/* copyright and trademark notice */
.ipfoot{max-width:860px;margin:48px auto 0;padding:18px 0 8px;border-top:1px solid var(--line);font-size:13px;line-height:1.55;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.ipfoot p{margin:0;max-width:none}
.cert-ip{font-size:10.5px;color:#6B7678;margin-top:6px}
@media print{.ipfoot{margin-top:18px;font-size:9pt}}
@media print{body:has(.certificate) .ipfoot{display:none}}

.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em}
.inv-form{margin:10px 0 16px}
.inv-text{width:100%;margin-top:10px;font-size:14px}