/* A printed, creased open sheet around the original Toned composition. */
@font-face{font-family:Infamous;src:url('/fonts/Infamous-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
*{box-sizing:border-box}html{height:100%;background:#fff}body.toned-zine{height:100svh;min-width:0;margin:0;padding:20px;display:flex;align-items:center;justify-content:center;background:#fff;color:#171717;overflow:hidden}
.zine-paper{position:relative;isolation:isolate;display:grid;grid-template-rows:56px minmax(0,1fr)56px;width:min(100%,1360px);height:100%;padding:0 22px;background:#f7f7f3;box-shadow:0 4px 18px #0003,0 1px 2px #0005;outline:1px solid #ffffffa8}
.zine-paper::before{content:'';position:absolute;inset:0;z-index:10;pointer-events:none;background:url('/toned/paper-grain.svg');opacity:.075;mix-blend-mode:multiply}
.zine-paper::after{content:'';position:absolute;inset:0;z-index:11;pointer-events:none;background:linear-gradient(90deg,transparent calc(50% - 38px),#00000003 calc(50% - 17px),#0000000b calc(50% - 4px),#0000001f calc(50% - 1px),#ffffff6e 50%,#ffffff1f calc(50% + 3px),#00000006 calc(50% + 17px),transparent calc(50% + 38px));opacity:.8}
.zine-margin{display:flex;align-items:center;min-width:0;position:relative;z-index:12}
.zine-top{justify-content:flex-start}.zine-bottom{justify-content:flex-end}
.zine-margin a{display:inline-flex;align-items:center;min-height:48px;max-width:100%;padding:2px 4px;color:#171717;font:400 24px/1.2 Infamous,cursive;text-decoration-line:underline;text-decoration-thickness:1.5px;text-decoration-color:#178253;text-underline-offset:5px;touch-action:manipulation}
.zine-margin a:focus-visible{outline:2px solid #178253;outline-offset:2px}.zine-margin a:active{color:#315b3f}
@media(hover:hover){.zine-margin a:hover{color:#315b3f;text-decoration-thickness:1.5px}}
.zine-stage{position:relative;container:toned-card/size;min-width:0;min-height:0;background:#3a320c;overflow:hidden}
.zine-stage .toned-reader,.zine-stage .toned-sheet{width:100%;height:100%;min-height:0;max-height:none;overflow:visible}
.zine-stage .toned-sheet{margin:0}
.zine-stage .toned-masthead{left:0}
.zine-stage .toned-stories:hover video{filter:none}
.zine-stage .toned-cover-ink{position:relative;display:block;width:100%;height:100%}
.zine-stage .toned-motion-frame video{object-fit:contain;object-position:right top}
.zine-stage .toned-stories-frame{height:24.105903%}
.zine-stage .toned-about{font-size:clamp(24px,min(3.7875cqw,calc(var(--toned-stage-height)*.083)),54px)}
.zine-stage .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@container toned-card (max-width:999px){.zine-stage .toned-logo-ink{filter:url(#toned-printed-mobile)}}
@container toned-card (min-width:600px) and (max-width:999px){
 .zine-stage .toned-sheet{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-rows:23% auto minmax(0,1fr);grid-template-areas:'masthead masthead' 'lead cover' 'video cover';gap:18px;padding:16px 20px}
 .zine-stage .toned-masthead{position:relative;inset:auto;grid-area:masthead;width:100%;height:100%}
 .zine-stage .toned-about{position:relative;inset:auto;grid-area:lead;align-self:start;width:100%;font-size:clamp(20px,3.6cqw,34px);line-height:1.09}
 .zine-stage .toned-moving-cover{position:relative;inset:auto;grid-area:cover;width:100%;height:100%;min-height:0;aspect-ratio:auto}
 .zine-stage .toned-motion-frame{width:100%;height:100%;aspect-ratio:auto}.zine-stage .toned-motion-frame video{object-fit:contain;object-position:right top}
 .zine-stage .toned-stories-frame{position:relative;inset:auto;grid-area:video;align-self:end;width:100%;height:auto;max-height:100%;min-height:0;aspect-ratio:2.2}
}
@container toned-card (max-width:599px){
 .zine-stage .toned-sheet{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:14% auto minmax(0,1fr)18%;grid-template-areas:'masthead' 'lead' 'cover' 'video';gap:12px;padding:6px 12px 8px}
 .zine-stage .toned-masthead{position:relative;inset:auto;grid-area:masthead;width:100%;height:100%}
 .zine-stage .toned-about{position:relative;inset:auto;grid-area:lead;width:100%;font-size:20px;line-height:1.13}
 .zine-stage .toned-moving-cover{position:relative;inset:auto;grid-area:cover;justify-self:start;align-self:stretch;width:70%;max-width:70%;height:100%;min-height:0;aspect-ratio:auto;margin-left:-12px}
 .zine-stage .toned-motion-frame{height:100%;width:100%;aspect-ratio:auto}.zine-stage .toned-motion-frame video{object-fit:contain;object-position:left center}
 .zine-stage .toned-stories-frame{position:relative;inset:auto;grid-area:video;justify-self:end;align-self:stretch;width:78%;height:100%;min-height:0;aspect-ratio:auto;margin-right:-12px}
}
@container toned-card (min-width:500px) and (max-width:599px) and (max-height:540px){
 .zine-stage .toned-sheet{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-rows:23% auto minmax(0,1fr);grid-template-areas:'masthead masthead' 'lead cover' 'video cover';gap:18px;padding:16px 20px}
 .zine-stage .toned-masthead{position:relative;inset:auto;grid-area:masthead;width:100%;height:100%}
 .zine-stage .toned-about{position:relative;inset:auto;grid-area:lead;align-self:start;width:100%;font-size:clamp(20px,3.6cqw,34px);line-height:1.09}
 .zine-stage .toned-moving-cover{position:relative;inset:auto;grid-area:cover;width:100%;max-width:100%;height:100%;min-height:0;aspect-ratio:auto;margin:0}
 .zine-stage .toned-motion-frame{width:100%;height:100%;aspect-ratio:auto}.zine-stage .toned-motion-frame video{object-fit:contain;object-position:right top}
 .zine-stage .toned-stories-frame{position:relative;inset:auto;grid-area:video;align-self:end;width:100%;height:auto;max-height:100%;min-height:0;aspect-ratio:2.2;margin:0}
 .zine-stage .toned-copy-desktop,.zine-stage .toned-copy-mobile{display:none}.zine-stage .toned-copy-tablet{display:inline}
}
@container toned-card (max-height:420px){
 .zine-stage .toned-sheet{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-rows:26% auto minmax(0,1fr);grid-template-areas:'masthead cover' 'lead cover' 'video cover';gap:8px 16px;padding:8px 14px}
 .zine-stage .toned-masthead{position:relative;inset:auto;grid-area:masthead;width:100%;height:100%}
 .zine-stage .toned-about{position:relative;inset:auto;grid-area:lead;width:100%;font-size:clamp(16px,2.7cqw,24px);line-height:1.1;letter-spacing:-.02em;-webkit-text-stroke:.2px}
 .zine-stage .toned-moving-cover{position:relative;inset:auto;grid-area:cover;align-self:stretch;justify-self:end;width:100%;max-width:100%;height:100%;min-height:0;aspect-ratio:auto;margin:0}
 .zine-stage .toned-motion-frame{height:100%;width:100%;aspect-ratio:auto}.zine-stage .toned-motion-frame video{object-fit:contain;object-position:right center}
 .zine-stage .toned-stories-frame{position:relative;inset:auto;grid-area:video;justify-self:start;align-self:stretch;width:100%;height:100%;min-height:0;aspect-ratio:auto;margin:0}
 .zine-stage .toned-copy-desktop,.zine-stage .toned-copy-mobile{display:none}.zine-stage .toned-copy-tablet{display:inline}
}
@media(min-width:761px) and (min-height:600px){.zine-paper{height:min(100%,calc(min(1360px,100vw - 40px)*.7167))}}
@media(max-width:760px){body.toned-zine{padding:12px}.zine-paper{grid-template-rows:48px minmax(0,1fr)48px;padding:0 12px}.zine-margin a{font-size:22px;min-height:44px;padding-inline:2px}}
@media(max-height:450px){body.toned-zine{padding:8px}.zine-paper{grid-template-rows:44px minmax(0,1fr)44px;padding-inline:12px}.zine-margin a{font-size:20px;min-height:44px}}
@media(prefers-reduced-motion:reduce){.zine-margin a{transition:none}}