/* The Max Noble 5 Minute Study · one stylesheet for every study (generated by src/gen_studies.py) */
:root{--navy:#002855;--deep:#001A38;--ox:#6A1A2C;--ink:#1A1A18;--ink2:#3A3A35;--grey:#6E6E66;--grey2:#9C9A8F;--paper:#F4F1E9;--bright:#FBF9F3;--hair:#E0D9C9;--disp:Newsreader,Georgia,serif;--body:Spectral,Georgia,serif}
*{box-sizing:border-box}
html{scroll-snap-type:y proximity;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:300 17px/1.62 var(--body);-webkit-font-smoothing:antialiased}
a{color:var(--navy)}
strong,b{font-weight:500}
em,i{font-style:italic}
/* top bar */
.bar{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:rgba(244,241,233,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--hair);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase}
.bar a{color:var(--navy);text-decoration:none}
.bar .wm{font-family:var(--disp);font-weight:500;letter-spacing:.3em;word-spacing:-.12em;font-size:.8rem}
.bar .no{color:var(--grey)}
.bar .pg{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--navy)}
/* one idea per screen */
.s{min-height:100vh;min-height:100svh;scroll-snap-align:start;padding:72px 16px 56px;display:flex;flex-direction:column;justify-content:center}
.s>.in{width:100%;max-width:38rem;margin:0 auto}
.s+.s{border-top:1px solid var(--hair)}
.s.wide>.in{max-width:52rem}
/* cover */
.cover{background:var(--deep);color:var(--bright);position:relative;justify-content:space-between}
.cover .cn{position:absolute;width:22px;height:22px;border:0 solid rgba(251,249,243,.55)}
.cover .c1{top:58px;left:12px;border-top-width:1px;border-left-width:1px}.cover .c2{top:58px;right:12px;border-top-width:1px;border-right-width:1px}
.cover .c3{bottom:12px;left:12px;border-bottom-width:1px;border-left-width:1px}.cover .c4{bottom:12px;right:12px;border-bottom-width:1px;border-right-width:1px}
.classbar,.stamp{display:flex;justify-content:space-between;gap:12px;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,249,243,.7)}
.classbar{padding-bottom:10px;border-bottom:1px solid rgba(251,249,243,.25)}
.stamp{padding-top:10px;border-top:1px solid rgba(251,249,243,.25);color:rgba(251,249,243,.55)}
.mast{text-align:center;margin:28px 0 0}
.mast .wordmark{font-family:var(--disp);font-weight:500;font-size:1.15rem;letter-spacing:.3em;word-spacing:-.12em;text-transform:uppercase;margin-right:-.3em}
.mast .mrule{width:44px;height:1px;background:rgba(251,249,243,.8);margin:8px auto}
.mast .tag{font-family:var(--disp);font-style:italic;font-weight:300;font-size:.85rem;color:rgba(251,249,243,.72)}
.cover .mid{margin:40px 0}
.eyebrow{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,249,243,.72);margin:0 0 18px;line-height:1.7}
.cover h1{font-family:var(--disp);font-weight:400;font-size:clamp(2.3rem,10vw,3.6rem);line-height:1.06;letter-spacing:-.01em;margin:0}
.cover h1 em{font-weight:300}
.cover .rule{width:48px;height:1px;background:rgba(251,249,243,.8);margin:26px 0 22px}
.cover .ox{width:48px;height:2px;background:var(--ox);margin:26px 0 22px}
.dek{font-style:italic;font-size:1.08rem;line-height:1.55;color:rgba(251,249,243,.9);margin:0}
.meta{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(251,249,243,.55);margin:30px 0 0;line-height:1.7}
.byl{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(251,249,243,.88);margin:8px 0 0}
.scroll{display:block;text-align:center;font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(251,249,243,.6);margin-top:18px}
/* text */
.lbl{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--navy);margin:0 0 14px;font-weight:400}
h2{font-family:var(--disp);font-weight:400;font-size:clamp(1.7rem,6.4vw,2.3rem);line-height:1.12;margin:0 0 18px;letter-spacing:-.005em}
h3{font-family:var(--disp);font-weight:500;font-size:1.25rem;line-height:1.3;margin:28px 0 10px}
h4{font-family:var(--disp);font-weight:500;font-size:1.1rem;margin:0 0 4px}
p{margin:0 0 14px}
p.lede{font-family:var(--disp);font-weight:400;font-size:1.32rem;line-height:1.42}
.note{font-size:.8rem;color:var(--grey);line-height:1.5}
b.t{font-weight:500;color:var(--navy);border-bottom:1px solid rgba(0,40,85,.35)}
b.t.ox{color:var(--ox);border-bottom-color:rgba(106,26,44,.4)}
blockquote{margin:24px 0;padding:2px 0 2px 18px;border-left:2px solid var(--navy)}
blockquote p{font-family:var(--disp);font-style:italic;font-weight:400;font-size:1.3rem;line-height:1.4;color:var(--deep);margin:0}
.after,.close{font-family:var(--disp);font-style:italic;font-size:1.15rem;line-height:1.45;color:var(--deep);border-left:2px solid var(--navy);padding-left:16px;margin:22px 0 0}
.sig{font-family:var(--disp);font-style:italic;text-align:right;color:var(--deep)}
ul,ol{padding-left:1.2rem;margin:0 0 14px}li{margin:0 0 8px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr));gap:16px;margin:22px 0}
.stat .big{font-family:var(--disp);font-size:2rem;line-height:1;color:var(--navy)}
.stat .big.ox{color:var(--ox)}
.stat .sm{font-size:.8rem;color:var(--grey);margin-top:6px;line-height:1.4}
.box,.howto,.listen{background:var(--bright);border:1px solid var(--hair);padding:16px 18px;margin:18px 0}
.howto .lbl,.listen .lbl{margin-bottom:6px}
.howto ol,.listen ol{margin:0}
/* tables */
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:8px 0 14px}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th{text-align:left;font-weight:400;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);padding:0 8px 8px 0;border-bottom:1px solid var(--ink);vertical-align:bottom}
td{vertical-align:top;padding:10px 8px 10px 0;border-bottom:1px solid var(--hair);line-height:1.5}
td.l{font-family:var(--disp);font-size:1.6rem;line-height:1;color:var(--navy);width:2rem}
td.n{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);width:6.5rem}
td.sw{font-weight:400}
td.c,th.c{text-align:center;font-family:var(--disp);font-size:1.1rem}
td.res{font-family:var(--disp);font-size:1.05rem}
td.adv2{font-weight:500;color:var(--navy)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.sum td{font-weight:500;border-top:1px solid var(--ink)}
td.y{color:var(--navy);font-weight:400}
td.blank{border-bottom:1px dotted var(--grey2);min-width:4rem}
caption{text-align:left;font-family:var(--disp);font-size:1.1rem;padding-bottom:6px}
.agrid{display:grid;gap:22px}@media(min-width:760px){.agrid{grid-template-columns:1fr 1fr}}
/* advice, steps, tools */
.adv{display:flex;gap:14px;padding:14px 0;border-top:1px solid var(--hair)}
.adv:last-of-type{border-bottom:1px solid var(--hair)}
.adv .num,.step .num{font-family:var(--disp);font-size:1.8rem;line-height:1;color:var(--navy);flex:none;width:1.6rem}
.adv p{margin:0}
.step{display:flex;gap:14px;padding:12px 0;border-top:1px solid var(--hair)}
.step p{margin:0}
.tool{padding:14px 0;border-top:1px solid var(--hair)}
.tool .tn{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--navy);margin-bottom:6px}
.tool .tn i{letter-spacing:0;text-transform:none;font-size:.8rem;color:var(--grey);margin-left:6px}
.tool p{margin:0 0 6px;font-size:.95rem}
.tool .v{font-family:var(--disp);font-style:italic;color:var(--deep);margin:0}
.tool .v::before{content:attr(data-k) ' · ';font-style:normal;font-family:var(--body);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--navy)}
.opts,.words,.roles,.quad,.learn,.g2{display:grid;gap:14px;margin:16px 0}
@media(min-width:640px){.opts,.words,.learn{grid-template-columns:repeat(3,1fr)}.roles{grid-template-columns:repeat(2,1fr)}.quad,.g2{grid-template-columns:1fr 1fr}}
.opt,.words>div,.roles>div{border-top:2px solid var(--navy);padding-top:8px;font-size:.92rem;color:var(--ink2)}
.opt .k{font-family:var(--disp);font-size:1.6rem;line-height:1;color:var(--navy)}
.opt b,.words b,.roles b{display:block;font-family:var(--disp);font-weight:500;font-size:1.05rem;color:var(--ink);margin:4px 0}
.quad>div,.learn>div{background:#fff;border:1px solid var(--hair);border-top:2px solid var(--navy);padding:12px 14px}
.quad .h,.learn .k{display:block;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--navy)}
.quad .q,.learn .q p{font-family:var(--disp);font-style:italic;font-size:1.05rem;margin:4px 0}
.quad p,.learn p{font-size:.9rem;color:var(--ink2);margin:4px 0 0}
.board{display:flex;gap:10px;align-items:baseline;margin:14px 0;padding:10px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.board .k{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--navy);white-space:nowrap}
.board p{margin:0;font-family:var(--disp);font-style:italic;font-size:1.02rem;line-height:1.4}
@media(max-width:560px){.board{flex-direction:column;gap:4px}}
.insight{border:1px solid var(--navy);padding:12px 16px;margin:14px 0}
.insight .k{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--navy)}
.insight .eqn{font-family:var(--disp);font-size:1.1rem;text-align:center;margin:8px 0}
.insight p{font-size:.9rem;margin:0}
.law{background:var(--deep);color:var(--bright);padding:22px 20px;margin:20px 0 0}
.law .k{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,249,243,.7)}
.law h3{font-weight:400;font-size:1.55rem;line-height:1.15;margin:8px 0 12px;color:var(--bright)}
.law p{font-style:italic;font-size:.98rem;line-height:1.6;color:rgba(251,249,243,.92)}
.law .sig{color:rgba(251,249,243,.85);margin:0}
/* worksheet */
.task{background:var(--bright);border:1px solid var(--hair);border-top:2px solid var(--navy);padding:14px 16px;margin:16px 0}
.fx{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--hair)}
.fx .nm{font-family:var(--disp);font-weight:500;font-size:1.1rem}
.fx .eq{font-family:var(--disp);font-size:1rem;display:flex;align-items:center;gap:8px}
.frac{display:inline-grid;text-align:center;line-height:1.25}
.frac span:first-child{border-bottom:1px solid var(--ink);padding:0 6px 3px}.frac span:last-child{padding:3px 6px 0}
.x{color:var(--grey)}
.k{font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--grey)}
.row{display:flex;align-items:flex-end;gap:10px;margin-top:14px}
.ln{border-bottom:1px dotted var(--grey2);height:24px;flex:1}
.ln.res{flex:0 0 7rem}
.u{font-family:var(--disp)}
.lines .ln,.assess .ln{display:block;height:26px}
.scale{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:14px}
.bx{width:26px;height:26px;border:1px solid var(--ink2);background:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.62rem;color:var(--grey)}
.hint{font-size:.88rem;line-height:1.5;color:var(--ink2);border-left:2px solid var(--navy);padding-left:12px;margin:14px 0 0}
.need{display:flex;flex-wrap:wrap;border:1.5px solid var(--navy);background:#fff;margin:16px 0 0}
.need .hd{background:var(--navy);color:var(--bright);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;padding:10px 12px;display:flex;align-items:center}
.need .it{flex:1;min-width:8rem;padding:8px 14px;border-left:1px solid var(--hair);display:flex;flex-direction:column}
.need .w{font-size:.8rem;color:var(--ink2)}
.need .v{font-family:var(--disp);font-size:1.4rem;color:var(--navy);font-variant-numeric:tabular-nums}
.need .v small{font-family:var(--body);font-size:.7rem;color:var(--grey);margin-left:4px}
.checks{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin:12px 0}
.cb{display:inline-block;width:14px;height:14px;border:1px solid var(--ink2);background:#fff;vertical-align:-2px;margin-right:6px}
.starter{font-size:.9rem;line-height:1.5;color:var(--ink2);border-left:2px solid var(--navy);padding-left:12px;margin:14px 0 0}
.formal{display:flex;flex-wrap:wrap;gap:12px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:10px 0;margin:12px 0}
.formal>div{flex:1;min-width:7rem;font-size:.92rem}.formal .k{display:block}
.box.bear{border-top:2px solid var(--ox)}.box.bull{border-top:2px solid var(--navy)}
.box .h{font-family:var(--disp);font-weight:500;font-size:1.1rem}.box .q{font-size:.84rem;color:var(--grey);font-style:italic;margin-top:10px}
figure{margin:18px 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
figure svg{width:100%;min-width:500px;height:auto;display:block}
svg text{font-family:Newsreader,Georgia,serif}
.src{font-size:.85rem;line-height:1.5;margin:0 0 10px;word-break:break-word}
.src a{font-size:.78rem;text-decoration:none}
/* end of a study */
.end .nav{display:grid;gap:12px;margin-top:22px}
.end .nav a{display:block;border:1px solid var(--hair);background:var(--bright);padding:14px 16px;text-decoration:none;color:var(--ink)}
.end .nav small{display:block;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}
.end .nav b{font-family:var(--disp);font-weight:400;font-size:1.15rem}
.btn{display:inline-block;margin-top:18px;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;padding:14px 22px;background:var(--navy);color:var(--bright);border:0;font-family:var(--body);cursor:pointer}
.btn.ghost{background:transparent;color:var(--navy);border:1px solid var(--navy)}
/* the series home */
.home .hero{text-align:center}
.home .hero .series{font-family:var(--disp);font-weight:400;font-size:clamp(2.6rem,12vw,4.4rem);line-height:1.02;margin:22px 0 18px;color:var(--navy)}
.home .hero .promise{font-family:var(--disp);font-style:italic;font-size:1.2rem;color:var(--ink2);margin:0}
.home .hero .three{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin:26px 0 0;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}
.entry .no{font-family:var(--disp);font-size:clamp(3.4rem,18vw,5.6rem);line-height:.9;color:var(--navy);font-weight:300;letter-spacing:-.02em}
.entry .ed{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--grey);margin:14px 0 10px}
.entry h2 a{color:var(--ink);text-decoration:none}
.entry .d{color:var(--ink2);font-size:1.02rem}
.entry .m{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);margin-top:12px}
.idx{list-style:none;padding:0;margin:18px 0 0;border-top:1px solid var(--ink)}
.idx li{margin:0;border-bottom:1px solid var(--hair)}
.idx a{display:grid;grid-template-columns:3.4rem 1fr;gap:10px;padding:10px 0;text-decoration:none;color:var(--ink)}
.idx .n{font-family:var(--disp);color:var(--navy)}
.idx small{display:block;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--grey)}
.footer{text-align:center;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--grey2);padding:28px 16px 40px}
@media(min-width:900px){body{font-size:18px}.s{padding:96px 24px 72px}}
/* A4 print: every screen becomes a page */
@media print{
  @page{size:A4;margin:16mm 18mm}
  html{scroll-snap-type:none}
  body{background:#fff;font-size:10.6pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .bar,.scroll,.end .nav,.btn,.no-print{display:none!important}
  .s{min-height:auto;padding:0;display:block;break-after:page;border:0!important}
  .s>.in{max-width:none}
  .cover{margin:-16mm -18mm 0;padding:20mm 22mm;min-height:297mm;display:flex}
  .cover .c1,.cover .c2{top:10mm}.cover .c1,.cover .c3{left:10mm}.cover .c2,.cover .c4{right:10mm}.cover .c3,.cover .c4{bottom:10mm}
  .task,.law,.box,table,figure{break-inside:avoid}
  a{text-decoration:none}
}
