/* Opaque source paper is toned by play-paper-tone, without blend compositing. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;color-scheme:light}
.drawing{background:var(--paper);mix-blend-mode:normal;isolation:isolate}
.drawing picture{display:block;background:var(--paper)}
.drawing img{mix-blend-mode:normal}
.observatory-stage,.observatory-stage picture{background:var(--paper)}
.observatory-fallback{mix-blend-mode:normal}

/* Native pickers retain their behaviour, with the same field geometry in Safari. */
.support-launch .donation-panel select{
 -webkit-appearance:none;appearance:none;border:1px solid #777b80;border-radius:0;
 background-color:var(--paper);color:var(--ink);width:100%;min-height:54px;
 padding:14px 40px 14px 12px;line-height:1.4;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='m1 1 6 6 6-6' fill='none' stroke='%233b3d40' stroke-width='1.3'/%3E%3C/svg%3E");
 background-repeat:no-repeat;background-position:right 14px center;background-size:14px 8px;
}
.support-launch .currency-input,.support-launch input[type="number"]{border-radius:0;background-color:var(--paper);box-shadow:none}
.support-launch input[type="number"]{-webkit-appearance:none;appearance:textfield;font-size:16px}
.support-launch input[type="number"]::-webkit-inner-spin-button,
.support-launch input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

