/* Majlis Talks only: Day / Night reading light. Every colour comes from --n-* set by night.js (t = 0 is exactly the day site). */
html.mt-scope{background:var(--n-page,#fcfcfa)}
html.mt-scope .page-inner main{background:var(--n-page,#fcfcfa)}
html.mt-scope body{background:var(--n-page,#fcfcfa);color:var(--n-ink,#111111);transition:none}
html.mt-scope .page-light .header,html.mt-scope .header.is-dark,html.mt-scope.page-light .header{color:var(--n-ink,#111111)}
html.mt-scope .header{color:var(--n-ink,#111111)}
html.mt-scope .hlogo .ar-logo{filter:invert(var(--n-f,0))}
/* rules, greys, soft text */
html.mt-scope .pt-row{border-bottom-color:color-mix(in srgb,var(--n-ink,#111) calc(var(--n-line-a,.14)*100%),transparent)}
html.mt-scope .pt-n,html.mt-scope .pt-date,html.mt-scope .pt-wc,html.mt-scope .latest-wc,html.mt-scope .p-next>* .u-small{color:var(--n-grey,#8a8a86)}
html.mt-scope .pt-ex,html.mt-scope .ph-lead .ar-lead{color:var(--n-soft,#3d3d3a)}
html.mt-scope .pt-cover{background:var(--n-paper,#f4f3ef)}
html.mt-scope .reveal::after{background:var(--n-paper,#f4f3ef)}
html.mt-scope .p-next{border-color:color-mix(in srgb,var(--n-ink,#111) 14%,transparent)}
html.mt-scope .uline{border-color:currentColor}
/* the magazine article */
html.mt-scope .mag{color:var(--n-ink,#111111);--hair:1px solid var(--n-ink,#111111)}
html.mt-scope .tag .bar,html.mt-scope .end{background:var(--n-ink,#111111)}
html.mt-scope .m-cols p.dc::first-letter{color:var(--n-ink,#111111)}
html.mt-scope .pq{border-top-color:var(--n-ink,#111111)}
html.mt-scope .key li,html.mt-scope .key li:first-child{border-color:color-mix(in srgb,var(--n-ink,#111) 28%,transparent)}
html.mt-scope .pin{background:var(--n-page,#fcfcfa);border-color:var(--n-ink,#111111);color:var(--n-ink,#111111)}
html.mt-scope .m-left-dark{background:var(--n-panel,#111111)}
@media (max-width:760px){
  html.mt-scope .mag-b .m-hl,html.mt-scope .mag-b .m-hl .credits{color:var(--n-ink,#111111)}
  html.mt-scope .mag-b .m-left-dark .m-hl{color:#fcfcfa}
  html.mt-scope .mag-b .m-left-dark .m-hl .credits{color:rgba(252,252,250,.78)}
}
/* transparent sketches: invert the line drawings at night (photos are untouched) */
html.mt-scope img[src*="/img/pt/"],html.mt-scope source[srcset*="/img/pt/"]+img{filter:invert(calc(var(--n-f,0)*.88))}
html.mt-scope.is-night img[src*="/img/pt/"]{mix-blend-mode:screen!important}
html.mt-scope.is-night .pt-cover img{mix-blend-mode:screen!important}
/* prev / next tabs and the small pills stay dark, lifted a touch at night with a hairline */
html.mt-scope .mt-tab{background:var(--n-tab,#111111);box-shadow:inset 0 0 0 1px rgba(236,232,224,calc(var(--n-f,0)*.22))}
@media (hover:hover){html.mt-scope .mt-tab:hover,html.mt-scope .mt-tab:focus-visible{background:var(--n-tabh,#2a2a28)}}
html.mt-scope .mini .btn{background:var(--n-tab,#111111);box-shadow:inset 0 0 0 1px rgba(236,232,224,calc(var(--n-f,0)*.22))}
html.mt-scope .mini .btn-menu{background:var(--n-paper,#f4f3ef);color:var(--n-ink,#111111)}

/* ---- the slider ---- */
.nt-ctl{position:fixed;z-index:58;top:var(--m);right:calc(var(--m) + 6.6rem);display:flex;align-items:center;gap:.55rem;height:2.4rem;padding:0 .2rem;
  color:var(--n-ink,#111111);transition:right .6s var(--ease-2)}
.mini.is-on+.nt-ctl{right:calc(var(--m) + 13.5rem)}
.nt-l{font-size:.5625rem;letter-spacing:.12em;color:var(--n-grey,#8a8a86);user-select:none;-webkit-user-select:none}
.nt-range{-webkit-appearance:none;appearance:none;width:5.5rem;height:1.4rem;margin:0;background:transparent;cursor:pointer;--p:0%}
.nt-range:focus{outline:none}
.nt-range::-webkit-slider-runnable-track{height:1px;background:linear-gradient(90deg,currentColor var(--p),color-mix(in srgb,currentColor 30%,transparent) var(--p))}
.nt-range::-moz-range-track{height:1px;background:color-mix(in srgb,currentColor 30%,transparent)}
.nt-range::-moz-range-progress{height:1px;background:currentColor}
.nt-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:.8rem;height:.8rem;margin-top:calc(-.4rem + .5px);border-radius:50%;
  background:var(--n-page,#fcfcfa);border:1px solid currentColor;box-shadow:inset 0 0 0 2.5px var(--n-page,#fcfcfa),inset 0 0 0 7px currentColor;transition:transform .2s ease}
.nt-range::-moz-range-thumb{width:.8rem;height:.8rem;border-radius:50%;background:currentColor;border:2px solid var(--n-page,#fcfcfa);box-shadow:0 0 0 1px currentColor}
.nt-range:hover::-webkit-slider-thumb{transform:scale(1.15)}
.nt-range:focus-visible::-webkit-slider-thumb{box-shadow:inset 0 0 0 2.5px var(--n-page,#fcfcfa),inset 0 0 0 7px currentColor,0 0 0 3px color-mix(in srgb,currentColor 25%,transparent)}
@media (max-width:991px){.nt-ctl{right:calc(var(--m) + 9.6rem)}}
/* once the page scrolls under it, the slider sits in a soft pill beside Say hi / Menu */
@media (min-width:761px){
  .nt-ctl{border-radius:99px;transition:right .6s var(--ease-2),background-color .4s,box-shadow .4s,padding .4s}
  .mini.is-on+.nt-ctl{height:2.75rem;padding:0 1.05rem;background:color-mix(in srgb,var(--n-page,#fcfcfa) 86%,transparent);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 0 1px color-mix(in srgb,var(--n-ink,#111) 12%,transparent)}
}
/* phone: in the bottom bar, between the ‹ / › tabs */
@media (max-width:760px){
  .nt-ctl{top:auto;bottom:max(.6rem,env(safe-area-inset-bottom));left:50%;right:auto;transform:translateX(-50%);height:2.1rem;padding:0 .7rem;border-radius:2px;
    background:color-mix(in srgb,var(--n-page,#fcfcfa) 90%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
    box-shadow:0 0 0 1px color-mix(in srgb,var(--n-ink,#111) 12%,transparent)}
  .mini.is-on+.nt-ctl{right:auto}
  .nt-range{width:5rem}
  body.page-inner:not(.has-mt-tabs) .footer{padding-bottom:calc(1.2rem + 3.2rem)}
}
@media (prefers-reduced-motion:reduce){.nt-ctl,.nt-range::-webkit-slider-thumb{transition:none}}

/* ---- text size A− A+ (articles only), beside the slider ---- */
.nt-ctl .ts-sep{width:1px;height:1rem;margin:0 .2rem;background:color-mix(in srgb,currentColor 28%,transparent)}
.ts-ctl{display:flex;align-items:center;gap:.1rem}
.ts-b{-webkit-appearance:none;appearance:none;border:0;background:none;color:inherit;font:inherit;font-family:var(--font);font-weight:600;
  font-size:.75rem;line-height:1;letter-spacing:.02em;min-width:1.9rem;height:1.9rem;padding:0 .3rem;border-radius:99px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;transition:background-color .2s}
.ts-b span{font-size:.85em;margin-left:.05em}
.ts-up{font-size:.9375rem}
.ts-b:disabled{opacity:.32;cursor:default}
.ts-b.ts-rs{min-width:0;font-size:.5625rem;letter-spacing:.08em;color:var(--n-grey,#8a8a86);font-variant-numeric:tabular-nums}
.ts-b[hidden]{display:none}
@media (hover:hover){.ts-b:not(:disabled):hover{background:color-mix(in srgb,currentColor 10%,transparent)}}
.ts-b:focus{outline:none}
.ts-b:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb,currentColor 35%,transparent)}
.ts-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:760px){
  .nt-ctl{gap:.4rem;padding:0 .45rem}
  .nt-range{width:4.25rem}
  .ts-b{min-width:1.75rem;height:1.75rem;padding:0 .2rem}
  .ts-b.ts-rs{display:none}
  .nt-ctl .ts-sep{margin:0}
}

/* ---- A− / A+ never move (27 Oct): fixed-width buttons, a reserved fixed slot for the % reset, tabular figures,
   ring via box-shadow on :focus-visible only, disabled = dimmed only. The group is anchored on its right edge,
   so any width change would shift it; widths are therefore constant at every size step. ---- */
.nt-ctl .ts-ctl{flex:none;gap:.1rem}
.nt-ctl .ts-b{flex:none;width:1.9rem;min-width:1.9rem;height:1.9rem;padding:0;border:0;margin:0;outline:none;font-variant-numeric:tabular-nums;transition:background-color .2s,opacity .2s}
.nt-ctl .ts-b.ts-rs{width:2.6rem;min-width:2.6rem;font-size:.5625rem;letter-spacing:.04em;white-space:nowrap}
.nt-ctl .ts-b.ts-rs.is-idle{visibility:hidden;pointer-events:none}
.nt-ctl .ts-b[hidden]{display:inline-flex;visibility:hidden}
.nt-ctl .ts-b:disabled{opacity:.32;cursor:default;background:none}
.nt-ctl .ts-b:focus{outline:none}
.nt-ctl .ts-b:focus:not(:focus-visible){box-shadow:none}
.nt-ctl .ts-b:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,currentColor 35%,transparent)}
.nt-ctl .nt-l{flex:none}
.nt-ctl .nt-range{flex:none}
@media (max-width:760px){
  .nt-ctl .ts-b{width:1.75rem;min-width:1.75rem;height:1.75rem}
  .nt-ctl .ts-b.ts-rs{display:none}
}