@font-face{font-family:Barlow;src:url(fonts/Barlow-Regular.ttf)}
@font-face{font-family:Barlow;src:url(fonts/Barlow-SemiBold.ttf);font-weight:600}
@font-face{font-family:"Zilla Slab";src:url(fonts/ZillaSlab-Regular.ttf)}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/IBMPlexMono-Regular.otf)}
:root{color-scheme:light;--paper:#F2E8D0;--petrol:#193F47;--vermilion:#AF3727;--ochre:#D4A439;--support:#DED5BD;--black:#121C20}
*{box-sizing:border-box}html{scroll-padding-top:16px}
body{margin:0;background:var(--paper);color:var(--petrol);font:19px/1.55 Barlow,Arial,sans-serif}
a{color:inherit;text-underline-offset:4px}a:hover{color:var(--vermilion)}
:focus-visible{outline:3px solid var(--vermilion);outline-offset:4px}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;background:var(--petrol);color:var(--paper);padding:10px 16px;z-index:2}
.wrap{max-width:1120px;margin:auto;padding:0 32px}
.masthead{border-bottom:2px solid var(--petrol)}.masthead .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px 32px;flex-wrap:wrap;padding-top:22px;padding-bottom:18px}
.masthead img{display:block;width:240px;height:auto}
.masthead nav{display:flex;gap:8px 26px;flex-wrap:wrap;font-weight:600;font-size:16px;letter-spacing:.08em;text-transform:uppercase}
.masthead nav a{text-decoration:none;padding:10px 0;border-bottom:2px solid transparent}.masthead nav a[aria-current]{border-bottom-color:var(--vermilion)}
main{padding:40px 0 64px}.eyebrow,.label{font-weight:600;font-size:14px;letter-spacing:.1em;text-transform:uppercase}
h1,h2,h3{font-family:"Zilla Slab",Georgia,serif;font-weight:400;line-height:1.15}h1{font-size:50px;margin:10px 0 16px;max-width:900px}h2{font-size:34px;margin:0 0 14px}h3{font-size:25px;margin:0 0 8px}
p{max-width:760px}.lede{font-size:23px;max-width:800px}.small{font-size:16px}
section{margin-top:56px}section:first-child{margin-top:0}
.product-name{font-weight:600;font-size:64px;line-height:1;letter-spacing:.06em;margin:14px 0 10px}
.feature{display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:center;border-top:1px solid var(--petrol);padding-top:28px}
.feature img.picture{display:block;width:100%;height:auto;background:var(--black)}
.feature .mark{display:block;width:min(100%,400px);height:auto;margin:6px 0 4px}
.attribution{font-weight:600;font-size:12px;letter-spacing:.08em;line-height:1.6;margin:0 0 16px}
.button{display:inline-block;background:var(--petrol);color:var(--paper);text-decoration:none;font-weight:600;padding:12px 22px;min-height:44px}.button:hover{background:var(--vermilion);color:var(--paper)}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:28px;border-top:1px solid var(--petrol);padding-top:24px}.pair h3 a{text-decoration-thickness:1px}
.pair a.shot{display:block;position:relative;aspect-ratio:4/3;background:var(--support);margin-bottom:14px}.pair a.shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.feature a.tile{display:block;max-width:476px}.feature a.tile img{display:block;width:100%;height:auto}
.division{border-top:2px solid var(--petrol);padding-top:20px;margin-top:48px}
.entry{display:grid;grid-template-columns:320px 1fr;gap:26px;border-top:1px solid var(--petrol);padding:24px 0}
.entry img{display:block;width:100%;height:auto}
.status{display:inline-block;background:var(--support);padding:3px 10px;font-weight:600;font-size:15px}
.player{background:var(--black);padding:10px}.player video{display:block;width:100%;height:auto;background:var(--black)}
.capture{margin:0}.capture img{display:block;width:100%;height:auto;border:1px solid var(--petrol)}
figure{margin:0}figcaption{font-size:16px;margin-top:10px;max-width:none}
.studies{display:grid;gap:44px}.study .note{font-size:16px}
.stages{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 28px;counter-reset:stage}
.stages li{border-top:1px solid var(--petrol);padding:14px 0 18px;counter-increment:stage}
.stages li::before{content:counter(stage,decimal-leading-zero);font-family:"IBM Plex Mono",monospace;font-size:14px;color:var(--vermilion);display:block}
.stages strong{display:block;font-size:20px}.stages span{font-size:16px}
table{border-collapse:collapse;width:100%;max-width:900px;font-size:17px}th,td{text-align:left;vertical-align:top;padding:12px 14px 12px 0;border-top:1px solid var(--petrol)}th{width:32%;font-weight:600}
details{border-top:1px solid var(--petrol);padding:18px 0;font-size:16px}summary{font-weight:600;font-size:19px;cursor:pointer;min-height:44px}details li{margin:8px 0}
.crumbs{font-size:15px;margin:0 0 6px}
.cellwrap{overflow-x:auto;border-top:1px solid var(--petrol);padding-top:18px}
.cell{display:grid;grid-template-columns:76px repeat(32,minmax(20px,1fr));gap:3px 2px;align-items:center;min-width:780px;font-family:"IBM Plex Mono",monospace;font-size:12px}
.cell span{height:24px}.cell .lab{font-family:Barlow,Arial,sans-serif;font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;height:auto}
.cell .beat{height:auto;text-align:center}.cell .slot{background:var(--support)}.cell .kick,.cell .snare{background:var(--petrol)}
.cell .hat{background:linear-gradient(var(--support) 30%,var(--petrol) 30% 70%,var(--support) 70%)}.cell .open{background:var(--support);box-shadow:inset 0 0 0 2px var(--petrol)}
.cell .bass{background:var(--vermilion);color:var(--paper);font-weight:600;font-size:11px;line-height:24px;text-align:center;letter-spacing:-.02em}
.cell.mini{grid-template-columns:repeat(32,1fr);gap:2px 1px;min-width:0}.cell.mini span{height:12px}.cell.mini .bass{font-size:0}
.fig-label{font-weight:600;font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 12px}
.movement{margin-top:64px}.movement h3{margin:40px 0 8px}
.fig.dark{background:#121C20;margin:22px 0 34px;padding:18px 18px 12px}.fig.dark .fig-label{color:#D4A439;margin:0 0 10px}
.fig.dark figcaption{color:#DAD6C8;font-size:16px;max-width:900px;margin-top:12px}
.plate{overflow-x:auto;scrollbar-color:#D4A439 #121C20}.plate:focus-visible{outline:3px solid #D4A439;outline-offset:2px}
.score{display:block;width:100%;min-width:860px;height:auto}.score text{font-family:Barlow,Arial,sans-serif;fill:#F2E8D0}
.score .dim{fill:#9DB5B7}.score .v{fill:#E4604B}.score .o{fill:#D4A439}.score .mono{font-family:"IBM Plex Mono",monospace}.score .vf{fill:#E4604B}
footer{border-top:2px solid var(--petrol);font-size:15px}footer .wrap{padding-top:22px;padding-bottom:40px}footer p{max-width:860px}
@media(max-width:760px){body{font-size:18px}.wrap{padding:0 16px}h1{font-size:36px}h2{font-size:28px}.lede{font-size:20px}.product-name{font-size:44px}.feature,.entry,.pair{grid-template-columns:1fr}.stages{grid-template-columns:1fr}.masthead img{width:200px}th{width:40%}.fig.dark{padding:12px 10px 8px}.movement{margin-top:48px}}