*{box-sizing:border-box;margin:0;padding:0}:root{--black: #000;--white: #fff;--border-width: 5px;--border-shadow: 6px 6px 0 var(--black)}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--white);color:var(--black);line-height:1.6;min-height:100vh}h1,h2,h3{font-family:Ubuntu,sans-serif;font-weight:700}#app{max-width:1200px;margin:0 auto;padding:1.5rem 2rem;min-height:100vh;display:flex;flex-direction:column}header{text-align:center;margin-bottom:2rem}.site-logo{width:140px;height:auto;margin-bottom:.25rem;display:block;margin-left:auto;margin-right:auto}header h1{font-size:3rem;margin-bottom:.25rem;line-height:1.1}.tagline{font-size:1.25rem;margin-top:0}.header-intro{font-size:.95rem;color:#444;max-width:500px;margin:1rem auto 0;line-height:1.5}main{flex:1}#auth-section{max-width:600px;margin:0 auto;text-align:center;padding:2rem;border:var(--border-width) solid var(--black);box-shadow:var(--border-shadow)}#auth-section p{margin-bottom:1.5rem}#auth-section p:last-child{margin-bottom:0}.browser-note{font-size:.875rem;color:#666;font-style:italic;margin-top:1rem}#connect-btn{font-family:Ubuntu,sans-serif;font-weight:700;font-size:1.25rem;padding:1rem 2rem;background-color:var(--black);color:var(--white);border:3px solid var(--black);cursor:pointer;transition:transform .1s,box-shadow .1s;box-shadow:4px 4px 0 var(--black)}#connect-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--black)}#connect-btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--black)}#connect-btn:disabled{opacity:.5;cursor:not-allowed}#loading-section{max-width:600px;margin:0 auto;text-align:center;padding:2rem;border:var(--border-width) solid var(--black);box-shadow:var(--border-shadow)}#loading-section h2{margin-bottom:1rem}.loading-status{font-size:1.125rem}.track-count{font-family:Ubuntu,sans-serif;font-weight:700;font-size:2rem;margin:1rem 0}#results-section{max-width:700px;margin:0 auto}.list-box{border:var(--border-width) solid var(--black);padding:1.5rem;box-shadow:var(--border-shadow)}.list-box h2{font-size:1.5rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--black)}.list-box h3{font-size:1.125rem;margin-bottom:.75rem}.artist-list{list-style:none;font-size:1.125rem}.artist-item{padding:.75rem 0;border-bottom:1px solid #ddd}.artist-item:last-child{border-bottom:none}.artist-row{display:flex;align-items:center}.artist-toggle{background:none;border:none;padding:0;cursor:pointer;display:flex;align-items:center}.artist-toggle:hover .artist-marker{background:var(--black);color:var(--white)}.artist-marker{font-family:Ubuntu,sans-serif;font-weight:700;margin-right:.75rem;color:var(--black);border:2px solid var(--black);padding:.125rem .375rem;font-size:.875rem;transition:background .1s,color .1s}.artist-name-link{color:var(--black);text-decoration:underline;text-underline-offset:3px;font-weight:600}.artist-name-link:hover{background:var(--black);color:var(--white);text-decoration:none;padding:.125rem .25rem;margin:-.125rem -.25rem}.artist-name{color:var(--black);font-weight:600}.artist-related{margin-left:2rem;margin-top:.5rem}.related-list{list-style:none;padding-left:.5rem;border-left:2px solid #ddd}.related-list li{padding:.25rem 0 .25rem .5rem;font-size:1rem}.related-artist-link{color:var(--black);text-decoration:underline;text-underline-offset:3px;font-weight:600}.related-artist-link:hover{background:var(--black);color:var(--white);text-decoration:none;padding:.125rem .25rem;margin:-.125rem -.25rem}.related-info{font-size:.8rem;color:#666;margin-bottom:.75rem;line-height:1.4;font-style:italic}.related-header{font-size:.875rem;font-weight:600;margin-bottom:.5rem}.related-loading,.related-empty,.related-error{font-size:.875rem;color:#666;font-style:italic;padding:.25rem 0}.shared-genres{font-size:.875rem;color:#666}.related-error{color:#c00}.artist-link{display:flex;align-items:center;text-decoration:none;color:var(--black)}.artist-link:hover{opacity:.7}.empty-state{color:#666;font-style:italic}.list-placeholder{border:var(--border-width) dashed #ccc;padding:1.5rem;display:flex;align-items:center;justify-content:center;color:#999;min-height:200px}.lineup-info{margin-top:2rem;text-align:center;font-size:.875rem;color:#666}footer{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--black);text-align:center;font-size:.875rem}.footer-partners{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:1.5rem}.partner-link{display:inline-block;font-family:Ubuntu,sans-serif;font-weight:700;font-size:1rem;padding:.75rem 1.25rem;background-color:var(--white);color:var(--black);text-decoration:none;border:3px solid var(--black);box-shadow:3px 3px 0 var(--black);transition:transform .1s,box-shadow .1s}.partner-link:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--black)}.partner-link:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--black)}.disclaimer{margin-bottom:.5rem;color:#666}.footer-links{margin-top:1rem}.footer-links a{color:var(--black);margin:0 .5rem}.footer-links a:hover{opacity:.7}.footer-attribution{margin-top:1rem;font-weight:600}.footer-attribution a{color:var(--black)}.footer-attribution a:hover{opacity:.7}#lineup-info{max-width:800px;margin:0 auto 2rem;text-align:center}.back-link{margin-bottom:1rem}.back-link a{color:var(--black);text-decoration:none;font-weight:700}.back-link a:hover{opacity:.7}.lineup-meta{font-size:.875rem;color:#666;margin-bottom:1rem}.lineup-note{font-size:.875rem;color:#666;max-width:600px;margin:0 auto;line-height:1.5}.lineup-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.lineup-loading{text-align:center;padding:2rem;color:#666}@media (max-width: 768px){#results-section,.lineup-grid{grid-template-columns:1fr}.site-logo{width:100px}header h1{font-size:2rem}.list-box{padding:1rem}.list-placeholder{min-height:100px}}#setup-section{max-width:600px;margin:0 auto;padding:2rem;border:var(--border-width) solid var(--black);box-shadow:var(--border-shadow)}#setup-section h2{font-size:1.5rem;margin-bottom:1rem}.setup-intro{margin-bottom:1.5rem;line-height:1.6}.setup-steps{margin-bottom:1.5rem;padding:1rem;background:#f9f9f9;border:1px solid #ddd}.setup-steps h3{font-size:1.125rem;margin-bottom:.75rem}.setup-steps ol{margin-left:1.5rem;line-height:1.8}.setup-steps ol ul{margin-top:.5rem;margin-left:1rem;list-style-type:disc}.setup-steps code{background:#fff;border:1px solid #ccc;padding:.125rem .375rem;font-family:monospace;font-size:.9em}.setup-link{margin-top:1rem;font-size:.9rem}.setup-input{margin-bottom:1rem}.setup-input label{display:block;margin-bottom:.5rem;font-weight:700}.setup-input input{width:100%;padding:.75rem;border:2px solid var(--black);font-size:1rem;font-family:monospace;margin-bottom:.75rem}.setup-input input:focus{outline:none;border-color:#333;box-shadow:0 0 0 2px #0000001a}.setup-input button{font-family:Ubuntu,sans-serif;font-weight:700;font-size:1rem;padding:.75rem 1.5rem;background-color:var(--black);color:var(--white);border:none;cursor:pointer;transition:opacity .2s}.setup-input button:hover{opacity:.8}.setup-error{color:#c00;font-size:.9rem;margin-top:.5rem}.setup-note{font-size:.875rem;color:#666;font-style:italic}.setup-help{margin-top:1rem;font-size:.9rem}.setup-help a{color:var(--black);font-weight:700}#setup-guide{max-width:800px;margin:0 auto}.guide-intro,.guide-notes,.guide-steps,.guide-troubleshooting{margin-bottom:2rem;padding:1.5rem;border:var(--border-width) solid var(--black);box-shadow:var(--border-shadow)}.guide-notes ul{margin-left:1.5rem;line-height:1.8}.guide-notes li{margin-bottom:.75rem}.guide-notes h2,.guide-intro h2,.guide-steps h2,.guide-troubleshooting h2{font-size:1.5rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--black)}.guide-intro p{margin-bottom:1rem;line-height:1.6}.guide-step{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid #ddd}.guide-step:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.guide-step h3{font-size:1.125rem;margin-bottom:.75rem}.guide-step p{margin-bottom:.75rem;line-height:1.6}.guide-step ul{margin-left:1.5rem;margin-bottom:.75rem;line-height:1.6}.guide-step code{background:#f5f5f5;border:1px solid #ddd;padding:.125rem .375rem;font-family:monospace;font-size:.9em}.guide-step code.important{background:#fffde7;border-color:#ffc107}.guide-step .warning{background:#fff3e0;border-left:4px solid #ff9800;padding:.75rem 1rem;margin:1rem 0}.uri-display{text-align:center;margin:1rem 0}.uri-display code{background:var(--black);color:var(--white);padding:.5rem 1rem;font-size:1rem;border:none}.copy-block{display:flex;align-items:center;justify-content:center;gap:0;margin:1rem 0;max-width:100%}.copy-block code{background:var(--black);color:var(--white);padding:.625rem 1rem;font-size:1rem;font-family:monospace;border:2px solid var(--black);border-radius:0;-webkit-user-select:all;user-select:all}.copy-btn{font-family:Ubuntu,sans-serif;font-weight:700;font-size:.875rem;padding:.625rem 1rem;margin-left:.5rem;background:var(--white);color:var(--black);border:2px solid var(--black);cursor:pointer;transition:all .15s ease;white-space:nowrap}.copy-btn:hover,.copy-btn.copied{background:var(--black);color:var(--white)}@media (max-width: 480px){.copy-block{flex-direction:column;align-items:stretch}.copy-block code{text-align:center;font-size:.875rem;word-break:break-all}.copy-btn{margin-left:0;margin-top:.5rem}}.guide-media{margin:1rem 0}.guide-media img{max-width:100%;height:auto;border:var(--border-width) solid var(--black);display:block}.screenshot-placeholder{background:#f0f0f0;border:2px dashed #ccc;padding:3rem 1rem;text-align:center;color:#999;font-style:italic;display:none;align-items:center;justify-content:center;min-height:200px}.guide-troubleshooting h3{font-size:1rem;margin-top:1.5rem;margin-bottom:.5rem}.guide-troubleshooting h3:first-of-type{margin-top:0}.guide-troubleshooting p,.guide-troubleshooting ul{margin-bottom:.75rem;line-height:1.6}.guide-troubleshooting ul{margin-left:1.5rem}.guide-troubleshooting code{background:#f5f5f5;border:1px solid #ddd;padding:.125rem .375rem;font-family:monospace;font-size:.9em}.guide-cta{text-align:center;margin:2rem 0}.btn-primary{display:inline-block;font-family:Ubuntu,sans-serif;font-weight:700;font-size:1.125rem;padding:1rem 2rem;background-color:var(--black);color:var(--white);text-decoration:none;border:3px solid var(--black);box-shadow:4px 4px 0 var(--black);transition:transform .1s,box-shadow .1s}.btn-primary:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--black)}.btn-primary:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--black)}.landing-grid{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:2rem}.landing-grid #auth-section,.landing-grid #setup-section,.landing-grid #loading-section{order:1}.landing-grid #preview-section{order:2}@media (min-width: 900px){.landing-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:stretch}.landing-grid #preview-section{order:1;max-width:none;margin:0}.landing-grid #auth-section,.landing-grid #setup-section,.landing-grid #loading-section{order:2;margin:0;max-width:none;display:flex;flex-direction:column;justify-content:center}}#preview-section{max-width:500px;margin:0 auto}#preview-section h2{font-size:1.25rem;text-align:center;margin-bottom:1rem}.preview-box{opacity:.75}.preview-list-box{border:3px dashed #666!important;box-shadow:none!important;background:#fafafa}.preview-list-box h3{font-size:1.125rem;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px dashed #999;color:#333}.preview-list-box .artist-list{font-size:1rem}.preview-list-box .artist-item{border-bottom-color:#ddd;border-bottom-style:dashed}.preview-list-box .artist-toggle{cursor:default}.preview-list-box .artist-toggle:hover .artist-marker{background:transparent;color:var(--black)}.preview-label{text-align:center;font-size:.875rem;color:#666;font-style:italic;margin-top:.75rem}.hidden{display:none!important}#why-content{max-width:800px;margin:0 auto}.why-section{margin-bottom:2rem;padding:1.5rem;border:var(--border-width) solid var(--black);box-shadow:var(--border-shadow)}.why-section h2{font-size:1.5rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--black)}.why-section p{margin-bottom:1rem;line-height:1.6}.why-section p:last-child{margin-bottom:0}.why-section a{color:var(--black);font-weight:600}.why-section a:hover{opacity:.7}.feature-list{margin:1rem 0 1.5rem 1.5rem;line-height:1.8}.feature-list li{margin-bottom:.5rem}.link-list{list-style:none;margin:1rem 0}.link-list li{margin-bottom:.75rem}.link-list a{color:var(--black);text-decoration:underline;text-underline-offset:3px}.link-list a:hover{background:var(--black);color:var(--white);text-decoration:none;padding:.125rem .25rem;margin:-.125rem -.25rem}.why-cta{text-align:center;margin:2rem 0}