@font-face{font-family:Space Mono;src:url(/fonts/SpaceMono400.woff2)format("woff2");font-weight:400;font-style:normal;font-display:optional}@font-face{font-family:Space Mono;src:url(/fonts/SpaceMono700.woff2)format("woff2");font-weight:700;font-style:normal;font-display:optional}@font-face{font-family:Advercase;src:url(/fonts/advercase-bold.woff2)format("woff2"),url(/fonts/advercase-bold.woff)format("woff");font-weight:700;font-style:normal;font-display:optional}@font-face{font-family:Advercase;src:url(/fonts/advercase-regular.woff2)format("woff2"),url(/fonts/advercase-regular.woff)format("woff");font-weight:400;font-style:normal;font-display:optional}*,:before,:after{box-sizing:border-box;margin:0;padding:0}:focus-visible{outline:2px solid var(--mustard);outline-offset:3px;border-radius:2px}.skip-link{background:var(--mustard);color:var(--black);letter-spacing:1px;z-index:100;padding:8px 16px;font-family:Space Mono,monospace;font-size:16px;text-decoration:none;position:absolute;top:-100%;left:0}.skip-link:focus{top:0}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:root{--cream:#f5efd6;--orange:#e8541a;--mustard:#d4a017;--green:#2d6a2d;--purple:#5b2d8e;--brown:#3b1f0a;--pink:#e84393;--black:#0a0804}html{background-color:var(--black);background-image:radial-gradient(at 10% 20%,#5b2d8e66 0%,#0000 50%),radial-gradient(at 90% 80%,#e8541a59 0%,#0000 50%),radial-gradient(#d4a01733 0%,#0000 60%),radial-gradient(at 80% 10%,#e843934d 0%,#0000 40%);background-attachment:fixed}body{color:var(--cream);min-height:100vh;font-family:Space Mono,monospace;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:0 0;animation:8s ease-in-out infinite alternate bgPulse;position:fixed;inset:0}@keyframes bgPulse{0%{opacity:.7}to{opacity:1}}body:after{content:"";pointer-events:none;z-index:1;opacity:.4;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");position:fixed;inset:0}.bg-circle{pointer-events:none;z-index:0;border-radius:50%;animation:12s ease-in-out infinite float;position:fixed}.bg-circle:first-child{border:1px solid #e8541a26;width:280px;height:280px;top:-100px;left:-100px}.bg-circle:nth-child(2){border:1px solid #5b2d8e33;width:220px;height:220px;animation-delay:-4s;bottom:-60px;right:-60px}.bg-circle:nth-child(3){display:none}@media (width>=768px){.bg-circle:first-child{width:600px;height:600px;top:-200px;left:-200px}.bg-circle:nth-child(2){width:400px;height:400px;bottom:-100px;right:-100px}.bg-circle:nth-child(3){border:1px solid #d4a01733;width:250px;height:250px;animation-delay:-8s;display:block;top:40%;right:5%}}@keyframes float{0%,to{transform:translate(0)rotate(0)}33%{transform:translate(15px,-20px)rotate(2deg)}66%{transform:translate(-10px,10px)rotate(-1deg)}}.wrapper{z-index:2;max-width:1200px;margin:0 auto;position:relative}.content-wrapper{padding:32px 16px 80px}@media (width>=768px){.content-wrapper{padding:48px 24px 80px}}.site-header{z-index:10;-webkit-backdrop-filter:blur(12px);background:#0a0804d9;border-bottom:1px solid #f5efd61a;position:sticky;top:0}.site-header .wrapper{padding:20px 16px 16px}@media (width>=768px){.site-header .wrapper{padding:32px 24px 24px}}.header-inner{justify-content:space-between;align-items:center;gap:12px;display:flex}.logo{color:var(--cream);letter-spacing:2px;font-family:Advercase,sans-serif;font-size:clamp(24px,7vw,96px);line-height:.9;text-decoration:none;position:relative}@media (width>=768px){.logo{letter-spacing:4px}}.logo span{color:var(--orange)}.page-title{letter-spacing:2px;color:var(--cream);margin-bottom:6px;font-family:Advercase,sans-serif;font-size:clamp(28px,6vw,72px);line-height:1}@media (width>=768px){.page-title{letter-spacing:3px;margin-bottom:8px}}.page-subtitle{color:#f5efd699;text-transform:uppercase;letter-spacing:2px;margin-bottom:32px;font-size:16px}@media (width>=768px){.page-subtitle{letter-spacing:3px;margin-bottom:48px}}.albums-grid{grid-template-columns:1fr 1fr;gap:12px;list-style:none;display:grid}@media (width>=640px){.albums-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}}@media (width>=1024px){.albums-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}}.albums-grid>li{display:flex}.album-card{background:#f5efd60a;border:1px solid #f5efd614;border-radius:4px;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.album-cover{aspect-ratio:1;position:relative;overflow:hidden}.album-cover img{object-fit:cover;width:100%;height:100%;display:block}.album-cover-placeholder{aspect-ratio:1;background:linear-gradient(135deg, var(--purple), var(--brown));justify-content:center;align-items:center;width:100%;display:flex}.album-cover-placeholder span{color:#f5efd633;letter-spacing:4px;font-family:Advercase,sans-serif;font-size:48px}.album-info{flex-direction:column;flex:1;padding:12px;display:flex}@media (width>=768px){.album-info{padding:16px}}.album-name{letter-spacing:1px;color:var(--cream);margin-bottom:4px;font-family:Advercase,sans-serif;font-size:18px;line-height:1.1}@media (width>=768px){.album-name{font-size:22px}}.album-year{color:#f5efd68c;text-transform:uppercase;letter-spacing:2px;margin-bottom:10px;font-size:16px}.vinyl-list,.no-vinyl{margin-top:auto}.vinyl-list{flex-direction:column;gap:6px;list-style:none;display:flex}.vinyl-list li a{color:var(--mustard);align-items:flex-start;gap:8px;font-family:Space Mono,monospace;font-size:16px;line-height:1.4;text-decoration:none;transition:color .2s;display:flex}@media (width>=768px){.vinyl-list li a{font-size:16px}}.vinyl-list li a:before{content:"→";flex-shrink:0}.vinyl-list li a:hover{color:var(--cream)}.no-vinyl{color:#f5efd680;letter-spacing:1px;font-size:16px;font-style:italic}.logout,.back-btn{color:#f5efd699;text-transform:uppercase;letter-spacing:1px;white-space:nowrap;border:1px solid #f5efd626;border-radius:2px;padding:5px 8px;font-family:Space Mono,monospace;font-size:16px;text-decoration:none;transition:all .2s}@media (width>=768px){.logout,.back-btn{letter-spacing:2px;padding:6px 12px}}.logout:hover,.back-btn:hover{color:var(--cream);border-color:#f5efd666}.logout:hover{color:var(--orange);border-color:var(--orange)}.user-info{flex-shrink:0;align-items:center;gap:6px;display:flex}@media (width>=768px){.user-info{gap:12px}}.user-info img{border:2px solid var(--orange);object-fit:cover;border-radius:50%;width:32px;height:32px}@media (width>=768px){.user-info img{width:40px;height:40px}}.user-info .user-text{display:none}@media (width>=640px){.user-info .user-text{display:block}.user-info span{color:#f5efd699;text-transform:uppercase;letter-spacing:2px;font-size:16px}.user-info strong{color:var(--cream);font-size:16px;display:block}}.wishlist-link{color:#f5efd699;text-transform:uppercase;letter-spacing:1px;white-space:nowrap;border:1px solid #f5efd626;border-radius:2px;padding:5px 8px;font-family:Space Mono,monospace;font-size:16px;text-decoration:none;transition:all .2s}@media (width>=768px){.wishlist-link{letter-spacing:2px;padding:5px 10px}}.wishlist-link:hover{color:var(--pink);border-color:var(--pink)}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@supports not (backdrop-filter:blur(1px)){.site-header{background:#0a0804f7}}.site-footer{z-index:2;border-top:1px solid #f5efd614;width:100%;padding:24px 16px;position:relative}@media (width>=768px){.site-footer{padding:32px 24px}}.footer-inner{flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;display:flex}@media (width>=640px){.footer-inner{justify-content:space-between}}.footer-credit{color:#f5efd699;letter-spacing:1px;font-family:Space Mono,monospace;font-size:16px;text-decoration:none;transition:color .2s}.footer-credit:hover{color:var(--mustard)}.footer-links{gap:16px;display:flex}.footer-links a{color:#f5efd699;letter-spacing:1px;text-transform:uppercase;font-family:Space Mono,monospace;font-size:16px;text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--cream)}.noscript-msg{color:#f5efd699;letter-spacing:1px;text-align:center;padding:48px 0;font-size:16px}
