/* Reduce the empty space above the strip without changing its content. */
section.marquee-section{padding-top:20px}
@media(max-width:767px){section.marquee-section{padding-top:22px}}
/* Desktop and tablet notes window. Phones keep the original plain strip. */
@media(min-width:768px){
 .marquee-section .marquee-item>button{display:inline-block;border:0;padding:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;line-height:inherit;text-align:left;cursor:pointer}
 .marquee-section .marquee-item>button:focus-visible{outline:1px solid currentColor;outline-offset:7px}
 .marquee-section.is-method-reading .marquee-track{animation-play-state:paused}
}
.marquee-method-window{position:fixed;z-index:180;width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;border:1px solid var(--theme-line,#babcb9);background:var(--paper,#ececec);color:var(--ink,#131313);box-shadow:0 10px 32px #00000018;font-family:Apparat,Arial,sans-serif}
.marquee-method-window[hidden]{display:none}
.marquee-window-bar{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;padding-left:18px;border-bottom:1px solid var(--theme-line,#c9cbc8);background:var(--paper,#ececec);z-index:1}
.marquee-window-bar>h3{min-width:0;margin:0;padding:10px 0;font-size:20px;font-weight:300;line-height:1.2;letter-spacing:-.025em;overflow-wrap:anywhere}
.marquee-window-bar>button{flex-shrink:0;width:44px;min-height:44px;border:0;border-left:1px solid var(--theme-line,#c9cbc8);background:transparent;color:inherit;font-size:22px;cursor:pointer}
.marquee-window-bar>button:hover{background:var(--ink,#131313);color:var(--paper,#ececec)}
.marquee-window-bar>button:focus-visible{outline:1px solid currentColor;outline-offset:-4px}
.marquee-window-body{padding:20px 22px 22px;counter-reset:method-note}
.marquee-window-body article{position:relative;padding-left:32px;counter-increment:method-note}
.marquee-window-body article::before{position:absolute;top:0;left:0;color:var(--muted,#797979);font:400 11px/1.5 Apparat,Arial,sans-serif;content:counter(method-note,decimal-leading-zero)}
.marquee-window-body article+article::before{top:16px}
.marquee-window-body article+article{margin-top:18px;padding-top:16px;border-top:1px solid var(--theme-line,#c9cbc8)}
.marquee-window-body h4{margin:0 0 9px;color:var(--ink,#131313);font-size:14px;font-weight:600;line-height:1.35;letter-spacing:0}
.marquee-window-body p{margin:0;color:var(--muted,#686868);font-size:14px;line-height:1.6;overflow-wrap:anywhere}
html[data-site-theme="dark"] .marquee-method-window{background:#181818;color:#ececec;border-color:#3b3b3b;box-shadow:0 12px 36px #0007}
html[data-site-theme="dark"] .marquee-window-bar{background:#202020;border-color:#3b3b3b}
html[data-site-theme="dark"] .marquee-window-body article+article,html[data-site-theme="dark"] .marquee-window-bar>button{border-color:#3b3b3b}
html[data-site-theme="dark"] .marquee-window-body p{color:#a4a4a4}
@media(max-width:767px){.marquee-method-window{display:none!important}}
@media(min-width:768px) and (prefers-reduced-motion:reduce){
 .marquee-section .marquee-track{animation:none;width:100%;max-width:100%;overflow-x:auto;padding:12px 0}
 .marquee-section .marquee-copy{flex-shrink:0}
 .marquee-section .marquee-copy[aria-hidden="true"]{display:none}
}
/* Outline first, then paper and notes. */
.marquee-method-window{--method-paper:var(--paper,#ececec);--method-line:var(--theme-line,#babcb9)}
html[data-site-theme="dark"] .marquee-method-window{--method-paper:#181818;--method-line:#3b3b3b}
.marquee-method-window.is-opening:not([hidden]){animation:marquee-paper-reveal 800ms ease both}
.marquee-method-window.is-opening:not([hidden])::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;background:linear-gradient(var(--method-line),var(--method-line)) left top/0 1px no-repeat,linear-gradient(var(--method-line),var(--method-line)) right top/1px 0 no-repeat,linear-gradient(var(--method-line),var(--method-line)) right bottom/0 1px no-repeat,linear-gradient(var(--method-line),var(--method-line)) left bottom/1px 0 no-repeat;animation:marquee-frame-build 800ms cubic-bezier(.22,.61,.36,1) both}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-bar{animation:marquee-content-reveal 320ms ease 440ms both}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article{animation:marquee-content-reveal 340ms ease both}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article:nth-child(1){animation-delay:500ms}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article:nth-child(2){animation-delay:570ms}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article:nth-child(3){animation-delay:640ms}
@keyframes marquee-frame-build{
 0%{background-size:0 1px,1px 0,0 1px,1px 0;opacity:1}
 30%{background-size:100% 1px,1px 0,0 1px,1px 0}
 55%{background-size:100% 1px,1px 100%,0 1px,1px 0}
 78%{background-size:100% 1px,1px 100%,100% 1px,1px 100%;opacity:1}
 100%{background-size:100% 1px,1px 100%,100% 1px,1px 100%;opacity:0}
}
@keyframes marquee-paper-reveal{0%,55%{background-color:transparent;border-color:transparent;box-shadow:0 10px 32px #0000}100%{background-color:var(--method-paper);border-color:var(--method-line)}}
@keyframes marquee-content-reveal{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.marquee-method-window.is-opening:not([hidden]),.marquee-method-window.is-opening:not([hidden]) .marquee-window-bar,.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article{animation:none}.marquee-method-window::after{display:none}}

/* Fine internal rules follow the outer contour. */
.marquee-method-window.is-opening:not([hidden]) .marquee-window-bar{border-bottom-color:transparent}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-bar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--method-line);transform-origin:left;animation:marquee-rule-reveal 380ms ease 460ms both}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article+article{border-top-color:transparent}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article+article::after{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:var(--method-line);transform-origin:left;animation:marquee-rule-reveal 380ms ease 580ms both}
.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article:nth-child(3)::after{animation-delay:650ms}
@keyframes marquee-rule-reveal{from{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.marquee-method-window.is-opening:not([hidden]) .marquee-window-bar::after,.marquee-method-window.is-opening:not([hidden]) .marquee-window-body article+article::after{animation:none}}
