/* Signal Archive / template 03, revision 9. Monochrome navigation and native document scrolling. */
@font-face{font-family:'Space Grotesk';src:url(fonts/space-grotesk.ttf) format('truetype');font-weight:300 700;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url(fonts/ibm-plex-mono.ttf) format('truetype');font-weight:400;font-display:swap}
:root{--black:#050505;--ink:#ededed;--muted:#b4b4b4;--dim:#929292;--rule:#ffffff2b;--gutter:clamp(1.3rem,5.7vw,8rem);--nav-space:clamp(9rem,13vw,13rem);--space:clamp(6rem,10vw,12rem);font-family:'Space Grotesk',Arial,sans-serif;color:var(--ink);background:var(--black);color-scheme:dark;font-synthesis:none;scrollbar-gutter:stable}
*{box-sizing:border-box}html{scroll-behavior:auto}body{text-transform:lowercase;isolation:isolate;margin:0;font-size:1rem;line-height:1.5}button,input,select,textarea{font:inherit}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:400}a{color:inherit;text-decoration:none}button{color:inherit;background:none;border:0;padding:0;cursor:pointer}img,svg{display:block;max-width:100%}a,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}::selection{background:var(--ink);color:var(--black)}:focus-visible{outline:.1rem solid var(--ink);outline-offset:.45rem}section:focus,main:focus{outline:none}[hidden]{display:none!important}.mono{font-family:'IBM Plex Mono',monospace;font-size:.65rem;font-weight:400;line-height:1.65;letter-spacing:.08em;text-transform:lowercase}.skip-link{position:fixed;top:1rem;left:1rem;z-index:100;padding:.7rem 1rem;background:var(--ink);color:var(--black);transform:translateY(-200%)}.skip-link:focus{transform:none}
.masthead{position:fixed;inset:0 0 auto;z-index:12;padding:1.75rem var(--gutter) 1.4rem;pointer-events:none;background:linear-gradient(180deg,#050505f5 0%,#050505eb 65%,#050505aa 85%,#05050500 100%)}.wordmark{display:inline-flex;align-items:center;gap:1.3rem;pointer-events:auto;font-size:.9rem;font-weight:500;letter-spacing:.04em;white-space:nowrap;text-shadow:0 0 1rem #000}.status-light{display:inline-block;width:.3rem;height:.3rem;flex:0 0 auto;border-radius:50%;background:var(--ink);box-shadow:0 0 .6rem #ffffff66}
.section-index{position:fixed;right:clamp(1rem,2.5vw,3rem);top:50%;transform:translateY(-50%);z-index:15;width:8.5rem;display:flex;flex-direction:column;align-items:stretch;text-align:right}.section-index a{display:flex;align-items:center;justify-content:flex-end;gap:.8rem;min-height:2.75rem;height:2.75rem;font-size:.84rem;letter-spacing:-.035em;color:#adadad;transition:height .65s cubic-bezier(.2,.7,.25,1),font-size .65s cubic-bezier(.2,.7,.25,1),color .4s}.section-index a:hover{color:#fff}.section-index a[aria-current=location]{height:4.2rem;font-size:clamp(1.4rem,1.85vw,1.9rem);color:#fff}.section-index a>span{transition:translate .4s;text-shadow:0 0 .8rem #000,0 .1rem .25rem #000}.section-index a:hover>span{translate:-.15rem 0}.section-index i{position:relative;display:block;flex:0 0 auto;width:.16rem;height:.16rem;border-radius:50%;background:currentColor;opacity:.5;transition:width .6s,height .6s,opacity .6s,box-shadow .6s}.section-index a[aria-current] i{width:.25rem;height:1.35rem;border-radius:1rem;opacity:1;background:linear-gradient(#fff,#a7a7a7);box-shadow:0 0 1rem #ffffff44}.section-index .nav-pressed i:after{content:'';position:absolute;inset:-.3rem;border:.0625rem solid #ffffff80;border-radius:inherit;animation:index-ping .6s ease-out both}@keyframes index-ping{to{opacity:0;scale:2}}
.hardware-button{font-family:'IBM Plex Mono',monospace;font-size:.65rem;letter-spacing:.025em;display:inline-flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:2.75rem;transition:transform .15s,color .25s,background .25s}.hardware-button:active{transform:translateY(.1rem)}


main{position:relative;z-index:1;margin-left:var(--gutter);margin-right:var(--nav-space)}
.chapter{position:relative;scroll-margin-top:5rem;max-width:112rem;margin-inline:auto}
.opening{padding-top:7rem;min-height:100svh;display:flex;flex-direction:column;padding-bottom:2rem}
.hero-composition{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;flex:1;padding-bottom:1rem}
.hero-stage{position:relative;isolation:isolate;overflow:visible;container-type:inline-size;width:min(100%,50rem,74svh);aspect-ratio:1.1;margin:auto;transform-origin:center}
.hero-title-layer h1{display:contents;font-size:clamp(2rem,18cqi,8.5rem);font-weight:400;line-height:1;letter-spacing:-.08em;color:#f3f3f3}
.hero-title-layer h1>span{position:absolute;display:block;left:6%;top:10%;z-index:1;white-space:nowrap;will-change:transform;text-shadow:0 .018em .055em #000,0 -.018em .045em #000}.hero-title-layer h1>span+span{left:auto;top:auto;right:2%;bottom:9%;z-index:3}
.js-motion .hero-title-layer h1>span{animation:type-arrive 1.25s cubic-bezier(.16,1,.3,1) both}.js-motion .hero-title-layer h1>span+span{animation-delay:.13s}
@keyframes type-arrive{from{opacity:0;translate:0 .15em}to{opacity:1;translate:0 0}}
.hero-caption{position:relative;z-index:5;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:clamp(1.5rem,3vw,3rem);width:min(100%,60rem);margin-inline:auto}
.hero-intro{color:var(--muted);font-size:clamp(.8rem,1.05vw,1rem);line-height:1.6}.hero-listen{margin:0}
.record-exhibit{position:absolute;left:6%;top:2%;width:88%;min-width:0;z-index:2;pointer-events:none}.record-exhibit .interactive-art{pointer-events:auto}
.disc-motion{position:relative;width:100%;margin:auto;will-change:transform;isolation:isolate;overflow:clip}
.asset-filters{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}.vinyl-face{position:relative;aspect-ratio:735 / 736;width:100%;isolation:isolate;filter:url(#art-edge-alpha)}.vinyl-face>img{display:block;width:100%;height:auto;object-fit:contain;-webkit-mask-image:url(assets/vinyl-stencil.jpg);mask-image:url(assets/vinyl-stencil.jpg);mask-mode:luminance;mask-size:100% 100%;mask-repeat:no-repeat}.vinyl-spin{display:block;width:100%;height:auto;transform-origin:50% 50%;animation:record-spin 16s linear infinite;animation-play-state:paused;will-change:transform}
@keyframes record-spin{to{transform:rotate(1turn)}}
.art-motion[data-running=true] .vinyl-spin,.art-motion[data-running=true] .deck-outer,.art-motion[data-running=true] .deck-marker{animation-play-state:running}
.inspect-button{min-width:10rem}
.inspect-icon{display:grid;place-items:center;width:2.5rem;height:2.5rem;border:.0625rem solid var(--rule);border-radius:50%;font-size:1rem;transition:border-color .3s,box-shadow .4s,translate .3s}
.inspect-button:hover .inspect-icon{border-color:#c5dfff;box-shadow:0 0 1.8rem #90c0ff35;translate:.15rem -.15rem}
.opening-scroll{display:grid;place-items:center;align-self:flex-start;margin-top:1rem;min-height:3rem;min-width:2.75rem;color:var(--muted);padding:.6rem .5rem}.opening-scroll svg{width:1.1rem;height:1.1rem}.opening-scroll:hover{color:#fff}
.section-heading h2,.chapter h2{font-size:clamp(2.5rem,5.2vw,6.3rem);line-height:1.05;letter-spacing:-.065em}
.mixes-section{padding-top:var(--space)}
.mixes-layout{display:grid;grid-template-columns:1fr 1.08fr;align-items:center;gap:clamp(2.5rem,5vw,6rem);margin-top:clamp(3rem,6vw,7rem)}
.deck-exhibit{min-width:0}.deck-art{position:relative;aspect-ratio:1;isolation:isolate;width:100%;max-width:36rem;margin:auto;overflow:clip}
.deck-geometry{display:block;width:100%;height:100%;overflow:visible}.deck-layer{transform-box:view-box;transform-origin:300px 300px}.deck-outer{animation:deck-counter 10s linear infinite;animation-play-state:paused;will-change:transform}.deck-marker{animation:deck-clockwise 5s linear infinite;animation-play-state:paused;will-change:transform}
@keyframes deck-clockwise{to{transform:rotate(1turn)}}@keyframes deck-counter{to{transform:rotate(-1turn)}}
.mix-listening{min-width:0}.soundcloud-player{display:block;width:100%;height:clamp(22rem,34vw,28rem);border:0;background:#f2f2f2;filter:grayscale(1) invert(1);color-scheme:normal}.player-link{margin-top:1.4rem}
.text-link{display:inline-flex;align-items:center;justify-content:space-between;gap:2.5rem;font-size:.85rem;min-height:2.75rem;line-height:1.3;border-bottom:.0625rem solid var(--rule);transition:border-color .3s,color .3s}
.text-link:hover{border-color:#adcfff;color:#d6e8ff}.text-link>span{font-size:1.1rem;transition:transform .4s}.text-link:hover>span{transform:translate(.2rem,-.2rem)}
.music-section{padding-block:var(--space);display:grid;grid-template-columns:.65fr 1.35fr;gap:clamp(3rem,6vw,7rem)}
.release-message{font-size:clamp(2rem,4.2vw,4.5rem);line-height:1.08;letter-spacing:-.055em;max-width:13ch}
.release-note{font-size:1rem;max-width:34ch;color:var(--muted);margin-top:2rem}
.release-platforms{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding:0;margin:3.5rem 0 0}
.release-platforms li{display:flex;justify-content:space-between;align-items:baseline;gap:.7rem;border-top:.0625rem solid var(--rule);padding-top:1.2rem;font-size:.8rem;color:var(--muted)}
.pending-mark{color:var(--dim)}.release-status{margin-top:1.5rem;color:var(--dim)}
.audio-section{padding-top:2rem;padding-bottom:var(--space)}.audio-section h2{font-size:clamp(2.5rem,4.7vw,5.75rem)}
.oscilloscope{width:100%;margin:clamp(3rem,6vw,7rem) auto 3rem;background:transparent;border:0;padding:clamp(.5rem,2vw,2rem)}
.oscilloscope svg{width:100%;height:auto;overflow:visible}.scope-line,.scope-soft{fill:none;stroke:#e9eff0;stroke-linejoin:round;stroke-linecap:round}.scope-line{stroke-width:1.65}.scope-soft{stroke-width:3;opacity:.45}
.js-motion .oscilloscope.in-view .scope-line{animation:trace-arrive 1.7s ease-out both;animation-play-state:paused}.js-motion .oscilloscope.in-view[data-running=true] .scope-line{animation-play-state:running}@keyframes trace-arrive{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
.project-entry{width:100%;border-block:.0625rem solid var(--rule);display:grid;grid-template-columns:1.7fr 1fr auto;gap:2rem;align-items:center;text-align:left;padding:2.6rem 0;transition:border-color .4s}
.project-entry:hover{border-color:#b7d7ff88}.project-name{font-size:clamp(1.7rem,3vw,3.4rem);line-height:1.1;letter-spacing:-.055em}.project-state{display:flex;align-items:center;gap:.8rem;color:var(--muted)}.entry-arrow{font-size:1.7rem;transition:transform .4s,color .4s}.project-entry:hover .entry-arrow{transform:translate(.2rem,-.2rem);color:#bcdcff}.bench-note{color:var(--dim);text-align:right;margin-top:1.5rem}

.contact-section{border-top:.0625rem solid var(--rule);padding-block:clamp(6rem,10vw,11rem);min-height:90svh;display:grid;grid-template-columns:.9fr 1.5fr;gap:clamp(3rem,6vw,7rem)}.contact-heading h2{font-size:clamp(4rem,6.8vw,8rem);margin-top:0}.contact-heading>p:last-child{font-size:.85rem;color:var(--muted);margin-top:1.5rem}.contact-body{min-width:0}.email-link{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:clamp(1.4rem,2.7vw,3.25rem);line-height:1.3;letter-spacing:-.055em;min-height:3rem}.email-link [data-email-text]{overflow-wrap:anywhere;min-width:0}.email-link>span:last-child{flex:0 0 auto}.social-links{display:flex;gap:2rem;flex-wrap:wrap;margin-top:3rem;margin-bottom:4rem;font-size:.9rem;color:var(--muted)}.social-links a:hover{color:var(--ink)}details{border-block:.0625rem solid var(--rule)}summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;list-style:none;min-height:5.5rem;font-size:.95rem}summary::-webkit-details-marker{display:none}summary>span{margin-inline-end:.5rem;transition:transform .3s}details[open] summary>span{transform:rotate(45deg)}form{padding:1.5rem 0 2.5rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:2rem}label{display:block;margin-bottom:1.75rem;color:var(--muted);font-size:.75rem}input,select,textarea{background:transparent;border:0;border-bottom:.0625rem solid var(--rule);border-radius:0;color:var(--ink);display:block;width:100%;font-size:1rem;line-height:1.5;padding:.6rem 0;margin-top:.5rem}input::placeholder,textarea::placeholder{color:var(--dim)}select option{background:var(--black);color:var(--ink)}textarea{resize:vertical}.draft-button{border:.0625rem solid #ffffff66;padding:.4rem 1rem;min-width:min(13rem,100%)}.draft-button:hover{background:#ffffff0c}.form-note{color:var(--dim);font-size:.7rem;margin-top:1rem}#form-status{color:var(--muted);font-size:.8rem;max-width:45ch;margin-top:1rem}#email-fallback{margin-top:1rem}
.site-footer{position:relative;z-index:1;border-top:.0625rem solid var(--rule);margin-left:var(--gutter);margin-right:var(--nav-space);padding-block:1.7rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;color:var(--dim)}.site-footer button{font:inherit;color:inherit}.site-footer a:hover,.site-footer button:hover{color:var(--ink)}
.not-found{min-height:100svh;max-width:60rem;margin:0 auto;padding:7rem var(--gutter) 4rem;display:flex;flex-direction:column;justify-content:center;gap:1.5rem}
.not-found h1{font-size:clamp(3rem,9vw,7rem);line-height:1.05;letter-spacing:-.065em}
.not-found p{color:var(--muted);max-width:32ch}.not-found>a{margin-top:1rem;align-self:flex-start;padding:.75rem 0;border-bottom:1px solid var(--rule)}
dialog{background:#090909;color:var(--ink);border:.0625rem solid #ffffff4a;padding:2rem;width:min(90vw,45rem);max-height:90svh;box-shadow:0 2rem 10rem #0009}dialog::backdrop{background:#000d}html:has(dialog[open]){overflow:hidden}.dialog-topline{display:flex;justify-content:space-between;align-items:center;gap:2rem;color:var(--muted)}.close-button{min-width:4.5rem}.close-button>span{font-size:1.2rem}.dialog-topline+h2{font-size:clamp(1.7rem,3vw,3rem);line-height:1.1;letter-spacing:-.05em;margin-top:2rem}#detail-dialog[data-view=study]{width:min(92vw,70rem)}#study-view .vinyl-face{width:min(100%,62svh);margin:0 auto}#study-view img{width:100%;height:auto;object-fit:contain}#text-view{font-size:1.1rem;line-height:1.65;color:var(--muted);max-width:45ch;margin-top:2rem}#text-view>p+p{margin-top:1.2rem}.detail-contact{margin-top:2rem}dialog[open]{animation:dialog-enter .24s ease-out both}dialog.is-closing{animation:dialog-exit .18s ease-in both}.js-motion .reveal{opacity:0;transform:translateY(.8rem);transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1)}.js-motion .reveal.in-view{opacity:1;transform:none}.motion-off .hero-title-layer,.motion-off .disc-motion{transform:none!important;will-change:auto}@keyframes dialog-enter{from{opacity:0;transform:translateY(.8rem)}to{opacity:1;transform:none}}@keyframes dialog-exit{to{opacity:0;transform:translateY(.4rem)}}


@media(max-width:58rem){
  :root{--nav-space:9rem;--space:clamp(4rem,8vw,6rem)}
  .section-index{width:7rem;right:1.3rem}.section-index a[aria-current]{font-size:1.5rem}
  .opening{padding-top:5.5rem;min-height:0;padding-bottom:.75rem}
  .hero-composition{flex:initial;gap:1.5rem;padding-bottom:0}.hero-stage{margin:0 auto}
  .hero-title-layer h1{position:absolute;inset:0;display:block;z-index:3;pointer-events:none;font-size:clamp(2.25rem,20.5cqi,8.5rem)}
  .hero-caption{grid-template-columns:1fr auto;gap:.75rem 1.5rem}.hero-intro{grid-column:1/-1}
  .chapter h2,.audio-section h2{font-size:clamp(3rem,7.2vw,5rem)}
  .mixes-layout{grid-template-columns:1fr 1.1fr;gap:2rem;margin-top:2.5rem}
  .music-section{grid-template-columns:.6fr 1.4fr;gap:2rem}
  .release-platforms{grid-template-columns:1fr;gap:1rem;margin-top:1.5rem}.release-platforms li{padding-top:.8rem}
  .oscilloscope{margin:2.25rem auto 2rem}
  .project-entry{grid-template-columns:1fr auto;gap:1rem;padding-block:2rem}.project-state{grid-column:1;grid-row:2}.entry-arrow{grid-column:2;grid-row:1/3}
  .contact-section{gap:2rem;padding-block:var(--space);min-height:0}.contact-heading h2{font-size:clamp(3.5rem,8.5vw,6rem)}
  .email-link{font-size:clamp(1.2rem,2.8vw,2rem)}.social-links{margin-block:2rem 2.5rem}summary{min-height:4.25rem}
  .site-footer{font-size:.6rem}
}
@media(max-width:43rem){
  :root{--gutter:1.3rem;--nav-space:5.7rem;--space:4.5rem}
  .masthead{padding-top:1.4rem}.wordmark{font-size:.78rem;gap:.8rem}
  .section-index{right:.7rem;width:4.3rem}.section-index a{font-size:.65rem;min-height:2.75rem;height:2.75rem;gap:.45rem}.section-index a[aria-current]{height:3.3rem;font-size:1.05rem}.section-index i{width:.12rem;height:.12rem}.section-index a[aria-current] i{width:.18rem;height:1.1rem}
  .opening{padding-top:5rem}.hero-composition{gap:1.25rem}.hero-stage{width:100%;flex:0 0 auto}
  .hero-caption{display:flex;flex-direction:column;align-items:stretch;gap:.75rem;width:100%}.hero-intro{font-size:.85rem}.hero-listen{font-size:.8rem;margin:0}.hero-caption .inspect-button{max-width:none}
  .inspect-button{min-width:0;max-width:12rem;font-size:.65rem;gap:1.4rem}.inspect-icon{width:2rem;height:2rem}.opening-scroll{margin-top:.75rem}
  .chapter h2,.audio-section h2{font-size:clamp(2.75rem,12vw,4.5rem)}
  .mixes-layout{grid-template-columns:1fr;gap:1.75rem;margin-top:2rem}.deck-exhibit{width:100%;max-width:25rem;margin:auto}.soundcloud-player{height:22rem}.player-link{font-size:.8rem;margin-top:1rem}
  .music-section{grid-template-columns:1fr;gap:2rem}.release-message{font-size:clamp(1.9rem,8vw,3.5rem)}.release-note{font-size:.85rem;margin-top:1rem}.release-platforms{gap:1rem;margin-top:1.5rem}.release-platforms li{font-size:.8rem}.release-status{font-size:.6rem}
  .oscilloscope{margin:2rem auto 1.5rem;padding:.7rem .35rem}.project-entry{padding-block:1.4rem;gap:.8rem .7rem}.project-name{font-size:clamp(1.4rem,6vw,2rem)}.project-state{font-size:.55rem;gap:.5rem}.bench-note{font-size:.6rem;text-align:left;max-width:31ch;margin-top:1rem}
  .contact-section{grid-template-columns:1fr;gap:2rem;padding-block:4rem 3.5rem}.contact-heading h2{font-size:clamp(3rem,14vw,4.75rem);margin-top:0}.contact-heading>p:last-child{font-size:.85rem;margin-top:1rem}
  .email-link{font-size:clamp(.9rem,4.1vw,1.6rem);gap:.8rem}.social-links{gap:1rem;font-size:.75rem;margin-block:1.5rem 2rem}.form-row{grid-template-columns:1fr;gap:0}
  .site-footer{display:grid;grid-template-columns:1fr 1fr;gap:1rem;font-size:.55rem}.site-footer>*:last-child{grid-column:1/-1}
  dialog{padding:1.2rem;max-height:92svh}.dialog-topline{gap:1rem;font-size:.6rem}.close-button{min-width:4rem;font-size:.65rem}.dialog-topline+h2{margin-top:1.3rem}#study-view .vinyl-face{width:min(100%,58svh)}#text-view{font-size:1rem}.hardware-button{min-height:2.75rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1!important;transform:none!important}.hero-title-layer,.disc-motion{transform:none!important;will-change:auto}.vinyl-spin,.deck-outer,.deck-marker{animation:none!important;will-change:auto}.hero-word-broken,.hero-word-vnyl{transform:none!important;will-change:auto}}
