/* 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}}
