/* GSU LESSON ENGINE v1.0 · Sep 2 2026
   Every rule scoped under .tgl so nothing reaches the site chrome.
   Used by every Trades Geometry lesson page. Change it here, not per lesson. */
.tgl{background:#000;color:#F5F1E8;font-family:Georgia,'Times New Roman',serif;padding:0 0 70px}
.tgl *{box-sizing:border-box}
.tgl .wr{max-width:1060px;margin:0 auto;padding:0 24px}
.tgl .kick{color:#C9A84C;font-family:Arial,sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;margin:0 0 10px}
.tgl .back{color:rgba(245,241,232,.45);font-family:Arial,sans-serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;display:inline-block;margin:34px 0 18px}
.tgl .back:hover{color:#C9A84C}
.tgl h1{font-size:42px;font-weight:400;margin:0;line-height:1.05;color:#F5F1E8}
.tgl .lede{color:rgba(245,241,232,.66);font-size:17px;line-height:1.6;margin:16px 0 0;max-width:680px}
.tgl h2{font-size:27px;font-weight:400;margin:0 0 6px;line-height:1.2;color:#F5F1E8}
.tgl .stepnum{font-family:Arial,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#C9A84C;margin:0 0 4px}
.tgl .step{margin-top:52px;padding-top:30px;border-top:1px solid rgba(201,168,76,.3)}
.tgl p{line-height:1.72;font-size:16.5px}
.tgl .strip{position:sticky;top:0;z-index:20;background:rgba(0,0,0,.94);border-bottom:1px solid rgba(201,168,76,.3);padding:11px 0;margin-top:24px}
.tgl .strip .in{max-width:1060px;margin:0 auto;padding:0 24px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tgl .pill{font-family:Arial,sans-serif;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:6px 11px;border:1px solid rgba(245,241,232,.22);color:rgba(245,241,232,.45);border-radius:20px;cursor:pointer;background:transparent}
.tgl .pill.read{border-color:rgba(201,168,76,.5);color:#C9A84C}
.tgl .pill.shaky{border-color:#E39C9C;color:#E39C9C}
.tgl .pill.solid{background:#C9A84C;border-color:#C9A84C;color:#000}
.tgl .rt{margin-left:auto;font-family:Arial,sans-serif;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(245,241,232,.4)}
.tgl .rt button{background:none;border:0;color:rgba(245,241,232,.4);cursor:pointer;font:inherit;text-decoration:underline}
.tgl .blk{border:1px solid rgba(201,168,76,.3);background:#0d0d11;margin:16px 0;padding:22px 24px;transition:border-color .3s,box-shadow .3s}
.tgl .blk.flash{border-color:#C9A84C;box-shadow:0 0 0 3px rgba(201,168,76,.18)}
.tgl .blk h3{font-size:20px;font-weight:400;margin:0 0 4px;color:#F5F1E8}
.tgl .blk .tag{font-family:Arial,sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#C9A84C;margin:0 0 10px}
.tgl .blk p{margin:0 0 12px}
.tgl .blkbar{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px dotted rgba(201,168,76,.22)}
.tgl .mini{font-family:Arial,sans-serif;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:8px 13px;border:1px solid rgba(201,168,76,.45);background:transparent;color:#C9A84C;cursor:pointer}
.tgl .mini:hover{background:#C9A84C;color:#000}
.tgl .lab{display:grid;grid-template-columns:1.35fr .65fr;gap:22px;align-items:start;margin-top:20px}
@media(max-width:860px){.tgl .lab{grid-template-columns:1fr}}
.tgl .stage{background:#08080b;border:1px solid rgba(201,168,76,.3);padding:12px}
.tgl .stage svg{display:block;width:100%;height:auto}
.tgl .ctl{background:#0d0d11;border:1px solid rgba(201,168,76,.3);padding:20px}
.tgl .ctl label{display:block;font-family:Arial,sans-serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,241,232,.62);margin:0 0 6px}
.tgl .val{float:right;color:#C9A84C;letter-spacing:0}
.tgl input[type=range]{width:100%;accent-color:#C9A84C;margin:0 0 18px}
.tgl .out{border-top:1px solid rgba(201,168,76,.3);padding-top:14px;margin-top:4px}
.tgl .row{display:flex;justify-content:space-between;gap:10px;font-family:Arial,sans-serif;font-size:13px;padding:7px 0;border-bottom:1px dotted rgba(201,168,76,.18)}
.tgl .row:last-child{border-bottom:0}
.tgl .row span:first-child{color:rgba(245,241,232,.62)}
.tgl .row.big{font-size:16px;padding-top:11px}
.tgl .row.big span:last-child{color:#C9A84C}
.tgl .work{background:#0d0d11;border-left:3px solid #C9A84C;padding:16px 19px;margin-top:18px;font-family:Arial,sans-serif;font-size:13.5px;line-height:1.9;white-space:pre-line;color:rgba(245,241,232,.85)}
.tgl .hands{border:1px solid rgba(201,168,76,.3);background:rgba(201,168,76,.06);padding:18px 21px;margin-top:20px}
.tgl .hands p{margin:0 0 10px;font-size:15.5px}
.tgl .hands p:last-child{margin:0}
.tgl .prac{background:#0d0d11;border:1px solid rgba(201,168,76,.3);padding:24px;margin-top:20px}
.tgl .qmeta{font-family:Arial,sans-serif;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#C9A84C;margin:0 0 8px}
.tgl .q{font-size:19px;line-height:1.45;margin:0 0 4px}
.tgl .entry{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.tgl input[type=text]{flex:1 1 210px;min-width:0;background:#000;border:1px solid rgba(201,168,76,.3);color:#F5F1E8;padding:12px 14px;font-family:Arial,sans-serif;font-size:16px}
.tgl input[type=text]:focus{outline:none;border-color:#C9A84C}
.tgl button.go{font-family:Arial,sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:12px 20px;border:1px solid #C9A84C;background:#C9A84C;color:#000;cursor:pointer}
.tgl button.alt{background:transparent;color:#C9A84C}
.tgl .hint{font-family:Arial,sans-serif;font-size:12.5px;color:rgba(245,241,232,.45);margin-top:9px}
.tgl .verdict{margin-top:16px;padding:16px 18px;border-left:3px solid #C9A84C;background:rgba(201,168,76,.07);display:none}
.tgl .verdict.on{display:block}
.tgl .verdict b{display:block;margin-bottom:8px;font-weight:400;font-size:16px}
.tgl .verdict.right b{color:#9BD4A2}
.tgl .verdict.wrong b{color:#E39C9C}
.tgl .vwork{font-family:Arial,sans-serif;font-size:13.5px;line-height:1.9;white-space:pre-line;color:rgba(245,241,232,.85)}
.tgl .send{margin-top:14px;padding-top:12px;border-top:1px dotted rgba(201,168,76,.25)}
.tgl .send p{margin:0 0 10px;font-size:15px}
.tgl .done{border:1px solid #C9A84C;background:rgba(201,168,76,.09);padding:22px 24px;margin-top:22px;display:none}
.tgl .done.on{display:block}
.tgl .done h3{color:#C9A84C;font-size:21px;margin:0 0 8px;font-weight:400}
.tgl .book{margin:52px 0 0;padding-top:28px;border-top:1px solid rgba(201,168,76,.3);display:grid;grid-template-columns:130px 1fr;gap:24px}
@media(max-width:640px){.tgl .book{grid-template-columns:1fr}}
.tgl .book img{width:100%;max-width:130px;border:1px solid rgba(201,168,76,.3);display:block}
.tgl .book h4{font-size:20px;font-weight:400;margin:0 0 8px}
.tgl .book p{font-size:15px;color:rgba(245,241,232,.78);margin:0 0 12px}
.tgl .btn{display:inline-block;margin:4px 8px 0 0;font-family:Arial,sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:12px 20px;text-decoration:none;border:1px solid #C9A84C;color:#C9A84C}
.tgl .btn.solid{background:#C9A84C;color:#000}
.tgl .fine{font-size:12px;color:rgba(245,241,232,.42);font-family:Arial,sans-serif;line-height:1.6;margin-top:16px}
.tgl svg text{font-family:Arial,sans-serif}
