/* Layout: one working column, 62rem max. A navy masthead with four tabs; each tab is a single task
   (see what changed, study a teaching record, browse topics, find any change). */
:root{
  --bg:#F4F5F8; --surface:#FFFFFF; --surface-2:#ECEEF4; --ink:#1A1B3A; --ink-2:#4A4C69; --line:#D3D6E2;
  --mast:#1A1B3A; --mast-ink:#FFFFFF; --mast-ink-2:#C9CBE0;
  --teal:#3D6062; --teal-soft:#E2EDED; --burgundy:#721C24; --burgundy-soft:#F7E6E8;
  --ok:#1D6843; --ok-soft:#DFF1E6; --warn:#754E00; --warn-soft:#F8ECD0; --focus:#2B5FD9;
  --mark:rgba(26,27,58,.075);
  --display:"Source Serif 4",Georgia,"Times New Roman",serif;
  --body:"Atkinson Hyperlegible",Verdana,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",Consolas,"Courier New",monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#111228; --surface:#1B1C3B; --surface-2:#25274A; --ink:#F2F1F8; --ink-2:#C2C3DA; --line:#3B3D65;
    --mast:#0B0C1E; --mast-ink:#FFFFFF; --mast-ink-2:#C9CBE0;
    --teal:#A4CFD1; --teal-soft:#213A3C; --burgundy:#F3A9B0; --burgundy-soft:#47222A;
    --ok:#93DBB3; --ok-soft:#1B3A2A; --warn:#F2CB7E; --warn-soft:#41341A; --focus:#9DB8FF;
    --mark:rgba(242,241,248,.06);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#111228; --surface:#1B1C3B; --surface-2:#25274A; --ink:#F2F1F8; --ink-2:#C2C3DA; --line:#3B3D65;
  --mast:#0B0C1E; --mast-ink:#FFFFFF; --mast-ink-2:#C9CBE0;
  --teal:#A4CFD1; --teal-soft:#213A3C; --burgundy:#F3A9B0; --burgundy-soft:#47222A;
  --ok:#93DBB3; --ok-soft:#1B3A2A; --warn:#F2CB7E; --warn-soft:#41341A; --focus:#9DB8FF;
  --mark:rgba(242,241,248,.06);
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.6;margin:0;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
button,select,input,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.wrap{max-width:62rem;margin:0 auto;padding-inline:20px}

/* Content protection: no text selection outside form fields. */
main,.mast{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,select{-webkit-user-select:text;user-select:text}
.watermark{position:fixed;inset:0;pointer-events:none;z-index:50;background-repeat:repeat}
.noprint{display:none}
@media print{
  body>*{display:none!important}
  body>.noprint{display:block!important;font:16px/1.5 Georgia,serif;color:#000;padding:2rem}
}

.mast{background:var(--mast);color:var(--mast-ink)}
.mast .wrap{padding-block:22px 0}
.mast-top{display:flex;flex-wrap:wrap;gap:8px 16px;justify-content:space-between;align-items:center}
.brand{font-size:.85rem;letter-spacing:.09em;text-transform:uppercase;color:var(--mast-ink-2);margin:0}
.userbar{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-size:.9rem;color:var(--mast-ink-2);min-width:0}
.userbar span{overflow-wrap:anywhere}
.mastbtn{background:transparent;border:1px solid var(--mast-ink-2);color:var(--mast-ink);border-radius:6px;padding:.15rem .6rem;cursor:pointer;font-size:.9rem}
.mastbtn:hover{border-color:var(--mast-ink)}
.mast h1{font-family:var(--display);font-weight:700;font-size:clamp(1.6rem,4.5vw,2.25rem);line-height:1.15;margin:.2rem 0 .3rem;text-wrap:balance}
.mast .sub{color:var(--mast-ink-2);margin:0 0 1rem;max-width:46rem}
.tabs{display:flex;flex-wrap:wrap;gap:4px}
.tab{background:transparent;border:0;border-bottom:4px solid transparent;color:var(--mast-ink-2);padding:.6rem .95rem;cursor:pointer;font-weight:700;border-radius:6px 6px 0 0}
.tab:hover{color:var(--mast-ink)}
.tab[aria-selected="true"]{background:var(--bg);color:var(--ink);border-bottom-color:var(--bg)}
main{padding-block:28px 56px;min-height:50vh}
h2{font-family:var(--display);font-size:1.6rem;line-height:1.2;margin:0 0 .5rem;text-wrap:balance}
h3{font-family:var(--display);font-size:1.25rem;line-height:1.25;margin:0 0 .5rem;text-wrap:balance}
p{margin:0 0 .9rem;max-width:44rem}
.lead{font-size:1.1rem;color:var(--ink)}
.muted{color:var(--ink-2)}
.label{font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--ink-2);margin:0 0 .4rem}
.code{font-family:var(--mono);font-size:.95em;font-weight:600;white-space:nowrap}
.stack{display:flex;flex-direction:column;gap:22px}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:20px}
.panel.official{border-left:6px solid var(--teal)}
.panel.rce{border-left:6px solid var(--burgundy)}
.panel.drg{background:var(--surface-2)}
.notice{background:var(--warn-soft);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:14px 18px}
.error{color:var(--burgundy);font-weight:700}
ul,ol{margin:0 0 .9rem;padding-left:1.4rem;max-width:44rem}
li{margin:.3rem 0}
.chip{display:inline-block;font-size:.85rem;font-weight:700;padding:.12rem .6rem;border-radius:999px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);white-space:nowrap}
.chip.hi{background:var(--teal-soft);color:var(--teal);border-color:transparent}
.chip.rec{background:var(--burgundy-soft);color:var(--burgundy);border-color:transparent}
.chip.c-New{background:var(--ok-soft);color:var(--ok);border-color:transparent}
.chip.c-Deleted{background:var(--burgundy-soft);color:var(--burgundy);border-color:transparent}
.chip.c-Revised{background:var(--warn-soft);color:var(--warn);border-color:transparent}
.btn{background:var(--surface);border:2px solid var(--ink-2);border-radius:8px;padding:.5rem 1rem;cursor:pointer;font-weight:700}
.btn:hover{border-color:var(--ink)}
.btn.primary{background:var(--teal);border-color:var(--teal);color:var(--surface)}
.btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.small{padding:.3rem .7rem;font-size:.92rem}
.linkbtn{background:none;border:0;padding:0;color:var(--teal);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-align:left}
select,input[type="search"],input[type="email"],input[type="text"]{background:var(--surface);border:2px solid var(--ink-2);border-radius:8px;padding:.5rem .7rem;max-width:100%}
input[type="search"]{width:100%;font-size:1.1rem;padding:.7rem .9rem}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(17rem,100%),1fr));gap:18px}
.stat{display:flex;flex-wrap:wrap;gap:8px 22px;margin:.3rem 0 .6rem}
.stat button{background:none;border:0;padding:0;cursor:pointer;text-align:left}
.stat .n{font-family:var(--display);font-size:2.1rem;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;display:block}
.stat .w{font-size:.95rem;color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}
.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.98rem}
th,td{text-align:left;padding:.45rem .7rem .45rem 0;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;padding-right:0}
.item{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:8px;min-width:0}
.item h3{font-size:1.12rem;margin:0}
.item .meta{font-size:.95rem;color:var(--ink-2)}
.item p{margin:0}
.list{display:flex;flex-direction:column;gap:12px}
.filters{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:end}
.filters label{display:flex;flex-direction:column;font-size:.85rem;font-weight:700;color:var(--ink-2);gap:3px;min-width:0}
.filters label.check{flex-direction:row;align-items:center;gap:8px;font-size:1rem;color:var(--ink);font-weight:400}
.excerpt{background:var(--surface-2);border-radius:8px;padding:14px 18px;font-size:1rem}
.excerpt p{margin:0 0 .5rem;max-width:none}
.excerpt p:last-child{margin:0}
.opt{display:block;width:100%;text-align:left;background:var(--surface);border:2px solid var(--line);border-radius:8px;padding:.7rem .9rem;cursor:pointer}
.opt:hover{border-color:var(--ink-2)}
.fb{border-left:5px solid var(--line);padding:.5rem 0 .5rem .9rem;margin:.4rem 0 .2rem}
.fb.supported{border-color:var(--ok)}
.fb.not_supported{border-color:var(--burgundy)}
.fb.not_needed{border-color:var(--warn)}
.fb p{margin:0}
.verdict{font-weight:700}
.kv{display:grid;grid-template-columns:minmax(7rem,auto) 1fr;gap:4px 14px;font-size:.98rem;margin:0}
.kv dt{color:var(--ink-2)}
.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
details summary{cursor:pointer;font-weight:700}
.foot{color:var(--ink-2);font-size:.95rem;border-top:1px solid var(--line);padding-block:18px 30px}
.del{text-decoration:line-through;color:var(--ink-2)}

/* Sign-in */
.signin{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(20rem,100%),1fr));gap:24px;align-items:start}
.signin form{display:flex;flex-direction:column;gap:14px}
.signin label{display:flex;flex-direction:column;gap:4px;font-weight:700}
.signin input[type="email"],.signin input[type="text"]{width:100%;font-size:1.05rem;padding:.65rem .8rem}
.signin input.codein{font-family:var(--mono);font-size:1.6rem;letter-spacing:.4em;max-width:12rem;text-align:center}
.signin .fine{font-size:.92rem;color:var(--ink-2);margin:0}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.perks li{margin:.45rem 0}

@media (max-width:520px){ body{font-size:17px} .panel{padding:16px} .kv{grid-template-columns:minmax(5.5rem,auto) 1fr} }
@media (prefers-reduced-motion:no-preference){ .btn,.opt,.tab{transition:border-color .15s,background-color .15s} }
.stat .w.nolink{text-decoration:none}
.panel.locked{border-left:6px solid var(--ink-2)}