@import "https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@1,800&display=swap";body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.album-card{box-shadow:none;cursor:pointer;background:0 0;border-radius:12px;outline:none;padding:15px;transition:transform;animation:.5s forwards fadeIn}.album-card.fade-out{animation:.3s forwards fadeOut}.album-card:hover{transition:transform .2s;transform:translateY(-5px)}.album-card:focus-visible{box-shadow:0 0 0 2px var(--text-color)}.image-container{aspect-ratio:1;background:color-mix(in srgb, var(--bg-color) 80%, var(--text-color) 20%);border-radius:8px;width:100%;position:relative}.loading-spinner{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAD1BMVEUAAAD///////////////+PQt5oAAAABHRSTlMAf7+fX8KDTQAAAAFiS0dEBI9o2VEAAAAHdElNRQfiBhYQDR0KXz6BAAABDklEQVQoz12QsU7DMBRFXUcVqhQhIVXqDEgVA+pWFib+ACFl6B+0LF2YsvULWoaSqQPq2C9AiI0/QEwgJEaQGNh4/WwnCXCl6Nzjo2f73YRQGYUHaSgV0PLvwz0Zqo9kBvCQhNJARwRnWQrd5wKwOYNk8VVH4KoBHI1EJwCzRxC9QnB6YuG+A7iKxLhvYO44qC8FjlVs4MnBk4PxF/ymeAHPHjrg0eRMGLjEwIxg7uANvFALXxQXBi4pLhz0KN4dDCi+KL4d3Hj4oVhSDMDBGGDhYEIxdTAVWDmYUcwdzAU2DhYUSwcrgbWDNcXGwVbgx8Evxc7BXuCP4kBxFDhRnCkuAmcbF4qrwJXiJnD7B/q0sSDHzBqkAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE4LTA2LTIyVDE2OjEzOjI5LTA0OjAwx9BqeQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxOC0wNi0yMlQxNjoxMzoyOS0wNDowMLaN0sUAAAAASUVORK5CYII=);background-size:contain;width:32px;height:32px;animation:1s steps(8,end) infinite spin;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.album-image{object-fit:cover;border-radius:8px;width:100%;height:100%}.album-title{color:var(--text-color);letter-spacing:-.01em;margin:8px 0;font-size:1.1rem;font-weight:700}.album-artist{color:color-mix(in srgb, var(--text-color) 80%, transparent);letter-spacing:-.01em;margin:4px 0;font-size:.9rem;font-weight:400}.album-year{color:color-mix(in srgb, var(--text-color) 60%, transparent);letter-spacing:-.01em;font-size:.8rem;font-style:italic;font-weight:400}.image-fallback{opacity:.6;justify-content:center;align-items:center;font-size:.85rem;display:flex;position:absolute;inset:0}.modal-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal-overlay.closing{animation:.2s forwards fadeOut}.modal-overlay.closing .modal-content{animation:.2s forwards slideDown}.modal-content{background:var(--bg-color);color:var(--text-color);border-radius:16px;max-width:min(600px,90vw);padding:2rem;animation:.3s slideUp;position:relative;box-shadow:0 8px 32px #0000004d}.modal-close{color:var(--text-color);cursor:pointer;background:0 0;border:none;border-radius:20px;justify-content:center;align-items:center;width:40px;height:40px;padding:.5rem;font-size:1.5rem;transition:background-color .2s;display:flex;position:absolute;top:1rem;right:1rem}.modal-close:hover{background:color-mix(in srgb, var(--text-color) 10%, transparent)}.modal-content h2{letter-spacing:-.02em;margin-top:0;margin-bottom:1.5rem;font-family:Noto Serif,serif;font-size:1.8rem;font-style:italic;font-weight:700}.modal-content h3{margin-top:1.5rem;margin-bottom:1rem;font-size:1.2rem}.modal-content p{margin:1rem 0;font-size:1.1rem;line-height:1.6}.modal-content ul{margin:1rem 0;padding-left:1.5rem}.modal-content li{margin:.5rem 0;line-height:1.4}.modal-footer{border-top:1px solid color-mix(in srgb, var(--text-color) 20%, transparent);text-align:center;color:color-mix(in srgb, var(--text-color) 80%, transparent);margin-top:2rem;padding-top:1rem;font-style:italic}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}:root{--color-dark:#493b2a;--color-light:#b6d094;--bg-color:var(--color-dark);--text-color:var(--color-light)}:root[data-theme=light]{--bg-color:var(--color-light);--text-color:var(--color-dark)}html{background-color:var(--bg-color);transition:background-color .3s}body{background-color:var(--bg-color);margin:0;padding:0;transition:background-color .3s;overflow-x:hidden}.App{text-align:center;background-color:var(--bg-color);min-width:100vw;min-height:120vh;color:var(--text-color);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;flex-direction:column;padding:20px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;transition:background-color .3s,color .3s;display:flex;overflow-x:hidden}.App-logo{pointer-events:none;height:40vmin}@media (prefers-reduced-motion:no-preference){.App-logo{animation:20s linear infinite App-logo-spin}}.App-header{color:#fff;background-color:#282c34;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;font-size:calc(10px + 2vmin);display:flex}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.header-section{opacity:0;flex-direction:column;justify-content:center;width:100%;height:45vh;min-height:300px;animation:.8s .2s forwards contentFadeIn;display:flex;position:relative}@keyframes contentFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.results-section{flex:1;width:100%;min-height:60vh;padding-bottom:40px}.search-container{box-sizing:border-box;width:min(80vw,600px);margin:20px auto 0;padding:0 20px}.header-controls{z-index:100;opacity:0;box-sizing:border-box;justify-content:space-between;width:min(95vw,1200px);margin:0 auto;padding:20px;animation:.8s .4s forwards contentFadeIn;display:flex}.format-controls{color:var(--text-color);align-items:center;gap:8px;font-size:14px;font-weight:500;display:flex}.switch{width:60px;height:28px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:color-mix(in srgb, var(--bg-color) 80%, var(--text-color) 20%);border:1px solid color-mix(in srgb, var(--text-color) 20%, transparent);border-radius:34px;transition:all .3s;position:absolute;inset:0}.slider:before{content:"";background-color:var(--text-color);border-radius:50%;width:20px;height:20px;transition:all .3s;position:absolute;bottom:3px;left:4px}input:checked+.slider{background-color:color-mix(in srgb, var(--bg-color) 70%, var(--text-color) 30%)}input:checked+.slider:before{transform:translate(31px)}.theme-toggle{cursor:pointer;width:40px;height:40px;color:var(--text-color);background:0 0;border:none;justify-content:center;align-items:center;transition:transform .3s;display:flex}.theme-toggle:hover{transform:scale(1.1)}.theme-toggle svg{width:24px;height:24px}.search-input{letter-spacing:-.01em;width:100%;color:var(--text-color);background-color:color-mix(in srgb, var(--bg-color) 80%, var(--text-color) 20%);box-shadow:0 4px 12px #0003, 0 0 0 1px color-mix(in srgb, var(--text-color) 10%, transparent);box-sizing:border-box;border:none;border-radius:16px;outline:none;padding:20px 30px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:min(16px + .5vw,18px);font-weight:400;transition:all .3s cubic-bezier(.4,0,.2,1)}.search-input:focus{background-color:color-mix(in srgb, var(--bg-color) 70%, var(--text-color) 30%);box-shadow:0 8px 24px #00000040, 0 0 0 1px color-mix(in srgb, var(--text-color) 15%, transparent);transform:translateY(-1px)}.search-input::placeholder{color:color-mix(in srgb, var(--text-color) 50%, transparent);font-weight:400}.results-grid{box-sizing:border-box;opacity:1;grid-template-columns:repeat(4,1fr);gap:30px;width:min(95vw,1200px);margin:0 auto;padding:20px;transition:opacity .2s;display:grid}.site-title{color:var(--text-color);text-transform:lowercase;letter-spacing:-.12em;cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;margin:0 0 1.5rem -.2em;padding:.1em .2em;font-family:Noto Serif,serif;font-size:min(8vw,6rem);font-style:italic;font-weight:800;transition:color .3s;display:inline-block}.site-title:focus-visible{outline:none}.loading{text-align:center;grid-column:1/-1;justify-content:center;align-items:center;gap:8px;height:2rem;padding:2rem;display:flex}.loading-dot{background:var(--text-color);opacity:0;border-radius:50%;width:8px;height:8px;animation:.3s forwards dotFadeIn,1s infinite dotJump}.loading-dot:nth-child(2){animation-delay:.1s,.2s}.loading-dot:nth-child(3){animation-delay:.2s,.4s}@keyframes dotFadeIn{0%{opacity:0}to{opacity:.7}}@keyframes dotJump{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (width<=1200px){.results-grid{grid-template-columns:repeat(3,1fr)}.header-controls{right:20px}}@media (width<=900px){.results-grid{grid-template-columns:repeat(2,1fr);gap:20px}}@media (width<=600px){.results-grid{grid-template-columns:repeat(1,1fr);width:90vw}.search-container{width:90vw}}.view-toggle{justify-content:center;gap:8px;margin:16px auto 0;display:flex}.view-button{cursor:pointer;color:var(--text-color);opacity:.5;background:0 0;border:none;border-radius:6px;padding:8px;transition:all .2s}.view-button:hover{background:color-mix(in srgb, var(--text-color) 10%, transparent)}.view-button.active{opacity:1;background:color-mix(in srgb, var(--text-color) 15%, transparent)}.results-grid.list-view{flex-direction:column;gap:16px;max-width:800px;display:flex}.results-grid.list-view .album-card{background:color-mix(in srgb, var(--bg-color) 95%, var(--text-color));border-radius:8px;grid-template-columns:100px 1fr;align-items:center;gap:20px;padding:12px;display:grid}.results-grid.list-view .album-card:hover{background:color-mix(in srgb, var(--bg-color) 90%, var(--text-color));transform:translateY(-2px)}.results-grid.list-view .image-container{width:100px;height:100px;margin:0}.results-grid.list-view .album-info{flex-direction:column;gap:4px;display:flex}.album-card{box-shadow:none;cursor:pointer;opacity:1;background:0 0;border-radius:12px;outline:none;padding:15px;transition:all .3s;transform:translateY(0)}.album-card.fade-out{opacity:0;transform:translateY(10px)}.view-transition{opacity:0}.right-controls{align-items:center;gap:8px;display:flex}.help-button{cursor:pointer;width:40px;height:40px;color:var(--text-color);background:0 0;border:none;justify-content:center;align-items:center;transition:transform .2s;display:flex}.help-button:hover{transform:scale(1.1)}