/* Restrained Y2K: chrome type, elliptical controls and smoked glass. */
:root{--accent:#ff0099;--line:#ffffff19}
.wordmark{font-style:italic;letter-spacing:-1.8px}
.intro{padding-top:39px;padding-bottom:47px}
.intro h1{font-style:italic;font-weight:800;letter-spacing:-.085em;padding-right:.14em;background:linear-gradient(176deg,#fff 12%,#dce0e7 32%,#7f8490 47%,#f7f8ff 50%,#c4c8d1 66%,#777d88 88%);background-clip:text;-webkit-background-clip:text;filter:drop-shadow(0 1px 0 #ffffff28);transform-origin:left bottom}
.intro p{font-size:12px;letter-spacing:.11em;color:#a2a4ab}
.intro:after{width:82px;background:linear-gradient(90deg,var(--accent) 0 55%,#e1d4e980 55% 65%,transparent 65% 77%,#ffffff45 77%)}
.intro-signature{align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;padding-top:24px;gap:20px}
.orbit-mark{position:relative;width:135px;height:80px;margin-right:6px;opacity:.68;animation:orbit-enter 1.6s var(--ease) both}
.orbit-mark span{position:absolute;inset:19px 0;border:1px solid #aeb5c278;border-radius:50%;transform:rotate(-24deg);box-shadow:inset 0 1px 0 #ffffff16}
.orbit-mark span:nth-child(2){inset:10px 18px;transform:rotate(30deg);border-color:#ffffff22}
.orbit-mark i{position:absolute;inset:0;display:grid;place-items:center;font-size:40px;font-style:normal;color:#e4e6ed;text-shadow:0 1px 9px #ffffff12;transition:transform 1.2s var(--ease),color .5s}
.intro:hover .orbit-mark i{transform:rotate(90deg);color:#ff8dc9}
@keyframes orbit-enter{from{opacity:0;transform:translateY(14px) rotate(-18deg)}to{opacity:.68;transform:none}}
.intro-mark{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.16em;color:#898b92}
nav a,h2,.filters button,.load-area button,footer>a:last-child{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
nav a{letter-spacing:.08em}nav a:after{height:2px;background:linear-gradient(90deg,var(--accent),#ff009900)}
.header{background:#080809b3;-webkit-backdrop-filter:blur(20px) saturate(135%);backdrop-filter:blur(20px) saturate(135%)}
.header.scrolled{background:#080809c7;border-bottom-color:#bfc5d61b}
.section-bar{position:relative;border-top-color:#ffffff22}
.section-bar h2{display:flex;align-items:center;gap:10px;letter-spacing:.13em}
.section-bar h2:before{content:"";width:6px;height:6px;border:1px solid #b4b6c5;transform:rotate(45deg)}
#total{font-family:ui-monospace,monospace;vertical-align:baseline;margin-left:0;color:#92939a;font-size:11px}
.filters{padding:4px;gap:2px;border-radius:100px;background:linear-gradient(180deg,#24242b6b,#1010157d);border-color:#bdc2d529;box-shadow:inset 0 1px 0 #ffffff0e,0 4px 20px #0003}
.filters button{padding:11px 20px;color:#a4a5af;letter-spacing:.07em}
.filters button.active{color:#ff64be;text-shadow:0 0 12px #ff008c33}
.filter-indicator{border-radius:100px;border-color:#d8deee40;border-bottom-color:#ff009982;background:linear-gradient(160deg,#c5d0e52b,#3c3d4817 55%,#ff009916);box-shadow:inset 0 1px 0 #ffffff1c,0 2px 10px #0004;transition:transform .6s cubic-bezier(.22,1,.36,1),width .6s var(--ease)}
.thumb{border-radius:9px 2px 9px 2px;border-color:#c1c6d424}
.thumb:before{content:"";position:absolute;z-index:1;inset:-50%;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#fff0 41%,#ffffff14 49%,#ffffff04 54%,transparent 62%);transform:translateX(-100%);opacity:0;transition:transform .85s var(--ease),opacity .2s}
.thumb:after{box-shadow:inset 0 1px 0 #fff2,inset 0 -1px 0 #0004}
.card h3{color:#c7c9cf}.work-item:focus-within .thumb{border-color:#ff00996b}
.play{width:47px;height:35px;border-radius:50%;transform:scale(.8) rotate(-13deg);background:linear-gradient(145deg,#a7adc92e,#11121766);border-color:#e3e7ff66;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 #ffffff2e,0 4px 18px #0005}
.play svg{transform:rotate(13deg)}
.card:hover .play,.card:focus-visible .play{transform:scale(1) rotate(-13deg)}
.title-toggle{background:linear-gradient(145deg,#8185993b,#0c0c138c);border-color:#e6e9ff4d;box-shadow:inset 0 1px 0 #ffffff1a;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.title-tooltip{background:linear-gradient(135deg,rgba(77,79,95,.32),rgba(14,14,22,.62));border:1px solid #dde2ff36;border-top-color:#edf0ff66;border-bottom-color:#ff4fb92b;border-radius:14px 3px 14px 3px;box-shadow:0 22px 65px #0007,inset 0 1px 0 #ffffff1a,inset 0 -1px 0 #ffffff08;-webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%);transform:translateY(10px) scale(.978);transform-origin:top left;transition:opacity .22s,transform .48s var(--ease),visibility 0s .22s}
.title-tooltip.is-visible{transform:translateY(0) scale(1);transition-delay:0s}
.title-tooltip:before{content:"";position:absolute;top:0;left:23px;width:64px;height:1px;background:linear-gradient(90deg,#ffffffa6,#ff00996e,transparent);pointer-events:none}
.tooltip-category{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;letter-spacing:.18em;color:#ff73c3}
.tooltip-category:before{width:6px;height:6px;border:1px solid currentColor;background:none;transform:rotate(45deg)}
.title-tooltip p{color:#fff;text-shadow:0 1px 3px #000b;letter-spacing:.015em;line-height:1.95}
.load-area button{border-radius:100px;border-color:#bec4d538;background:linear-gradient(155deg,#b9bed81c,#16161c5c);padding:15px 33px;box-shadow:inset 0 1px 0 #ffffff1a}
.load-area button span{display:inline-block;transition:transform .5s var(--ease)}.load-area button:hover span{transform:rotate(90deg)}
.profile h3{font-style:italic;font-weight:750}.about,.contact,footer{border-top-color:#ffffff1c}
.about>h2,.contact>h2{display:flex;align-items:baseline;gap:10px}.about>h2:before,.contact>h2:before{content:"+";color:#ff64bc;font-weight:400}
.progress{height:1px;background:linear-gradient(90deg,#ccc3,var(--accent) 65%,#ffc5e9);box-shadow:0 0 6px #ff009930}
#cursor{background:#ff4cad}#cursor.over{width:35px;height:35px;border-color:#ffd3ed9c;background:#c8d4ff08;box-shadow:inset 0 0 0 3px #ffffff04}
@media(hover:hover){.card:hover .thumb:before{transform:translateX(100%);opacity:1}.card:hover .thumb{border-color:#dbb7d87a;box-shadow:0 12px 32px #0008,0 0 0 1px #ff009916}.card:hover h3{color:#f1edf2}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.title-tooltip{background:#181820ed}}
@media(max-width:600px){.intro{padding-top:26px;padding-bottom:36px}.intro h1{font-size:90px}.intro p{font-size:11px;letter-spacing:.025em}.intro-signature{justify-content:center;padding-top:0}.orbit-mark{width:70px;height:64px;margin:0}.orbit-mark span{inset:23px 0}.orbit-mark span:nth-child(2){inset:17px 8px}.orbit-mark i{font-size:25px}.intro:after{width:48px}.filters{padding:3px;gap:0}.filters button{padding:10px 12px}.title-tooltip{border-radius:12px 3px 12px 3px}.section-bar h2{gap:7px}.title-toggle{background:linear-gradient(145deg,#82879940,#080812a3)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.thumb:before{display:none}.intro:hover .orbit-mark i{transform:none}}