:root{
  --navy:#0D1C2E; --navy-2:#132842; --navy-3:#1B3556; --rule:#284A70;
  --gold:#C9A227; --gold-lt:#E3C46A; --parch:#EFE9DC; --muted:#94A9C2;
  --green:#5AA06F; --red:#C05C48; --amber:#C9932A;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--navy);color:var(--parch);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.2;margin:0 0 .5em}
h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.15rem;color:var(--gold-lt)}
p{margin:0 0 1em;max-width:70ch}
ul,ol{max-width:70ch;padding-left:1.2em}li{margin-bottom:.4em}
a{color:var(--gold-lt)}
.tbl{border-collapse:collapse;width:100%;max-width:64rem;margin:1rem 0 1.4rem;font-size:.9rem}
.tbl th{text-align:left;font-family:var(--serif);color:var(--gold-lt);border-bottom:1px solid var(--gold);padding:.5rem .7rem}
.tbl td{border-bottom:1px solid var(--rule);padding:.5rem .7rem;vertical-align:top}
p.rule,.rule-box{border-left:3px solid var(--gold);background:var(--navy-2);padding:.8rem 1rem;margin:1.2rem 0}
p.formula{font-family:var(--serif);font-size:1.05rem;background:var(--navy-2);border:1px solid var(--rule);padding:.8rem 1rem;display:inline-block;margin:.6rem 0 1.2rem}
.eyebrow{font-size:.78rem;color:var(--gold);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.5rem}
.lede{font-size:1.05rem;color:var(--muted);max-width:62ch}
.small{font-size:.82rem;color:var(--muted)}
.sec{margin:2.4rem 0}
.sec h3{border-bottom:1px solid var(--rule);padding-bottom:.4rem;margin-bottom:.9rem}
.panel{background:var(--navy-2);border:1px solid var(--rule);padding:1rem 1.2rem;max-width:66ch;margin-bottom:2rem}
.panel h4{margin:0 0 .5rem;color:var(--gold-lt);font-size:1rem}
.btn{font-family:var(--sans);font-size:.92rem;background:var(--gold);color:#16243A;border:0;padding:.72rem 1.4rem;cursor:pointer;font-weight:600}
.btn:hover{background:var(--gold-lt)}
.btn.ghost{background:none;border:1px solid var(--rule);color:var(--parch);font-weight:400}
.btn.ghost:hover{background:var(--navy-2);border-color:var(--gold)}
.btn:disabled{background:var(--navy-3);color:#68809B;cursor:not-allowed}
.btnrow{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center;margin-top:1.6rem}
label{display:block;font-size:.85rem;color:var(--muted);margin:.9rem 0 .35rem}
input[type=text],input[type=email],input[type=password],textarea{
  background:var(--navy-2);border:1px solid var(--rule);color:var(--parch);
  padding:.7rem .8rem;font-size:1rem;font-family:var(--sans);width:100%;max-width:30rem}
textarea{max-width:46rem;min-height:8rem;line-height:1.5;resize:vertical}
input:focus,textarea:focus{outline:2px solid var(--gold);outline-offset:1px}
.err{color:var(--red);font-size:.9rem;margin-top:.8rem;min-height:1.2em}
.wrap{display:flex;min-height:100vh}
.rail{width:290px;flex:0 0 290px;background:var(--navy-2);border-right:1px solid var(--rule);padding:1.4rem 1.1rem 3rem}
.main{flex:1;min-width:0;padding:2rem 2.2rem 5rem;position:relative}
.brandmark{font-family:var(--serif);font-size:1.05rem;color:var(--gold);letter-spacing:.16em;text-transform:uppercase}
.brandsub{font-family:var(--serif);font-size:1.3rem;margin:.35rem 0 .1rem}
.brandline{font-size:.75rem;color:var(--muted);margin-bottom:1.4rem;word-break:break-word}
.ledger{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.ledger button{width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--rule);color:var(--parch);
  padding:.7rem .3rem;cursor:pointer;font-family:var(--sans);font-size:.87rem;display:flex;gap:.7rem;align-items:baseline;line-height:1.35}
.ledger button:hover{background:var(--navy-3)}
.ledger button:disabled{color:#5C7089;cursor:not-allowed}
.ledger button:disabled:hover{background:none}
.ledger .num{font-family:var(--serif);color:var(--gold);flex:0 0 1.4rem}
.ledger .mark{margin-left:auto;font-size:.72rem;color:var(--muted);white-space:nowrap;padding-left:.4rem}
.ledger .pass{color:var(--green)}.ledger .fail{color:var(--red)}
.railfoot{margin-top:1.6rem;font-size:.72rem;color:var(--muted)}
.qhead{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--rule);padding-bottom:.6rem;margin-bottom:1.2rem;font-size:.85rem;color:var(--muted)}
.qtext{font-family:var(--serif);font-size:1.22rem;line-height:1.4;margin-bottom:1.2rem;max-width:62ch}
.opts{display:flex;flex-direction:column;gap:.55rem;max-width:52rem}
.opt{text-align:left;background:var(--navy-2);border:1px solid var(--rule);color:var(--parch);padding:.8rem 1rem;cursor:pointer;
  font-size:.95rem;font-family:var(--sans);line-height:1.45;display:flex;gap:.8rem;align-items:flex-start}
.opt:hover{border-color:var(--gold)}
.opt .k{font-family:var(--serif);color:var(--gold);flex:0 0 1.1rem}
.opt.sel{border-color:var(--gold);background:var(--navy-3)}
.pips{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:1.2rem}
.pip{width:16px;height:4px;background:var(--rule)}
.pip.done{background:var(--gold)}.pip.now{background:var(--parch)}
.score{display:flex;align-items:baseline;gap:1rem;margin:1.4rem 0}
.score .big{font-family:var(--serif);font-size:3.6rem;line-height:1;color:var(--gold)}
.score .lab{font-size:.9rem;color:var(--muted);max-width:26ch}
.review{border-top:1px solid var(--rule);padding:1.1rem 0;max-width:70ch}
.review .qr{font-family:var(--serif);font-size:1.02rem;margin-bottom:.5rem}
.review .ans{font-size:.9rem;margin-bottom:.3rem}
.ok{color:var(--green)}.no{color:var(--red)}.part{color:var(--amber)}
.review .why{font-size:.88rem;color:var(--muted)}
.review .why b{color:var(--gold-lt)}
.wm{position:fixed;inset:0;pointer-events:none;z-index:5;opacity:.05;overflow:hidden}
.wm span{position:absolute;font-family:var(--sans);font-size:13px;white-space:nowrap;transform:rotate(-30deg);color:#fff}
.lesson{user-select:none;-webkit-user-select:none}
.certwrap{background:#0A1624;padding:1rem 0 3rem}
.cert{background:#FBF7EE;color:#1A2A3D;max-width:900px;margin:0 auto;padding:52px 56px;border:2px solid #B9982F;position:relative;font-family:var(--serif)}
.cert:after{content:"";position:absolute;inset:12px;border:1px solid #D8C071;pointer-events:none}
.cert .cbrand{text-align:center;letter-spacing:.3em;text-transform:uppercase;font-size:.8rem;color:#8A6E15}
.cert .crule{width:70px;height:2px;background:#B9982F;margin:14px auto 22px}
.cert h2{text-align:center;font-size:2.35rem;margin:0 0 .2em;color:#12202F}
.cert .csub{text-align:center;font-style:italic;color:#5B6B7C;margin-bottom:26px}
.cert .cname{text-align:center;font-size:2.5rem;color:#12202F;border-bottom:1px solid #C9B278;padding-bottom:10px;margin:0 auto 22px;max-width:600px}
.cert .cbody{text-align:center;max-width:60ch;margin:0 auto 26px;font-size:1rem;line-height:1.65;color:#33475C}
.cert .cgrid{display:flex;justify-content:center;gap:46px;flex-wrap:wrap;margin-bottom:28px;text-align:center}
.cert .cgrid div span{display:block;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:#8A6E15;margin-bottom:4px}
.cert .cgrid div strong{font-size:1.2rem;color:#12202F}
.cert .cfoot{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #D8C071;padding-top:16px;font-size:.72rem;color:#5B6B7C;font-family:var(--sans);line-height:1.5}
.cert .seal{position:absolute;right:46px;bottom:70px;width:92px;height:92px;border:2px solid #B9982F;border-radius:50%;
  display:flex;align-items:center;justify-content:center;text-align:center;font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:#8A6E15;line-height:1.4;padding:8px}
.riskbar{border-top:1px solid var(--rule);margin-top:3rem;padding-top:1rem;font-size:.76rem;color:var(--muted);max-width:74ch}
.centre{max-width:34rem;margin:0 auto;padding:3rem 1.2rem 4rem}
.tabs{display:flex;gap:.5rem;margin:1.4rem 0}
.tabs button{flex:1;padding:.6rem;background:none;border:1px solid var(--rule);color:var(--muted);cursor:pointer;font-family:var(--sans)}
.tabs button.on{border-color:var(--gold);color:var(--parch);background:var(--navy-2)}
@media (max-width:860px){
  .wrap{display:block}
  .rail{width:auto;flex:none;border-right:0;border-bottom:1px solid var(--rule);padding:1.1rem}
  .main{padding:1.4rem 1.1rem 4rem}
  h1{font-size:1.55rem}
  .cert{padding:30px 22px}.cert h2{font-size:1.6rem}.cert .cname{font-size:1.7rem}.cert .seal{display:none}
  .score .big{font-size:2.8rem}
}
@media print{
  .rail,.btnrow,.riskbar,.noprint,.wm{display:none!important}
  body{background:#fff}.main{padding:0}.certwrap{background:#fff;padding:0}
}

/* ---- figures ---- */
.fig{
  margin:1.8rem 0 2rem;padding:0;max-width:44rem;
  border:1px solid var(--rule);background:var(--navy-2);
}
.figcap{
  padding:.7rem 1rem;border-bottom:1px solid var(--rule);
  font-size:.85rem;color:var(--muted);line-height:1.4;
}
.figcap b{color:var(--gold);font-weight:600;margin-right:.5rem}
.fig svg{display:block;width:100%;height:auto;padding:1.1rem .9rem;background:transparent}
.fignote{
  margin:0;padding:.7rem 1rem .9rem;border-top:1px solid var(--rule);
  font-size:.83rem;color:var(--muted);max-width:none;
}
@media (max-width:600px){
  .fig svg{padding:.7rem .4rem}
  .figcap,.fignote{font-size:.8rem;padding-left:.8rem;padding-right:.8rem}
}