@media(max-width:700px){
 :root{--reading-size:19px;--reading-leading:1.65;--action-size:17px;--section-title:34px;--compact-title:31px}
 .wrap{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}
 .menu-toggle{min-height:44px;font-size:16px}
 .site-header #navigation{font-size:19px;gap:12px;padding-block:16px 22px}
 .site-header #navigation>a{display:flex;align-items:center;min-height:44px}
 .home .chapter-heading{align-items:flex-start}
 .home .chapter-icon{width:32px;height:32px;flex-basis:32px;margin-top:3px}
 .home .chapter-heading h2{font-size:clamp(31px,8.4vw,36px)}
 .home .home-approach h2,.home .support-band h2{font-size:clamp(35px,9.3vw,40px);line-height:1.12}
 .home .sketch-st-francis .sketch-0{margin-top:28px}
 .project-page .project-hero{padding-top:28px;padding-bottom:16px}
 .project-hero-meta{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:22px}
 .project-page .project-hero .project-hero-meta>.kicker{margin:0;font-size:16px;line-height:1.5}
 .project-language{gap:22px;font-size:16px}
 .project-page .project-hero h1{font-size:clamp(38px,10.8vw,46px);line-height:1.08;letter-spacing:-.04em}
 .project-page .project-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 16px;margin-top:24px;font-size:16px;align-items:center}
 .project-page .project-facts>span:first-child{grid-column:1/-1}
 .project-page .funding-jump{justify-self:end;text-align:right;font-size:16px}
 .project-editorial .project-opening{padding-block:24px;gap:20px}
 .project-editorial .project-opening aside{gap:18px}
 .project-editorial .project-opening aside h2{font-size:26px;line-height:1.2}
 .project-editorial .project-opening .story-copy .lead{font-size:25px;line-height:1.45}
 .project-editorial .project-opening .story-copy{font-size:var(--reading-size);line-height:var(--reading-leading)}
 .project-editorial .threshold-caption{flex-direction:column;align-items:flex-start;gap:6px;margin-top:14px}
 .project-editorial .threshold-caption .threshold-note{max-width:none}
 .project-editorial .threshold-reset{max-width:100%;white-space:normal;text-align:left}
 .project-editorial .threshold-controls{gap:12px;font-size:16px}
 .project-editorial .threshold-introduction h2,
 .st-francis-project .music-introduction h2,.observatory-introduction h2{font-size:32px;line-height:1.15}
 .st-francis-project .music-introduction p{font-size:var(--reading-size);line-height:var(--reading-leading)}
 .st-francis-project .sketch-st-francis .sketch-note p{font-size:var(--reading-size);line-height:var(--reading-leading)}
 .project-editorial .rights-sources .text-link{max-width:100%;font-size:16px;overflow-wrap:break-word}
 .project-editorial .rights-copy blockquote{font-size:26px;line-height:1.4}
 .project-editorial .funding-section{gap:22px;padding-block:32px 42px}
 .project-editorial .funding-number{font-size:58px;line-height:1.1}
 .project-editorial .funding-section h2{font-size:32px;line-height:1.15}
 .project-editorial .funding-section p{font-size:var(--reading-size);line-height:var(--reading-leading)}
 .project-editorial .funding-section .kicker{font-size:16px}
 .project-editorial .funding-section .funding-number{font-size:58px;line-height:1.1}
 .project-editorial .funding-section .funding-status{font-size:17px;line-height:1.6}
 .project-editorial .accountability>h2{font-size:17px}
 .accountability summary{gap:16px;line-height:1.5;align-items:center}
 .accountability summary span{flex-shrink:0}
 .accountability details>div{font-size:17px;line-height:1.65}
 .translation-note{margin-top:20px;margin-bottom:28px;font-size:15px;line-height:1.6}
 .footer-main{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px 24px;align-items:start}
 .footer-main>.text-link{grid-column:1/-1;justify-self:start}
 .footer-main p{font-size:16px;line-height:1.5}
 .footer-bottom>div{gap:8px 20px}
 .footer-bottom>div>a{display:flex;align-items:center;min-height:44px}
 .support-launch .support-hero h1{font-size:clamp(38px,10.4vw,44px)}
 .support-launch .donation-panel{padding:24px 20px}
 .support-launch .donation-panel legend{align-items:baseline;flex-wrap:wrap;gap:6px 14px}
 .support-launch .support-project-heading{flex-wrap:wrap;gap:8px 20px}
 .support-launch .support-project .support-project-purpose{font-size:18px}
 .support-launch .people-list article{display:block}
 .support-launch .people-list article>p{margin-top:8px}
 .support-launch .people-list article>span{display:block;margin-top:18px}
 .utility-page h1{font-size:40px;line-height:1.12}
 .utility-page .story-copy h2{font-size:30px;line-height:1.2}
 #play-philosophy-page .pf-index-label,#play-philosophy-page .pf-chapters button{font-size:16px}
 #play-philosophy-page .pf-past-opening .ra-intro h1,
 #play-philosophy-page .pf-display,#play-philosophy-page .pf-future .pf-display{font-size:clamp(38px,10.8vw,46px)}
 #play-philosophy-page .pf-past-opening .ra-intro>p{display:block;max-width:none}
 #play-philosophy-page .ra-stage{display:grid;grid-template-rows:auto minmax(130px,1fr) 28px 44px;gap:10px;min-height:0;padding:20px var(--pf-edge) 10px}
 #play-philosophy-page .ra-story{position:static;overflow:visible;max-height:none}
 #play-philosophy-page .ra-name{min-height:0;max-width:none;font-size:29px;margin:8px 0 12px}
 #play-philosophy-page .ra-caption{font-size:17px;line-height:1.5;min-height:0}
 #play-philosophy-page .ra-credit{font-size:15px;line-height:1.5;margin-top:12px}
 #play-philosophy-page .ra-art{position:relative;inset:auto;min-height:0;height:auto}
 #play-philosophy-page .ra-time{position:static;align-self:center;font-size:24px}
 #play-philosophy-page .ra-footer{position:static;font-size:15px;gap:10px}
 #play-philosophy-page .ra-controls{gap:20px}
 #play-philosophy-page .ra-controls button{font-size:16px}
 #play-philosophy-page .pf-section{padding-block:52px}
 #play-philosophy-page .pf-essay>.pf-display{margin-bottom:30px}
 #play-philosophy-page .pf-roles button{font-size:17px}
 #play-philosophy-page .pf-invitation{margin-top:48px}
 #play-philosophy-page .pf-contact{font-size:38px}
}
@media(max-width:960px) and (max-height:500px) and (orientation:landscape){
 html{scroll-padding-top:76px}
 .header-inner{min-height:62px}
 .site-header .wordmark{font-size:32px}
 #play-philosophy-page{--pf-header:62px;--pf-index:44px}
 .project-page .project-hero{padding-top:28px}
 .project-editorial .sketch-note>p,.project-editorial .sketch-story p{font-size:18px;line-height:1.6}
 .project-editorial .sketch-mlondolozi .sketch-note{grid-column:1/6}
 .project-editorial .sketch-mlondolozi .sketch-0{grid-column:6/13}
 #play-philosophy-page .ra-stage{min-height:0;height:calc(100svh - var(--pf-header) - var(--pf-index));grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 26px 44px;gap:6px 24px;padding-top:12px}
 #play-philosophy-page .ra-story{grid-column:1;grid-row:1/3;max-height:100%;overflow-y:auto}
 #play-philosophy-page .ra-art{grid-column:2;grid-row:1;min-height:0}
 #play-philosophy-page .ra-time{grid-column:2;grid-row:2}
 #play-philosophy-page .ra-footer{grid-column:1/-1;grid-row:3}
}
