/* SHUXSYN / an interactive personal wall */
:root{--navy:#090d12;--ink:#06080b;--paper:#d9dde2;--steel:#8c99aa;--line:#ffffff20}body{background-color:var(--navy);background-image:linear-gradient(#a7bbda04 1px,transparent 1px),linear-gradient(90deg,#a7bbda04 1px,transparent 1px);background-size:46px 46px}header{height:68px;margin:0 3%;border-bottom-color:#ffffff13;gap:25px}.brand{font-family:'Courier New',monospace;font-size:17px;letter-spacing:-1px;font-weight:400}.location{font-size:9px;color:#788291}nav{font-size:10px;gap:25px}nav a[aria-current=page]:after{height:1px;background:#b4c5d9}.home-wall .page{padding:0;animation:none}.universe{height:calc(100svh - 105px);min-height:790px;max-height:1150px;position:relative;overflow:hidden;font-family:'Courier New',monospace;background:radial-gradient(ellipse at 50% 48%,#1c2c411c,transparent 52%);--mx:0;--my:0}.universe:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background-image:url("data:image/svg,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.87' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.15' d='M0 0h180v180H0z'/%3E%3C/svg%3E");opacity:.12}.frame-corner{position:absolute;width:13px;height:24px;border-color:#ffffff38;border-style:solid;pointer-events:none}.tl{left:17px;top:15px;border-width:2px 0 0 2px}.tr{right:17px;top:15px;border-width:2px 2px 0 0}.bl{left:17px;bottom:25px;border-width:0 0 2px 2px}.br{right:17px;bottom:25px;border-width:0 2px 2px 0}.wall-top{position:absolute;left:7%;right:27%;top:35px;display:grid;grid-template-columns:1.1fr 1.1fr 1fr;gap:5%;z-index:3;font-size:12px;line-height:1.8;color:#929aa4}.wall-top b{display:block;font-size:11px;color:#d9dde2;letter-spacing:.03em;margin-bottom:8px}.wall-top span,.wall-top a{display:block}.wall-top a:hover{color:#fff}.wall-online{position:absolute;right:5%;top:30px;font-size:9px;color:#9aa4b1;display:flex;gap:9px;align-items:center}.wall-online i{width:5px;height:5px;border-radius:50%;background:#9aaea0;box-shadow:0 0 8px #9aaea05a;animation:online 4s infinite}.coordinate{position:absolute;color:#637080;font-size:8px;letter-spacing:.02em}.coord-a{top:24%;left:3%}.coord-b{bottom:16%;right:3%}.wall-whisper{position:absolute;right:7%;top:23%;font-size:11px;color:#8d96a2;letter-spacing:.05em;z-index:5}.ghost-note{font-family:Arial,sans-serif;font-weight:700;font-size:clamp(60px,8vw,140px);letter-spacing:-.07em;position:absolute;left:27%;top:17%;color:#a5b4ca0e;transform:rotate(-13deg);z-index:1;transition:color .4s}.ghost-note:hover{color:#a5b4ca30}.name-cloud{position:absolute;top:38%;left:34%;width:38%;z-index:5;pointer-events:none;transform:translate(calc(var(--mx)*-8px),calc(var(--my)*-8px))}.name-cloud h1{font-family:Arial,Helvetica,sans-serif;font-weight:400;font-size:clamp(70px,7.4vw,132px);line-height:1;letter-spacing:-.075em;margin:0;position:relative;white-space:nowrap;color:#e0e2e7;text-shadow:0 0 25px #c6d3e00b}.name-star{font-size:23px;vertical-align:top;margin-left:9px;display:inline-block;animation:turn 30s linear infinite;color:#8297b5}.name-echo{position:absolute;inset:0;font-family:Arial,Helvetica,sans-serif;font-size:clamp(70px,7.4vw,132px);font-weight:400;letter-spacing:-.075em;line-height:1}.name-echo span{position:absolute;top:0;left:0;color:#dce7f1;opacity:calc(.19 - var(--i)*.022);filter:blur(calc(var(--i)*.65px));transform:translate(calc(var(--i)*12px),calc(var(--i)*20px));animation:echo-wave 8s ease-in-out infinite;animation-delay:calc(var(--i)*-.18s)}.name-caption{font-size:9px;line-height:1.8;letter-spacing:.07em;color:#8994a3;margin-top:23px;position:relative}.wall-object{position:absolute;z-index:4;will-change:transform;translate:calc(var(--mx)*var(--depth,0)*1px) calc(var(--my)*var(--depth,0)*1px);transition:filter .3s}.wall-object:hover{filter:brightness(1.14);z-index:8}.draggable{cursor:grab;touch-action:none;user-select:none}.draggable.dragging{cursor:grabbing;z-index:15;filter:brightness(1.2)}.object-caption{display:block;font-size:9px;letter-spacing:.05em;text-align:center;color:#a2acb9;margin-top:12px}.chrome-object{width:20%;max-width:300px;left:6%;top:29%;transform:rotate(-14deg);--depth:22}.chrome-spin{animation:float-star 9s ease-in-out infinite;filter:drop-shadow(8px 20px 15px #000b)}.chrome-spin svg{display:block;width:100%;height:auto}.chrome-object .object-caption{transform:rotate(14deg);margin-top:15px}.vinyl-object{width:19%;max-width:290px;right:20%;top:33%;--depth:-15;transform:rotate(13deg)}.vinyl{width:100%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#11151b 0,#11151b 2px,#2c333d 2.5px,#0a0e14 3.5px);box-shadow:10px 22px 35px #000a,inset 0 0 0 1px #9aa6b340,inset 0 0 0 9px #080b0e;position:relative;animation:turn 32s linear infinite}.vinyl:after{content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(transparent 0deg,#d1e5ff25 42deg,transparent 70deg,transparent 180deg,#d1e5ff25 215deg,transparent 245deg);pointer-events:none}.vinyl-label{position:absolute;inset:32%;border-radius:50%;background:#9eafc4;color:#111923;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:5px;font-weight:700;font-size:10px;line-height:1.15}.vinyl-label i{width:9px;height:9px;border-radius:50%;background:#080c12;border:2px solid #73849a}.vinyl-label small{font-size:4px;letter-spacing:.1em}.vinyl-sticker{position:absolute;top:75%;right:-20%;font:italic 19px/1.05 Georgia,serif;color:#c1cddd;transform:rotate(-20deg);border-bottom:1px solid #ffffff2a;padding-bottom:7px}.vinyl-object .object-caption{margin-top:25px;font-size:8px}.portrait-object{width:15%;right:5%;top:11%;transform:rotate(-5deg);--depth:12}.portrait-sheet{background:#b5bdc6;padding:8px 8px 25px;box-shadow:10px 12px 0 #8290a512,16px 20px 30px #0008;position:relative}.portrait-art{aspect-ratio:.82;background:#151e29;overflow:hidden;position:relative;background-image:radial-gradient(ellipse at 65% 30%,#4d6079,transparent 65%)}.portrait-symbol{position:absolute;left:-12%;top:5%;font:bold italic clamp(100px,17vw,270px)/1 Georgia,serif;letter-spacing:-.15em;color:#d1d7e0;filter:blur(1px);mix-blend-mode:screen;transform:rotate(12deg);opacity:.65}.portrait-symbol span{font-style:normal;position:absolute;left:35%;top:20%;color:#566b87}.portrait-sheet img{width:100%;aspect-ratio:.82;object-fit:cover;filter:grayscale(1);display:block}.scan-lines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#0000 0,#0000 3px,#07101a60 4px)}.scan-lines:after{content:'';position:absolute;left:0;right:0;height:2px;background:#b8cee24a;animation:scan 9s linear infinite}.photo-note{position:absolute;bottom:8px;right:10px;font-size:7px;color:#1e2a39}.tape{position:absolute;top:-9px;left:31%;width:38%;height:26px;background:#cad5dc30;backdrop-filter:blur(3px);transform:rotate(-5deg);z-index:3;border-left:1px dashed #d5dde530;border-right:1px dashed #d5dde530}.scribble{font:italic 17px Georgia,serif;display:block;text-align:center;color:#9da5b1;margin-top:18px;transform:rotate(5deg)}.project-object{width:24%;max-width:355px;left:32%;top:67%;transform:rotate(-4deg);--depth:8}.project-sheet{background:#b6c0cc;padding:7px;box-shadow:8px 15px 25px #0008}.type-poster{height:clamp(150px,14vw,225px);background:#1b2d45;color:#ced8e6;position:relative;padding:15px;overflow:hidden}.type-poster:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,#090f1730 3px);pointer-events:none}.type-poster small{font-size:7px;letter-spacing:.12em;position:absolute;right:12px;top:13px;writing-mode:vertical-rl}.type-poster strong{font:900 clamp(26px,3.25vw,53px)/.87 Arial,sans-serif;letter-spacing:-.06em;display:block}.type-poster strong i{font-family:Georgia,serif;font-weight:400}.type-poster>span{font-size:5px;position:absolute;bottom:7px;left:15px;letter-spacing:.04em}.project-sheet img{width:100%;height:220px;object-fit:cover}.project-strip{color:#142035;font-size:8px;padding:9px 5px 3px;display:flex;justify-content:space-between}.cross-object{right:5%;top:60%;width:18%;transform:rotate(6deg);--depth:-8;display:flex;flex-direction:column;align-items:center;gap:4px;color:#a3b2c5}.cross-outline{font:130px/.85 Arial,sans-serif;color:transparent;-webkit-text-stroke:.7px #9fb3ce65;animation:copyright-drift 7s ease-in-out infinite}.cross-object>span:nth-child(2){font-size:18px;line-height:1.15;transform:rotate(-13deg);margin-top:-7px}.cross-object small{font-size:6px;margin-top:14px;letter-spacing:.06em}.cassette-object{width:18%;max-width:255px;left:7%;top:68%;transform:rotate(10deg);--depth:16}.cassette{height:clamp(100px,10vw,150px);background:linear-gradient(135deg,#283546,#111922 50%,#303e50);border-radius:9px;border:1px solid #586a7b;box-shadow:inset 0 0 0 5px #101925,12px 19px 25px #000b;position:relative;padding:10px 13px;overflow:hidden}.screw{position:absolute;color:#8491a1;font-size:9px;top:1px}.s1{left:5px}.s2{right:5px}.cassette-label{background:#a5b1c2;color:#0f1c2d;height:76%;padding:7px 8px;text-align:center;border-radius:4px 4px 15px 15px;display:flex;flex-direction:column;justify-content:space-between}.cassette-label small{font-size:5px;letter-spacing:.05em}.cassette-label b{font:italic clamp(10px,1.4vw,19px) Georgia,serif}.tape-window{display:flex;align-items:center;justify-content:space-between;background:#142031;border-radius:20px;padding:2px 6px;margin:4px 0;height:29px}.tape-window i{width:22px;height:22px;border:5px dashed #b7c6d4;border-radius:50%;animation:turn 7s linear infinite;flex-shrink:0}.tape-window span{width:34%;height:14px;background:linear-gradient(90deg,#060a0e 50%,#46556a 50%);border:1px solid #647386}.cassette-base{position:absolute;bottom:-8px;left:23%;width:54%;height:24%;border:1px solid #6c7a8b45;transform:perspective(80px) rotateX(30deg)}.cassette-object .object-caption{font-size:8px}.loose-note{position:absolute;z-index:2;font-size:11px;line-height:1.7;color:#8792a2}.note-one{left:8%;top:58%;transform:rotate(-7deg)}.note-two{right:31%;bottom:14%;font-size:13px;transform:rotate(9deg)}.note-two i{font-family:Georgia,serif;font-size:20px;color:#adb7c5}.sound-doodle{position:absolute;left:28%;top:42%;display:flex;align-items:center;gap:3px;transform:rotate(-90deg);height:38px}.sound-doodle i{height:max(3px,var(--h));width:2px;background:#a2b4ce60;animation:wave-bar 2s ease-in-out infinite alternate;animation-delay:var(--delay)}.wall-bottom{position:absolute;left:4%;right:4%;bottom:25px;display:flex;justify-content:space-between;align-items:center;font-size:8px;color:#768496;z-index:6}.wall-bottom button{font:inherit;border-bottom:1px solid #ffffff35;padding:6px 0;color:#aab5c4}.wall-enter{border:1px solid #a6b5c954;padding:11px 18px;color:#bec9d7;transition:background .2s}.wall-enter:hover{background:#a6b5c91c}.scroll-hint{position:absolute;bottom:75px;left:47%;text-align:center;font-size:8px;line-height:1.7;color:#8a96a5;z-index:8}.scroll-hint span{display:inline-block;animation:scroll-bob 3s infinite;font-size:18px}.wall-archive{padding:20px 7% 95px;border-top:1px solid #ffffff18}.wall-archive .section-head{margin-top:55px}.section-head h2,.page-title{font-family:Arial,sans-serif;font-weight:400}.wall-archive .projects{gap:12%}.wall-archive .project:first-child{transform:rotate(-2deg)}.wall-archive .project:nth-child(2){transform:rotate(3deg);padding-top:100px}.wall-archive .project .media{border:8px solid #a6afba;min-height:320px}.wall-archive .project:nth-child(2) .media{border-color:#344153}.project .media{background:#101a27}.placeholder{background:none!important}.placeholder b{font-family:'Courier New',monospace;font-weight:400;color:#677d9a}.big-quote{border-color:#ffffff20}.big-quote h2{font-family:Georgia,serif;font-style:italic}.recognition{background:#a9b4c2}.page:not(.home-wall .page){animation:enter .25s ease-out}.sound{height:37px;font-size:8px;background:#070a0f;border-color:#ffffff15}.sound button{font-size:12px}.sound input{height:12px}footer{background:#0b111b;color:#a1aec0;border-top:1px solid #ffffff15;padding-top:50px}.footer-title{font-family:'Courier New',monospace;font-weight:400;font-size:clamp(40px,6vw,95px)}.footer-bottom{border-color:#ffffff20}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.motion-paused .wall-object,.motion-paused .name-cloud{translate:0 0}.wall-object:focus-visible{outline:1px dashed #bfcede;outline-offset:10px}.draggable:focus-visible:after{content:'ARROW KEYS TO MOVE';position:absolute;top:100%;left:0;font-size:8px;color:#c9d2df}
@keyframes turn{to{transform:rotate(360deg)}}@keyframes float-star{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-16px) rotate(16deg)}}@keyframes echo-wave{0%,100%{transform:translate(calc(var(--i)*12px),calc(var(--i)*20px)) rotate(-1deg)}50%{transform:translate(calc(var(--i)*17px),calc(var(--i)*17px)) rotate(3deg)}}@keyframes scan{from{top:-5%}to{top:105%}}@keyframes wave-bar{to{transform:scaleY(.25);opacity:.3}}@keyframes online{50%{opacity:.35}}@keyframes copyright-drift{50%{transform:rotate(-12deg) translateY(-8px)}}@keyframes scroll-bob{50%{transform:translateY(5px)}}
@media(min-width:1700px){.universe{min-height:900px}.wall-top{font-size:14px}.name-cloud{top:37%}.project-object{top:64%}.cassette-object{top:66%}}
@media(max-width:1000px){.wall-top{font-size:10px;left:6%;right:26%;gap:4%}.wall-top b{font-size:10px}.universe{min-height:760px}.portrait-object{top:15%;width:18%;right:4%}.wall-whisper{top:38%;right:4%;font-size:9px;max-width:120px}.name-cloud{left:29%;top:40%;width:50%}.name-cloud h1,.name-echo{font-size:10vw}.chrome-object{top:29%;width:24%;left:4%}.vinyl-object{top:49%;right:12%;width:24%}.project-object{left:32%;top:66%;width:28%}.cross-object{top:76%;right:5%;width:19%}.cross-outline{font-size:75px}.cross-object>span:nth-child(2){font-size:13px}.cross-object small{font-size:5px}.cassette-object{left:5%;top:68%;width:23%}.cassette{height:125px}.note-one{top:58%;left:6%}.note-two{display:none}.sound-doodle{left:23%}.ghost-note{top:22%;left:30%}.scroll-hint{left:45%;bottom:70px}.wall-archive .project .media{min-height:250px}}
@media(max-width:650px){header{height:57px;margin:0 5%}.brand{font-size:15px}.menu-toggle{font-size:10px}nav{top:57px;background:#0c121c}.universe{height:1010px;min-height:1010px;max-height:none}.frame-corner{width:9px;height:17px}.tl,.bl{left:9px}.tr,.br{right:9px}.wall-top{top:33px;left:7%;right:7%;grid-template-columns:1fr 1fr;gap:7%;font-size:9px;line-height:1.8}.wall-top b{font-size:10px;margin-bottom:5px}.wall-top>div:nth-child(3){display:none}.wall-online{top:172px;right:8%;font-size:7px}.coordinate{font-size:6px}.coord-a{top:190px;left:6%}.coord-b{bottom:84px;right:6%}.wall-whisper{top:327px;left:7%;right:auto;font-size:8px;max-width:180px}.ghost-note{top:205px;left:8%;font-size:48px}.portrait-object{top:219px;width:32%;right:8%;transform:rotate(7deg)}.portrait-sheet{padding:5px 5px 18px}.portrait-symbol{font-size:130px}.photo-note{font-size:5px;bottom:6px}.tape{height:18px;top:-6px}.scribble{font-size:12px;margin-top:10px}.chrome-object{top:253px;width:37%;left:5%;transform:rotate(-15deg)}.chrome-object .object-caption{font-size:7px;max-width:150px;margin-top:7px}.name-cloud{left:15%;top:463px;width:80%}.name-cloud h1,.name-echo{font-size:17vw}.name-caption{font-size:7px;margin-top:15px;line-height:1.8}.name-star{font-size:16px;margin-left:6px}.name-echo span{animation-name:echo-small}.sound-doodle{left:2%;top:480px;gap:2px}.sound-doodle i{width:1px}.vinyl-object{top:610px;right:9%;width:35%}.vinyl-label{font-size:8px}.vinyl-label small{font-size:3px}.vinyl-sticker{font-size:14px;right:-4%;top:80%}.vinyl-object .object-caption{font-size:6px;margin-top:21px}.project-object{top:650px;left:7%;width:39%;transform:rotate(-6deg)}.type-poster{height:148px;padding:12px}.type-poster strong{font-size:33px}.type-poster small{font-size:5px}.type-poster>span{font-size:4px;left:8px}.project-strip{font-size:5px;padding:7px 1px 2px}.project-sheet{padding:5px}.project-sheet img{height:148px}.cassette-object{top:836px;left:10%;width:33%;transform:rotate(8deg)}.cassette{height:90px;padding:8px 9px;border-radius:5px}.cassette-label{padding:4px 5px}.cassette-label small{font-size:3px}.cassette-label b{font-size:11px}.tape-window{height:18px;margin:2px 0}.tape-window i{width:15px;height:15px;border-width:3px}.tape-window span{height:9px}.cassette-object .object-caption{font-size:5px;margin-top:6px}.cross-object{top:819px;right:12%;width:27%}.cross-outline{font-size:69px}.cross-object>span:nth-child(2){font-size:13px}.cross-object small{font-size:4px;margin-top:10px}.note-one{top:582px;left:9%;font-size:8px;line-height:1.5}.wall-bottom{left:7%;right:7%;bottom:24px;font-size:6px;gap:10px}.wall-bottom>span{display:none}.wall-enter{padding:10px 13px;font-size:7px}.scroll-hint{left:48%;bottom:105px;font-size:0}.scroll-hint span{font-size:16px}.wall-archive{padding:0 7% 55px}.wall-archive .section-head{margin-top:45px}.wall-archive .section-head h2{font-size:42px}.wall-archive .section-head .eyebrow{font-size:7px;max-width:170px}.wall-archive .project:nth-child(2){padding-top:10px}.wall-archive .projects{gap:40px}.wall-archive .project .media{min-height:270px;border-width:5px}.wall-archive .project h3{font-size:22px}.wall-archive .big-quote h2{font-size:32px}.page-title{font-size:59px}.footer-title{font-size:49px}.sound{height:37px;padding:0 5%;font-size:7px}.footer-bottom{font-size:8px}.project .meta{gap:8px}footer{padding-bottom:70px}.draggable:focus-visible:after{font-size:6px}}
@keyframes echo-small{0%,100%{transform:translate(calc(var(--i)*5px),calc(var(--i)*9px))}50%{transform:translate(calc(var(--i)*8px),calc(var(--i)*8px))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}.wall-object{translate:0 0!important}.name-echo span{transform:translate(calc(var(--i)*8px),calc(var(--i)*12px))}.name-cloud{transform:none}}
@media(min-width:1001px){.wall-enter{margin-left:auto;margin-right:45px}.scroll-hint{left:61%;bottom:70px}}
@media(max-width:650px){.type-poster strong{font-size:26px}.wall-whisper{top:421px;left:7%;max-width:170px;font-size:7px}}
.playlist-feature{min-width:0;width:100%}.playlist-feature>.eyebrow{margin-bottom:20px}.playlist-feature iframe{display:block;width:100%;height:352px;min-height:352px;border-radius:12px}.playlist-feature .text-link{font-size:10px}
/* BeatStars / sound lab */
.beats-feature{margin:90px 0 0;border:1px solid #798ca44a;background:#111b28;position:relative;overflow:hidden}.beats-topline{display:flex;justify-content:space-between;padding:19px 25px;border-bottom:1px solid #93a9c328;font:10px/1.4 'Courier New',monospace;letter-spacing:.13em;color:#a4b3c5}.beats-topline>span:last-child{color:#e1e7ef}.beats-body{display:grid;grid-template-columns:1fr 1.1fr;gap:7%;padding:38px}.beats-art{display:block;aspect-ratio:1;background:radial-gradient(ellipse at 40% 35%,#687e99 0,#344c6a 38%,#15273f 75%);position:relative;isolation:isolate;overflow:hidden;border:1px solid #93a9c340;box-shadow:9px 12px 0 #070c144a}.beats-grid{position:absolute;inset:0;background-image:linear-gradient(#d6e2f31a 1px,transparent 1px),linear-gradient(90deg,#d6e2f31a 1px,transparent 1px);background-size:30px 30px;transform:perspective(400px) rotateX(40deg) scale(1.5);opacity:.5}.beats-art:after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0,transparent 2px,#040d1b26 3px);z-index:3}.beats-monogram{position:absolute;inset:5% 0;display:flex;align-items:center;justify-content:center;font:italic 300px/.9 Georgia,serif;color:#d0dce9;letter-spacing:-.2em;transform:rotate(-12deg);text-shadow:7px 8px 0 #101c2f5a;opacity:.9}.beats-monogram>span{font:normal 150px Arial,sans-serif;margin-left:-50px;color:#192e4b;mix-blend-mode:multiply;transform:translateY(20px)}.beats-orbit{position:absolute;inset:12%;border-radius:50%;border:1px solid #c9d9ec60;transform:rotate(-28deg);animation:beat-orbit 30s linear infinite}.beats-orbit span{position:absolute;inset:8%;border:1px solid #c9d9ec36;border-radius:50%}.beats-orbit span:nth-child(2){inset:-10% 24%;transform:rotate(60deg);border-color:#c9d9ec77}.beats-orbit span:nth-child(3){inset:24% -10%;transform:rotate(30deg)}.beats-art-label{position:absolute;bottom:21px;left:22px;right:22px;display:flex;justify-content:space-between;font:8px/1.6 'Courier New',monospace;letter-spacing:.15em;color:#b6c5d8;z-index:4}.beats-play{position:absolute;right:18px;top:18px;width:40px;height:40px;display:grid;place-content:center;background:#dce5ef;color:#15253a;border-radius:50%;font:25px Arial,sans-serif;z-index:4;transition:transform .25s,background .25s}.beats-art:hover .beats-play{transform:rotate(45deg);background:#fff}.beats-copy{align-self:center;padding:10px 0}.beats-copy>.meta{font-size:9px;color:#8fa2ba;letter-spacing:.12em}.beats-copy h2{font-size:clamp(50px,6.3vw,100px);font-weight:400;letter-spacing:-.065em;line-height:.88;margin:28px 0}.beats-copy h2 i{font-family:Georgia,serif;font-weight:400;color:#b4c7df}.beats-copy>p{font-size:15px;line-height:1.75;color:#9faec0;margin-bottom:30px}.beats-profile{display:flex;gap:14px;align-items:center;border-top:1px solid #91a6c13d;padding:20px 0 0;max-width:340px}.beats-avatar{width:42px;height:42px;display:grid;place-content:center;border:1px solid #a8bcd45e;font:italic 22px Georgia,serif;color:#b6cce5;background:#192a40}.beats-profile strong{display:block;font:14px 'Courier New',monospace;letter-spacing:.09em}.beats-profile small{display:block;margin-top:7px;font:8px 'Courier New',monospace;letter-spacing:.08em;color:#8ea0b6}.beats-profile-arrow{margin-left:auto;font-size:25px;transition:transform .2s}.beats-profile:hover .beats-profile-arrow{transform:translate(4px,-4px)}.beats-bottom{display:flex;align-items:center;gap:30px;padding:20px 30px;background:#0a111b;border-top:1px solid #93a9c328}.beats-wave{flex:1;min-width:0;height:48px;display:flex;align-items:center;gap:4px;overflow:hidden;mask-image:linear-gradient(90deg,#000, #000 80%,transparent)}.beats-wave i{height:var(--bar);width:3px;flex-shrink:0;background:#718eaf;opacity:.7;animation:beats-meter 2.4s ease-in-out infinite alternate;animation-delay:var(--phase)}.beats-cta{display:flex;align-items:center;gap:35px;border:1px solid #a6b8ce7a;padding:15px 19px;font:10px 'Courier New',monospace;letter-spacing:.06em;transition:background .2s,color .2s}.beats-cta b{font:23px/1 Arial,sans-serif}.beats-cta:hover{background:#ccd9e9;color:#0c192b}.beats-feature:focus-within{border-color:#a7bfdc}@keyframes beat-orbit{to{transform:rotate(332deg)}}@keyframes beats-meter{to{transform:scaleY(.25);opacity:.3}}@media(max-width:900px){.beats-body{padding:28px;gap:7%}.beats-monogram{font-size:220px}.beats-monogram>span{font-size:110px}.beats-copy h2{font-size:62px}.beats-copy>.meta{font-size:7px}.beats-art-label{font-size:6px;left:15px;right:15px;bottom:15px}.beats-wave{gap:3px}.beats-cta{gap:20px;font-size:9px}}@media(max-width:650px){.beats-feature{margin-top:55px}.beats-topline{padding:15px;font-size:8px}.beats-body{grid-template-columns:1fr;gap:24px;padding:20px}.beats-art{max-width:430px;width:100%;margin:auto}.beats-monogram{font-size:250px}.beats-monogram>span{font-size:125px}.beats-copy{padding:5px 4px}.beats-copy h2{font-size:70px;margin:22px 0}.beats-copy>.meta{font-size:7px}.beats-copy>p{font-size:14px}.beats-bottom{flex-direction:column;gap:15px;align-items:stretch;padding:18px 22px}.beats-wave{flex:auto;height:36px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);justify-content:center}.beats-wave i{width:2px;gap:3px}.beats-cta{justify-content:space-between;font-size:9px}.beats-profile{max-width:none;padding-top:18px}.beats-art-label{font-size:7px}.beats-play{width:34px;height:34px;font-size:23px}}
/* Continuous bokeh background and translucent transport bar */
html{background:#04070a}body{isolation:isolate;background:none}.ambient-background{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:#04070a}.ambient-background #background-video{display:block;position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;opacity:.82;background:#04070a}.ambient-shade{position:absolute;inset:0;background:linear-gradient(90deg,#04080e58,#04080e36 50%,#04080e50)}.universe{background:transparent}.wall-archive{background:#070e1850}footer{background:#09111c5c;backdrop-filter:blur(5px)}.sound{background:linear-gradient(180deg,#0a152122,#060e184f);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid #c3d3e51a;box-shadow:0 -10px 28px #07101a12}.background-toggle{margin-left:auto!important;display:flex;align-items:center;gap:8px;font-size:12px!important;white-space:nowrap}.background-toggle span{font:8px 'Courier New',monospace;letter-spacing:.07em}.volume{margin-left:15px}.sound #track{color:#bac7d7}.ambient-background~header{background:transparent}@media(max-width:650px){.background-toggle span{font-size:6px}.background-toggle{gap:5px}.volume{margin-left:4px}.sound{gap:9px}.sound #track{max-width:39%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* Featured song control beside the SHUXSYN wordmark */
.wall-audio-toggle{display:inline-flex;align-items:center;gap:9px;vertical-align:middle;margin-left:clamp(16px,2vw,30px);padding:11px 15px;border:1px solid #dbe7f24c;border-radius:999px;background:#0b142280;color:#e7edf6;font:9px 'Courier New',monospace;letter-spacing:.13em;cursor:pointer;pointer-events:auto;transition:background .25s,border-color .25s,transform .25s,box-shadow .25s;box-shadow:0 0 24px #9bb9e20c;backdrop-filter:blur(8px)}
.wall-audio-toggle:hover{background:#b7cbe329;border-color:#dbe7f29c;transform:translateY(-2px);box-shadow:0 0 25px #a7c8f222}
.wall-audio-toggle:focus-visible{outline:2px solid #dbe7f2;outline-offset:4px}
.wall-audio-toggle:disabled{opacity:.45;cursor:not-allowed}
.wall-audio-icon{font-size:12px;color:#c7d7ea}
@media(max-width:1000px){.wall-audio-toggle{gap:6px;margin-left:14px;padding:9px 11px;font-size:8px}}
@media(max-width:650px){.wall-audio-toggle{position:absolute;left:0;top:calc(100% + 16px);margin-left:0;padding:9px 12px;font-size:7px}.name-cloud{pointer-events:none}.wall-audio-toggle{pointer-events:auto}}
/* Live music visualizer fills the open space beside the wordmark */
.music-visualizer{position:absolute;left:calc(100% + clamp(18px,3vw,48px));top:50%;translate:0 -50%;width:clamp(150px,17vw,270px);height:100px;z-index:4;padding:15px 15px 22px;border:1px solid #cbd8e31c;border-radius:18px;background:linear-gradient(145deg,#b7cee614,#07101c55);box-shadow:0 18px 60px #0004,inset 0 1px #ffffff0b;backdrop-filter:blur(11px);pointer-events:none;overflow:hidden}
.music-visualizer:before,.music-visualizer:after{content:'';position:absolute;border-radius:50%;pointer-events:none}.music-visualizer:before{width:115px;height:115px;right:-50px;top:-65px;border:1px solid #b5d0f116;box-shadow:0 0 25px #9bbce011}.music-visualizer:after{inset:auto 12px 8px;height:1px;background:linear-gradient(90deg,transparent,#cedbef5a,transparent)}
#music-visualizer{display:block;width:100%;height:100%;position:relative;z-index:1}
.viz-tag{position:absolute;z-index:2;left:15px;bottom:8px;display:flex;align-items:center;gap:7px;color:#aabbd0;font:7px 'Courier New',monospace;letter-spacing:.16em;white-space:nowrap}.viz-tag i{width:5px;height:5px;border-radius:50%;background:#b9cde6;box-shadow:0 0 9px #b9cde6;animation:viz-pulse 1.8s ease-in-out infinite}
@keyframes viz-pulse{50%{opacity:.38;box-shadow:0 0 2px #b9cde6}}
@media(max-width:1000px){.music-visualizer{left:calc(100% + 10px);width:clamp(130px,18vw,180px);height:88px;padding:12px 11px 21px}.viz-tag{left:11px;font-size:6px}}
@media(max-width:650px){.music-visualizer{left:0;top:calc(100% + 79px);translate:0 0;width:min(80vw,290px);height:76px;padding:10px 10px 19px}.viz-tag{left:10px;bottom:6px;font-size:6px}}
@media(prefers-reduced-motion:reduce){.viz-tag i{animation:none}}
